// JavaScript Document
//Josh Clark Design Portfolio: By Josh Clark, at http://www.joshclarkdesign.com
//** Created: 5/24/2009
// Declares the lists of images that will appear as sets in the main viewer area
var mind_over_machines = new Array ("
","
","
","
","
");
var seventhseal = new Array ("
","
","
","
","
");
var project1 = new Array ("
","
","
");
var project2 = new Array ("
","
");
var project3 = new Array ("
","
");
var project4 = new Array ("
","
","
","
","
");
var project5 = new Array ("
","
","
","
");
var project6 = new Array ("
","
");
var project7 = new Array ("
","
");
var wash_logo = new Array ("
");
var uglymug_logo = new Array ("
");
var yoga_logo = new Array ("
");
var boomtown_logo = new Array ("
");
var ss_logo = new Array ("
","
");
var anamide_logo = new Array ("
");
var bhrc_logo = new Array ("
");
var project9 = new Array ("
");
var project10 = new Array ("
","
");
var project11 = new Array ("
","
");
var project12 = new Array ("
","
");
var project13 = new Array ("
","
","
","
");
var aca = new Array ("
","
","
");
var centermd = new Array ("
","
");
var fitzmaurice = new Array ("
","
","
");
var momweb = new Array ("
","
","
","
","
","
");
var ssweb = new Array ("
","
","
");
var skirmish = new Array ("
","
");
var zanninos_logo = new Array ("
","
","
","
");
var unisearch_logo = new Array ("
");
var rcd_logo = new Array ("
","
");
var nrai_interface = new Array ("
","
");
var eb_interface = new Array ("
");
var osi_logo = new Array ("
","
");
var whole_layout = new Array ("
","
");
var mobi_layout = new Array ("
");
var gerretson_layout = new Array ("
");
var mcsa_layout = new Array ("
");
var walton = new Array ("
","
","
","
","
","
");
var repertorio = new Array ("
");
var vesta = new Array ("
","
");
// Object containing all project image sets
var imageBank = {
project1:project1,
project2:project2,
project3:project3,
project4:project4,
project5:project5,
project6:project6,
project7:project7,
project9:project9,
project10:project10,
project11:project11,
project12:project12,
project13:project13,
seventhseal:seventhseal,
mind_over_machines:mind_over_machines,
aca:aca,
centermd:centermd,
fitzmaurice:fitzmaurice,
momweb:momweb,
ssweb:ssweb,
skirmish:skirmish,
wash_logo:wash_logo,
uglymug_logo:uglymug_logo,
yoga_logo:yoga_logo,
boomtown_logo:boomtown_logo,
ss_logo:ss_logo,
anamide_logo:anamide_logo,
bhrc_logo:bhrc_logo,
zanninos_logo:zanninos_logo,
unisearch_logo:unisearch_logo,
rcd_logo:rcd_logo,
nrai_interface:nrai_interface,
eb_interface:eb_interface,
osi_logo:osi_logo,
whole_layout:whole_layout,
mobi_layout:mobi_layout,
gerretson_layout:gerretson_layout,
mcsa_layout:mcsa_layout,
walton:walton,
repertorio:repertorio,
vesta:vesta
};
// Declaring the text that will be shown in the caption area
var project_caption1 = "client:
Project number 1 caption
role:
Role that I played in the project.";
var project_caption2 = "client:
Black Hole Night Club
role:
Logo Design, Website Design, Flash";
var project_caption3 = "client:
Learning Ext JS, Shea Frederick
role:
Website Design";
var project_caption4 = "client:
Home & Stone
role:
E-Commerce Website Design";
var project_caption5 = "client:
Elevation Church
role:
Website Design, XHTML/CSS, CMS";
var project_caption6 = "client:
CTASC
role:
Website Design";
var project_caption7 = "client:
SaSa's Spa
role:
Website Design";
var project_caption9 = "client:
Danielle Renee
role:
Logo Design, Website Design, XHTML/CSS, CMS";
var project_caption10 = "client:
reMarriage Magazine
role:
Website Design";
var project_caption11 = "client:
Elite MGA
role:
Website Design, Flash Design";
var project_caption12 = "client:
OFAC Watch
role:
User Interface Design";
var project_caption13 = "client:
Flyer Design for Multiple Clients
role:
Graphic Design";
var seventhseal_caption = "client:
Seventh Seal
role:
Album Cover Design, Logo Design, Website Design";
var mindovermachines_caption = "client:
Mind Over Machines
role:
Print Design - Pocket Folder, Thank you cards, Envelopes, Business Cards";
var aca_caption = "client:
ACA: Answer Center America
role:
Web design";
var centermd_caption = "client:
Center Maryland
role:
Web Development, Production Design";
var fitzmaurice_caption = "client:
Fitzmaurice Community Services
role:
Web Design";
var momweb_caption = "client:
Mind Over Machines
role:
Web Design, Interaction Design";
var ssweb_caption = "client:
Seventh Seal
role:
Web Design, Logo Design, Artwork";
var skirmish_caption = "client:
Skirmish Paintball
role:
Web Design, Logo Design";
var wash_logo_caption = "client:
Wash This Out Design
role:
Logo Design, Ad Design";
var uglymug_logo_caption = "client:
Ugly Mug Coffee and Concert House
role:
Logo Design";
var yoga_logo_caption = "client:
Yoga Butterfly
role:
Logo Design";
var boomtown_logo_caption = "client:
Boomtown Internet Marketing
role:
Logo Design";
var ss_logo_caption = "client:
Seventh Seal
role:
Logo Design";
var anamide_logo_caption = "client:
Anamide
role:
Logo Design";
var bhrc_logo_caption = "client:
Black Hole Night Club
role:
Logo Design";
var zanninos_logo_caption = "client:
Zannino's Catering
role:
Logo Design";
var unisearch_logo_caption = "client:
Unisearch
role:
Logo Design";
var rcd_logo_caption = "client:
RCD Technology
role:
Logo Design";
var nrai_interface_caption = "client:
NRAI
role:
Interface Design";
var eb_interface_caption = "client:
Everything is Better Tshirts
role:
Interface Design";
var osi_logo_caption = "client:
Outside Solutions, Inc.
role:
Logo Design";
var whole_layout_caption = "client:
Seventh Seal (Band)
role:
EP Layout Design";
var mobi_layout_caption = "client:
Mind Over Machines
role:
Brochure Design";
var gerretson_layout_caption = "client:
Gerretson
role:
Brochure Design";
var mcsa_layout_caption = "client:
MCSA
role:
Card Design";
var walton_caption = "client:
Walton Performing Arts Center
role:
Website Design";
var repertorio_caption = "client:
Repertorio Espanol
role:
Website Design";
var vesta_caption ="client:
Vestascension
role:
Website Design";
// Object containing all captions
var infoBank = {
project1:project_caption1,
project2:project_caption2,
project3:project_caption3,
project4:project_caption4,
project5:project_caption5,
project6:project_caption6,
project7:project_caption7,
project9:project_caption9,
project10:project_caption10,
project11:project_caption11,
project12:project_caption12,
project13:project_caption13,
seventhseal:seventhseal_caption,
mind_over_machines:mindovermachines_caption,
aca:aca_caption,
centermd:centermd_caption,
fitzmaurice:fitzmaurice_caption,
momweb:momweb_caption,
ssweb:ssweb_caption,
skirmish:skirmish_caption,
wash_logo:wash_logo_caption,
uglymug_logo:uglymug_logo_caption,
yoga_logo:yoga_logo_caption,
boomtown_logo:boomtown_logo_caption,
ss_logo:ss_logo_caption,
anamide_logo:anamide_logo_caption,
bhrc_logo:bhrc_logo_caption,
zanninos_logo:zanninos_logo_caption,
unisearch_logo:unisearch_logo_caption,
rcd_logo:rcd_logo_caption,
nrai_interface:nrai_interface_caption,
eb_interface:eb_interface_caption,
osi_logo:osi_logo_caption,
whole_layout:whole_layout_caption,
mobi_layout:mobi_layout_caption,
gerretson_layout:gerretson_layout_caption,
mcsa_layout:mcsa_layout_caption,
walton:walton_caption,
repertorio:repertorio_caption,
vesta:vesta_caption
};
// Declaring the text for the Project titles
var project_title1 = "Project 1
";
var project_title2 = "Web: Black Hole Night Club
";
var project_title3 = "Web: Learning Ext JS
";
var project_title4 = "Web: Home & Stone Web and E-Commerce Design
";
var project_title5 = "Web: Elevation Church
";
var project_title6 = "Web: CTASC
";
var project_title7 = "Web: SaSa's Spa
";
var project_title9 = "Web: Danielle Renee
";
var project_title10 = "Web: reMarriage Magazine
";
var project_title11 = "Web: Elite MGA
";
var project_title12 = "OFAC Watch Application Design
";
var project_title13 = "Layout: Flyer Design for Multiple Clients
";
var seventhseal_title = "Layout: Seventh Seal Album Cover Design
";
var mindovermachines_title = "Layout: Mind Over Machines Identity Package
";
var aca_title = "Web: Answer Center America
";
var centermd_title = "Web: Center Maryland
";
var fitzmaurice_title = "Web: Fitzmaurice Community Services
";
var momweb_title = "Web: Mind Over Machines
";
var ssweb_title = "Web: Seventh Seal
";
var skirmish_title = "Web: Skirmish
";
var wash_logo_title = "Logo: Wash This Out Design
";
var uglymug_logo_title = "Logo: The Ugly Mug Coffee and Concert House
";
var yoga_logo_title = "Logo: Yoga Butterly
";
var boomtown_logo_title = "Logo: Boomtown Internet Marketing
";
var ss_logo_title = "Logo: Seventh Seal (Band)
";
var anamide_logo_title = "Logo: Ananmide (Band)
";
var bhrc_logo_title = "Logo: Black Hole Night Club
";
var zanninos_logo_title = "Logo: Zannino's Catering
";
var unisearch_logo_title = "Logo: Unisearch
";
var rcd_logo_title = "Logo: RCD Technology
";
var nrai_interface_title = "Interface: NRAI Private Web
";
var eb_interface_title = "Interface: Everything is Better Tshirt Design
";
var osi_logo_title = "Logo: Outside Solutions, Inc.
";
var whole_layout_title = "Layout: Seventh Seal, Whole EP Layout Design
";
var mobi_layout_title = "Layout: MOBI Application Brochure Design
";
var gerretson_layout_title = "Layout: Gerretson Brochure Design
";
var mcsa_layout_title = "Layout: MCSA Card Design
";
var walton_title = "Layout: Walton Performing Arts Website Design
";
var repertorio_title = "Layout: Repertorio Espanol Website Design
";
var vesta_title = "Layout: Vestascension Website Design
";
// Object containing all titles
var titleBank = {
project1:project_title1,
project2:project_title2,
project3:project_title3,
project4:project_title4,
project5:project_title5,
project6:project_title6,
project7:project_title7,
project9:project_title9,
project10:project_title10,
project11:project_title11,
project12:project_title12,
project13:project_title13,
seventhseal:seventhseal_title,
mind_over_machines:mindovermachines_title,
aca:aca_title,
centermd:centermd_title,
fitzmaurice:fitzmaurice_title,
momweb:momweb_title,
ssweb:ssweb_title,
skirmish:skirmish_title,
wash_logo:wash_logo_title,
uglymug_logo:uglymug_logo_title,
yoga_logo:yoga_logo_title,
boomtown_logo:boomtown_logo_title,
ss_logo:ss_logo_title,
anamide_logo:anamide_logo_title,
bhrc_logo:bhrc_logo_title,
zanninos_logo:zanninos_logo_title,
unisearch_logo:unisearch_logo_title,
rcd_logo:rcd_logo_title,
nrai_interface:nrai_interface_title,
eb_interface:eb_interface_title,
osi_logo:osi_logo_title,
whole_layout:whole_layout_title,
mobi_layout:mobi_layout_title,
gerretson_layout:gerretson_layout_title,
mcsa_layout:mcsa_layout_title,
walton:walton_title,
repertorio:repertorio_title,
vesta:vesta_title
};
// When a thumbnail is clicked, the caption, title and main viewer are updated with the desired content
$(document).ready(function () {
var i = 0;// Variable used to make sure that the user needs to see the featured items when they land on the homepage
$("#hiddenNavHome").show();
$("#prevLinkHome").hide();
$("#nextLinkHome").show();
imageNumber = 0;
projectName = $("#main_image").attr("syncwith");
currentProjectImages = imageBank[projectName];
maxNumber = currentProjectImages.length - 1;
$("#previousButtonHome").click(function(event){
$("#main_image").html(currentProjectImages[imageNumber - 1]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
if(imageNumber > 0){
imageNumber--;
}
$("#nextLinkHome").show();
if(imageNumber == 0){
$("#prevLinkHome").hide();
}
$(this).blur();
return false;
});
$("#nextButtonHome").click(function(event){
if(imageNumber == maxNumber){
$("#main_image").html(currentProjectImages[imageNumber]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
}
if(imageNumber < maxNumber){
$("#main_image").html(currentProjectImages[imageNumber + 1]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
imageNumber++;
}
if(imageNumber == maxNumber){
$("#nextLinkHome").hide();
}
$("#prevLinkHome").show();
$(this).blur();
return false;
});
$("#prevLink").hide();
$(".panel a").click(function(event){
//$("#main_image_landing").empty().html('
');
imageNumber = 0;
projectName = this.attributes.name.nodeValue;
currentProjectImages = imageBank[projectName];
maxNumber = currentProjectImages.length - 1;
$("#project_title").html(titleBank[projectName]);
$("#caption").html(infoBank[projectName]);
$("#main_image").html(currentProjectImages[imageNumber]);
if(i == 0){
$("#project_title_landing").hide();
$("#project_title").fadeIn('slow');
$("#main_image_landing").hide();
$("#main_image").fadeIn('slow');
$("#caption_landing").hide();
$("#caption").fadeIn('slow');
} else {
$("#project_title").hide();
$("#project_title").fadeIn('slow');
$("#main_image").hide();
$("#main_image").fadeIn('slow');
$("#caption").hide();
$("#caption").fadeIn('slow');
}
$("#hiddenNav").show();
$("#prevLink").hide();
$("#nextLink").show();
if(currentProjectImages.length === 1){
$("#nextLink").hide();
}
i++; // Updates variable so user can move on from landing page*/
event.preventDefault();
});
$("#previousButton").click(function(event){
$("#main_image").html(currentProjectImages[imageNumber - 1]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
if(imageNumber > 0){
imageNumber--;
}
$("#nextLink").show();
if(imageNumber == 0){
$("#prevLink").hide();
}
$(this).blur();
return false;
});
$("#nextButton").click(function(event){
if(imageNumber == maxNumber){
$("#main_image").html(currentProjectImages[imageNumber]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
}
if(imageNumber < maxNumber){
$("#main_image").html(currentProjectImages[imageNumber + 1]);
$("#main_image").hide();
$("#main_image").fadeIn('slow');
imageNumber++;
}
if(imageNumber == maxNumber){
$("#nextLink").hide();
}
$("#prevLink").show();
$(this).blur();
return false;
});
/* $(window).bind("load resize", function(){ //refresh position of nav buttons when page loads/resizes
if(window.innerHeight >= 904){
windowMiddle = (window.innerWidth / 2);
$("#nextLink").css({left:windowMiddle + 392 +'px'})
$("#prevLink").css({left:windowMiddle - 614 +'px'})
}
if(window.innerHeight < 904){
windowMiddle = (window.innerWidth / 2);
$("#nextLink").css({left:windowMiddle + 385 +'px'})
$("#prevLink").css({left:windowMiddle - 624 +'px'})
}
}) */
});