Update lightbox plugin

Updating the lightbox plugin Signed-off-by: Eric Poirier <eric@ericpoirier.ca>
wet-boew · Jun 28, 2012 · f1114d0 · f1114d0
1 parent 33787d1
commit f1114d0
Show file tree

Hide file tree

Showing 22 changed files with 2,648 additions and 0 deletions.
diff --git a/build/js/dependencies/fancybox-min.js b/build/js/dependencies/fancybox-min.js
diff --git a/build/js/images/lightbox/blank.gif b/build/js/images/lightbox/blank.gif
diff --git a/build/js/images/lightbox/fancybox_loading.gif b/build/js/images/lightbox/fancybox_loading.gif
diff --git a/build/js/images/lightbox/fancybox_sprite.png b/build/js/images/lightbox/fancybox_sprite.png
diff --git a/demos/lightbox/images/1_b.jpg b/demos/lightbox/images/1_b.jpg
diff --git a/demos/lightbox/images/1_s.jpg b/demos/lightbox/images/1_s.jpg
diff --git a/demos/lightbox/images/2_b.jpg b/demos/lightbox/images/2_b.jpg
diff --git a/demos/lightbox/images/2_s.jpg b/demos/lightbox/images/2_s.jpg
diff --git a/demos/lightbox/images/3_b.jpg b/demos/lightbox/images/3_b.jpg
diff --git a/demos/lightbox/images/3_s.jpg b/demos/lightbox/images/3_s.jpg
diff --git a/demos/lightbox/images/4_b.jpg b/demos/lightbox/images/4_b.jpg
diff --git a/demos/lightbox/images/4_s.jpg b/demos/lightbox/images/4_s.jpg
diff --git a/demos/lightbox/images/5_b.jpg b/demos/lightbox/images/5_b.jpg
diff --git a/demos/lightbox/images/5_s.jpg b/demos/lightbox/images/5_s.jpg
diff --git a/demos/lightbox/lightbox-eng.html b/demos/lightbox/lightbox-eng.html
@@ -0,0 +1,307 @@
+<!DOCTYPE html>
+<!--[if IE 7]> <html lang="en" class="no-js ie7"> <![endif]-->
+<!--[if IE 8]> <html lang="en" class="no-js ie8"> <![endif]-->
+<!--[if gt IE 8]><!-->
+<html lang="en" class="no-js">
+<!--<![endif]-->
+<head>
+<meta charset="utf-8" />
+<!-- Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW)
+www.tbs.gc.ca/ws-nw/wet-boew/terms / www.sct.gc.ca/ws-nw/wet-boew/conditions -->
+<title>Lightbox - Working examples - Web Experience Toolkit (WET)</title>
+
+<link rel="shortcut icon" href="../../build/theme-gcwu-fegc/images/favicon.ico" />
+<meta name="dcterms.description" content="English description/Description en anglais" />
+<meta name="description" content="English description/Description en anglais" />
+<meta name="keywords" content="English keywords/Mots-clés en anglais" />
+<meta name="dcterms.creator" content="English name of the content author/Nom en anglais de l'auteur du contenu" />
+<meta name="dcterms.title" content="English title/Titre en anglais" />
+<meta name="dcterms.issued" title="W3CDTF" content="Date published (YYYY-MM-DD)/Date de publication (AAAA-MM-JJ)" />
+<meta name="dcterms.modified" title="W3CDTF" content="Date modified (YYYY-MM-DD)/Date de modification (AAAA-MM-JJ)" />
+<meta name="dcterms.subject" title="scheme" content="English subject terms/Termes de sujet en anglais" />
+<meta name="dcterms.language" title="ISO639-2" content="eng" />
+<meta name="viewport" content="width=device-width, initial-scale=1" />
+
+<script src="../../build/js/jquery.min.js"></script>
+
+
+
+<link rel="stylesheet" href="../../build/grids/css/util-min.css" />
+<!--[if lte IE 8]>
+<link rel="stylesheet" href="../../build/js/css/pe-ap-ie-min.css" />
+<link rel="stylesheet" href="../../build/theme-gcwu-fegc/css/theme-ie-min.css" />
+<![endif]-->
+<!--[if gt IE 8]><!-->
+<link rel="stylesheet" href="../../build/js/css/pe-ap-min.css" />
+<link rel="stylesheet" href="../../build/theme-gcwu-fegc/css/theme-min.css" />
+<!--<![endif]-->
+
+<!-- CustomScriptsCSSStart -->
+<!--[if !IE]> -->
+<style>
+	pre{border:1px solid #aaa;background:#eee;border-radius:1em;padding:0 1em;}
+	pre code{background:#eee;counter-reset:line;}
+	pre code .line:before{content:counter(line);display:inline-block;text-align:right;width:1.25em;padding-right:.5em;margin-right:.75em;margin-left:-1.1em;padding-left:.5em;background:#aaa;border-right:1px solid #333;border-left:1px solid #aaa;opacity:.7;}
+	pre code .line:first-child:before{border-top-left-radius:1em;border-top:1px solid #aaa;padding-top:1em;}
+	pre code .line:last-child:before{border-bottom-left-radius:1em;border-bottom:1px solid #aaa;padding-bottom:1em;}
+	pre code .line{counter-increment:line;white-space:pre-wrap;}
+	pre code .attr{color:#b22;}
+	pre code .str{color:#464;font-weight:bold;}
+	pre code .sym{color:#44f;font-weight:bold;}
+	pre code .req{border:1px dashed #b22;background:#ffe;}
+</style>
+<!-- <![endif]-->
+<!-- CustomScriptsCSSEnd -->
+
+
+
+
+</head>
+
+<body><div id="wb-body">
+<div id="wb-skip">
+<ul id="wb-tphp">
+<li id="wb-skip1"><a href="#wb-cont">Skip to main content</a></li>
+<li id="wb-skip2"><a href="#wb-nav">Skip to footer</a></li>
+</ul>
+</div>
+
+<div id="wb-head"><div id="wb-head-in"><header>
+<!-- HeaderStart -->
+<nav role="navigation"><div id="gcwu-gcnb"><h2>Government of Canada navigation bar</h2><div id="gcwu-gcnb-in"><div id="gcwu-gcnb-fip">
+<div id="gcwu-sig"><div id="gcwu-sig-in"><div id="gcwu-sig-eng" title="Government of Canada"><img src="../../build/theme-gcwu-fegc/images/sig-eng.gif" width="214" height="20" alt="Government of Canada" /></div></div></div>
+<ul>
+<li id="gcwu-gcnb1"><a rel="external" href="http://www.canada.gc.ca/home.html">Canada.gc.ca</a></li>
+<li id="gcwu-gcnb2"><a rel="external" href="http://www.servicecanada.gc.ca/eng/home.shtml">Services</a></li>
+<li id="gcwu-gcnb3"><a rel="external" href="http://www.canada.gc.ca/depts/major/depind-eng.html">Departments</a></li>
+<li id="gcwu-gcnb-lang"><a href="lightbox-fra.html" lang="fr">Français</a></li>
+</ul>
+</div></div></div></nav>
+
+<div id="gcwu-bnr" role="banner"><div id="gcwu-bnr-in">
+<div id="gcwu-wmms"><div id="gcwu-wmms-in"><div id="gcwu-wmms-fip" title="Symbol of the Government of Canada"><img src="../../build/theme-gcwu-fegc/images/wmms.gif" width="126" height="30" alt="Symbol of the Government of Canada" /></div></div></div>
+<div id="gcwu-title"><p id="gcwu-title-in"><a href="../../docs/index-eng.html">Web Experience Toolkit&#160;(WET)</a></p></div>
+
+<section role="search"><div id="gcwu-srchbx"><h2>Search</h2>
+<form action="#" method="post"><div id="gcwu-srchbx-in">
+<label for="gcwu-srch">Search website</label><input id="gcwu-srch" name="gcwu-srch" type="text" value="" size="27" maxlength="150" />
+<input id="gcwu-srch-submit" name="gcwu-srch-submit" type="submit" value="Search" data-icon="search" />
+</div></form>
+</div></section>
+</div></div>
+
+<nav role="navigation">
+<div id="gcwu-psnb"><h2><span>Site</span> menu</h2><div id="gcwu-psnb-in"><div class="wet-boew-menubar mb-mega"><div>
+<ul class="mb-menu" data-ajax-replace="../includes/menu-eng.html">
+<li><div><a href="http://wet-boew.github.com/wet-boew/docs/index-eng.html">WET project</a></div></li>
+<li><div><a href="section2/index-eng.html">Section 2</a></div></li>
+<li><div><a href="#">Section 3</a></div></li>
+<li><div><a href="#">Section 4</a></div></li>
+<li><div><a href="#">Section 5</a></div></li>
+<li><div><a href="#">Section 6</a></div></li>
+<li><div><a href="#">Section 7</a></div></li>
+</ul>
+</div></div></div></div>
+
+<div id="gcwu-bc"><h2>Breadcrumb trail</h2><div id="gcwu-bc-in">
+<ol>
+<li><a href="../../docs/index-eng.html">Home</a></li>
+<li><a href="../index-eng.html">Working examples</a></li>
+<li>Tabbed interface</li>
+</ol>
+</div></div>
+</nav>
+<!-- HeaderEnd -->
+</header></div></div>
+
+<div id="wb-core"><div id="wb-core-in" class="equalize">
+<div id="wb-main" role="main"><div id="wb-main-in">
+<!-- MainContentStart -->
+
+<h1 id="wb-cont">Light Box</h1>
+
+<div class="wet-boew-share span-5 margin-bottom-none" data-wet-boew="{title:'Page title override',url:'http://www.urloverride.gc.ca',sites:[]}"></div>
+<div class="clear"></div><div class="clear"></div>
+
+<section><div class="span-4 module-table-contents">
+	<h2>Table of contents</h2>
+	<ul>
+		<li><a href="#instructions">Instructions</a></li>
+		<li><a href="#coding">Coding</a></li>
+		<li><a href="#cssnames">CSS names</a></li>
+		<li><a href="#basic">Examples</a></li>
+	</ul>
+</div></section>
+<div class="clear"></div>
+<!-- end of .module-table-contents -->
+
+<div class="span-4"><section><h2 id="instructions">Instructions</h2>
+	<p>Create link elements whose href attributes will contain the path of the element you wish to open within the fancyBox.</p>
+</section></div>
+<div class="clear"></div>
+
+<h2>Examples</h2>
+<h3>Single Pictures</h3>
+<div class="span-4">
+<h4 class="background-dark margin-bottom-medium">Pictures</h4>
+<section><div class="wet-boew-lightbox">
+	<div class="lightbox">	
+		<p><a class="lightbox-item" href="images/1_b.jpg" title="Lorem ipsum dolor sit amet"><img src="images/1_s.jpg" alt="" class="image-actual" /></a>	
+		<a class="lightbox-item" href="images/2_b.jpg" title="Etiam quis mi eu elit temp"><img src="images/2_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" href="images/3_b.jpg" title="Cras neque mi, semper leon"><img src="images/3_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" href="images/4_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/4_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" href="images/5_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/5_s.jpg" alt="" class="image-actual" /></a></p>
+	</div><!-- end of .grid-12 -->
+</div></section><!-- end of .wet-boew-lightbox -->
+</div><!-- end of .span-4 -->
+
+<div class="span-4">
+<section><h4 class="background-dark margin-bottom-medium" id="coding">Coding</h4>
+<pre><code>&lt;div class=&quot;wet-boew-lightbox&quot;&gt;
+  &lt;div class=&quot;lightbox&quot;&gt;
+    &lt;p&gt;&lt;a class=&quot;lightbox-item&quot; href=&quot;images/your_image.jpg&quot; title=&quot;Title Image&quot;&gt;
+      &lt;img src=&quot;images/image_source.jpg&quot; alt=&quot;&quot; class=&quot;image-actual&quot; /&gt;
+    &lt;/a&gt;&lt;/p&gt;
+    ...	
+  &lt;/div&gt;
+&lt;/div&gt;</code></pre>
+</section>
+</div>
+
+<div class="clear"></div>
+
+<h3>Group of Pictures</h3>
+<div class="span-4">
+<h4 class="background-dark margin-bottom-medium">Photo Gallery</h4>	
+<section><div class="wet-boew-lightbox">
+	<div class="lightbox-group" title="Group 1">
+		<p><a class="lightbox-item" rel="gallery" href="images/1_b.jpg" title="Lorem ipsum dolor sit amet"><img src="images/1_s.jpg" alt="" class="image-actual" /></a>	
+		<a class="lightbox-item" rel="gallery" href="images/2_b.jpg" title="Etiam quis mi eu elit temp"><img src="images/2_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" rel="gallery" href="images/3_b.jpg" title="Cras neque mi, semper leon"><img src="images/3_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" rel="gallery" href="images/4_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/4_s.jpg" alt="" class="image-actual" /></a>
+		<a class="lightbox-item" rel="gallery" href="images/5_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/5_s.jpg" alt="" class="image-actual" /></a></p>
+	</div>
+</div></section>
+</div>
+
+<div class="span-4">
+<section><h4 class="background-dark margin-bottom-medium" id="coding">Coding</h4>
+<pre><code>&lt;div class=&quot;wet-boew-lightbox&quot;&gt;
+  &lt;div class=&quot;lightbox-group&quot; title=&quot;Photo Gallery&quot;&gt;
+    &lt;p&gt;&lt;a class=&quot;lightbox-item&quot; href=&quot;images/your_image.jpg&quot; title=&quot;Title Image&quot;&gt;
+      &lt;img src=&quot;images/image_source.jpg&quot; alt=&quot;&quot; class=&quot;image-actual&quot; /&gt;
+    &lt;/a&gt;&lt;/p&gt;	
+    ...	
+  &lt;/div&gt;
+&lt;/div&gt;</code></pre>
+</section>
+</div>
+
+<div class="clear"></div>
+
+<h3>Hidden Group of Pictures</h3>
+<div class="span-4">
+<h4 class="background-dark margin-bottom-medium">Hidden Photo Gallery</h4>
+<section><div class="wet-boew-lightbox">
+	<div class="lightbox-group" title="Group 2">
+		<p><a class="lightbox-item" href="images/1_b.jpg" rel="hidden-gallery" title="Lorem ipsum dolor sit amet"><img src="images/1_s.jpg" alt="" class="image-actual" /></a>
+		<div class="hidden">	
+			<p><a class="lightbox-item" rel="hidden-gallery" href="images/2_b.jpg" title="Etiam quis mi eu elit temp"><img src="images/2_s.jpg" alt="" class="image-actual" /></a>
+			<a class="lightbox-item" rel="hidden-gallery" href="images/3_b.jpg" title="Cras neque mi, semper leon"><img src="images/3_s.jpg" alt="" class="image-actual" /></a>
+			<a class="lightbox-item" rel="hidden-gallery" href="images/4_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/4_s.jpg" alt="" class="image-actual" /></a>
+			<a class="lightbox-item" rel="hidden-gallery" href="images/5_b.jpg" title="Sed vel sapien vel sem uno"><img src="images/5_s.jpg" alt="" class="image-actual" /></a></p>
+		</div>
+	</div>
+</div></section>
+</div>
+
+<div class="span-4">
+<section><h4 class="background-dark margin-bottom-medium" id="coding">Coding</h4>
+<pre><code>&lt;div class=&quot;wet-boew-lightbox&quot;&gt;
+  &lt;div class=&quot;lightbox-group&quot; title=&quot;Hidden Photo Gallery&quot;&gt;
+    &lt;p&gt;&lt;a class=&quot;lightbox-item&quot; href=&quot;images/your_image.jpg&quot; title=&quot;Title Image&quot;&gt;
+      &lt;img src=&quot;images/image_source.jpg&quot; alt=&quot;&quot; class=&quot;image-actual&quot; /&gt;
+    &lt;/a&gt;&lt;/p&gt;
+
+    &lt;div class=&quot;hidden&quot;&gt;
+      &lt;p&gt;&lt;a class=&quot;lightbox-item&quot; href=&quot;images/your_image.jpg&quot; title=&quot;Title Image&quot;&gt;
+        &lt;img src=&quot;images/image_source.jpg&quot; alt=&quot;&quot; class=&quot;image-actual&quot; /&gt;
+      &lt;/a&gt;&lt;/p&gt;
+      ...
+    &lt;/div&gt;
+  &lt;/div&gt;
+&lt;/div&gt;</code></pre>
+</section>
+</div>
+
+<div class="clear"></div>
+
+<dl id="gcwu-date-mod" role="contentinfo">
+<dt>Date modified:</dt><dd><span><time>2011-10-31</time></span></dd>
+</dl>
+<div class="clear"></div>
+<!-- MainContentEnd -->
+</div></div>
+</div></div>
+
+<div id="wb-foot"><div id="wb-foot-in"><footer><h2 id="wb-nav">Footer</h2>
+<!-- FooterStart -->
+<nav role="navigation"><div id="gcwu-sft"><h3>Site footer</h3><div id="gcwu-sft-in">
+<div id="gcwu-tctr">
+<ul>
+<li class="gcwu-tc"><a href="#" rel="license">Terms and conditions</a></li>
+<li class="gcwu-tr"><a href="#">Transparency</a></li>
+</ul>
+</div>
+<div class="clear"></div>
+<section><div class="span-2"><h4 class="gcwu-col-head"><a href="#">About us</a></h4>
+<ul>
+<li><a href="#">Our Mandate</a></li>
+<li><a href="#">Our Minister</a></li>
+</ul>
+</div></section>
+<section><div class="span-2"><h4 class="gcwu-col-head"><a href="#">News</a></h4>
+<ul>
+<li><a href="#">News releases</a></li>
+<li><a href="#">Media advisories</a></li>
+<li><a href="#">Multimedia</a></li>
+</ul>
+</div></section>
+<section><div class="span-2"><h4 class="gcwu-col-head"><a href="#">Contact us</a></h4>
+<address>
+<ul>
+<li><a href="#">Phone numbers</a></li>
+<li><a href="#">Office locations</a></li>
+</ul>
+</address>
+</div></section>
+<section><div class="span-2"><h4 class="gcwu-col-head"><a href="#">Stay connected</a></h4>
+<ul>
+<li><a rel="external" href="#">YouTube</a></li>
+<li><a rel="external" href="#">Twitter</a></li>
+<li><a href="#">Feeds</a></li>
+</ul>
+</div></section>
+</div></div></nav>
+
+<nav role="navigation"><div id="gcwu-gcft"><h3>Government of Canada footer</h3><div id="gcwu-gcft-in"><div id="gcwu-gcft-fip">
+<ul>
+<li><a rel="external" href="http://healthycanadians.gc.ca/index-eng.php"><span>Health</span><br />healthycanadians.gc.ca</a></li>
+<li><a rel="external" href="http://www.voyage.gc.ca/index-eng.asp"><span>Travel</span><br />travel.gc.ca</a></li>
+<li><a rel="external" href="http://www.servicecanada.gc.ca/eng/home.shtml"><span>Service Canada</span><br />servicecanada.gc.ca</a></li>
+<li><a rel="external" href="http://www.jobbank.gc.ca/intro-eng.aspx"><span>Jobs</span><br />jobbank.gc.ca</a></li>
+<li><a rel="external" href="http://actionplan.gc.ca/eng/index.asp"><span>Economy</span><br />actionplan.gc.ca</a></li>
+<li id="gcwu-gcft-ca"><div><a rel="external" href="http://www.canada.gc.ca/home.html">Canada.gc.ca</a></div></li>
+</ul>
+</div></div></div></nav>
+<!-- FooterEnd -->
+</footer>
+</div></div></div>
+
+<!-- ScriptsStart -->
+<script src="../../build/theme-gcwu-fegc/js/theme-min.js"></script>
+<script src="../../build/js/settings.js"></script>
+<script src="../../build/js/pe-ap-min.js"></script>
+<!-- ScriptsEnd -->
+</body>
+</html>