The JavaScript Source: Miscellaneous: KityKity's Photo Album

Home

Miscellaneous

KityKity's Photo Album

This is a photo album script that displays your favorite photos in a flip book-style album! Includes picture, title, date taken, and description. Select your picture from a list, click for a random picture, or search for your picture!

The JavaScript Source: Miscellaneous: KityKity's Photo Album
Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Command-s). The script is yours!!!

  <BODY>     <SCRIPT LANGUAGE="JavaScript"> var javascript_version = 1.0;</SCRIPT> <SCRIPT LANGUAGE="JavaScript1.1"> javascript_version = 1.1;</SCRIPT> <script language=javascript> /********************************************************** * Suzy's Javascript Photo Album, version 5.5, March 2, 2003 * * Changed this version: can now use HTML tags in picture description. * * This javascript code may be used on other Websites if: * 1) This notice is left unchanged. * 2) A link to http://www.kitykity.com is placed on that page. * Please search the FAQ for answers to common problems and questions. * You may contact me at kitykity@hotmail.com for assistance. * **********************************************************/ self.name = "main"; // names current window as "main" PicVar = 0; // Object Fix function Fix(DatVal, PicVal, TitVal, TxtVal) { this.DatVal = DatVal this.PicVal = PicVal this.TitVal = TitVal this.TxtVal = TxtVal } // Create new main array. var SuzyArray = new Array() // The following lines are the ONLY LINES in this whole script that you need to change! // SuzyArray[PicVar++] = new Fix("date", "picname.jpg", "pic title", "pic description") SuzyArray[PicVar++] = new Fix("2/25/2003", "2003-02-25-27.jpg", "Our house in the snow", "I took this beautiful picture this morning. The streets are <i>one solid sheet of ice</i> right now! It's insane. I don't think we'll be driving anywhere soon.") SuzyArray[PicVar++] = new Fix("1/5/2003", "2003-01-05-03.jpg", "Rain in the trees", "I had taken <b>Rainlin</b> out for a walk in the stroller, and we saw these cute little trees and stopped for a picture.") SuzyArray[PicVar++] = new Fix("1/31/2003", "2002-12-31-01.jpg", "Scott and Suzy", "I asked one of our friends to take this picture for us. Could my handsome hubby's eyes get any more <b>blue?</b> :)") SuzyArray[PicVar++] = new Fix("12/7/2002", "2002-12-07-05.jpg", "on the hayride", "Daddy was having a wonderful time on the hayride. Dylan wasn't too sure about it!") SuzyArray[PicVar++] = new Fix("11/9/2002", "2002-11-09-09.jpg", "Boys on wheels", "Daddy was holding Dylan up <i>with his knees!</i> Those skates sure are hard to stand up in, but once he got the knack for it Dylan didn't want to take them off.") SuzyArray[PicVar++] = new Fix("10/30/2002", "2002-10-30-01.jpg", "Dylan the Builder", "Here's Dylan, all dressed up and ready for Halloween! Everything in his life is Bob-the-builder related.") SuzyArray[PicVar++] = new Fix("6/19/2002", "2002-06-19-07.jpg", "Jabba's face", "It's hard, really hard, to get a picture of Jabba's face without him charging the camera.") SuzyArray[PicVar++] = new Fix("6/11/2002", "2002-06-11-11.jpg", "Rain behind the house", "The brick that makes up the outside of the house proved to be really pretty for framing pictures of the kidlets.") SuzyArray[PicVar++] = new Fix("6/9/2002", "2002-06-09-04.jpg", "Scott and Rainlin", "I just had to take some pictures of them before church. They looked so nice!") SuzyArray[PicVar++] = new Fix("6/9/2002", "2002-06-09-01.jpg", "Rainlin and Susan", "We both wore our pretty blue flower dresses that Sunday.") SuzyArray[PicVar++] = new Fix("6/7/2002", "2002-06-07-24.jpg", "Kaytlyn and Rainlin playing dress-up", "Kaytlyn has a whole bunch of dress-up clothes, and Rain loves to go over to her house and play dress-up with her.") SuzyArray[PicVar++] = new Fix("6/2/2002", "2002-06-02-13.jpg", "The Three Amigos", "Dylan, Daddy, and Rainlin were watching Castaway on the couch. We just moved all the furniture into that 'great room,' and everyone seems to like it better in there.") SuzyArray[PicVar++] = new Fix("6/1/2002", "2002-06-01-09.jpg", "Simon", "For those of you who have never met him, this is Simon. He's the tatoo I have on my left leg. I drew everything of the tattoo except for his head, which came from a greeting card my mother sent me while I was in the military.") last = PicVar - 1; current = 0; function ShowSuzyPic(newpic) { // (not working on some browsers) document.playsound.play(); current = newpic; SelectionBox = document.SuzyForm.SuzyDropdown; SelectionBox.options[current].selected = true; document.getElementById("SuzySpot").innerHTML = '<a href=javascript:SuzyPicRemote("' + SuzyArray[current].PicVal + '","last");><img name="PicShowing" src=' + SuzyArray[current].PicVal + ' height=200 border=0></a>'; document.getElementById("Journal").outerHTML = '<div id=journal><br>' + SuzyArray[current].DatVal + '<p style="text-align:justify; text-indent:25px">' + SuzyArray[current].TxtVal + '</div>'; if (document.SuzyForm.WhereView[1].checked) { timerID = setTimeout("SuzyPicRemote(SuzyArray[current].PicVal,'current')",1000) } } function RandomSuzyPic() { randompic = Math.floor(Math.random()*PicVar); last = current; ShowSuzyPic(randompic); } function PreviousSuzyPic() { last = current; current--; if(current<0) current = PicVar - 1; ShowSuzyPic(current); } function NextSuzyPic() { last = current; TotalImages = document.SuzyForm.SuzyDropdown.options.length; current++; if (current>=PicVar) current = 0; ShowSuzyPic(current); } function SuzyPicRemote(picName,whichPic) { ShowingImage = new Image(); ShowingImage.src = picName; wid = ShowingImage.width + 50; hei = ShowingImage.height + 50; if (wid < 30 || hei < 30) { wid=650; hei=490; } if (screen.width < wid || screen.height < hei) { wid = screen.width - 50; hei = screen.height - 50; } OpenWindow = window.open("http://www.kitykity.com/photoalbum/clear.html", "remoteWin", "resizable=1, scrollbars=1, toolbar=0, left=15, top=10, width=" + wid + ", height=" + hei); OpenWindow.document.write('<html><body background=parchment.jpg><img src=' + picName + '></body></html>'); OpenWindow.document.close(); } function FindPic() { TotalFound = 0; SearchString = document.SuzyForm.SearchWord.value; SearchString = SearchString.toLowerCase(); WriteResults = window.open("clear.html","resultwindow","height=300, width=300, toolbar=0, status=0, menubar=0, resizable=1, scrollbars=1"); WriteResults.document.open(); WriteResults.document.write('<div style="text-align:center; font:8pt verdana">' + 'You searched for:<br><i>' + SearchString + '</i><br><b>Results:</b><br>'); for (loop=0; loop < PicVar ; loop++) { Keyword = SuzyArray[loop].TxtVal; Keyword = Keyword.toLowerCase(); URL = SuzyArray[loop].PicVal; title = SuzyArray[loop].TitVal; title = title.toLowerCase(); SearchResult = Keyword.indexOf(SearchString); SearchResult2 = title.indexOf(SearchString); if (SearchResult != "-1" || SearchResult2 != "-1") { last = current; WriteResults.document.write('<br><a href=javascript:ShowSuzyPic(' + loop + '); target="main">' + title + '</a>'); TotalFound++; } } WriteResults.document.write('<p><b>Returned ' + TotalFound + ' results.</b>'); WriteResults.document.close(); if(javascript_version > 1.0) { //delay a bit here because IE4 encounters errors //when trying to focus a recently opened window setTimeout('WriteResults.focus();',250); } } // --> </script> <form name="SuzyForm"> <table border=0><tr><td> <table style="padding:0px; margin:0px" border=0 cellspacing=0><tr align=center> <td bgcolor=f9f9f9 style="background:url(parchment.jpg); width:275px; border-top:2px groove #888888;border-left:4px groove #888888;border-bottom:4px groove #888888; padding:10px; margin:0px"> <div id="SuzySpot"> <script language=javascript> document.write('<a href=javascript:SuzyPicRemote("' + SuzyArray[current].PicVal + '","last");><img name="PicShowing" src=' + SuzyArray[current].PicVal + ' height=200 border=0></a>'); </script> </div> </td> <td style="background:url(parchmentring.jpg); width:36px; border-top:2px groove #888888; border-bottom:4px groove #888888" border=0> </td> <td style="background:url(parchment.jpg); border-top:2px groove #888888; border-right:4px groove #888888; border-bottom:4px groove #888888; padding:5px; padding-right:20px; width:225px; font:8pt verdana; color:#000044; margin-left:0px" valign=top> <div id="Journal"> <script language=javascript> document.write('<br>' + SuzyArray[current].DatVal + '<p style="text-align:justify; text-indent:25px">' + SuzyArray[current].TxtVal); </script> </div> </td> </tr></table> <p> <table border=0><tr align=center> <td> <input type=button value="<<" onClick="PreviousSuzyPic();" style="font:8pt verdana,helvetica,arial; text-align:center"> <input type=button value="random" onClick="RandomSuzyPic();" style="font:8pt verdana,helvetica,arial"> <input type=button value=">>" onClick="NextSuzyPic();" style="font:8pt verdana,helvetica,arial; text-align:center"> <p> <SELECT size=12 style='font:8pt verdana' name='SuzyDropdown' onChange='ShowSuzyPic(SuzyForm.SuzyDropdown.options.selectedIndex);'> <script language=javascript> TotalImages = PicVar; for (loop=0; loop < TotalImages; loop++) { document.write("<option value=" + SuzyArray[loop].PicVal + ">" + SuzyArray[loop].TitVal + "</option>"); } </script> </SELECT> </td> <td style="padding-left:25px; font:8pt verdana"> <p style="text-align:left"><input type=radio name="WhereView" value="chkLocal" CHECKED>- View pictures in this window. <br><input type=radio name="WhereView" value="chkRemote">- View pictures in remote window.</p> <p>Search for a photo: <br><input name="SearchWord" size=10 style="font:8pt verdana"> <br><input type="button" value="Find it!" onClick="javascript:FindPic();" style="font:8pt verdana"> </td></tr></table> </td></tr></table> </FORM> <p><SCRIPT Language="Javascript"> document.write("This album currently has " + PicVar + " photos and was last modified on " + document.lastModified +"."); </script> <p><center> <font face="arial, helvetica" size"-2">Free JavaScripts provided<br> by <a href="http://javascriptsource.com">The JavaScript Source</a></font> </center><p> 
