generate thumbs with imagemagick; js lightbox

sys/bower.json

@@ -17,6 +17,7 @@
     "tests"
   ],
   "dependencies": {
-    "jquery": "^3.1.0"
+    "jquery": "^3.1.0",
+    "lightbox2": "^2.9.0"
   }
 }

sys/bower_components/lightbox2/.bower.json

@@ -0,0 +1,44 @@
+{
+  "name": "lightbox2",
+  "homepage": "http://lokeshdhakar.com/projects/lightbox2/",
+  "authors": [
+    "Lokesh Dhakar <lokesh.dhakar@gmail.com>"
+  ],
+  "description": "The original Lightbox script. Uses jQuery.",
+  "main": [
+    "./dist/js/lightbox.js",
+    "./dist/css/lightbox.css",
+    "./dist/images/close.png",
+    "./dist/images/loading.gif",
+    "./dist/images/next.png",
+    "./dist/images/prev.png"
+  ],
+  "keywords": [
+    "lightbox",
+    "lightbox2",
+    "overlay",
+    "gallery",
+    "slideshow",
+    "images"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components"
+  ],
+  "dependencies": {
+    "jquery": "~2"
+  },
+  "version": "2.9.0",
+  "_release": "2.9.0",
+  "_resolution": {
+    "type": "version",
+    "tag": "v2.9.0",
+    "commit": "3c792b46c0e5dd6923f9d71db8cad611beef8050"
+  },
+  "_source": "https://github.com/lokesh/lightbox2.git",
+  "_target": "^2.9.0",
+  "_originalSource": "lightbox2",
+  "_direct": true
+}

sys/bower_components/lightbox2/CONTRIBUTING.md

