// ----------------------------------------------------------------------------------- // // This page coded by Scott Upton // http://www.uptonic.com | http://www.couloir.org // // This work is licensed under a Creative Commons License // Attribution-ShareAlike 2.0 // http://creativecommons.org/licenses/by-sa/2.0/ // // Associated APIs copyright their respective owners // // ----------------------------------------------------------------------------------- // --- version date: 11/28/05 -------------------------------------------------------- // Define each photo's name, width, height and caption var photoArray = new Array( // Source, Width, Height, Caption new Array("virginity.jpg", "350", "320", "
La virginit\u00E9: arme de domination massive, Ch‰telaine, sept 2008. Prix d'Excellence: Communication Arts, Illustration West 47, 3x3 Proshow No.6, Applied Arts.","
Male dominance on women's virginity, Chatelaine magazine, sept 2008 issue. Excellence Awards: Communication Arts, Illustration West 47, 3x3 Proshow No.6, Applied Arts."), new Array("bird.jpg", "350", "320", "
Une m\u00E8re raconte le dŽpart du nid familial de sa fille atteinte dÕune d\u00E9ficence intellectuelle, Globe and Mail.","
A mom tells the story of her disabled daughter leaving home, Globe and Mail."), new Array("prof.jpg", "350", "320", "
Le d\u00E9crochage chez les jeunes enseignants du syst\u00E8me public, magazine Inter.","
Young teachers massively leaving the profession, Inter magazine."), new Array("fish.jpg", "350", "320", "
Des promesses d'assurance-vie abusive, Businessweek.","
Abusive life insurance promises made to the elderly, Businessweek."), new Array("horses.jpg", "350", "320", "
Les cheffes d'entreprises sembleraient manquer de vision d'avenir en comparaison ˆ leur coll\u00E8gues masculins, magazine Canadian Business,","
Women leaders may lack of vision if compared to their male counterparts, Canadian Business magazine."), new Array("allaitement.jpg", "350", "320", "
MontŽe de lait contre l'allaitement, texte d'ƒlise Gravel, Ch‰telaine.","
I hate breastfeeding, article in Ch‰telaine."), new Array("infrastructure.jpg", "350", "320", "
L'infrastructure canadienne manque dramatiquement d'investissement, magazine Canadian Business.","
Canadian infrastructure in need of massive investment, Canadian Business magazine."), new Array("videogames_men.jpg", "350", "320", "
Pour devenir un homme il faut s'interesser ˆ autre chose que son look et les jeux vid\u00E9os, article sign\u00E9 Beno”t Dutrizac, sept 2008, magazine Ch‰telaine. Prix: Illustration West 47.","
To be a man, you have to have other interests besides your looks and videogames, Chatelaine, Sept 2008 issue. Awarded: Illustration West 47."), new Array("nurse.jpg", "350", "320", "
Une bonne utilisation des cinq sens permet ˆ l'infirmire de d\u00E9passer les technologies, Registered Nurse Journal .","
Nurses must rely on their senses rather than depend on technology, Registered Nurse Journal."), new Array("time_9to5.jpg", "350", "320", "
Le 9 ˆ 5 r\u00E9invent\u00E9, Report on Business, Globe and Mail.","
Has 9 to 5 met its' match? Report on Business, Globe and Mail."), new Array("baby_girls.jpg", "350", "320", "
Lˆ o il ne fait pas bon na”tre fille, nov 2008, Ch‰telaine.","
Not a good place to be born a girl, Chatelaine magazine, Nov 2008 issue."), new Array("tarzan.jpg", "350", "320", "
Un mari sauve son couple du naufrage l'ann\u00E9e o sa femme a termin\u00E9 son MBA, Globe and Mail.","
Husband saving his relationship the year his wife finished her MBA, Globe and Mail."), new Array("good_evil.jpg", "350", "320", "
Illustration pour deux articles, un sur la m\u00E9fiance g\u00E9n\u00E9rale ˆ l'\u00E9gard de la bont\u00E9, l'autre pronant les b\u00E9n\u00E9fices de la m\u00E9chancet\u00E9 , Ch‰telaine, oct 2008.","
Illustration for two articles: one on how we tend to be suspicious of other peoples' goodness, the second stating the benefits of being mean, Chatelaine magazine, oct 2008 issue."), new Array("heart.jpg", "350", "320", "
Interpr\u00E9tation d'un article relatant l'\u00E9xperience d'un journaliste apr\u00E8s une chirurgie cardiaque et son soudain attachement aux traditions catholiques, Ch‰telaine, nov 2008.","
Interpretation of an article about a journalist's experience after heart surgery and his sudden attachement to his christian tradition, Chatelaine magazine, oct 2008 issue."), new Array("reading.jpg", "350", "320", "
Comment les jeunes lecteurs apprennent \u00E8 lire, Qu\u00E9bec Sciences.","
How children learn to read, Quebec Science."), new Array("feet.jpg", "350", "320", "
Effets secondaires de la chimioth\u00E9rapie dont mon m\u00E9decin ne m'a pas parl\u00E9, More magazine d.a. Faith Cochran.","
Secondary effects of chimiotherapy no doctor told me about, More magazine, a.d. Faith Cochran."), new Array("umbrella_legal_counselling.jpg", "350", "320", "
Services l\u00E9gaux disponibles pour le regroupement du personel enseignant et administratif de l'Ontario, Ontario Principal Council.","
Legal advice services available for the administrative and teaching personel of Ontario, Ontario Principal Council."), new Array("music_industry.jpg", "350", "320", "
360 degr\u00E9s: ainsi se nomment les contrats qui couvrent toutes les facettes d'une carrire d'un artiste dans l'industrie de la musique, SOCAN Words and Music.","
360 degrees: contracts that cover every aspect of an artists' career in the music industry, SOCAN Words and Music."), new Array("paradise_house.jpg", "350", "320", "
Question spirituelle de mon fils, the Globe and Mail, d.a. Cinders McLeod.","
My son's questions on paradise, the Globe and Mail, a.d. Cinders McLeod."), new Array("valentines_angel.jpg", "350", "320", "
Carte pour la St-Valentin.","
Valentine's day card."), new Array("green_marketing.jpg", "350", "320", "
Cr\u00E9dits d'impots pour les entreprises qui prennent un virage vert, Canadian Business ","
Tax credits for companies going green, Canadian Business."), new Array("identity.jpg", "350", "320", "
Illustration pour le congrs de l'ACELF 2008: le Franais au coeur de notre identit\u00E9.","
Illustration for the ACELF congress 2008."), new Array("credit_card.jpg", "350", "320", "
Comment redorer votre cr\u00E9dit auprs des cr\u00E9anciers, Businessweek, d.a. Anne Russinof.","
How to brush up your credit rating, Businessweek, a.d. Anne Russinof."), new Array("mourning_2.jpg", "350", "320", "
Une femme raconte l'admiration qu'elle a pour son pre en deuil, the Globe and Mail, d.a. Cinders Mcleod.","
A woman writes about her admiration for her father in mourning, the Globe and Mail, a.d. Cinders Mcleod."), new Array("mouth_doctor.jpg", "350", "320", "
Une seconde opinion m\u00E9dicale obligatoire, Businessweek, d.a. Laura Renga.","
Getting a second opinion of what ails you, Businessweek, a.d. Laura Renga."), new Array("pinup_quebec.jpg", "350", "320", "
Illustration pour l'affiche de l'\u00E9vnement Ooh lˆ lˆ Illustration Show, ˆ Toronto en 2008, Prix LUX 2008","
Illustration for the poster of the Ooh lˆ lˆ illustration show held in Toronto, spring 2008, LUX prize 2008."), new Array("selfportrait.jpg", "350", "320", "
Autoportrait.","
Self-portrait."), new Array("jobhunting_bicycle.jpg", "350", "320", "
Gestion de carrire: avez-vous les outils n\u00E9c\u00E9ssaires pour faire les bons choix? ","
Personal carreer management: what tools do you need to make the right choices?"), new Array("angel_urban.jpg", "350", "320", "
Illustration pour la couverture du recueil de po\u00E9sie de Pierre Labrie, Le vent tout autour, \u00E9ditions La Bagnole .","
Illustration for the cover of a poetry book by Pierre Labrie, Le vent tout autour, La Bagnole publisher."), new Array("key_happiness.jpg", "350", "320", "
Nous d\u00E9tenons tous la clef du bonheur en nous.","
Each of us holds the key to happiness within ourselves."), new Array("boxer.jpg", "350", "320", "
Essai sur notre rapport ˆ la langue, magazine LÕActualit\u00E9.","
Essay on our relationship with the French language, LÕActualit\u00E9 magazine."), new Array("hotel_marketing_computer.jpg", "350", "320", "
La mise en march\u00E9 des h™tels sur internet, Hotelier magazine.","
Marketing your hotel on the web? Hotelier magazine."), new Array("mourning.jpg", "350", "320", "
Travail personel sur le deuil, Grand Prix, LUX 2008","
Personal work on mourning, Grand Prize, LUX 2008."), new Array("wasp_secret.jpg", "350", "320", "
Le poids et les cons\u00E9quences du secret en milieu de travail.","
Secrets and the workplace."), new Array("carpooling.jpg", "350", "320", "
Cinq femmes partagent le volant au quotidien pour aller au travail: un geste \u00E9cologique ˆ partir duquel se d\u00E9veloppe une grande amiti\u00E9.","
Five women carpooling 5 days a week: from an environmentaly-conscious move grows a circle of friends."), new Array("professional_coaching.jpg", "350", "320", "
La promesse du coaching: une nouvelle approche au d\u00E9veloppement professionel.","
The promise of coaching for administrators: professional developpement for the new age."), new Array("responsible_investment.jpg", "350", "320", "
Est-ce que votre \u00E9pargne est r\u00E9investi dans des investissements \u00E9cologiques?","
Are your savings invested in environmentaly friendly investments?"), new Array("pill_consumption.jpg", "350", "320", "
Article sur notre manque de conscience vis-ˆ-vis la prise de m\u00E9dicaments.","
The numbers reveal how lightly we take medical drug consumption."), new Array("high_heel_shoe_woman_work.jpg", "350", "320", "
Article qui constate la lente \u00E9volution de lÕ\u00E9quit\u00E9 salariale pour les femmes sur le march\u00E9 du travail, et ce que doivent faire les femmes pour changer la donne.","
Article reporting the slow evolution of salary-equity for women on the marketplace, and what is in their power to change the situation."), new Array("snake_game_addiction.jpg", "350", "320", "
Chosen, American Illustration 26.
Les cons\u00E9quences de la d\u00E9pendance au jeu sur ses victimes.","
Article about what game-addicts go through."), new Array("superhero_videogame.jpg", "350", "320", "
Montr\u00E9al: la mecque en cr\u00E9ation de jeux-vid\u00E9o.","
Montreal: the mecca of video-game programmers."), new Array("wolf_red_riding_hood_incest.jpg", "350", "320", "
Chosen, American Illustration 26; finaliste, Lux 2007.
Les cons\u00E9quences ˆ long terme de lÕinceste, et la possibilit\u00E9 de r\u00E9silience chez une partie de ces victimes.","
Victims of incest: the long lasting consequences and the possibility of resilience."), new Array("hunter.jpg", "350", "320", "
S\u00E9rie sur les proverbes: qui part \u00E8 la chasse perd sa place.","
Series on french proverbs: he who leaves (goes hunting) will easily be replaced (loses his seat)."), new Array("munk.jpg", "350", "320", "
S\u00E9rie sur les proverbes: lÕhabit ne fait pas le moine.","
Series on french proverbs: things arenÕt always as they appear (the robe doesnÕt make a munk)."), new Array("hat.jpg", "350", "320", "
S\u00E9rie sur les proverbes: parler ˆ travers son chapeau.","
Series on french proverbs: he who talks much about a subject he knows little of (to talk through oneÕs hat)."), new Array("baby.jpg", "350", "320", "
Article qui donne une perspective diff\u00E9rente (sous lÕangle de lÕenfant) sur les \u00E9tapes de d\u00E9veloppemnet du tout-petit.","
Article about toddler-development from the childÕs point of view."), new Array("communication_skills.jpg", "350", "320", "
Nos aptitudes en communication: une importance cruciale dans nos relations personelles et professionnelles.","
How our communication abilities influence our personal and professional relationships.") ); // Number of photos in this gallery var photoNum = photoArray.length; // get current photo id from URL var thisURL = document.location.href; var splitURL = thisURL.split("#"); var photoId = splitURL[1] - 1; // if no photoId supplied or if request out of range then set default var photoId = (!photoId)? 0 : photoId; var photoId = (photoId<0)? 0 : photoId; var photoId = (photoId>photoNum-1)? 0 : photoId; // Photo directory for this gallery var photoDir = "portfolio/casson/"; // Icon directory for this gallery var iconDir = "portfolio/casson/"; // Icon prefix Note that icons must be gifs var iconPrefix = "thumb_"; var iconsHTML = " " /*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/ var Slideshow = Class.create(); Slideshow.prototype = { initialize: function(photoId) { this.photoId = photoId; this.photo = 'Photo'; this.photoBox = 'ImageContainer'; this.photoContainer = 'OuterContainer'; this.linkContainer = 'LinkContainer' this.prevLink = 'PrevLink'; this.nextLink = 'NextLink'; this.captionBox = 'CaptionContainer'; this.captionFr = 'CaptionFr'; this.captionEng = 'CaptionEng'; this.counter = 'Counter'; this.loader = 'Loading'; this.iconsBox = 'IconContainer'; this.icons = 'Icons'; }, getCurrentSize: function() { // Get current height and width, subtracting CSS border size this.wCur = Element.getWidth(this.photoBox) - borderSize; this.hCur = Element.getHeight(this.photoBox) - borderSize; }, /* getNewSize: function() { // Get current height and width this.wNew = photoArray[photoId][1]; this.hNew = photoArray[photoId][2]; }, getScaleFactor: function() { this.getCurrentSize(); this.getNewSize(); // Scalars based on change from old to new this.xScale = (this.wNew / this.wCur) * 100; this.yScale = (this.hNew / this.hCur) * 100; }, */ setNewPhotoParams: function() { // Set source of new image Element.setSrc(this.photo,photoDir + photoArray[photoId][0]); // Set anchor for bookmarking Element.setHref(this.prevLink, "#" + (photoId+1)); Element.setHref(this.nextLink, "#" + (photoId+1)); }, setPhotoCaption: function() { // Add caption from gallery array Element.setInnerHTML(this.counter,((photoId+1)+'/'+photoNum)); Element.setInnerHTML(this.captionFr,photoArray[photoId][3]); Element.setInnerHTML(this.captionEng,photoArray[photoId][4]); }, showPhoto: function(){ new Effect.Fade(this.loader, {delay: 0.5, duration: 0.5}); // Workaround for problems calling object method "afterFinish" new Effect.Appear(this.photo, {duration: 1.0, queue: 'end', afterFinish: function(){ new Effect.Appear('CaptionContainer', {delay: 0.0, duration: 0.5}); new Effect.Appear('LinkContainer', {delay: 0.0, duration: 0.5});}}); }, nextPhoto: function(){ // Figure out which photo is next (photoId == (photoArray.length - 1)) ? photoId = 0 : photoId++; this.initSwap(); }, prevPhoto: function(){ // Figure out which photo is previous (photoId == 0) ? photoId = photoArray.length - 1 : photoId--; this.initSwap(); }, goToPhoto: function(newId){ // Set go to photo var tempId = newId; var splitTempId = tempId.split("_"); var Id = splitTempId[1] - 1; if(photoId != Id){ photoId = Id; this.initSwap(); } }, initSwap: function() { // Begin by hiding main elements Element.hide(this.photo); Element.show(this.loader); Element.hide(this.captionBox); Element.hide(this.linkContainer); // Set new dimensions and source, then resize this.setNewPhotoParams(); this.setPhotoCaption(); }, initIcons: function() { // for (var i = 0; i < photoNum; i++) { tempName = photoArray[i][0].split("."); iconFileName = tempName[0] + ".gif" iconURL = (iconDir+iconPrefix+iconFileName); iconsHTML = iconsHTML + "icon"; } Element.setInnerHTML('icons', iconsHTML); //Calculate the total width of all the icons including borders and margins var totalIconWidth = (Number(Element.getStyle('ic_1', 'margin-left').replace('px',''))+Number(Element.getStyle('ic_1', 'margin-right').replace('px',''))+Number(Element.getStyle('ic_1', 'border-left-width').replace('px',''))+Number(Element.getStyle('ic_1', 'border-right-width').replace('px',''))+Number(Element.getStyle('ic_1', 'width').replace('px','')))*photoNum + 5 Element.setWidth('icons', totalIconWidth); //Scroll to current page var iconPageNumber=Math.ceil((photoId)/9)-1 if (iconPageNumber>0) { scrollForward('IconFrame', 'icons', '531', iconPageNumber); } //debug(totalIconWidth); }, initCaption: function() { Element.setWidth(this.captionBox,this.wCur-(-borderSize)); }, initSwapFirst: function() { // Begin by hiding main elements Element.hide(this.photo); Element.show(this.loader); Element.hide(this.captionBox); //Element.setInnerHTML(this.caption,""); //Element.setInnerHTML(this.counter,""); Element.hide(this.linkContainer); // Set new dimensions and source, then resize this.setNewPhotoParams(); //this.resizePhotoBox(); //this.initCaption(); //To resize icon box, activate the following line //Element.setWidth(this.iconsBox,this.wCur-(-borderSize)); this.setPhotoCaption(); this.initIcons(); Behaviour.apply(); } } /*--------------------------------------------------------------------------*/ // Establish CSS-driven events via Behaviour script var myrules = { 'body' : function(el){ Effect.Center('WindowBox'); window.onresize = function(el){ Effect.Center('WindowBox'); } }, '#Photo' : function(element){ element.onload = function(){ var myPhoto = new Slideshow(photoId); myPhoto.showPhoto(); } }, '#PrevLink' : function(element){ element.onmouseover = function(){ } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.prevPhoto(); } }, /* '#Icons img' : function(element){ element.onmouseover = function(){ soundManager.play('beep'); //Element.setOpacity(this,'1.00'); } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.goToPhoto(this.id); soundManager.play('select'); } element.onmouseout = function(){ //Element.setOpacity(this,'0.5'); } },*/ '#NextLink' : function(element){ element.onmouseover = function(){ } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.nextPhoto(); } }, a : function(element){ element.onfocus = function(){ this.blur(); } }, //Icon Behaviors 'img.MouseOver' : function(el){ setMouseOver(el); element.onmouseover = function(){ mouseGoesOver(this); } element.onclick = function(){ } element.onmouseout = function(){ mouseGoesOut(this); } }, '#IconFrame img': function(el){ element.onmouseover = function(){ Element.setStyle(this, { border: 'solid 1px orange'} ); } element.onclick = function(){ var myPhoto = new Slideshow(photoId); myPhoto.goToPhoto(this.id); } element.onmouseout = function(){ Element.setStyle(this, { border: 'solid 1px white'} ); } }, '#icon_prev img' : function(){ element.onload = function(el){ } element.onclick = function(el){ scrollBack('IconFrame', 'icons', '531'); } }, '#icon_next img' : function(){ element.onload = function(el){ } element.onclick = function(el){ scrollForward('IconFrame', 'icons', '531', '1'); } } }; // Add window.onload event to initialize Behaviour.addLoadEvent(init); Behaviour.apply(); function init() { var myPhoto = new Slideshow(photoId); myPhoto.initSwapFirst(); }