diff options
| author |  Tom Willemsen | 2011-03-23 11:14:27 +0100 |
|---|---|---|
| committer | Tom Willemsen | 2011-03-23 11:14:27 +0100 |
| commit | 0d342f0aee3f2f800e486c0051dabe718a7b2841 (patch) | |
| tree | 1f55afabb8f4876dbe564f7ed5d8e573ddc78df3 /emacs.d/nxhtml/tests/in/bug-373106-flipbook.html | |
| parent | d4510153b17625a3dd2f1852cc6392fc26efecf6 (diff) | |
| download | dotfiles-0d342f0aee3f2f800e486c0051dabe718a7b2841.tar.gz dotfiles-0d342f0aee3f2f800e486c0051dabe718a7b2841.zip | |
I don't like nxhtml
Diffstat (limited to 'emacs.d/nxhtml/tests/in/bug-373106-flipbook.html')
| -rw-r--r-- | emacs.d/nxhtml/tests/in/bug-373106-flipbook.html | 160 |
1 files changed, 0 insertions, 160 deletions
diff --git a/emacs.d/nxhtml/tests/in/bug-373106-flipbook.html b/emacs.d/nxhtml/tests/in/bug-373106-flipbook.html deleted file mode 100644 index 658d391..0000000 --- a/emacs.d/nxhtml/tests/in/bug-373106-flipbook.html +++ /dev/null @@ -1,160 +0,0 @@ -<?xml version="1.0" encoding="UTF-8"?> -<!DOCTYPE html PUBLIC - "-//W3C//DTD XHTML 1.0 Strict//EN" - "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> -<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> - <head> - <title>Flipbook (draft)</title> - <style type="text/css"> - body { - background-color: black; - color: white; - } - - .ui-effects-transfer { - border: 2px dotted gray; - } - </style> - <script type="text/javascript" src="jquery.js"></script> - <script type="text/javascript" src="jquery-ui.js"></script> - <script type="text/javascript" src="jquery.event.special.gesture.js"></script> - <script type="text/javascript" src="jquery.gestureable.js"></script> - <script type="text/javascript"> - /* Code to do some fancy book-like effects - */ - - /* a closure-based class */ - var ImageManager = function (images) { - var self = this; - var currentPage = 0; - - self.getCurrentPages = function () { - return [images[currentPage], - images[currentPage+1]]; - }; - - self.turnNext = function () { - currentPage += 2; - return self.getCurrentPages(); - }; - - self.turnPrevious = function () { - currentPage -= 2; - return self.getCurrentPages(); - }; - }; - - function style_element(element) { - element.css('background-color', 'black'); - element.css('width', '900px'); - element.css('height', '650px'); - element.css('border', '2px dashed white'); - } - - function small_gesture(event) { - /* called in mousedown of small images */ - var container = $(event.target).closest('div'); - var manager = container.data('manager'); - var large = $(event.target). - attr('src'). - replace(/small/, 'large'); - - switch (event.gesture) { - case 'U': - case 'D': - container.data('left').hide(); - container.data('right').hide(); - container.data('spacer').hide(); - container.data('zoomed').attr('src', large).show('clip'); - break; - case 'L': - var images = manager.turnPrevious(); - container.data('left').attr('src', images[0] + '_small.jpg'); - container.data('right').attr('src', images[1] + '_small.jpg'); - break; - case 'R': - var images = manager.turnNext(); - container.data('left').attr('src', images[0] + '_small.jpg'); - container.data('right').attr('src', images[1] + '_small.jpg'); - break; - } - } - - function large_gesture(event) { - var container = $(event.target).closest('div'); - switch (event.gesture) { - case 'U': - case 'D': - $(event.target).hide(); - container.data('spacer').show(); - container.data('left').show(); - container.data('right').show(); - } - } - - function disable_scroll(event) { - /* Simply disables the dragging of elements */ - return false; - } - - function flipbook(element, images) { - var manager = new ImageManager(images); - element.data('manager', manager); - - // apply the style - style_element(element); - - // create a spacer div and attach it - var spacer = $('<div class="spacer"></div>'); - spacer.css('height', '162px'); - element.data('spacer', spacer); - element.append(spacer); - - var zoomed = $('<img />'); - zoomed.gestureable(); - zoomed.mouseup(large_gesture). - mousedown(disable_scroll). - hide(); - - element.data('zoomed', zoomed); - element.append(zoomed); - - // create the images - var currentImages = manager.getCurrentPages(); - var left = $('<img src="' + currentImages[0] + '_small.jpg" />'); - var right = $('<img src="' + currentImages[1] + '_small.jpg" />'); - element.data('left', left); - element.data('right', right); - - $([left, right]).each(function (key, value) { - // enable gestures - value.gestureable(); - value.mouseup(small_gesture); - value.mousedown(disable_scroll); - // add to the display - element.append(value); - }); - } - - $(document).ready(function () { - flipbook($('#flipbook'), - ['image_01', 'image_02', 'image_03', 'image_04', - 'image_05', 'image_06', 'image_07', 'image_08', - 'image_09', 'image_10', 'image_11', 'image_12', - 'image_13', 'image_14', 'image_15']); - }); - </script> - </head> - <body> - <div id="flipbook"></div> - <p>Usage: gesture left/right to change images, up/down to zoom in/out</p> - <p>The flipbook uses a number of libs:</p> - <p> - <ul> - <li>jQuery</li> - <li>jQuery UI</li> - <li>jQuery Special Event Gestures</li> - </ul> - </p> - </body> -</html> |