Did you use this script? Do you like this site? Please link to us!

Add a comment, suggestion, or correction

Sign up for the JavaScript Weekly

internet.com Privacy Policy

[ Contact Us! ]
[ JavaScript Forum ]
[ Submit Your Script! ]

WebMediaBrands Corporate Info

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

Whitepapers and eBooks

Adobe Article: Adobe Helps PHP Developers Create Rich Internet Applications
Adobe Article: Java Developers Finding a Home at Adobe Flex
IBM Articles: A Smarter Business Needs Smarter Technology
Intel Xeon Processor Increases Server Efficiency and Capabilities
Intel Tech Brief: Automated Energy Efficiency for the Intelligent Enterprise
Oracle Whitepaper: Using Oracle In-Memory Database Cache to Accelerate the Oracle Database
Oracle Whitepapers - Innovation for IT Leaders
Avaya Article: Communication-Enabled Mashups--Empowering Both Business Owners and IT

Internet.com eBook: IT Manager's Guide to Social Networking
Internet.com eBook: Get Ready for Windows 7
Microsoft Article: Expression Web 3--New Features for PHP Developers
Whitepapers: Manage Your Business Infrastracture with IBM
Whitepaper: Maximize Your Storage Investment with HP
Internet.com eBook: Becoming a Better Project Manager
Microsoft Article: Stress Free and Efficient Designer/Developer Collaboration
MORE WHITEPAPERS, EBOOKS, AND ARTICLES

Webcasts

Webcast: Connecting PHP to Microsoft Technologies
Video: Microsoft Partner Program Benefits
Video: Windows Azure Debugging Tips
SAP BusinessObjects Webcast: Unlock the Power of Reporting with Crystal Reports

IBM Webcast: Speed Business Innovation with Reduced Cost and Risk
Video: Deploy Applications on Windows Azure
MORE WEBCASTS, PODCASTS, AND VIDEOS

Downloads and eKits

Downloads & Free Trials: Microsoft's New Efficiency Resource Center
Get the Windows 7 SDK
Free Trial: Red Gate SQL Backup Pro 6

Iron Speed Designer Application Generator
MORE DOWNLOADS, EKITS, AND FREE TRIALS

Tutorials and Demos

Virtual Lab: Migrating PHP Applications
Enabling Web Slices and Accelerators with a PHP Site
Internet.com Hot List: Get the Inside Scoop on the Hottest IT and Developer Products

All About Botnets
MORE TUTORIALS, DEMOS AND STEP-BY-STEP GUIDES