@@ -0,0 +1,12 @@
+# Contributing to Lightbox2
+
+## Found a bug?
+
+[Search through existing Github Issues](https://github.com/lokesh/lightbox2/issues) that have been reported to avoid creating a duplicate issue. If your bug has not been reported, create a new issue with the following details:
+
+- What version of Lightbox2 you are using
+- Information on which browsers and operating systems you have reproduced the bug on
+- Steps to reproduce the bug
+- A link to your production site where the bug is visible or all relevant HTML, CSS, and Javascript required to recreate the bug
+
+All of the above are required.

sys/bower_components/lightbox2/Gruntfile.js

@@ -0,0 +1,83 @@
+module.exports = function(grunt) {
+
+  grunt.initConfig({
+    concat: {
+      dist: {
+        src: ['bower_components/jquery/dist/jquery.js', 'src/js/lightbox.js'],
+        dest: 'dist/js/lightbox-plus-jquery.js',
+      },
+    },
+    connect: {
+      server: {
+        options: {
+          port: 8000
+        }
+      }
+    },
+    copy: {
+      dist: {
+        files: [
+          {
+            expand: true,
+            cwd: 'src/',
+            src: ['**'],
+            dest: 'dist/'
+          }
+        ],
+      },
+    },
+    jshint: {
+      all: [
+        'src/js/lightbox.js'
+      ],
+      options: {
+        jshintrc: true
+      }
+    },
+    jscs: {
+      src: [
+        'src/js/lightbox.js'
+      ],
+      options: {
+        config: ".jscsrc"
+      }
+    },
+    uglify: {
+      options: {
+        preserveComments: 'some',
+        sourceMap: true
+      },
+      dist: {
+        files: {
+          'dist/js/lightbox.min.js': ['src/js/lightbox.js'],
+          'dist/js/lightbox-plus-jquery.min.js': ['dist/js/lightbox-plus-jquery.js']
+        }
+      }
+    },
+    watch: {
+      jshint: {
+        files: ['src/js/lightbox.js'],
+        tasks: ['jshint', 'jscs']
+      }
+    },
+    cssmin: {
+      minify: {
+          src: 'dist/css/lightbox.css',
+          dest: 'dist/css/lightbox.min.css'
+      }
+    }
+  });
+
+  grunt.loadNpmTasks('grunt-contrib-concat');
+  grunt.loadNpmTasks('grunt-contrib-connect');
+  grunt.loadNpmTasks('grunt-contrib-copy');
+  grunt.loadNpmTasks('grunt-contrib-jshint');
+  grunt.loadNpmTasks('grunt-contrib-uglify');
+  grunt.loadNpmTasks('grunt-contrib-watch');
+  grunt.loadNpmTasks('grunt-contrib-cssmin');
+  grunt.loadNpmTasks("grunt-jscs");
+
+  grunt.registerTask('default', ['connect', 'watch']);
+  grunt.registerTask('test', ['jshint', 'jscs']);
+  grunt.registerTask('build', ['jshint', 'jscs', 'copy:dist', 'concat', 'uglify', 'cssmin:minify']);
+};

sys/bower_components/lightbox2/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2015 Lokesh Dhakar
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

sys/bower_components/lightbox2/README.md

@@ -0,0 +1,159 @@
+# Lightbox2
+
+The original lightbox script. Eight years later — still going strong!
+
+Lightbox is small javascript library used to overlay images on top of the current page. It's a snap to setup and works on all modern browsers.
+
+For demos and usage instructions, visit [lokeshdhakar.com/projects/lightbox2/](http://lokeshdhakar.com/projects/lightbox2/).
+
+by [Lokesh Dhakar](http://www.lokeshdhakar.com)
+
+
+## Roadmap
+
+### Actively being worked on
+
+- **Maintenance.** Geting open Issues and PRs number down. Not working on new features for v2.x.
+
+### Features *NOT* on the roadmap
+
+The goal of this script from it's beginnings till today is to to provide a better *image viewing experience*.
+
+- **HTML or video content.**  If you need to show html or video content, I recommend googling for an alternative script as there are many options.
+- **Social sharing buttons.** 
+
+### v3.0 - In Brainstorming Phase
+
+**Interactions**
+- Add touch gesture support.
+- Exploring using tilt gesture on mobile devices with extra-wide images.
+- If user attempts to go forward when at end of image set, animation (shake?) indicating the end or option to close Lightbox.
+- Make sure right-click/long pressing works to access the image's context menu.
+
+**Layout**
+- Allow vertical centering.
+- Update sizing on window resize.
+- Should the dev be able to choose the position of the caption, close button, and nav controls?
+- Optimize layout for mobile.
+- Optimize layout for screens of varying densities.
+- Should the close button still live in the bottom right corner?
+
+**Animations**
+- Evaluate start, end, and transition animations.
+- Rewrite animations for performance and flexibility.
+
+**Assets**
+- Use inline SVG for UI elements.
+
+**Caching**
+- Review if and how images should be preloaded
+
+**Accessibility**
+- Should opening lightbox update the url? and should this url be parsed on page load to show Lightbox automatically?
+- Review alt attributes.
+- Review ARIA roles.
+- Review constrast ratios.
+- Review keyboard input and tabbing.
+- Review click/touch target size.
+- Test with screen reader.
+
+**API**
+- Do not initialize automatically and allow multiple instances.
+- Add event handlers.
+- Allow setting options on the fly.
+- Allow the setting of options from HTML?
+- Allow instantiation with jQuery plugin syntax.
+- Evaluate preloading and caching.
+- Evaluate droppping jQuery requirement.
+- Allow placement inside of a specified element? Orig feature requester was dealing with iframe.
+
+## Changelog
+
+### v2.9.0 - 2016-10-30
+
+- [Fix] Allow loading of lightbox.js anywhere on page. Prev requirement was at the end of the body tag. [Commit](https://github.com/lokesh/lightbox2/commit/7047214f77cfc8f892e8513426b57d45bf29e9cd)
+- [Add] Add imageFadeDuration option. [Commit](https://github.com/lokesh/lightbox2/commit/6d5f99a65f189a5d2bd7bbfac4682fe36e62871e)
+- [Change] Right-clicking image now shows context menu for image. [Commit](https://github.com/lokesh/lightbox2/commit/363c3cb8af8fae1b6f95d6679df976022290f878)
+- [Change] Allow controlling of image border with a simpler css border vs a parent container padding _hack_. [Commit](https://github.com/lokesh/lightbox2/commit/214361297f1dd5f0c19c1d80ff37c398cdda55cb)
+
+### v2.8.2 - 2015-12-13
+
+- [Add] npm support. ```npm install --save lightbox2```
+- [Add] Add option to disable vertical scrolling [#487](https://github.com/lokesh/lightbox2/pull/487) Thanks [blacksunshineCoding](https://github.com/blacksunshineCoding)
+- [Fix] When horizontal scrolling is on page the overlay is not covering entire page [#485](https://github.com/lokesh/lightbox2/pull/485) Thanks [@manuel-io](https://github.com/manuel-io)
+- [Change] Add css minify task to Gruntfile.js and removedlegacy css vendor prefixes for border-radius. [#470](https://github.com/lokesh/lightbox2/pull/470) Thanks [ajerez](https://github.com/ajerez)
+
+
+### v2.8.1 - 2015-07-09
+
+- [Fix] Change AMD jQuery require statement to use all lowercase. [#464](https://github.com/lokesh/lightbox2/pull/464) Thanks [@vtforester](https://github.com/vtforester)
+
+### v2.8.0 - 2015-06-29
+
+- [Add] UMD support (AMD, CommonJS, fallback to global export).[#461](https://github.com/lokesh/lightbox2/pull/461)
+- [Add] option method for setting options. [#461](https://github.com/lokesh/lightbox2/commit/d708fbd716aaa90e01ba4198944c8955e7283d87)
+- [Add] CONTRIBUTING.md
+
+### v2.7.4 - 2015-06-23
+
+- [Change] Revert jquery dep version to 2.x from 1.x. Added note to Lightbox page about using jQuery 1.x to get IE6, 7, and 8 support.
+- [Fix] Preserve author and license comments from lightbox.js in minified files.
+
+### v2.7.3 - 2015-06-22
+
+- [Add] Barebone HTML file with examples /examples/index.html.
+- [Add] jquery.lightbox.js which concatenates jQuery and Lightbox. This is for those who are Bower averse or want an extra easy install.
+
+### v2.7.2 - 2015-06-16
+
+- [Add] maxWidth and maxHeight options added [#197](https://github.com/lokesh/lightbox2/pull/197)
+- [Add] Enable target attribute in caption links [#299](https://github.com/lokesh/lightbox2/pull/299)
+- [Change] Switched to The MIT License from  Creative Commons Attribution 4.0 International License.
+- [Change] Add CSS and images to bower.json main property.
+- [Change] Dropped version property from bower.json. [#453](https://github.com/lokesh/lightbox2/pull/453)
+- [Change] Use src -> dist folder structure for build.
+- [Fix] Remove empty src attribute from img tag [#287](https://github.com/lokesh/lightbox2/pull/287)
+- [Fix] Correct grammatical error in comment [#224](https://github.com/lokesh/lightbox2/pull/224)
+- [Fix] Clear the jquery animation queue before hiding the .lb-loader [#309](https://github.com/lokesh/lightbox2/pull/309)
+- [Remove] Remove releases's zips from repo.
+
+### v2.7.1 - 2014-03-30
+
+- [Fix] Enable links in captions
+
+### v2.7.0 - 2014-03-29
+
+- [Add] Support for data-title attribute for the caption.  - Thanks [@copycut](https://github.com/copycut)
+- [Add] New option to enable always visible prev and next arrows
+- [Change] Rewrite Coffeescript code into plain ole Javascript
+- [Change] Updated jQuery to v1.10.2
+- [Fix] prev/next arrows not appearing in IE9 and IE 10 - Thanks [@rebizu](https://github.com/rebizu)
+- [Fix]  Support wrap around option w/keyboard actions. Thanks [@vovayatsyuk](https://github.com/vovayatsyuk)
+
+### v2.6.0 - 2013-07-06
+
+- [Add] Added wraparound option
+- [Add] Added fitImagesInViewport option - now mobile friendly
+- [Add] Added showImageNumber label
+- [Add] Compatibility with html5shiv
+- [Add] Html5 valid using new data-lightbox attribute
+- [Add] Compatibility with hmtl5shiv and modernizr
+- [Add] Support jquery 1.9+
+- [Change] Move reference to loading and close images into css
+- [Change] Cache jquery objects
+
+### v2.5.0 - 2012-04-11
+
+- [Change] Switch to jQuery from Prototype and Scriptaculous
+- [Change] Switch from Javacript to Coffeescript
+- [Change] Switch from CSS to SASS
+- [Add] Repo created on Github
+
+
+## How to deploy
+
+- Update version number in ```src/lightbox.js```
+- Update README.md Changelog with release date
+- grunt build
+- Push to Github repo
+- Create a new Github release along with tag. Naming convention for both ```v2.8.1```

sys/bower_components/lightbox2/bower.json

@@ -0,0 +1,33 @@
+{
+  "name": "lightbox2",
+  "homepage": "http://lokeshdhakar.com/projects/lightbox2/",
+  "authors": [
+    "Lokesh Dhakar <lokesh.dhakar@gmail.com>"
+  ],
+  "description": "The original Lightbox script. Uses jQuery.",
+  "main": [
+    "./dist/js/lightbox.js",
+    "./dist/css/lightbox.css",
+    "./dist/images/close.png",
+    "./dist/images/loading.gif",
+    "./dist/images/next.png",
+    "./dist/images/prev.png"
+  ],
+  "keywords": [
+    "lightbox",
+    "lightbox2",
+    "overlay",
+    "gallery",
+    "slideshow",
+    "images"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components"
+  ],
+  "dependencies": {
+    "jquery": "~2"
+  }
+}

sys/bower_components/lightbox2/dist/css/lightbox.css

@@ -0,0 +1,213 @@
+/* Preload images */
+body:after {
+  content: url(../images/close.png) url(../images/loading.gif) url(../images/prev.png) url(../images/next.png);
+  display: none;
+}
+
+body.lb-disable-scrolling {
+  overflow: hidden;
+}
+
+.lightboxOverlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 9999;
+  background-color: black;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
+  opacity: 0.8;
+  display: none;
+}
+
+.lightbox {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  z-index: 10000;
+  text-align: center;
+  line-height: 0;
+  font-weight: normal;
+}
+
+.lightbox .lb-image {
+  display: block;
+  height: auto;
+  max-width: inherit;
+  max-height: none;
+  border-radius: 3px;
+
+  /* Image border */
+  border: 4px solid white;
+}
+
+.lightbox a img {
+  border: none;
+}
+
+.lb-outerContainer {
+  position: relative;
+  *zoom: 1;
+  width: 250px;
+  height: 250px;
+  margin: 0 auto;
+  border-radius: 4px;
+
+  /* Background color behind image.
+     This is visible during transitions. */
+  background-color: white;
+}
+
+.lb-outerContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-loader {
+  position: absolute;
+  top: 43%;
+  left: 0;
+  height: 25%;
+  width: 100%;
+  text-align: center;
+  line-height: 0;
+}
+
+.lb-cancel {
+  display: block;
+  width: 32px;
+  height: 32px;
+  margin: 0 auto;
+  background: url(../images/loading.gif) no-repeat;
+}
+
+.lb-nav {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  z-index: 10;
+}
+
+.lb-container > .nav {
+  left: 0;
+}
+
+.lb-nav a {
+  outline: none;
+  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
+}
+
+.lb-prev, .lb-next {
+  height: 100%;
+  cursor: pointer;
+  display: block;
+}
+
+.lb-nav a.lb-prev {
+  width: 34%;
+  left: 0;
+  float: left;
+  background: url(../images/prev.png) left 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-prev:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-nav a.lb-next {
+  width: 64%;
+  right: 0;
+  float: right;
+  background: url(../images/next.png) right 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-next:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-dataContainer {
+  margin: 0 auto;
+  padding-top: 5px;
+  *zoom: 1;
+  width: 100%;
+  -moz-border-radius-bottomleft: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
+.lb-dataContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-data {
+  padding: 0 4px;
+  color: #ccc;
+}
+
+.lb-data .lb-details {
+  width: 85%;
+  float: left;
+  text-align: left;
+  line-height: 1.1em;
+}
+
+.lb-data .lb-caption {
+  font-size: 13px;
+  font-weight: bold;
+  line-height: 1em;
+}
+
+.lb-data .lb-caption a {
+  color: #4ae;
+}
+
+.lb-data .lb-number {
+  display: block;
+  clear: left;
+  padding-bottom: 1em;
+  font-size: 12px;
+  color: #999999;
+}
+
+.lb-data .lb-close {
+  display: block;
+  float: right;
+  width: 30px;
+  height: 30px;
+  background: url(../images/close.png) top right no-repeat;
+  text-align: right;
+  outline: none;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
+  opacity: 0.7;
+  -webkit-transition: opacity 0.2s;
+  -moz-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+}
+
+.lb-data .lb-close:hover {
+  cursor: pointer;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}

sys/bower_components/lightbox2/examples/index.html

@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en-us">
+<head>
+  <meta charset="utf-8">
+  <title>Lightbox Example</title>
+  <link rel="stylesheet" href="../dist/css/lightbox.min.css">
+</head>
+<body>
+
+  <section>
+    <h3>Two Individual Images</h3>
+    <div>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-1.jpg" data-lightbox="example-1"><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-1.jpg" alt="image-1" /></a>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-2.jpg" data-lightbox="example-2" data-title="Optional caption."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-2.jpg" alt="image-1"/></a>
+    </div>
+
+    <hr />
+
+    <h3>A Four Image Set</h3>
+    <div>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-3.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-3.jpg" alt=""/></a>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-4.jpg" data-lightbox="example-set" data-title="Or press the right arrow on your keyboard."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-4.jpg" alt="" /></a>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-5.jpg" data-lightbox="example-set" data-title="The next image in the set is preloaded as you're viewing."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-5.jpg" alt="" /></a>
+      <a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-6.jpg" data-lightbox="example-set" data-title="Click anywhere outside the image or the X to the right to close."><img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-6.jpg" alt="" /></a>
+    </div>
+  </section>
+
+  <section>
+    <p>
+      For more information, visit <a href="http://lokeshdhakar.com/projects/lightbox2/">http://lokeshdhakar.com/projects/lightbox2/</a>
+    </p>
+  </section>
+
+  <script src="../dist/js/lightbox-plus-jquery.min.js"></script>
+
+</body>
+</html>

sys/bower_components/lightbox2/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "lightbox2",
+  "version": "2.8.2",
+  "author": "Lokesh Dhakar <lokesh.dhakar@gmail.com>",
+  "description": "The original Lightbox script. Uses jQuery.",
+  "keywords": [
+    "lightbox",
+    "lightbox2",
+    "overlay",
+    "gallery",
+    "slideshow",
+    "images"
+  ],
+  "homepage": "http://lokeshdhakar.com/projects/lightbox2/",
+  "main": "./dist/js/lightbox.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lokesh/lightbox2.git"
+  },
+  "bugs": {
+    "url": "https://github.com/lokesh/lightbox2/issues"
+  },
+  "licenses": [
+    {
+      "type": "MIT",
+      "url": "https://raw.githubusercontent.com/lokesh/lightbox2/master/LICENSE"
+    }
+  ],
+  "devDependencies": {
+    "grunt": "^0.4.5",
+    "grunt-contrib-concat": "^0.5.1",
+    "grunt-contrib-connect": "^0.7.1",
+    "grunt-contrib-copy": "^0.8.0",
+    "grunt-contrib-cssmin": "^0.12.3",
+    "grunt-contrib-jshint": "^0.11.2",
+    "grunt-contrib-uglify": "~0.4.0",
+    "grunt-contrib-watch": "^0.5.3",
+    "grunt-jscs": "^1.8.0"
+  }
+}

sys/bower_components/lightbox2/src/css/lightbox.css

@@ -0,0 +1,213 @@
+/* Preload images */
+body:after {
+  content: url(../images/close.png) url(../images/loading.gif) url(../images/prev.png) url(../images/next.png);
+  display: none;
+}
+
+body.lb-disable-scrolling {
+  overflow: hidden;
+}
+
+.lightboxOverlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 9999;
+  background-color: black;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
+  opacity: 0.8;
+  display: none;
+}
+
+.lightbox {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  z-index: 10000;
+  text-align: center;
+  line-height: 0;
+  font-weight: normal;
+}
+
+.lightbox .lb-image {
+  display: block;
+  height: auto;
+  max-width: inherit;
+  max-height: none;
+  border-radius: 3px;
+
+  /* Image border */
+  border: 4px solid white;
+}
+
+.lightbox a img {
+  border: none;
+}
+
+.lb-outerContainer {
+  position: relative;
+  *zoom: 1;
+  width: 250px;
+  height: 250px;
+  margin: 0 auto;
+  border-radius: 4px;
+
+  /* Background color behind image.
+     This is visible during transitions. */
+  background-color: white;
+}
+
+.lb-outerContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-loader {
+  position: absolute;
+  top: 43%;
+  left: 0;
+  height: 25%;
+  width: 100%;
+  text-align: center;
+  line-height: 0;
+}
+
+.lb-cancel {
+  display: block;
+  width: 32px;
+  height: 32px;
+  margin: 0 auto;
+  background: url(../images/loading.gif) no-repeat;
+}
+
+.lb-nav {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  z-index: 10;
+}
+
+.lb-container > .nav {
+  left: 0;
+}
+
+.lb-nav a {
+  outline: none;
+  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
+}
+
+.lb-prev, .lb-next {
+  height: 100%;
+  cursor: pointer;
+  display: block;
+}
+
+.lb-nav a.lb-prev {
+  width: 34%;
+  left: 0;
+  float: left;
+  background: url(../images/prev.png) left 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-prev:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-nav a.lb-next {
+  width: 64%;
+  right: 0;
+  float: right;
+  background: url(../images/next.png) right 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-next:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-dataContainer {
+  margin: 0 auto;
+  padding-top: 5px;
+  *zoom: 1;
+  width: 100%;
+  -moz-border-radius-bottomleft: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
+.lb-dataContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-data {
+  padding: 0 4px;
+  color: #ccc;
+}
+
+.lb-data .lb-details {
+  width: 85%;
+  float: left;
+  text-align: left;
+  line-height: 1.1em;
+}
+
+.lb-data .lb-caption {
+  font-size: 13px;
+  font-weight: bold;
+  line-height: 1em;
+}
+
+.lb-data .lb-caption a {
+  color: #4ae;
+}
+
+.lb-data .lb-number {
+  display: block;
+  clear: left;
+  padding-bottom: 1em;
+  font-size: 12px;
+  color: #999999;
+}
+
+.lb-data .lb-close {
+  display: block;
+  float: right;
+  width: 30px;
+  height: 30px;
+  background: url(../images/close.png) top right no-repeat;
+  text-align: right;
+  outline: none;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
+  opacity: 0.7;
+  -webkit-transition: opacity 0.2s;
+  -moz-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+}
+
+.lb-data .lb-close:hover {
+  cursor: pointer;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}

sys/css/main.css

@@ -43,9 +43,11 @@ h1, h2, h3, h4, h5, h6 {
   margin: 0; }
 
 #main h1 {
+  font-size: 2em;
   white-space: nowrap; }
 
 #main h2 {
+  font-size: 1.3em;
   white-space: nowrap;
   font-size: 1rem; }
 

sys/gulpfile.js

@@ -22,14 +22,19 @@ gulp.task('scss', function() {
       cascade: false
     }))
     .pipe(wrap('<style type="text/css">\n<%= contents %>\n</style>'))
-    .pipe(gulp.dest('css'))
+    .pipe(gulp.dest('css'));
 });
 
+gulp.task('wrap', function(){
+  return gulp.src( 'bower_components/lightbox2/dist/css/lightbox.min.css')
+    .pipe(wrap('<style type="text/css">\n<%= contents %>\n</style>'))
+    .pipe(gulp.dest('css'));
+})
 
 // Watch Files For Changes
 gulp.task('dev-watch', function() {
-  gulp.watch( 'scss/*.scss', ['scss']);
+  gulp.watch( 'scss/*.scss', ['scss', 'wrap']);
 });
 
 // Default Task
-gulp.task('default', ['scss']);
+gulp.task('default', ['scss', 'wrap']);

sys/script.tpl.html

@@ -1,3 +1,4 @@
 <script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
-<script src="js/jquery.line/jquery.line.js" type="text/javascript"></script>
-<script src="js/main.js" type="text/javascript"></script>
+<!-- <script src="js/jquery.line/jquery.line.js" type="text/javascript"></script> -->
+<script src="bower_components/lightbox2/dist/js/lightbox.min.js" type="text/javascript"></script>
+<script src="js/main.js" type="text/javascript"></script>

sys/scss/main.scss

@@ -69,11 +69,13 @@ h1, h2, h3, h4, h5, h6{
 		// text-transform: uppercase;
 		// padding: 5px 1rem;
 		// top: 100px;
+    font-size: 2em;
 		white-space: nowrap;
 	}
 
 	h2{
 		// top:0;
+    font-size: 1.3em;
 		white-space: nowrap;
 		// padding: 5px 1rem;
 		font-size: 1rem;

sys/tex2html.sh

@@ -8,6 +8,10 @@ if [ ! -d ../output/images ]; then
   mkdir ../output/images
 fi
 
+if [ ! -d ../output/thumbs ]; then
+  mkdir ../output/thumbs
+fi
+
 if [ ! -d ../output/sources ]; then
   mkdir ../output/sources
 fi
@@ -70,7 +74,7 @@ for i in ../content/*; do
       echo "<section class='images'>"$'\n' >> content.textile
       for img in $i/images/*; do
         # echo "images : $img"
-        if [ -f "$img" ]; then
+        if [ -f "$img" ] && [[ ! "$img" =~ ".db" ]] && [[ ! "$img" =~ ".avi" ]]; then
           # record file name
           fn=$(basename "$img")
           counter=$(printf %02d $l)
@@ -80,14 +84,20 @@ for i in ../content/*; do
           fimg="$folder-$counter.$ext"
           # copy image file with new name
           cp -f "$img" ../output/images/$fimg
+          # convert thumbs
+          convert ../output/images/$fimg -resize 400x400\>  ../output/thumbs/$fimg
           # replace image name in main content.textile file
-          sed -i "s/images\/$fn/images\/$fimg/g" content.textile
+          # pandoc can't render textile links
+          sed -i "s/!images\/$fn!/<a data-lightbox='$folder' href='images\/$fimg'>!thumbs\/$fimg!<\/a>/g" content.textile
+          # sed -i "s/!images\/$fn!/thumbs\/$fimg/g" content.textile
+
+
           # find "content.textile" -print0 | xargs -0 sed -i '' -e "s/images\/$fn/images\/$fimg/g"
           l=$(($l+1))
           # if image is not on content ...
           if [[ ! "$cont" =~ "images/$fn" ]]; then
             # ... add it at end of content
-            echo  "* !images/$fimg!" >> content.textile
+            echo  "* <a data-lightbox='$folder' href='images/$fimg'>!thumbs/$fimg!</a>" >> content.textile
           fi
         fi
       done
@@ -103,7 +113,7 @@ for i in ../content/*; do
       for src in $i/sources/*; do
         # echo "patch : $src"
         if [ -f "$src" ]; then
-          # if image is not on content ...
+          # if ~ is not on file name ...
           if [[ ! "$src" =~ "~" ]]; then
             # record file name
             fn=$(basename "$src")
@@ -145,11 +155,14 @@ cat /tmp/header|cat - content.textile > /tmp/out && mv /tmp/out content.textile
 pandoc -s \
   -f textile \
   -t html5 -o ../output/index.html \
+  -H css/lightbox.min.css \
   -H css/main.css \
   -A script.tpl.html \
   content.textile
 
+
 cp -r fonts ../output/
+cp -r bower_components ../output/
 
 
 # echo "export markdown as html"
@@ -157,6 +170,7 @@ cp -r fonts ../output/
 #   -f markdown+hard_line_breaks+auto_identifiers+ascii_identifiers+tex_math_dollars+pipe_tables+all_symbols_escapable \
 #   -t html5 -o index.html \
 #   -c fonts/amiri/amiri.css \
+#   -H bower_components/lightbox2/dist/css/lightbox.min.css \
 #   -H css/styles.css \
 #   -B body-base-top.tpl.html \
 #   -A body-base-bot.tpl.html \