/*******************************************************************************
FILE: mud_Scripts.php
REQUIRES: mud_API.js
AUTHOR: Takashi Okamoto mud(tm) - http://www.mudcorp.com/
VERSION: 2.0
DATE: 01/14/2006
--------------------------------------------------------------------------------
This file is part of the MudCorp Website.
The MudCorp Website itself is NOT free software; however there are many
components that are free. Please consult the header comments for those files
for the terms. For any licensing terms, please contact
us by using the contact form at http://mudcorporation.com/
--------------------------------------------------------------------------------
*******************************************************************************/
////////////////////////////////////////////////////////////////////////////////
// GLOBAL VARS
var delay = 5; // autoplay delay
var imgsGallery = new Array();
var proj, index, proj_list;
var selected = 0;
function sendFilter(loc) {
location.href = "/projects/" + loc + "/";
return false;
}
function setSelected(newSelected) {
// unset old
$('p'+selected).className = "proj_elem";
$('p'+newSelected).className = "proj_selected";
selected = newSelected;
}
////////////////////////////////////////////////////////////////////////////////
// MOUSE EVENTS
function setOnMouseClick() {
var elements = document.getElementsByTagName("a");
for (var i = 0; i < elements.length; i++) {
switch(elements[i].className) {
case "contactForm":
elements[i].onclick = function() {
$("contact").style.display = "block";
return false;
}
break;
case "next":
elements[i].onclick = function() {
var s = proj.nextImg();
setSelected(s);
if (!index.hidden) {
index.slideStart();
}
return false;
}
break;
case "prev":
elements[i].onclick = function() {
var s = proj.prevImg();
setSelected(s);
if (!index.hidden) {
index.slideStart();
}
return false;
}
break;
case "index":
elements[i].onclick = function() {
index.slideStart();
return false;
}
break;
case "close":
elements[i].onclick = function() {
index.slideStart();
return false;
}
break;
case "proj_elem":
elements[i].onclick = function(evt) {
evt = (evt) ? evt : ((window.event) ? event : null);
if (evt) {
var target = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if (target.nodeType == 3) target = target.parentNode;
var imgNumber = parseInt(target.id.substring(1));
var s = proj.showImg(imgNumber);
setSelected(s);
}
index.slideStart();
return false;
}
break;
case "proj_selected":
elements[i].onclick = function(evt) {
evt = (evt) ? evt : ((window.event) ? event : null);
if (evt) {
var target = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if (target.nodeType == 3) target = target.parentNode;
var imgNumber = parseInt(target.id.substring(1));
var s = proj.showImg(imgNumber);
setSelected(s);
}
index.slideStart();
return false;
}
break;
case "ap_start":
elements[i].onclick = function() {
proj.apStart(delay);
return false;
}
break;
case "ap_stop":
elements[i].onclick = function() {
proj.apStop();
return false;
}
break;
}
}
}
////////////////////////////////////////////////////////////////////////////////
// INIT
function initGallery() {
// load images
imgsGallery[0] = new Object();
imgsGallery[0].title = "Taber Studio (2006)";
imgsGallery[0].image = "/images/taberstudio.jpg";
imgsGallery[0].caption = 'Technology: XHTML, CSS, JavaScript, AJAX, PHP.
Design and programming for Taber Studio.
http://taberstudio.com';
imgsGallery[1] = new Object();
imgsGallery[1].title = "{XX} Design (2006)";
imgsGallery[1].image = "/images/xxdesign.jpg";
imgsGallery[1].caption = 'Technology: XHTML, CSS, JavaScript, AJAX, PHP, MySQL.
Design and programming of {XX} Design. Custom content management for easy updates through a web-based interface.
http://xxdesign.com';
imgsGallery[2] = new Object();
imgsGallery[2].title = "Ante Magazine (2005)";
imgsGallery[2].image = "/images/ante.jpg";
imgsGallery[2].caption = 'Technology: XHTML, CSS, JavaScript, AJAX, PHP, MySQL.
Design and programming of the new site for Ante Magazine, using AJAX to make new data calls.
http://antemagazine.com';
imgsGallery[3] = new Object();
imgsGallery[3].title = "Fusedspace Database — MudCatalogue (2005)";
imgsGallery[3].image = "/images/fs_mudcatalogue.jpg";
imgsGallery[3].caption = 'Technology: Perl, PDF, PHP, MySQL.
System of Perl scripts to construct an on-demand catalogue for \"Welcome to Fusedspace Database\" exhibition at Stroom, The Hague, Netherlands (for Team Science Fiction.) With a web interface, a personalized PDF is constructed, and sent directly to the printer. The PDF is also optionally uploaded to a webserver to be downloaded later. The individual projects were also batch processed by another set of Perl scripts that by feeding in various text and image contents. More information at http://www.teamscifi.net';
imgsGallery[4] = new Object();
imgsGallery[4].title = "Fusedspace Database — MudDisplay (2005)";
imgsGallery[4].image = "/images/fs_muddisplay.jpg";
imgsGallery[4].caption = 'Technology: Cocoa, Objective-C, Quartz Composer.
Applescript enabled custom Mac OS X display application for \"Welcome to Fusedspace Database\" exhibition at Stroom, The Hague, Netherlands (for Team Science Fiction.) Able to display images in three separate monitors, each independently controlled with an Applescript interface. More information at http://www.teamscifi.net';
imgsGallery[5] = new Object();
imgsGallery[5].title = "Fusedspace Database — MudTerminal (2005)";
imgsGallery[5].image = "/images/fs_mudterminal.jpg";
imgsGallery[5].caption = 'Technology: Cocoa, Objective-C, Quartz Composer.
Custom Mac OS X kiosk application for \"Welcome to Fusedspace Database\" exhibition at Stroom, The Hague, Netherlands (for Team Science Fiction.) Input consists of a trackball and three buttons. More information at http://www.teamscifi.net';
imgsGallery[6] = new Object();
imgsGallery[6].title = "Village Website (2005)";
imgsGallery[6].image = "/images/vllg.jpg";
imgsGallery[6].caption = 'Technology: XHTML, CSS, JavaScript, Perl, PHP, MySQL.
Design and programming by MudCorp. Complete e-commerce solution, and direct download of font files. Inventory management through custom CMS. Also featuring mudTyper ver1.1, first interactive online type testing tool with support for kerning and full character sets.
Expanded site in 10/2005 to include a products section, as Village now carries physical goods for sale.
http://www.vllg.com';
imgsGallery[7] = new Object();
imgsGallery[7].title = "2x4 Website (2005)";
imgsGallery[7].image = "/images/2x4.jpg";
imgsGallery[7].caption = 'Technology: XHTML, CSS, JavaScript, PHP, MySQL.
Design and programming of the new site for 2x4, Inc. showcasing their new work in an easy to navigate and simple site.
http://2x4.org';
imgsGallery[8] = new Object();
imgsGallery[8].title = "Stiletto Website (2005)";
imgsGallery[8].image = "/images/stiletto.jpg";
imgsGallery[8].caption = 'Technology: XHTML, CSS, JavaScript, PHP, MySQL.
Design with Stiletto. Project management through custom CMS.
http://stilettonyc.com';
imgsGallery[9] = new Object();
imgsGallery[9].title = "Endeavor Screensaver (2004)";
imgsGallery[9].image = "/images/endeavor.jpg";
imgsGallery[9].caption = 'Designed and programmed a flash based screen saver. Runs on computers in the endeavor office, done for 2x4, Inc.';
imgsGallery[10] = new Object();
imgsGallery[10].title = "Prada — SoundWave (2004)";
imgsGallery[10].image = "/images/prada_soundwave.gif";
imgsGallery[10].caption = 'Technology: Processing, Java, XML.
Processing applet that displays the sound spectrum of ambient noise. Installation work for Prada Epicenter L.A. done for 2x4, Inc.';
imgsGallery[11] = new Object();
imgsGallery[11].title = "Prada — MostWantedCombo (2004)";
imgsGallery[11].image = "/images/prada_mostwantedcombo.gif";
imgsGallery[11].caption = 'Technology: Processing, Java, XML.
Processing applet that displays the characteristics of the FBI\'s 10 most wanted, mixed in with dating profiles of a popular dating site. Installation work for Prada Epicenter L.A. done for 2x4, Inc.';
imgsGallery[12] = new Object();
imgsGallery[12].title = "Prada — MostWanted (2004)";
imgsGallery[12].image = "/images/prada_mostwanted.gif";
imgsGallery[12].caption = 'Technology: Processing, Java, XML.
Processing applet that displays the list of FBI\'s 10 most wanted. This applet was designed in a way that if you feed in a text file, it will print the contents of the text file line by line, much like a dot matrix printer, but on screen. Installation work for Prada Epicenter L.A. done for 2x4, Inc.';
imgsGallery[13] = new Object();
imgsGallery[13].title = "Prada — AllNames (2004)";
imgsGallery[13].image = "/images/prada_allnames.gif";
imgsGallery[13].caption = 'Technology: Processing, Java, XML.
Processing applet that displays many combinations of common first and last names. Installation work for Prada Epicenter L.A. done for 2x4, Inc.';
imgsGallery[14] = new Object();
imgsGallery[14].title = "mudHeart (2004)";
imgsGallery[14].image = "/images/heart.gif";
imgsGallery[14].caption = 'Technology: Processing.
Java applet of randomly drawn hearts with shivers down the spine. Perfect for Valentine’s day.
http://mudcorp.com/applets/mudHeart/';
imgsGallery[15] = new Object();
imgsGallery[15].title = "mud_ascii.pl (2004)";
imgsGallery[15].image = "/images/ascii.jpg";
imgsGallery[15].caption = 'Technology: Perl, ImageMagick, PDF::API2.
Program that generates a three color ascii art as PDF.
http://mudcorp.com/mosaic/';
imgsGallery[16] = new Object();
imgsGallery[16].title = "mud_mosaic.pl (2004)";
imgsGallery[16].image = "/images/mosaic.jpg";
imgsGallery[16].caption = 'Technology: Perl, ImageMagick.
Program that generates an image with smaller images.
http://mudcorp.com/mosaic/';
imgsGallery[17] = new Object();
imgsGallery[17].title = "Ben Rubin — Untitled (2004)";
imgsGallery[17].image = "/images/benrubin.jpg";
imgsGallery[17].caption = 'Technology: Processing, Perl, After Effects, LCD light boxes and controller.
Programming for Ben Rubin’s Untitled work. More info here on his website.
http://earstudio.com/projects/signlang.html';
imgsGallery[18] = new Object();
imgsGallery[18].title = "Andrew Zimmerman Website (2004)";
imgsGallery[18].image = "/images/andrewzimmerman.jpg";
imgsGallery[18].caption = 'Technology: XHTML, CSS, JavaScript.
Design and programming by MudCorp.
http://andrewzimmerman.com';
imgsGallery[19] = new Object();
imgsGallery[19].title = "Cenere Website (2004)";
imgsGallery[19].image = "/images/cenere.jpg";
imgsGallery[19].caption = 'Technology: XHTML, CSS, JavaScript.
Design by Stiletto, and programmed by MudCorp.
http://www.ceneregb.com';
imgsGallery[20] = new Object();
imgsGallery[20].title = "Texelseboys Lunchbox and Global Locator (2003 - now)";
imgsGallery[20].image = "/images/texelseboys.jpg";
imgsGallery[20].caption = 'Technology: XHTML, CSS, JavaScript, PHP, MySQL.
Design and programming by MudCorp. This is a travelling project of one tin lunchbox to give Texelseboys members a sense of physical connection. The locator has stories and pictures behind all the owners.
http://mudcorp.com/texelseboys/';
imgsGallery[21] = new Object();
imgsGallery[21].title = "mudOS (2003)";
imgsGallery[21].image = "/images/mudos.jpg";
imgsGallery[21].caption = 'Technology: HTML, JavaScript.
mudOS is a command line layer that runs over top of a GUI web browser. Using only client-side JavaScript, users can type in commands to control the web browser, and have a command line interface to interact with instead of the conventional graphical interface. Since mudOS is purely client-side JavaScript, it can run on any web browser that has JavaScript and cookies enabled. This makes mudOS a truly cross-platform application mudOS is a command line layer that runs over top of a GUI web browser. Using only client-side JavaScript, users can type in commands to control the web browser, and have a command line interface to interact with instead of the conventional graphical interface. Since mudOS is purely client-side JavaScript, it can run on any web browser that has JavaScript and cookies enabled. This makes mudOS a truly cross-platform application.
http://mudcorp.com/products-web/mudos/';
proj = new MudFadeGallery('proj', 'proj', imgsGallery, {startNum: 0, preload: true});
// set initial values
var title = (imgsGallery[0].title) ? imgsGallery[0].title : "No Title";
var caption = (imgsGallery[0].caption) ? imgsGallery[0].caption : "No caption";
$("proj_title").innerHTML = title;
$("proj").src = imgsGallery[0].image;
$("proj_caption").innerHTML = caption;
$("proj_number").innerHTML = "1 of " + imgsGallery.length + " projects";
}
function initIndex() {
proj_list = "";
for (var i = 0; i < imgsGallery.length; i++) {
var p_name = imgsGallery[i].title
if (p_name.length > 64) p_name = p_name.substring(0, 64) + "...";
if (i == 0) proj_list += '' + (i+1) + '. ' + p_name + '
';
else proj_list += '' + (i+1) + '. ' + p_name + '
';
}
proj_list += 'close';
$("index").innerHTML = proj_list;
//MudPopContent(id, showX, showY, hideX, hideY, width, height)
var index_dimensions = Element.getDimensions('index');
index = new MudPopContent('index', 0, 0, 0, -index_dimensions.height, index_dimensions.width, index_dimensions.height);
$('index').style.top = -index_dimensions.height + "px";
}
function setIndexSize() {
if (/MSIE/.test(navigator.userAgent) && !/Mac/.test(navigator.userAgent)) {
var h = (document.documentElement.clientHeight) ? document.documentElement.clientHeight : document.body.clientHeight;
$('index-wrapper').style.height = h + "px";
}
else {
var h = Element.getHeight('index');
$('index-wrapper').style.height = h + "px"
}
}
function init() {
initGallery();
initIndex();
setIndexSize();
setOnMouseClick();
}
////////////////////////////////////////////////////////////////////////////////
// EVENTS
Event.observe(window, 'load', init, false);