r2530 - added externals (ui, themes) and jquery and updated demo files; added skeleton for photov...
Author: joern.zaefferer
Date: Tue May 12 04:17:19 2009
New Revision: 2530
Added:
branches/labs/showcase/.project (contents, props changed)
branches/labs/showcase/demos/photoviewer/
branches/labs/showcase/demos/photoviewer/default.html (contents, props
changed)
branches/labs/showcase/demos/photoviewer/index.html (contents, props
changed)
branches/labs/showcase/demos/photoviewer/photos/
branches/labs/showcase/demos/photoviewer/photos/earth-thumb.jpg
(contents, props changed)
branches/labs/showcase/demos/photoviewer/photos/earth.jpg (contents,
props changed)
branches/labs/showcase/demos/photoviewer/photos/flight-thumb.jpg
(contents, props changed)
branches/labs/showcase/demos/photoviewer/photos/flight.jpg (contents,
props changed)
branches/labs/showcase/jquery-1.3.2.js
branches/labs/showcase/source/ui.photoviewer.js
Modified:
branches/labs/showcase/ (props changed)
branches/labs/showcase/demos/carousel/default.html
branches/labs/showcase/demos/carousel/dynamic.html
branches/labs/showcase/demos/carousel/no_animation.html
branches/labs/showcase/demos/carousel/no_interaction.html
branches/labs/showcase/demos/carousel/slider.html
branches/labs/showcase/demos/carousel/tilt.html
branches/labs/showcase/demos/carousel/vertical.html
branches/labs/showcase/demos/coverflow/default.html
branches/labs/showcase/demos/coverflow/slider.html
branches/labs/showcase/demos/coverflow/vertical.html
branches/labs/showcase/demos/index.html
branches/labs/showcase/demos/magnifier/default.html
branches/labs/showcase/demos/magnifier/magnification.html
branches/labs/showcase/demos/magnifier/matrix.html
branches/labs/showcase/demos/magnifier/overlap.html
branches/labs/showcase/demos/selectable/default.html
branches/labs/showcase/demos/selectable/draggable.html
branches/labs/showcase/source/ui.carousel.js
branches/labs/showcase/source/ui.coverflow.js
branches/labs/showcase/source/ui.magnifier.js
Log:
added externals (ui, themes) and jquery and updated demo files; added
skeleton for photoviewer widget
Added: branches/labs/showcase/.project
==============================================================================
--- (empty file)
+++ branches/labs/showcase/.project Tue May 12 04:17:19 2009
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<projectDescription>
+ <name>jquery-ui-labs</name>
+ <comment></comment>
+ <projects>
+ </projects>
+ <buildSpec>
+ </buildSpec>
+ <natures>
+ </natures>
+</projectDescription>
Modified: branches/labs/showcase/demos/carousel/default.html
==============================================================================
--- branches/labs/showcase/demos/carousel/default.html (original)
+++ branches/labs/showcase/demos/carousel/default.html Tue May 12 04:17:19
2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - Default functionality</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/carousel/dynamic.html
==============================================================================
--- branches/labs/showcase/demos/carousel/dynamic.html (original)
+++ branches/labs/showcase/demos/carousel/dynamic.html Tue May 12 04:17:19
2009
@@ -2,9 +2,9 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - Woohoo!</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
<script src="jquery.mousewheel.js" type="text/javascript"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/carousel/no_animation.html
==============================================================================
--- branches/labs/showcase/demos/carousel/no_animation.html (original)
+++ branches/labs/showcase/demos/carousel/no_animation.html Tue May 12
04:17:19 2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - No animation</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/carousel/no_interaction.html
==============================================================================
--- branches/labs/showcase/demos/carousel/no_interaction.html (original)
+++ branches/labs/showcase/demos/carousel/no_interaction.html Tue May 12
04:17:19 2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - No Interaction</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/carousel/slider.html
==============================================================================
--- branches/labs/showcase/demos/carousel/slider.html (original)
+++ branches/labs/showcase/demos/carousel/slider.html Tue May 12 04:17:19
2009
@@ -2,10 +2,10 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - In combination with slider</title>
- <link rel="stylesheet" href="../../../../trunk/themes/base/ui.all.css"
type="text/css">
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
- <script src="../../../../trunk/ui/ui.slider.js"
type="text/javascript"></script>
+ <link rel="stylesheet" href="../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script src="../../ui/ui.slider.js" type="text/javascript"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
Modified: branches/labs/showcase/demos/carousel/tilt.html
==============================================================================
--- branches/labs/showcase/demos/carousel/tilt.html (original)
+++ branches/labs/showcase/demos/carousel/tilt.html Tue May 12 04:17:19 2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - Tilted carousel</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/carousel/vertical.html
==============================================================================
--- branches/labs/showcase/demos/carousel/vertical.html (original)
+++ branches/labs/showcase/demos/carousel/vertical.html Tue May 12 04:17:19
2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Carousel - Vertical carousel</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../source/ui.carousel.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/coverflow/default.html
==============================================================================
--- branches/labs/showcase/demos/coverflow/default.html (original)
+++ branches/labs/showcase/demos/coverflow/default.html Tue May 12 04:17:19
2009
@@ -2,9 +2,9 @@
<html lang="en">
<head>
<title>jQuery UI Coverflow - Default functionality</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
- <script type="text/javascript"
src="../../source/sky.coverflow.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript"
src="../../source/ui.coverflow.js"></script>
<!-- Transformie is a plugin that makes webkit's CSS transforms work in
Internet Explorer (download at http://paulbakaus.com/projects) -->
<script src="http://transformie.googlecode.com/svn/trunk/sylvester.js"
type="text/javascript"></script>
Modified: branches/labs/showcase/demos/coverflow/slider.html
==============================================================================
--- branches/labs/showcase/demos/coverflow/slider.html (original)
+++ branches/labs/showcase/demos/coverflow/slider.html Tue May 12 04:17:19
2009
@@ -2,10 +2,10 @@
<html lang="en">
<head>
<title>jQuery UI Coverflow - Slider combination</title>
- <link rel="stylesheet" href="../../../../trunk/themes/base/ui.all.css"
type="text/css">
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
- <script src="../../../../trunk/ui/ui.slider.js"
type="text/javascript"></script>
+ <link rel="stylesheet" href="../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script src="../../ui/ui.slider.js" type="text/javascript"></script>
<script type="text/javascript"
src="../../source/ui.coverflow.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
Modified: branches/labs/showcase/demos/coverflow/vertical.html
==============================================================================
--- branches/labs/showcase/demos/coverflow/vertical.html (original)
+++ branches/labs/showcase/demos/coverflow/vertical.html Tue May 12
04:17:19 2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Coverflow - Vertical flow</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript"
src="../../source/ui.coverflow.js"></script>
<!-- Transformie is a plugin that makes webkit's CSS transforms work in
Internet Explorer (download at http://paulbakaus.com/projects) -->
Modified: branches/labs/showcase/demos/index.html
==============================================================================
--- branches/labs/showcase/demos/index.html (original)
+++ branches/labs/showcase/demos/index.html Tue May 12 04:17:19 2009
@@ -4,16 +4,17 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery UI Labs</title>
<link type="text/css" href="demos.css" rel="stylesheet" />
- <link rel="stylesheet" href="../../../trunk/themes/base/ui.all.css"
type="text/css" media="screen">
+ <link rel="stylesheet" href="../themes/base/ui.all.css" type="text/css"
media="screen">
- <script src="../../../trunk/jquery-1.3.2.js"
type="text/javascript"></script>
- <script src="../../../trunk/ui/ui.core.js"
type="text/javascript"></script>
- <script src="../../../trunk/ui/ui.slider.js" type="text/javascript"
charset="utf-8"></script>
- <script src="../../../trunk/ui/ui.draggable.js" type="text/javascript"
charset="utf-8"></script>
+ <script src="../jquery-1.3.2.js" type="text/javascript"></script>
+ <script src="../ui/ui.core.js" type="text/javascript"></script>
+ <script src="../ui/ui.slider.js" type="text/javascript"
charset="utf-8"></script>
+ <script src="../ui/ui.draggable.js" type="text/javascript"
charset="utf-8"></script>
<script src="../source/ui.carousel.js" type="text/javascript"></script>
<script src="../source/ui.coverflow.js" type="text/javascript"></script>
<script src="../source/ui.magnifier.js" type="text/javascript"></script>
+ <script src="../source/ui.photoviewer.js" type="text/javascript"></script>
<script src="../source/ui.selectable.js" type="text/javascript"></script>
@@ -161,6 +162,7 @@
<dd><a href="carousel/index.html">Carousel</a></dd>
<dd><a href="coverflow/index.html">Coverflow</a></dd>
<dd><a href="magnifier/index.html">Magnifier</a></dd>
+ <dd><a href="photoviewer/index.html">Photoviewer</a></dd>
<dt>About the UI Labs</dt>
<dd><a href="http://labs.jqueryui.com">Learn more</a></dd>
Modified: branches/labs/showcase/demos/magnifier/default.html
==============================================================================
--- branches/labs/showcase/demos/magnifier/default.html (original)
+++ branches/labs/showcase/demos/magnifier/default.html Tue May 12 04:17:19
2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Magnifier - Default functionality</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript"
src="../../source/ui.magnifier.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/magnifier/magnification.html
==============================================================================
--- branches/labs/showcase/demos/magnifier/magnification.html (original)
+++ branches/labs/showcase/demos/magnifier/magnification.html Tue May 12
04:17:19 2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Magnifier - Magnificent Magnification</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript"
src="../../source/ui.magnifier.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/magnifier/matrix.html
==============================================================================
--- branches/labs/showcase/demos/magnifier/matrix.html (original)
+++ branches/labs/showcase/demos/magnifier/matrix.html Tue May 12 04:17:19
2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Magnifier - Matrix</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript"
src="../../source/ui.magnifier.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/magnifier/overlap.html
==============================================================================
--- branches/labs/showcase/demos/magnifier/overlap.html (original)
+++ branches/labs/showcase/demos/magnifier/overlap.html Tue May 12 04:17:19
2009
@@ -2,8 +2,8 @@
<html lang="en">
<head>
<title>jQuery UI Magnifier - Overlapping items</title>
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript"
src="../../source/ui.magnifier.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Added: branches/labs/showcase/demos/photoviewer/default.html
==============================================================================
--- (empty file)
+++ branches/labs/showcase/demos/photoviewer/default.html Tue May 12
04:17:19 2009
@@ -0,0 +1,65 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>jQuery UI Photoviewer - Default functionality</title>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/effects.core.js"></script>
+ <script type="text/javascript" src="../../ui/effects.drop.js"></script>
+ <script type="text/javascript"
src="../../source/ui.photoviewer.js"></script>
+
+ <link type="text/css" href="../demos.css" rel="stylesheet" />
+
+ <script type="text/javascript">
+ $(function() {
+ var html = $('#demo-frame div.wrapper').html();
+ $('#demo-frame div.wrapper').parent().append(html).end().remove();
+
+ //You don't need this timeout in your pages - Safari has stupid issues
with our demo system
+ window.setTimeout(function() {
+ $("#photos").photoviewer();
+ }, $.browser.safari ? 100 : 0);
+ });
+ </script>
+</head>
+<body>
+<div class="demo">
+
+ <div class="wrapper">
+ <div id="coverflow">
+ <img src="icons/1.png" />
+ <img src="icons/2.png" />
+ <img src="icons/3.png" />
+ <img src="icons/4.png" />
+ <img src="icons/5.png" />
+ <img src="icons/6.png" />
+ <img src="icons/7.png" />
+ <img src="icons/8.png" />
+ <img src="icons/9.png" />
+ <img src="icons/10.png" />
+ <img src="icons/1.png" />
+ <img src="icons/2.png" />
+ <img src="icons/3.png" />
+ <img src="icons/4.png" />
+ <img src="icons/5.png" />
+ <img src="icons/6.png" />
+ <img src="icons/7.png" />
+ <img src="icons/8.png" />
+ <img src="icons/9.png" />
+ <img src="icons/10.png" />
+ </div>
+ </div>
+
+</div><!-- End demo -->
+
+<div class="demo-description">
+
+
+ Takes a container element with a list of images in it and creates adds a
coverflow effect that can
+ be controlled by clicking on the images or by using the keyboard.
+
+
+</div><!-- End demo-description -->
+
+</body>
+</html>
Added: branches/labs/showcase/demos/photoviewer/index.html
==============================================================================
--- (empty file)
+++ branches/labs/showcase/demos/photoviewer/index.html Tue May 12 04:17:19
2009
@@ -0,0 +1,17 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>jQuery UI Photoviewer Demos</title>
+ <link type="text/css" href="../demos.css" rel="stylesheet" />
+</head>
+<body>
+
+<div class="demos-nav">
+ <h4>Examples</h4>
+ <ul>
+ <li class="demo-config-on"><a href="default.html">Default
functionality</a></li>
+ </ul>
+</div>
+
+</body>
+</html>
Added: branches/labs/showcase/demos/photoviewer/photos/earth-thumb.jpg
==============================================================================
Binary file. No diff available.
Added: branches/labs/showcase/demos/photoviewer/photos/earth.jpg
==============================================================================
Binary file. No diff available.
Added: branches/labs/showcase/demos/photoviewer/photos/flight-thumb.jpg
==============================================================================
Binary file. No diff available.
Added: branches/labs/showcase/demos/photoviewer/photos/flight.jpg
==============================================================================
Binary file. No diff available.
Modified: branches/labs/showcase/demos/selectable/default.html
==============================================================================
--- branches/labs/showcase/demos/selectable/default.html (original)
+++ branches/labs/showcase/demos/selectable/default.html Tue May 12
04:17:19 2009
@@ -3,9 +3,9 @@
<head>
<title>jQuery UI Selectable - Default functionality</title>
<link rel="stylesheet" href="../../../../trunk/themes/base/ui.all.css"
type="text/css" media="screen">
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
- <script src="../../../../trunk/ui/ui.draggable.js" type="text/javascript"
charset="utf-8"></script>
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script src="../../ui/ui.draggable.js" type="text/javascript"
charset="utf-8"></script>
<script type="text/javascript"
src="../../source/ui.selectable.js"></script>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<style type="text/css">
Modified: branches/labs/showcase/demos/selectable/draggable.html
==============================================================================
--- branches/labs/showcase/demos/selectable/draggable.html (original)
+++ branches/labs/showcase/demos/selectable/draggable.html Tue May 12
04:17:19 2009
@@ -2,12 +2,12 @@
<html lang="en">
<head>
<title>jQuery UI Selectable - Combined draggable</title>
- <link rel="stylesheet" href="../../../../trunk/themes/base/ui.all.css"
type="text/css" media="screen">
- <script type="text/javascript"
src="../../../../trunk/jquery-1.3.2.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.core.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/effects.core.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.draggable.js"></script>
- <script type="text/javascript"
src="../../../../trunk/ui/ui.droppable.js"></script>
+ <link rel="stylesheet" href="../../themes/base/ui.all.css"
type="text/css" media="screen">
+ <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
+ <script type="text/javascript" src="../../ui/ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/effects.core.js"></script>
+ <script type="text/javascript" src="../../ui/ui.draggable.js"></script>
+ <script type="text/javascript" src="../../ui/ui.droppable.js"></script>
<script type="text/javascript"
src="../../source/ui.selectable.js"></script>