/tests/jquery-1.4.1.js
/tests/jquery-1.4.2.js
/tests/static
-/tests/visual
/tests/index.html
/tests/jquery-1.3.2.js
/tests/jquery-1.7.2.js
/tests/unit/tabs
/tests/unit/widget
/tests/unit/all.html
+/tests/visual
+/tests\visual/resizable
+/tests\visual/selectable
+/tests\visual/slider
+/tests\visual/sortable
+/tests\visual/tabs
+/tests\visual/all.html
+/tests\visual/effects.all.html
+/tests\visual/theme.html
+/tests\visual/dialog
+/tests\visual/draggable
+/tests\visual/droppable
+/tests\visual/menu
+/tests\visual/mouse
+/tests\visual/position
+/tests\visual/progressbar
+/tests\visual/accordion
+/tests\visual/animate
+/tests\visual/autocomplete
+/tests\visual/button
+/tests\visual/compound
+/tests\visual/datepicker
/themes/base/jquery.ui.dialog.css
/themes/base/jquery.ui.accordion.css
/themes/base/jquery.ui.all.css
/themes/base/jquery.ui.selectable.css
/themes/base/jquery.ui.slider.css
/themes/base/jquery.ui.tabs.css
+/themes\base/jquery.ui.datepicker.css
/ui/jquery.effects.transfer.js
/ui/i18n
/ui/jquery.effects.blind.js
/ui/jquery.ui.droppable.js
/ui/jquery.ui.mouse.js
/ui/jquery.ui.progressbar.js
-/grunt.js
\ No newline at end of file
+/grunt.js
+/ui/jquery.ui.droppable.js
+/ui/jquery.ui.mouse.js
+/ui/jquery.ui.sortable.js
+/ui/i18n
+/ui/jquery.effects.bounce.js
+/ui/jquery.effects.core.js
+/ui/jquery.effects.drop.js
+/ui/jquery.effects.slide.js
+/ui/jquery.ui.datepicker.js
+/ui/jquery.ui.dialog.js
+/ui/jquery.ui.draggable.js
+++ /dev/null
-#!/bin/sh
-
-base_dir="`pwd`/jquery-ui-release"
-repo_dir="$base_dir/jquery-ui"
-release_dir="$repo_dir/build/release"
-
-github_repo="git@github.com:jquery/jquery-ui.git"
-git_branch="1-8-stable"
-trac_url="http://bugs.jqueryui.com"
-
-
-#
-# Verify repo state
-#
-
-echo "Is AUTHORS.txt up to date?"
-echo "Press enter to continue, or ctrl+c to cancel."
-read
-
-
-
-#
-# Setup environment
-#
-
-echo
-echo "--------------------------"
-echo "| SETTING UP ENVIRONMENT |"
-echo "--------------------------"
-echo
-
-mkdir $base_dir
-cd $base_dir
-
-echo "Cloning repo from $github_repo..."
-git clone $github_repo
-cd $repo_dir
-git checkout $git_branch
-
-echo
-echo "Environment setup complete."
-echo
-
-
-
-#
-# Figure out which versions we're dealing with
-#
-
-echo
-echo "------------------------"
-echo "| CALCULATING VERSIONS |"
-echo "------------------------"
-echo
-
-# NOTE: this will be different for minor and major releases
-version_new=`node -e "console.log(require(\"${repo_dir}/package\").version)"`
-version_new=${version_new:0:$((${#version_new} - 3))}
-major_minor=${version_new%.*}
-point=${version_new##*.}
-version="${major_minor}.$(($point - 1))"
-version_next="${major_minor}.$(($point + 1))pre"
-
-echo "We are going from $version to $version_new."
-echo "version.txt will be set to $version_next when complete."
-echo "Press enter to continue, or ctrl+c to cancel."
-read
-
-
-#
-# Generate shell for changelog
-#
-
-echo
-echo "------------------------"
-echo "| GENERATING CHANGELOG |"
-echo "------------------------"
-echo
-
-echo "Creating shell for changelog..."
-changelog_url="http:\/\/docs.jquery.com\/action\/edit\/UI\/Changelog\/$version_new"
-`sed "s/CHANGELOG_URL/$changelog_url/" <$release_dir/changelog-shell >$base_dir/changelog`
-
-
-# find all commits
-echo "Adding commits to changelog..."
-format_ticket='[http://dev.jqueryui.com/ticket/XXXX #XXXX]'
-format_commit='[http://github.com/jquery/jquery-ui/commit/%H %h]'
-format_full="* %s ($format_ticket, $format_commit)"
-git whatchanged $version... --pretty=format:"$format_full" \
- -- ui themes demos build \
-| sed '/^:/ d' \
-| sed '/^$/ d' \
-| sed 's/\(Fixe[sd] #\)\([0-9][0-9]*\)\(.*\)\(XXXX #XXXX\)/Fixed #\2\3\2 #\2/' \
-| LC_ALL='C' sort -f \
->> $base_dir/changelog
-
-# find all fixed tickets
-echo "Adding Trac tickets to changelog..."
-trac_changelog="$trac_url/query?format=tab&milestone=$version_new"
-trac_changelog="$trac_changelog&resolution=fixed&col=id&col=component&col=summary&order=component"
-curl $trac_changelog >> $base_dir/changelog
-
-echo
-echo "Changelog complete."
-echo
-
-
-
-#
-# Generate list of contributors
-#
-
-echo
-echo "--------------------------"
-echo "| GATHERING CONTRIBUTORS |"
-echo "--------------------------"
-echo
-
-
-# find all committers and authors
-echo "Adding commiters and authors..."
-format_contributors='%aN%n%cN'
-git whatchanged $version... --pretty=format:"$format_contributors" \
-| sed '/^:/ d' \
-| sed '/^$/ d' \
-> $base_dir/thankyou
-
-# find all reporters and commenters from Trac
-echo "Adding reporters and commenters from Trac..."
-curl "$trac_url/report/22?V=$version_new&max=-1&format=tab" | tail -n +2 >> $base_dir/thankyou
-
-# sort names
-echo "Sorting contributors..."
-LC_ALL='C' sort -f $base_dir/thankyou | col -b | uniq > $base_dir/_thankyou
-mv $base_dir/_thankyou $base_dir/thankyou
-
-# find all people that were thanked
-echo "Adding people thanked in commits..."
-git whatchanged $version... \
-| grep -i thank \
->> $base_dir/thankyou
-
-#echo
-#echo "Find contributors from duplicates of fixed tickets and add them to:"
-#echo "$base_dir/thankyou"
-#echo "Press enter when done."
-#read
-
-echo
-echo "Contributors list complete."
-echo
-
-
-
-#
-# Update version
-#
-
-echo
-echo "--------------------"
-echo "| UPDATING VERSION |"
-echo "--------------------"
-echo
-
-echo "Updating package.json to $version_new..."
-sed "s/\(version\": \"\)\([^\"]*\)/\1${version_new}/" < package.json > _package.json
-mv _package.json package.json
-
-git commit -a -m "Tagging the $version_new release."
-version_new_time=`git log -1 --pretty=format:"%ad"`
-echo "Committed package.json at $version_new_time..."
-
-echo "Tagging $version_new..."
-git tag $version_new
-
-echo "Updating package.json to $version_next..."
-sed "s/\(version\": \"\)\([^\"]*\)/\1${version_next}/" < package.json > _package.json
-mv _package.json package.json
-
-git commit -a -m "Updating the $git_branch version to $version_next"
-echo "Committed package.json..."
-
-echo
-echo "Version update complete."
-echo
-
-
-
-#
-# Push to GitHub
-#
-
-echo
-echo "---------------------"
-echo "| PUSHING TO GITHUB |"
-echo "---------------------"
-echo
-
-echo "Please review the output and generated files as a sanity check."
-echo "Press enter to continue or ctrl+c to abort."
-read
-
-git push
-git push --tags
-
-echo
-echo "Push to GitHub complete."
-echo
-
-
-
-#
-# Update Trac
-#
-
-echo
-echo "-----------------"
-echo "| UPDATING TRAC |"
-echo "-----------------"
-echo
-
-# TODO: automate this
-# NOTE: this will be different for minor and major releases
-
-# Create new milestrone and version
-echo "$version_new was tagged at $version_new_time."
-echo "Close the $version_new Milestone with the above date and time."
-echo "Create the $version_new Version with the above date and time."
-echo "Create a Milestone for the next minor release."
-echo "Press enter when done."
-read
-
-echo
-echo "Trac updates complete."
-echo
-
-
-
-#
-# Build jQuery UI
-#
-
-echo
-echo "----------------------"
-echo "| BUILDING JQUERY UI |"
-echo "----------------------"
-echo
-
-# check out the tagged version
-echo "Checking out $version_new..."
-git checkout $version_new
-
-# install dependencies
-echo "Installing dependencies..."
-npm install
-
-# Run the build
-echo "Running build..."
-grunt release
-
-echo
-echo "Build complete."
-echo
-
-
-
-#
-# Upload zip to Google Code
-#
-
-echo
-echo "----------------------"
-echo "| UPDATE GOOGLE CODE |"
-echo "----------------------"
-echo
-
-echo "Upload zip to Google Code."
-echo " http://code.google.com/p/jquery-ui/downloads/entry"
-echo " Summary: jQuery UI $version_new (Source, demos, docs, themes, tests) STABLE"
-echo " Labels: Featured, Type-Source, OpSys-All"
-echo "Modify the previous release to no longer say STABLE at the end."
-echo "Remove the featured label from the previous release."
-echo "Press enter when done."
-read
-
-echo
-echo "Google Code update complete."
-echo
-
-
-
-#
-# Update SVN
-#
-
-echo
-echo "----------------"
-echo "| UPDATING SVN |"
-echo "----------------"
-echo
-
-cd $base_dir
-mkdir svn
-cd svn
-
-echo "Checking out SVN tags..."
-svn co --depth immediates https://jquery-ui.googlecode.com/svn/tags
-cd tags
-
-echo "Unzipping build into tags/$version_new..."
-unzip $repo_dir/dist/jquery-ui-$version_new.zip
-mv jquery-ui-$version_new $version_new
-
-echo "Adding files to SVN..."
-svn add $version_new
-
-echo "Setting svn:mime-type..."
-find $version_new -name \*.js -exec svn propset svn:mime-type text/javascript {} \;
-find $version_new -name \*.css -exec svn propset svn:mime-type text/css {} \;
-find $version_new -name \*.html -exec svn propset svn:mime-type text/html {} \;
-find $version_new -name \*.png -exec svn propset svn:mime-type image/png {} \;
-find $version_new -name \*.gif -exec svn propset svn:mime-type image/gif {} \;
-
-# TODO: commit
-echo
-echo "svn commit with the following message:"
-echo "Created $version_new tag from http://jquery-ui.googlecode.com/files/jquery-ui-$version_new.zip"
-echo "Press enter when done."
-read
-
-echo
-echo "SVN update complete."
-echo
-
-
-
-#
-# Generate themes
-#
-
-
-
-
-# ruby -e 'puts File.read("thankyou").split("\n").join(", ")' | pbcopy
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Collapse content</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#accordion" ).accordion({
- collapsible: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>By default, accordions always keep one section open. To allow for all sections to be be collapsible, set the <code>collapsible</code> option to true. Click on the currently open section to collapse its content pane.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Customize icons</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- var icons = {
- header: "ui-icon-circle-arrow-e",
- headerSelected: "ui-icon-circle-arrow-s"
- };
- $( "#accordion" ).accordion({
- icons: icons
- });
- $( "#toggle" ).button().toggle(function() {
- $( "#accordion" ).accordion( "option", "icons", false );
- }, function() {
- $( "#accordion" ).accordion( "option", "icons", icons );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
- </div>
-</div>
-
-<button id="toggle">Toggle icons</button>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Customize the header icons with the <code>icons</code> option, which accepts classes for the header's default and selected (open) state. Use any class from the UI CSS framework, or create custom classes with background images.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#accordion" ).accordion();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>
- Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
- ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
- amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
- odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
- </p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>
- Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
- purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
- velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
- suscipit faucibus urna.
- </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>
- Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
- Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
- ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
- lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
- </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>
- Cras dictum. Pellentesque habitant morbi tristique senectus et netus
- et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
- faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
- mauris vel est.
- </p>
- <p>
- Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
- Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
- inceptos himenaeos.
- </p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-<p>
-Click headers to expand/collapse content that is broken into logical sections, much like tabs.
-Optionally, toggle sections open/closed on mouseover.
-</p>
-<p>
-The underlying HTML markup is a series of headers (H3 tags) and content divs so the content is
-usable without JavaScript.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Fill space</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#accordion" ).accordion({
- fillSpace: true
- });
- });
- $(function() {
- $( "#accordionResizer" ).resizable({
- minHeight: 140,
- resize: function() {
- $( "#accordion" ).accordion( "resize" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<h3 class="docs">Resize the outer container:</h3>
-
-<div id="accordionResizer" style="padding:10px; width:350px; height:220px;" class="ui-widget-content">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
- </div>
-</div>
-
-<span class="ui-icon ui-icon-grip-dotted-horizontal" style="margin:2px auto;"></span>
-</div><!-- End accordionResizer -->
-
-<div style="margin-top:7px; padding:10px; width:350px; height:50px;" class="ui-widget-content">I'm another panel</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Because the accordion is comprised of block-level elements, by default its width fills the available horizontal space. To fill the vertical space allocated by its container, set the boolean <code>fillSpace</code> option to true, and the script will automatically set the dimensions of the accordion to the height of its parent container. The accordion will also resize with its container if the container is <code>resizable</code>.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Open on hoverintent</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $("#accordion").accordion({
- event: "click hoverintent"
- });
- });
-
- var cfg = ($.hoverintent = {
- sensitivity: 7,
- interval: 100
- });
-
- $.event.special.hoverintent = {
- setup: function() {
- $( this ).bind( "mouseover", jQuery.event.special.hoverintent.handler );
- },
- teardown: function() {
- $( this ).unbind( "mouseover", jQuery.event.special.hoverintent.handler );
- },
- handler: function( event ) {
- var self = this,
- args = arguments,
- target = $( event.target ),
- cX, cY, pX, pY;
-
- function track( event ) {
- cX = event.pageX;
- cY = event.pageY;
- };
- pX = event.pageX;
- pY = event.pageY;
- function clear() {
- target
- .unbind( "mousemove", track )
- .unbind( "mouseout", arguments.callee );
- clearTimeout( timeout );
- }
- function handler() {
- if ( ( Math.abs( pX - cX ) + Math.abs( pY - cY ) ) < cfg.sensitivity ) {
- clear();
- event.type = "hoverintent";
- // prevent accessing the original event since the new event
- // is fired asynchronously and the old event is no longer
- // usable (#6028)
- event.originalEvent = {};
- jQuery.event.handle.apply( self, args );
- } else {
- pX = cX;
- pY = cY;
- timeout = setTimeout( handler, cfg.interval );
- }
- }
- var timeout = setTimeout( handler, cfg.interval );
- target.mousemove( track ).mouseout( clear );
- return true;
- }
- };
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>
- Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
- ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
- amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
- odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
- </p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>
- Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
- purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
- velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
- suscipit faucibus urna.
- </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>
- Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
- Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
- ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
- lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
- </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>
- Cras dictum. Pellentesque habitant morbi tristique senectus et netus
- et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
- faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
- mauris vel est.
- </p>
- <p>
- Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
- Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
- inceptos himenaeos.
- </p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-<p>
-Click headers to expand/collapse content that is broken into logical sections, much like tabs.
-Optionally, toggle sections open/closed on mouseover.
-</p>
-<p>
-The underlying HTML markup is a series of headers (H3 tags) and content divs so the content is
-usable without JavaScript.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Open on mouseover</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#accordion" ).accordion({
- event: "mouseover"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Toggle sections open/closed on mouseover with the <code>event</code> option. The default value for event is "click."</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - No auto height</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#accordion" ).accordion({
- autoHeight: false,
- navigation: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <h3><a href="#section1">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, susceros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- <h3><a href="#section2">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- <h3><a href="#section3">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- </ul>
- <a href="#othercontent">Link to other content</a>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Setting <code>autoHeight: false</code> allows to accordion panels to keep their native height.</p>
-<p>In addition, the <code>navigation</code> option is enabled, opening the panel based on the current location, eg. no-auto-height.html#panel2 would open the second panel on page load. It also finds anchors within the content, so #othercontent will open the third section, as it contains a link with that href.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Accordion - Sortable</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- /* IE has layout issues when sorting (see #5413) */
- .group { zoom: 1 }
- </style>
- <script>
- $(function() {
- $( "#accordion" )
- .accordion({
- header: "> div > h3"
- })
- .sortable({
- axis: "y",
- handle: "h3",
- stop: function( event, ui ) {
- // IE doesn't register the blur when sorting
- // so trigger focusout handlers to remove .ui-state-focus
- ui.item.children( "h3" ).triggerHandler( "focusout" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="accordion">
- <div class="group">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p>
- </div>
- </div>
- <div class="group">
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p>
- </div>
- </div>
- <div class="group">
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- </div>
- <div class="group">
- <h3><a href="#">Section 4</a></h3>
- <div>
- <p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia mauris vel est. </p><p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. </p>
- </div>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Drag the header to re-order panels.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - addClass demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; padding: 1em; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
- .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
- </style>
- <script>
- $(function() {
- $( "#button" ).click(function() {
- $( "#effect" ).addClass( "newClass", 1000, callback );
- return false;
- });
-
- function callback() {
- setTimeout(function() {
- $( "#effect" ).removeClass( "newClass" );
- }, 1500 );
- }
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class=" ui-corner-all">
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>This demo adds a class which animates: text-indent, letter-spacing, width, height, padding, margin, and font-size.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Animate demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; background: #fff; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script>
- $(function() {
- $( "#button" ).toggle(
- function() {
- $( "#effect" ).animate({
- backgroundColor: "#aa0000",
- color: "#fff",
- width: 500
- }, 1000 );
- },
- function() {
- $( "#effect" ).animate({
- backgroundColor: "#fff",
- color: "#000",
- width: 240
- }, 1000 );
- }
- );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Animate</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Toggle Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Categories</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-category {
- font-weight: bold;
- padding: .2em .4em;
- margin: .8em 0 .2em;
- line-height: 1.5;
- }
- </style>
- <script>
- $.widget( "custom.catcomplete", $.ui.autocomplete, {
- _renderMenu: function( ul, items ) {
- var self = this,
- currentCategory = "";
- $.each( items, function( index, item ) {
- if ( item.category != currentCategory ) {
- ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
- currentCategory = item.category;
- }
- self._renderItem( ul, item );
- });
- }
- });
- </script>
- <script>
- $(function() {
- var data = [
- { label: "anders", category: "" },
- { label: "andreas", category: "" },
- { label: "antal", category: "" },
- { label: "annhhx10", category: "Products" },
- { label: "annk K12", category: "Products" },
- { label: "annttop C13", category: "Products" },
- { label: "anders andersson", category: "People" },
- { label: "andreas andersson", category: "People" },
- { label: "andreas johnson", category: "People" }
- ];
-
- $( "#search" ).catcomplete({
- delay: 0,
- source: data
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
- <label for="search">Search: </label>
- <input id="search" />
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A categorized search result. Try typing "a" or "n".</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Combobox</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-combobox {
- position: relative;
- display: inline-block;
- }
- .ui-combobox-toggle {
- position: absolute;
- top: 0;
- bottom: 0;
- margin-left: -1px;
- padding: 0;
- /* adjust styles for IE 6/7 */
- *height: 1.7em;
- *top: 0.1em;
- }
- .ui-combobox-input {
- margin: 0;
- padding: 0.3em;
- }
- </style>
- <script>
- (function( $ ) {
- $.widget( "ui.combobox", {
- _create: function() {
- var input,
- self = this,
- select = this.element.hide(),
- selected = select.children( ":selected" ),
- value = selected.val() ? selected.text() : "",
- wrapper = this.wrapper = $( "<span>" )
- .addClass( "ui-combobox" )
- .insertAfter( select );
-
- input = $( "<input>" )
- .appendTo( wrapper )
- .val( value )
- .addClass( "ui-state-default ui-combobox-input" )
- .autocomplete({
- delay: 0,
- minLength: 0,
- source: function( request, response ) {
- var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
- response( select.children( "option" ).map(function() {
- var text = $( this ).text();
- if ( this.value && ( !request.term || matcher.test(text) ) )
- return {
- label: text.replace(
- new RegExp(
- "(?![^&;]+;)(?!<[^<>]*)(" +
- $.ui.autocomplete.escapeRegex(request.term) +
- ")(?![^<>]*>)(?![^&;]+;)", "gi"
- ), "<strong>$1</strong>" ),
- value: text,
- option: this
- };
- }) );
- },
- select: function( event, ui ) {
- ui.item.option.selected = true;
- self._trigger( "selected", event, {
- item: ui.item.option
- });
- },
- change: function( event, ui ) {
- if ( !ui.item ) {
- var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
- valid = false;
- select.children( "option" ).each(function() {
- if ( $( this ).text().match( matcher ) ) {
- this.selected = valid = true;
- return false;
- }
- });
- if ( !valid ) {
- // remove invalid value, as it didn't match anything
- $( this ).val( "" );
- select.val( "" );
- input.data( "autocomplete" ).term = "";
- return false;
- }
- }
- }
- })
- .addClass( "ui-widget ui-widget-content ui-corner-left" );
-
- input.data( "autocomplete" )._renderItem = function( ul, item ) {
- return $( "<li></li>" )
- .data( "item.autocomplete", item )
- .append( "<a>" + item.label + "</a>" )
- .appendTo( ul );
- };
-
- $( "<a>" )
- .attr( "tabIndex", -1 )
- .attr( "title", "Show All Items" )
- .appendTo( wrapper )
- .button({
- icons: {
- primary: "ui-icon-triangle-1-s"
- },
- text: false
- })
- .removeClass( "ui-corner-all" )
- .addClass( "ui-corner-right ui-combobox-toggle" )
- .click(function() {
- // close if already visible
- if ( input.autocomplete( "widget" ).is( ":visible" ) ) {
- input.autocomplete( "close" );
- return;
- }
-
- // work around a bug (likely same cause as #5265)
- $( this ).blur();
-
- // pass empty string as value to search for, displaying all results
- input.autocomplete( "search", "" );
- input.focus();
- });
- },
-
- destroy: function() {
- this.wrapper.remove();
- this.element.show();
- $.Widget.prototype.destroy.call( this );
- }
- });
- })( jQuery );
-
- $(function() {
- $( "#combobox" ).combobox();
- $( "#toggle" ).click(function() {
- $( "#combobox" ).toggle();
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label>Your preferred programming language: </label>
- <select id="combobox">
- <option value="">Select one...</option>
- <option value="ActionScript">ActionScript</option>
- <option value="AppleScript">AppleScript</option>
- <option value="Asp">Asp</option>
- <option value="BASIC">BASIC</option>
- <option value="C">C</option>
- <option value="C++">C++</option>
- <option value="Clojure">Clojure</option>
- <option value="COBOL">COBOL</option>
- <option value="ColdFusion">ColdFusion</option>
- <option value="Erlang">Erlang</option>
- <option value="Fortran">Fortran</option>
- <option value="Groovy">Groovy</option>
- <option value="Haskell">Haskell</option>
- <option value="Java">Java</option>
- <option value="JavaScript">JavaScript</option>
- <option value="Lisp">Lisp</option>
- <option value="Perl">Perl</option>
- <option value="PHP">PHP</option>
- <option value="Python">Python</option>
- <option value="Ruby">Ruby</option>
- <option value="Scala">Scala</option>
- <option value="Scheme">Scheme</option>
- </select>
-</div>
-<button id="toggle">Show underlying select</button>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A custom widget built by composition of Autocomplete and Button. You can either type something into the field to get filtered suggestions based on your input, or use the button to get the full list of selections.</p>
-<p>The input is read from an existing select-element for progressive enhancement, passed to Autocomplete with a customized source-option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Custom data and display</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #project-label {
- display: block;
- font-weight: bold;
- margin-bottom: 1em;
- }
- #project-icon {
- float: left;
- height: 32px;
- width: 32px;
- }
- #project-description {
- margin: 0;
- padding: 0;
- }
- </style>
- <script>
- $(function() {
- var projects = [
- {
- value: "jquery",
- label: "jQuery",
- desc: "the write less, do more, JavaScript library",
- icon: "jquery_32x32.png"
- },
- {
- value: "jquery-ui",
- label: "jQuery UI",
- desc: "the official user interface library for jQuery",
- icon: "jqueryui_32x32.png"
- },
- {
- value: "sizzlejs",
- label: "Sizzle JS",
- desc: "a pure-JavaScript CSS selector engine",
- icon: "sizzlejs_32x32.png"
- }
- ];
-
- $( "#project" ).autocomplete({
- minLength: 0,
- source: projects,
- focus: function( event, ui ) {
- $( "#project" ).val( ui.item.label );
- return false;
- },
- select: function( event, ui ) {
- $( "#project" ).val( ui.item.label );
- $( "#project-id" ).val( ui.item.value );
- $( "#project-description" ).html( ui.item.desc );
- $( "#project-icon" ).attr( "src", "images/" + ui.item.icon );
-
- return false;
- }
- })
- .data( "autocomplete" )._renderItem = function( ul, item ) {
- return $( "<li></li>" )
- .data( "item.autocomplete", item )
- .append( "<a>" + item.label + "<br>" + item.desc + "</a>" )
- .appendTo( ul );
- };
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
- <div id="project-label">Select a project (type "j" for a start):</div>
- <img id="project-icon" src="images/transparent_1x1.png" class="ui-state-default"/>
- <input id="project"/>
- <input type="hidden" id="project-id"/>
- <p id="project-description"></p>
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>You can use your own custom data formats and displays by simply overriding the default focus and select actions.</p>
-<p>Try typing "j" to get a list of projects or just press the down arrow.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- var availableTags = [
- "ActionScript",
- "AppleScript",
- "Asp",
- "BASIC",
- "C",
- "C++",
- "Clojure",
- "COBOL",
- "ColdFusion",
- "Erlang",
- "Fortran",
- "Groovy",
- "Haskell",
- "Java",
- "JavaScript",
- "Lisp",
- "Perl",
- "PHP",
- "Python",
- "Ruby",
- "Scala",
- "Scheme"
- ];
- $( "#tags" ).autocomplete({
- source: availableTags
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="tags">Tags: </label>
- <input id="tags" />
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p>
-<p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Accent folding</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- var names = [ "Jörn Zaefferer", "Scott González", "John Resig" ];
-
- var accentMap = {
- "á": "a",
- "ö": "o"
- };
- var normalize = function( term ) {
- var ret = "";
- for ( var i = 0; i < term.length; i++ ) {
- ret += accentMap[ term.charAt(i) ] || term.charAt(i);
- }
- return ret;
- };
-
- $( "#developer" ).autocomplete({
- source: function( request, response ) {
- var matcher = new RegExp( $.ui.autocomplete.escapeRegex( request.term ), "i" );
- response( $.grep( names, function( value ) {
- value = value.label || value.value || value;
- return matcher.test( value ) || matcher.test( normalize( value ) );
- }) );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <form>
- <label for="developer">Developer: </label>
- <input id="developer" />
- </form>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The autocomplete field uses a custom source option which will match results that have accented characters even when the text field doesn't contain accented characters. However if the you type in accented characters in the text field it is smart enough not to show results that aren't accented.</p>
-<p>Try typing "Jo" to see "John" and "Jörn", then type "Jö" to see only "Jörn".</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Scrollable results</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete {
- max-height: 100px;
- overflow-y: auto;
- /* prevent horizontal scrollbar */
- overflow-x: hidden;
- /* add padding to account for vertical scrollbar */
- padding-right: 20px;
- }
- /* IE 6 doesn't support max-height
- * we use height instead, but this forces the menu to always be this tall
- */
- * html .ui-autocomplete {
- height: 100px;
- }
- </style>
- <script>
- $(function() {
- var availableTags = [
- "ActionScript",
- "AppleScript",
- "Asp",
- "BASIC",
- "C",
- "C++",
- "Clojure",
- "COBOL",
- "ColdFusion",
- "Erlang",
- "Fortran",
- "Groovy",
- "Haskell",
- "Java",
- "JavaScript",
- "Lisp",
- "Perl",
- "PHP",
- "Python",
- "Ruby",
- "Scala",
- "Scheme"
- ];
- $( "#tags" ).autocomplete({
- source: availableTags
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="tags">Tags: </label>
- <input id="tags" />
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>When displaying a long list of options, you can simply set the max-height for the autocomplete menu to prevent the menu from growing too large. Try typing "a" or "s" above to get a long list of results that you can scroll through.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Multiple, remote</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
- </style>
- <script>
- $(function() {
- function split( val ) {
- return val.split( /,\s*/ );
- }
- function extractLast( term ) {
- return split( term ).pop();
- }
-
- $( "#birds" )
- // don't navigate away from the field on tab when selecting an item
- .bind( "keydown", function( event ) {
- if ( event.keyCode === $.ui.keyCode.TAB &&
- $( this ).data( "autocomplete" ).menu.active ) {
- event.preventDefault();
- }
- })
- .autocomplete({
- source: function( request, response ) {
- $.getJSON( "search.php", {
- term: extractLast( request.term )
- }, response );
- },
- search: function() {
- // custom minLength
- var term = extractLast( this.value );
- if ( term.length < 2 ) {
- return false;
- }
- },
- focus: function() {
- // prevent value inserted on focus
- return false;
- },
- select: function( event, ui ) {
- var terms = split( this.value );
- // remove the current input
- terms.pop();
- // add the selected item
- terms.push( ui.item.value );
- // add placeholder to get the comma-and-space at the end
- terms.push( "" );
- this.value = terms.join( ", " );
- return false;
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="birds">Birds: </label>
- <input id="birds" size="50" />
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Usage: Enter at least two characters to get bird name suggestions. Select a value to continue adding more names.</p>
-<p>This is an example showing how to use the source-option along with some events to enable autocompleting multiple values into a single field.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Multiple values</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- var availableTags = [
- "ActionScript",
- "AppleScript",
- "Asp",
- "BASIC",
- "C",
- "C++",
- "Clojure",
- "COBOL",
- "ColdFusion",
- "Erlang",
- "Fortran",
- "Groovy",
- "Haskell",
- "Java",
- "JavaScript",
- "Lisp",
- "Perl",
- "PHP",
- "Python",
- "Ruby",
- "Scala",
- "Scheme"
- ];
- function split( val ) {
- return val.split( /,\s*/ );
- }
- function extractLast( term ) {
- return split( term ).pop();
- }
-
- $( "#tags" )
- // don't navigate away from the field on tab when selecting an item
- .bind( "keydown", function( event ) {
- if ( event.keyCode === $.ui.keyCode.TAB &&
- $( this ).data( "autocomplete" ).menu.active ) {
- event.preventDefault();
- }
- })
- .autocomplete({
- minLength: 0,
- source: function( request, response ) {
- // delegate back to autocomplete, but extract the last term
- response( $.ui.autocomplete.filter(
- availableTags, extractLast( request.term ) ) );
- },
- focus: function() {
- // prevent value inserted on focus
- return false;
- },
- select: function( event, ui ) {
- var terms = split( this.value );
- // remove the current input
- terms.pop();
- // add the selected item
- terms.push( ui.item.value );
- // add placeholder to get the comma-and-space at the end
- terms.push( "" );
- this.value = terms.join( ", " );
- return false;
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="tags">Tag programming languages: </label>
- <input id="tags" size="50" />
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Usage: Type something, eg. "j" to see suggestions for tagging with programming languages. Select a value, then continue typing to add more.</p>
-<p>This is an example showing how to use the source-option along with some events to enable autocompleting multiple values into a single field.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Remote JSONP datasource</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
- #city { width: 25em; }
- </style>
- <script>
- $(function() {
- function log( message ) {
- $( "<div/>" ).text( message ).prependTo( "#log" );
- $( "#log" ).scrollTop( 0 );
- }
-
- $( "#city" ).autocomplete({
- source: function( request, response ) {
- $.ajax({
- url: "http://ws.geonames.org/searchJSON",
- dataType: "jsonp",
- data: {
- featureClass: "P",
- style: "full",
- maxRows: 12,
- name_startsWith: request.term
- },
- success: function( data ) {
- response( $.map( data.geonames, function( item ) {
- return {
- label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
- value: item.name
- }
- }));
- }
- });
- },
- minLength: 2,
- select: function( event, ui ) {
- log( ui.item ?
- "Selected: " + ui.item.label :
- "Nothing selected, input was " + this.value);
- },
- open: function() {
- $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
- },
- close: function() {
- $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="city">Your city: </label>
- <input id="city" />
- Powered by <a href="http://geonames.org">geonames.org</a>
-</div>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Result:
- <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are cities, displayed when at least two characters are entered into the field.</p>
-<p>In this case, the datasource is the <a href="http://geonames.org">geonames.org webservice</a>. While only the city name itself ends up in the input after selecting an element, more info is displayed in the suggestions to help find the right entry. That data is also available in callbacks, as illustrated by the Result area below the input.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Remote with caching</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
- </style>
- <script>
- $(function() {
- var cache = {},
- lastXhr;
- $( "#birds" ).autocomplete({
- minLength: 2,
- source: function( request, response ) {
- var term = request.term;
- if ( term in cache ) {
- response( cache[ term ] );
- return;
- }
-
- lastXhr = $.getJSON( "search.php", request, function( data, status, xhr ) {
- cache[ term ] = data;
- if ( xhr === lastXhr ) {
- response( data );
- }
- });
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="birds">Birds: </label>
- <input id="birds" />
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are bird names, displayed when at least two characters are entered into the field.</p>
-<p>Similar to the remote datasource demo, though this adds some local caching to improve performance. The cache here saves just one query, and could be extended to cache multiple values, one for each term.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - Remote datasource</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
- </style>
- <script>
- $(function() {
- function log( message ) {
- $( "<div/>" ).text( message ).prependTo( "#log" );
- $( "#log" ).scrollTop( 0 );
- }
-
- $( "#birds" ).autocomplete({
- source: "search.php",
- minLength: 2,
- select: function( event, ui ) {
- log( ui.item ?
- "Selected: " + ui.item.value + " aka " + ui.item.id :
- "Nothing selected, input was " + this.value );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="birds">Birds: </label>
- <input id="birds" />
-</div>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Result:
- <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are bird names, displayed when at least two characters are entered into the field.</p>
-<p>The datasource is a server-side script which returns JSON data, specified via a simple URL for the source-option. In addition, the minLength-option is set to 2 to avoid queries that would return too many results and the select-event is used to display some feedback.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Autocomplete - XML data parsed once</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.autocomplete.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; }
- </style>
- <script>
- $(function() {
- function log( message ) {
- $( "<div/>" ).text( message ).prependTo( "#log" );
- $( "#log" ).scrollTop( 0 );
- }
-
- $.ajax({
- url: "london.xml",
- dataType: "xml",
- success: function( xmlResponse ) {
- var data = $( "geoname", xmlResponse ).map(function() {
- return {
- value: $( "name", this ).text() + ", " +
- ( $.trim( $( "countryName", this ).text() ) || "(unknown country)" ),
- id: $( "geonameId", this ).text()
- };
- }).get();
- $( "#birds" ).autocomplete({
- source: data,
- minLength: 0,
- select: function( event, ui ) {
- log( ui.item ?
- "Selected: " + ui.item.value + ", geonameId: " + ui.item.id :
- "Nothing selected, input was " + this.value );
- }
- });
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="ui-widget">
- <label for="birds">London matches: </label>
- <input id="birds" />
-</div>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Result:
- <div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>This demo shows how to retrieve some XML data, parse it using jQuery's methods, then provide it to the autocomplete as the datasource.</p>
-<p>This should also serve as a reference on how to parse a remote XML datasource - the parsing would just happen for each request within the source-callback.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Checkboxes</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#check" ).button();
- $( "#format" ).buttonset();
- });
- </script>
- <style>
- #format { margin-top: 2em; }
- </style>
-</head>
-<body>
-
-<div class="demo">
-
-<input type="checkbox" id="check" /><label for="check">Toggle</label>
-
-<div id="format">
- <input type="checkbox" id="check1" /><label for="check1">B</label>
- <input type="checkbox" id="check2" /><label for="check2">I</label>
- <input type="checkbox" id="check3" /><label for="check3">U</label>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A checkbox is styled as a toggle button with the button widget. The label element associated with the checkbox is used for the button text.</p>
-<p>This demo also demonstrates three checkboxes styled as a button set by calling <code>.buttonset()</code> on a common container.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "input:submit, a, button", ".demo" ).button();
- $( "a", ".demo" ).click(function() { return false; });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<button>A button element</button>
-
-<input type="submit" value="A submit button"/>
-
-<a href="#">An anchor</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Examples of the markup that can be used for buttons: A button element, an input of type submit and an anchor.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Icons</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( ".demo button:first" ).button({
- icons: {
- primary: "ui-icon-locked"
- },
- text: false
- }).next().button({
- icons: {
- primary: "ui-icon-locked"
- }
- }).next().button({
- icons: {
- primary: "ui-icon-gear",
- secondary: "ui-icon-triangle-1-s"
- }
- }).next().button({
- icons: {
- primary: "ui-icon-gear",
- secondary: "ui-icon-triangle-1-s"
- },
- text: false
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<button>Button with icon only</button>
-<button>Button with icon on the left</button>
-<button>Button with two icons</button>
-<button>Button with two icons and no text</button>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Some buttons with various combinations of text and icons, here specified via metadata.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Radios</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#radio" ).buttonset();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<form>
- <div id="radio">
- <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
- <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
- <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
- </div>
-</form>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A set of three radio buttons transformed into a button set.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Split button</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#rerun" )
- .button()
- .click(function() {
- alert( "Running the last action" );
- })
- .next()
- .button( {
- text: false,
- icons: {
- primary: "ui-icon-triangle-1-s"
- }
- })
- .click(function() {
- alert( "Could display a menu to select an action" );
- })
- .parent()
- .buttonset();
- });
- </script>
- <style>
-
- </style>
-</head>
-<body>
-
-<div class="demo">
-
-<div>
- <button id="rerun">Run last action</button>
- <button id="select">Select an action</button>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>An example of a split button built with two buttons: A plan button with just text, one with only a primary icon and no text. Both are grouped together in a set.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Button - Toolbar</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #toolbar {
- padding: 10px 4px;
- }
- </style>
- <script>
- $(function() {
- $( "#beginning" ).button({
- text: false,
- icons: {
- primary: "ui-icon-seek-start"
- }
- });
- $( "#rewind" ).button({
- text: false,
- icons: {
- primary: "ui-icon-seek-prev"
- }
- });
- $( "#play" ).button({
- text: false,
- icons: {
- primary: "ui-icon-play"
- }
- })
- .click(function() {
- var options;
- if ( $( this ).text() === "play" ) {
- options = {
- label: "pause",
- icons: {
- primary: "ui-icon-pause"
- }
- };
- } else {
- options = {
- label: "play",
- icons: {
- primary: "ui-icon-play"
- }
- };
- }
- $( this ).button( "option", options );
- });
- $( "#stop" ).button({
- text: false,
- icons: {
- primary: "ui-icon-stop"
- }
- })
- .click(function() {
- $( "#play" ).button( "option", {
- label: "play",
- icons: {
- primary: "ui-icon-play"
- }
- });
- });
- $( "#forward" ).button({
- text: false,
- icons: {
- primary: "ui-icon-seek-next"
- }
- });
- $( "#end" ).button({
- text: false,
- icons: {
- primary: "ui-icon-seek-end"
- }
- });
- $( "#shuffle" ).button();
- $( "#repeat" ).buttonset();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<span id="toolbar" class="ui-widget-header ui-corner-all">
- <button id="beginning">go to beginning</button>
- <button id="rewind">rewind</button>
- <button id="play">play</button>
- <button id="stop">stop</button>
- <button id="forward">fast forward</button>
- <button id="end">go to end</button>
-
- <input type="checkbox" id="shuffle" /><label for="shuffle">Shuffle</label>
-
- <span id="repeat">
- <input type="radio" id="repeat0" name="repeat" checked="checked" /><label for="repeat0">No Repeat</label>
- <input type="radio" id="repeat1" name="repeat" /><label for="repeat1">Once</label>
- <input type="radio" id="repeatall" name="repeat" /><label for="repeatall">All</label>
- </span>
-</span>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- A mediaplayer toolbar. Take a look at the underlying markup: A few button elements,
- an input of type checkbox for the Shuffle button, and three inputs of type radio for the Repeat options.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Populate alternate field</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- altField: "#alternate",
- altFormat: "DD, d MM, yy"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"> <input type="text" id="alternate" size="30"/></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Populate an alternate field with its own date format whenever a date is selected using the <code>altField</code> and <code>altFormat</code> options. This feature could be used to present a human-friendly date for user selection, while passing a more computer-friendly date through for further processing.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Animations</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.bounce.js"></script>
- <script src="../../ui/jquery.effects.clip.js"></script>
- <script src="../../ui/jquery.effects.drop.js"></script>
- <script src="../../ui/jquery.effects.fold.js"></script>
- <script src="../../ui/jquery.effects.slide.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker();
- $( "#anim" ).change(function() {
- $( "#datepicker" ).datepicker( "option", "showAnim", $( this ).val() );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker" size="30"/></p>
-
-<p>Animations:<br />
- <select id="anim">
- <option value="show">Show (default)</option>
- <option value="slideDown">Slide down</option>
- <option value="fadeIn">Fade in</option>
- <option value="blind">Blind (UI Effect)</option>
- <option value="bounce">Bounce (UI Effect)</option>
- <option value="clip">Clip (UI Effect)</option>
- <option value="drop">Drop (UI Effect)</option>
- <option value="fold">Fold (UI Effect)</option>
- <option value="slide">Slide (UI Effect)</option>
- <option value="">None</option>
- </select>
-</p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Use different animations when opening or closing the datepicker. Choose an animation from the dropdown, then click on the input to see its effect. You can use one of the three standard animations or any of the UI Effects.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Display button bar</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- showButtonPanel: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Display a button for selecting Today's date and a Done button for closing the calendar with the boolean <code>showButtonPanel</code> option. Each button is enabled by default when the bar is displayed, but can be turned off with additional options. Button text is customizable.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Format date</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker();
- $( "#format" ).change(function() {
- $( "#datepicker" ).datepicker( "option", "dateFormat", $( this ).val() );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker" size="30"/></p>
-
-<p>Format options:<br />
- <select id="format">
- <option value="mm/dd/yy">Default - mm/dd/yy</option>
- <option value="yy-mm-dd">ISO 8601 - yy-mm-dd</option>
- <option value="d M, y">Short - d M, y</option>
- <option value="d MM, y">Medium - d MM, y</option>
- <option value="DD, d MM, yy">Full - DD, d MM, yy</option>
- <option value="'day' d 'of' MM 'in the year' yy">With text - 'day' d 'of' MM 'in the year' yy</option>
- </select>
-</p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Display date feedback in a variety of ways. Choose a date format from the dropdown, then click on the input and select a date to see it in that format.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Select a Date Range</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#from" ).datepicker({
- defaultDate: "+1w",
- changeMonth: true,
- numberOfMonths: 3,
- onSelect: function( selectedDate ) {
- $( "#to" ).datepicker( "option", "minDate", selectedDate );
- }
- });
- $( "#to" ).datepicker({
- defaultDate: "+1w",
- changeMonth: true,
- numberOfMonths: 3,
- onSelect: function( selectedDate ) {
- $( "#from" ).datepicker( "option", "maxDate", selectedDate );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<label for="from">From</label>
-<input type="text" id="from" name="from"/>
-<label for="to">to</label>
-<input type="text" id="to" name="to"/>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Select the date range to search for.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Display month & year menus</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- changeMonth: true,
- changeYear: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Show month and year dropdowns in place of the static month/year header to facilitate navigation through large timeframes. Add the boolean <code>changeMonth</code> and <code>changeYear</code> options.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Icon trigger</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- showOn: "button",
- buttonImage: "images/calendar.gif",
- buttonImageOnly: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the icon next to the input field to show the datepicker. Set the datepicker to open on focus (default behavior), on icon click, or both.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Display inline</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-Date: <div id="datepicker"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Display the datepicker embedded in the page instead of in an overlay. Simply call .datepicker() on a div instead of an input.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Localize calendar</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-af.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ar.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ar-DZ.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-az.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-bg.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-bs.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ca.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-cs.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-cy-GB.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-da.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-de.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-el.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-en-AU.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-en-NZ.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-eo.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-es.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-et.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-eu.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-fa.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-fi.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-fo.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-fr.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-fr-CH.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-gl.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-he.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-hi.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-hr.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-hu.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-hy.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-id.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-is.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-it.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ja.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ka.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-kk.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-km.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ko.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-lb.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-lt.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-lv.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-mk.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ml.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ms.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-nl.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-nl-BE.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-no.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-pl.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-pt.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-pt-BR.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-rm.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ro.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ru.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sk.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sl.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sq.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sr.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sr-SR.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-sv.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-ta.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-th.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-tj.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-tr.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-uk.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-vi.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-zh-CN.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-zh-HK.js"></script>
- <script src="../../ui/i18n/jquery.ui.datepicker-zh-TW.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $.datepicker.setDefaults( $.datepicker.regional[ "" ] );
- $( "#datepicker" ).datepicker( $.datepicker.regional[ "fr" ] );
- $( "#locale" ).change(function() {
- $( "#datepicker" ).datepicker( "option",
- $.datepicker.regional[ $( this ).val() ] );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"/>
- <select id="locale">
- <option value="af">Afrikaans</option>
- <option value="sq">Albanian (Gjuha shqipe)</option>
- <option value="ar-DZ">Algerian Arabic</option>
- <option value="ar">Arabic (‫(لعربي</option>
- <option value="hy">Armenian (Հայերեն)</option>
- <option value="az">Azerbaijani (Azərbaycan dili)</option>
- <option value="eu">Basque (Euskara)</option>
- <option value="bs">Bosnian (Bosanski)</option>
- <option value="bg">Bulgarian (български език)</option>
- <option value="ca">Catalan (Català)</option>
- <option value="zh-HK">Chinese Hong Kong (繁體中文)</option>
- <option value="zh-CN">Chinese Simplified (简体中文)</option>
- <option value="zh-TW">Chinese Traditional (繁體中文)</option>
- <option value="hr">Croatian (Hrvatski jezik)</option>
- <option value="cs">Czech (čeština)</option>
- <option value="da">Danish (Dansk)</option>
- <option value="nl-BE">Dutch (Belgium)</option>
- <option value="nl">Dutch (Nederlands)</option>
- <option value="en-AU">English/Australia</option>
- <option value="en-NZ">English/New Zealand</option>
- <option value="en-GB">English/UK</option>
- <option value="eo">Esperanto</option>
- <option value="et">Estonian (eesti keel)</option>
- <option value="fo">Faroese (føroyskt)</option>
- <option value="fa">Farsi/Persian (‫(فارسی</option>
- <option value="fi">Finnish (suomi)</option>
- <option value="fr" selected="selected">French (Français)</option>
- <option value="fr-CH">French/Swiss (Français de Suisse)</option>
- <option value="gl">Galician</option>
- <option value="ge">Georgian</option>
- <option value="de">German (Deutsch)</option>
- <option value="el">Greek (Ελληνικά)</option>
- <option value="he">Hebrew (‫(עברית</option>
- <option value="hi">Hindi (हिंदी)</option>
- <option value="hu">Hungarian (Magyar)</option>
- <option value="is">Icelandic (Õslenska)</option>
- <option value="id">Indonesian (Bahasa Indonesia)</option>
- <option value="it">Italian (Italiano)</option>
- <option value="ja">Japanese (日本語)</option>
- <option value="kk">Kazakhstan (Kazakh)</option>
- <option value="km">Khmer</option>
- <option value="ko">Korean (한국어)</option>
- <option value="lv">Latvian (Latvieöu Valoda)</option>
- <option value="lt">Lithuanian (lietuviu kalba)</option>
- <option value="lb">Luxembourgish</option>
- <option value="mk">Macedonian</option>
- <option value="ml">Malayalam</option>
- <option value="ms">Malaysian (Bahasa Malaysia)</option>
- <option value="no">Norwegian (Norsk)</option>
- <option value="pl">Polish (Polski)</option>
- <option value="pt">Portuguese (Português)</option>
- <option value="pt-BR">Portuguese/Brazilian (Português)</option>
- <option value="rm">Rhaeto-Romanic (Romansh)</option>
- <option value="ro">Romanian (Română)</option>
- <option value="ru">Russian (Русский)</option>
- <option value="sr">Serbian (српски језик)</option>
- <option value="sr-SR">Serbian (srpski jezik)</option>
- <option value="sk">Slovak (Slovencina)</option>
- <option value="sl">Slovenian (Slovenski Jezik)</option>
- <option value="es">Spanish (Español)</option>
- <option value="sv">Swedish (Svenska)</option>
- <option value="ta">Tamil (தமிழ்)</option>
- <option value="th">Thai (ภาษาไทย)</option>
- <option value="tj">Tajikistan</option>
- <option value="tr">Turkish (Türkçe)</option>
- <option value="uk">Ukranian (Українська)</option>
- <option value="vi">Vietnamese (Tiếng Việt)</option>
- <option value="cy-GB">Welsh/UK (Cymraeg)</option>
- </select></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Localize the datepicker calendar language and format (English / Western formatting is the default). The datepicker includes built-in support for languages that read right-to-left, such as Arabic and Hebrew.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Restrict date range</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Restrict the range of selectable dates with the <code>minDate</code> and <code>maxDate</code> options. Set the beginning and end dates as actual dates (new Date(2009, 1 - 1, 26)), as a numeric offset from today (-20), or as a string of periods and units ('+1M +10D'). For the last, use 'D' for days, 'W' for weeks, 'M' for months, or 'Y' for years.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Display multiple months</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- numberOfMonths: 3,
- showButtonPanel: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Set the <code>numberOfMonths</code> option to an integer of 2 or more to show multiple months in a single datepicker.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Dates in other months</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- showOtherMonths: true,
- selectOtherMonths: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The datepicker can show dates that come from other than the main month
- being displayed. These other dates can also be made selectable.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Datepicker - Show week of the year</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.datepicker.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#datepicker" ).datepicker({
- showWeek: true,
- firstDay: 1
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>Date: <input type="text" id="datepicker"></p>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The datepicker can show the week of the year. The default calculation follows
- the ISO 8601 definition: the week starts on Monday, the first week of the year
- contains the first Thursday of the year. This means that some days from one
- year may be placed into weeks 'belonging' to another year.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Animation</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.explode.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- // increase the default animation speed to exaggerate the effect
- $.fx.speeds._default = 1000;
- $(function() {
- $( "#dialog" ).dialog({
- autoOpen: false,
- show: "blind",
- hide: "explode"
- });
-
- $( "#opener" ).click(function() {
- $( "#dialog" ).dialog( "open" );
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog" title="Basic dialog">
- <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
-</div>
-
-<button id="opener">Open Dialog</button>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Dialogs may be animated by specifying an effect for the show and/or hide properties. You must include the individual effects file for any effects you would like to use.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#dialog" ).dialog();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog" title="Basic dialog">
- <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
-</div>
-
-<!-- Sample page content to illustrate the layering of the dialog -->
-<div class="hiddenInViewSource" style="padding:20px;">
-<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
-<form>
- <input value="text input" /><br />
- <input type="checkbox" />checkbox<br />
- <input type="radio" />radio<br />
- <select>
- <option>select</option>
- </select><br /><br />
- <textarea>textarea</textarea><br />
-</form>
-</div><!-- End sample page content -->
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The basic dialog window is an overlay positioned within the viewport and is protected from page content (like select elements) shining through with an iframe. It has a title bar and a content area, and can be moved, resized and closed with the 'x' icon by default.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Modal confirmation</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
- $( "#dialog:ui-dialog" ).dialog( "destroy" );
-
- $( "#dialog-confirm" ).dialog({
- resizable: false,
- height:140,
- modal: true,
- buttons: {
- "Delete all items": function() {
- $( this ).dialog( "close" );
- },
- Cancel: function() {
- $( this ).dialog( "close" );
- }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog-confirm" title="Empty the recycle bin?">
- <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
-</div>
-
-<!-- Sample page content to illustrate the layering of the dialog -->
-<div class="hiddenInViewSource" style="padding:20px;">
- <p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
- <form>
- <input value="text input" /><br />
- <input type="checkbox" />checkbox<br />
- <input type="radio" />radio<br />
- <select>
- <option>select</option>
- </select><br /><br />
- <textarea>textarea</textarea><br />
- </form>
-</div><!-- End sample page content -->
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Confirm an action that may be destructive or important. Set the <code>modal</code> option to true, and specify primary and secondary user actions with the <code>buttons</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Modal form</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- body { font-size: 62.5%; }
- label, input { display:block; }
- input.text { margin-bottom:12px; width:95%; padding: .4em; }
- fieldset { padding:0; border:0; margin-top:25px; }
- h1 { font-size: 1.2em; margin: .6em 0; }
- div#users-contain { width: 350px; margin: 20px 0; }
- div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
- div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
- .ui-dialog .ui-state-error { padding: .3em; }
- .validateTips { border: 1px solid transparent; padding: 0.3em; }
- </style>
- <script>
- $(function() {
- // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
- $( "#dialog:ui-dialog" ).dialog( "destroy" );
-
- var name = $( "#name" ),
- email = $( "#email" ),
- password = $( "#password" ),
- allFields = $( [] ).add( name ).add( email ).add( password ),
- tips = $( ".validateTips" );
-
- function updateTips( t ) {
- tips
- .text( t )
- .addClass( "ui-state-highlight" );
- setTimeout(function() {
- tips.removeClass( "ui-state-highlight", 1500 );
- }, 500 );
- }
-
- function checkLength( o, n, min, max ) {
- if ( o.val().length > max || o.val().length < min ) {
- o.addClass( "ui-state-error" );
- updateTips( "Length of " + n + " must be between " +
- min + " and " + max + "." );
- return false;
- } else {
- return true;
- }
- }
-
- function checkRegexp( o, regexp, n ) {
- if ( !( regexp.test( o.val() ) ) ) {
- o.addClass( "ui-state-error" );
- updateTips( n );
- return false;
- } else {
- return true;
- }
- }
-
- $( "#dialog-form" ).dialog({
- autoOpen: false,
- height: 300,
- width: 350,
- modal: true,
- buttons: {
- "Create an account": function() {
- var bValid = true;
- allFields.removeClass( "ui-state-error" );
-
- bValid = bValid && checkLength( name, "username", 3, 16 );
- bValid = bValid && checkLength( email, "email", 6, 80 );
- bValid = bValid && checkLength( password, "password", 5, 16 );
-
- bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Username may consist of a-z, 0-9, underscores, begin with a letter." );
- // From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email_address_validation/
- bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. ui@jquery.com" );
- bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9" );
-
- if ( bValid ) {
- $( "#users tbody" ).append( "<tr>" +
- "<td>" + name.val() + "</td>" +
- "<td>" + email.val() + "</td>" +
- "<td>" + password.val() + "</td>" +
- "</tr>" );
- $( this ).dialog( "close" );
- }
- },
- Cancel: function() {
- $( this ).dialog( "close" );
- }
- },
- close: function() {
- allFields.val( "" ).removeClass( "ui-state-error" );
- }
- });
-
- $( "#create-user" )
- .button()
- .click(function() {
- $( "#dialog-form" ).dialog( "open" );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog-form" title="Create new user">
- <p class="validateTips">All form fields are required.</p>
-
- <form>
- <fieldset>
- <label for="name">Name</label>
- <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
- <label for="email">Email</label>
- <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
- <label for="password">Password</label>
- <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
- </fieldset>
- </form>
-</div>
-
-
-<div id="users-contain" class="ui-widget">
- <h1>Existing Users:</h1>
- <table id="users" class="ui-widget ui-widget-content">
- <thead>
- <tr class="ui-widget-header ">
- <th>Name</th>
- <th>Email</th>
- <th>Password</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>John Doe</td>
- <td>john.doe@example.com</td>
- <td>johndoe1</td>
- </tr>
- </tbody>
- </table>
-</div>
-<button id="create-user">Create new user</button>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Use a modal dialog to require that the user enter data during a multi-step process. Embed form markup in the content area, set the <code>modal</code> option to true, and specify primary and secondary user actions with the <code>buttons</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Modal message</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
- $( "#dialog:ui-dialog" ).dialog( "destroy" );
-
- $( "#dialog-message" ).dialog({
- modal: true,
- buttons: {
- Ok: function() {
- $( this ).dialog( "close" );
- }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog-message" title="Download complete">
- <p>
- <span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
- Your files have downloaded successfully into the My Downloads folder.
- </p>
- <p>
- Currently using <b>36% of your storage space</b>.
- </p>
-</div>
-
-<!-- Sample page content to illustrate the layering of the dialog -->
-<div class="hiddenInViewSource" style="padding:20px;">
- <p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
- <form>
- <input value="text input" /><br />
- <input type="checkbox" />checkbox<br />
- <input type="radio" />radio<br />
- <select>
- <option>select</option>
- </select><br /><br />
- <textarea>textarea</textarea><br />
- </form>
-</div><!-- End sample page content -->
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Use a modal dialog to explicitly acknowledge information or an action before continuing their work. Set the <code>modal</code> option to true, and specify a primary action (Ok) with the <code>buttons</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Dialog - Basic modal</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
- $( "#dialog:ui-dialog" ).dialog( "destroy" );
-
- $( "#dialog-modal" ).dialog({
- height: 140,
- modal: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="dialog-modal" title="Basic modal dialog">
- <p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>
-</div>
-
-<!-- Sample page content to illustrate the layering of the dialog -->
-<div class="hiddenInViewSource" style="padding:20px;">
- <p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
- <form>
- <input value="text input" /><br />
- <input type="checkbox" />checkbox<br />
- <input type="radio" />radio<br />
- <select>
- <option>select</option>
- </select><br /><br />
- <textarea>textarea</textarea><br />
- </form>
-</div><!-- End sample page content -->
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A modal dialog prevents the user from interacting with the rest of the page until it is closed.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Constrain movement</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .draggable { width: 90px; height: 90px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- #draggable, #draggable2 { margin-bottom:20px; }
- #draggable { cursor: n-resize; }
- #draggable2 { cursor: e-resize; }
- #containment-wrapper { width: 95%; height:150px; border:2px solid #ccc; padding: 10px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ axis: "y" });
- $( "#draggable2" ).draggable({ axis: "x" });
-
- $( "#draggable3" ).draggable({ containment: "#containment-wrapper", scroll: false });
- $( "#draggable4" ).draggable({ containment: "#demo-frame" });
- $( "#draggable5" ).draggable({ containment: "parent" });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<h3 class="docs">Constrain movement along an axis:</h3>
-
-<div id="draggable" class="draggable ui-widget-content">
- <p>I can be dragged only vertically</p>
-</div>
-
-<div id="draggable2" class="draggable ui-widget-content">
- <p>I can be dragged only horizontally</p>
-</div>
-
-<h3 class="docs">Or to within another DOM element:</h3>
-<div id="containment-wrapper">
-<div id="draggable3" class="draggable ui-widget-content">
- <p>I'm contained within the box</p>
-</div>
-
-<div id="draggable4" class="draggable ui-widget-content">
- <p>I'm contained within the box's parent</p>
-</div>
-
-<div class="draggable ui-widget-content">
- <p id="draggable5" class="ui-widget-header">I'm contained within my parent</p>
-</div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Constrain the movement of each draggable by defining the boundaries of the draggable area. Set the <code>axis</code> option to limit the draggable's path to the x- or y-axis, or use the <code>containment</code> option to specify a parent DOM element or a jQuery selector, like 'document.'</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Cursor style</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2, #draggable3 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ cursor: "move", cursorAt: { top: 56, left: 56 } });
- $( "#draggable2" ).draggable({ cursor: "crosshair", cursorAt: { top: -5, left: -5 } });
- $( "#draggable3" ).draggable({ cursorAt: { bottom: 0 } });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>I will always stick to the center (relative to the mouse)</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>My cursor is at left -5 and top -5</p>
-</div>
-
-<div id="draggable3" class="ui-widget-content">
- <p>My cursor position is only controlled for the 'bottom' value</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Position the cursor while dragging the object. By default the cursor appears in the center of the dragged object; use the <code>cursorAt</code> option to specify another location relative to the draggable (specify a pixel value from the top, right, bottom, and/or left). Customize the cursor's appearance by supplying the <code>cursor</code> option with a valid CSS cursor value: default, move, pointer, crosshair, etc.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable { width: 150px; height: 150px; padding: 0.5em; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me around</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Enable draggable functionality on any DOM element. Move the draggable object by clicking on it with the mouse and dragging it anywhere within the viewport.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Delay start</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2 { width: 120px; height: 120px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ distance: 20 });
- $( "#draggable2" ).draggable({ delay: 1000 });
- $( ".ui-draggable" ).disableSelection();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Only if you drag me by 20 pixels, the dragging will start</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>Regardless of the distance, you have to drag and wait for 1000ms before dragging starts</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Delay the start of dragging for a number of milliseconds with the <code>delay</code> option; prevent dragging until the cursor is held down and dragged a specifed number of pixels with the <code>distance</code> option. </p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Events</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable { width: 16em; padding: 0 1em; }
- #draggable ul li { margin: 1em 0; padding: 0.5em 0; } * html #draggable ul li { height: 1%; }
- #draggable ul li span.ui-icon { float: left; }
- #draggable ul li span.count { font-weight: bold; }
- </style>
- <script>
- $(function() {
- var $start_counter = $( "#event-start" ),
- $drag_counter = $( "#event-drag" ),
- $stop_counter = $( "#event-stop" ),
- counts = [ 0, 0, 0 ];
-
- $( "#draggable" ).draggable({
- start: function() {
- counts[ 0 ]++;
- updateCounterStatus( $start_counter, counts[ 0 ] );
- },
- drag: function() {
- counts[ 1 ]++;
- updateCounterStatus( $drag_counter, counts[ 1 ] );
- },
- stop: function() {
- counts[ 2 ]++;
- updateCounterStatus( $stop_counter, counts[ 2 ] );
- }
- });
-
- function updateCounterStatus( $event_counter, new_count ) {
- // first update the status visually...
- if ( !$event_counter.hasClass( "ui-state-hover" ) ) {
- $event_counter.addClass( "ui-state-hover" )
- .siblings().removeClass( "ui-state-hover" );
- }
- // ...then update the numbers
- $( "span.count", $event_counter ).text( new_count );
- }
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget ui-widget-content">
-
- <p>Drag me to trigger the chain of events.</p>
-
- <ul class="ui-helper-reset">
- <li id="event-start" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-play"></span>"start" invoked <span class="count">0</span>x</li>
- <li id="event-drag" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-arrow-4"></span>"drag" invoked <span class="count">0</span>x</li>
- <li id="event-stop" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-stop"></span>"stop" invoked <span class="count">0</span>x</li>
- </ul>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Layer functionality onto the draggable using the <code>start</code>, <code>drag</code>, and <code>stop</code> events. Start is fired at the start of the drag; drag during the drag; and stop when dragging stops.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Handles</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- #draggable p { cursor: move; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ handle: "p" });
- $( "#draggable2" ).draggable({ cancel: "p.ui-widget-header" });
- $( "div, p" ).disableSelection();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p class="ui-widget-header">I can be dragged only by this handle</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>You can drag me around…</p>
- <p class="ui-widget-header">…but you can't drag me by this handle.</p>
-</div>
-
-<!-- ADD CANCEL DEMO -->
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Allow dragging only when the cursor is over a specific part of the draggable. Use the <code>handle</code> option to specify the jQuery selector of an element (or group of elements) used to drag the object.</p>
-<p>Or prevent dragging when the cursor is over a specific element (or group of elements) within the draggable. Use the <code>cancel</code> option to specify a jQuery selector over which to "cancel" draggable functionality.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Revert position</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ revert: true });
- $( "#draggable2" ).draggable({ revert: true, helper: "clone" });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Revert the original</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>Revert the helper</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Return the draggable (or it's helper) to its original location when dragging stops with the boolean <code>revert</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Auto-scroll</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2, #draggable3 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ scroll: true });
- $( "#draggable2" ).draggable({ scroll: true, scrollSensitivity: 100 });
- $( "#draggable3" ).draggable({ scroll: true, scrollSpeed: 100 });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Scroll set to true, default settings</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>scrollSensitivity set to 100</p>
-</div>
-
-<div id="draggable3" class="ui-widget-content">
- <p>scrollSpeed set to 100</p>
-</div>
-
-<div style='height: 5000px; width: 1px;'></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Automatically scroll the document when the draggable is moved beyond the viewport. Set the <code>scroll</code> option to true to enable auto-scrolling, and fine-tune when scrolling is triggered and its speed with the <code>scrollSensitivity</code> and <code>scrollSpeed</code> options.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Snap to element or grid</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .draggable { width: 90px; height: 80px; padding: 5px; float: left; margin: 0 10px 10px 0; font-size: .9em; }
- .ui-widget-header p, .ui-widget-content p { margin: 0; }
- #snaptarget { height: 140px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ snap: true });
- $( "#draggable2" ).draggable({ snap: ".ui-widget-header" });
- $( "#draggable3" ).draggable({ snap: ".ui-widget-header", snapMode: "outer" });
- $( "#draggable4" ).draggable({ grid: [ 20,20 ] });
- $( "#draggable5" ).draggable({ grid: [ 80, 80 ] });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="snaptarget" class="ui-widget-header">
- <p>I'm a snap target</p>
-</div>
-
-<br clear="both" />
-
-<div id="draggable" class="draggable ui-widget-content">
- <p>Default (snap: true), snaps to all other draggable elements</p>
-</div>
-
-<div id="draggable2" class="draggable ui-widget-content">
- <p>I only snap to the big box</p>
-</div>
-
-<div id="draggable3" class="draggable ui-widget-content">
- <p>I only snap to the outer edges of the big box</p>
-</div>
-
-<div id="draggable4" class="draggable ui-widget-content">
- <p>I snap to a 20 x 20 grid</p>
-</div>
-
-<div id="draggable5" class="draggable ui-widget-content">
- <p>I snap to a 80 x 80 grid</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Snap the draggable to the inner or outer boundaries of a DOM element. Use the <code>snap</code>, <code>snapMode</code> (inner, outer, both), and <code>snapTolerance</code> (distance in pixels the draggable must be from the element when snapping is invoked) options. </p>
-<p>Or snap the draggable to a grid. Set the dimensions of grid cells (height and width in pixels) with the <code>grid</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable + Sortable</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .demo ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
- .demo li { margin: 5px; padding: 5px; width: 150px; }
- </style>
- <script>
- $(function() {
- $( "#sortable" ).sortable({
- revert: true
- });
- $( "#draggable" ).draggable({
- connectToSortable: "#sortable",
- helper: "clone",
- revert: "invalid"
- });
- $( "ul, li" ).disableSelection();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<ul>
- <li id="draggable" class="ui-state-highlight">Drag me down</li>
-</ul>
-
-<ul id="sortable">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Draggables are built to interact seamlessly with <a href="#">sortables</a>.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Draggable - Visual feedback</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2, #draggable3, #set div { width: 90px; height: 90px; padding: 0.5em; float: left; margin: 0 10px 10px 0; }
- #draggable, #draggable2, #draggable3 { margin-bottom:20px; }
- #set { clear:both; float:left; width: 368px; height: 120px; }
- p { clear:both; margin:0; padding:1em 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ helper: "original" });
- $( "#draggable2" ).draggable({ opacity: 0.7, helper: "clone" });
- $( "#draggable3" ).draggable({
- cursor: "move",
- cursorAt: { top: -12, left: -20 },
- helper: function( event ) {
- return $( "<div class='ui-widget-header'>I'm a custom helper</div>" );
- }
- });
- $( "#set div" ).draggable({ stack: "#set div" });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<h3 class="docs">With helpers:</h3>
-
-<div id="draggable" class="ui-widget-content">
- <p>Original</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>Semi-transparent clone</p>
-</div>
-
-<div id="draggable3" class="ui-widget-content">
- <p>Custom helper (in combination with cursorAt)</p>
-</div>
-
-<h3 class="docs">Stacked:</h3>
-<div id="set">
- <div class="ui-widget-content">
- <p>We are draggables..</p>
- </div>
-
- <div class="ui-widget-content">
- <p>..whose z-indexes are controlled automatically..</p>
- </div>
-
- <div class="ui-widget-content">
- <p>..with the stack option.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Provide feedback to users as they drag an object in the form of a helper. The <code>helper</code> option accepts the values 'original' (the draggable object moves with the cursor), 'clone' (a duplicate of the draggable moves with the cursor), or a function that returns a DOM element (that element is shown near the cursor during drag). Control the helper's transparency with the <code>opacity</code> option.</p>
-<p>To clarify which draggable is in play, bring the draggable in motion to front. Use the <code>zIndex</code> option to set a higher z-index for the helper, if in play, or use the <code>stack</code> option to ensure that the last item dragged will appear on top of others in the same group on drag stop.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Accept</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
- #draggable, #draggable-nonvalid { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
- </style>
- <script>
- $(function() {
- $( "#draggable, #draggable-nonvalid" ).draggable();
- $( "#droppable" ).droppable({
- accept: "#draggable",
- activeClass: "ui-state-hover",
- hoverClass: "ui-state-active",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "p" )
- .html( "Dropped!" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable-nonvalid" class="ui-widget-content">
- <p>I'm draggable but can't be dropped</p>
-</div>
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me to my target</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>accept: '#draggable'</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Specify using the <code>accept</code> option which element (or group of elements) is accepted by the target droppable.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
- #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable();
- $( "#droppable" ).droppable({
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "p" )
- .html( "Dropped!" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me to my target</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>Drop here</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Enable any DOM element to be droppable, a target for draggable elements.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Simple photo manager</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #gallery { float: left; width: 65%; min-height: 12em; } * html #gallery { height: 12em; } /* IE6 */
- .gallery.custom-state-active { background: #eee; }
- .gallery li { float: left; width: 96px; padding: 0.4em; margin: 0 0.4em 0.4em 0; text-align: center; }
- .gallery li h5 { margin: 0 0 0.4em; cursor: move; }
- .gallery li a { float: right; }
- .gallery li a.ui-icon-zoomin { float: left; }
- .gallery li img { width: 100%; cursor: move; }
-
- #trash { float: right; width: 32%; min-height: 18em; padding: 1%;} * html #trash { height: 18em; } /* IE6 */
- #trash h4 { line-height: 16px; margin: 0 0 0.4em; }
- #trash h4 .ui-icon { float: left; }
- #trash .gallery h5 { display: none; }
- </style>
- <script>
- $(function() {
- // there's the gallery and the trash
- var $gallery = $( "#gallery" ),
- $trash = $( "#trash" );
-
- // let the gallery items be draggable
- $( "li", $gallery ).draggable({
- cancel: "a.ui-icon", // clicking an icon won't initiate dragging
- revert: "invalid", // when not dropped, the item will revert back to its initial position
- containment: $( "#demo-frame" ).length ? "#demo-frame" : "document", // stick to demo-frame if present
- helper: "clone",
- cursor: "move"
- });
-
- // let the trash be droppable, accepting the gallery items
- $trash.droppable({
- accept: "#gallery > li",
- activeClass: "ui-state-highlight",
- drop: function( event, ui ) {
- deleteImage( ui.draggable );
- }
- });
-
- // let the gallery be droppable as well, accepting items from the trash
- $gallery.droppable({
- accept: "#trash li",
- activeClass: "custom-state-active",
- drop: function( event, ui ) {
- recycleImage( ui.draggable );
- }
- });
-
- // image deletion function
- var recycle_icon = "<a href='link/to/recycle/script/when/we/have/js/off' title='Recycle this image' class='ui-icon ui-icon-refresh'>Recycle image</a>";
- function deleteImage( $item ) {
- $item.fadeOut(function() {
- var $list = $( "ul", $trash ).length ?
- $( "ul", $trash ) :
- $( "<ul class='gallery ui-helper-reset'/>" ).appendTo( $trash );
-
- $item.find( "a.ui-icon-trash" ).remove();
- $item.append( recycle_icon ).appendTo( $list ).fadeIn(function() {
- $item
- .animate({ width: "48px" })
- .find( "img" )
- .animate({ height: "36px" });
- });
- });
- }
-
- // image recycle function
- var trash_icon = "<a href='link/to/trash/script/when/we/have/js/off' title='Delete this image' class='ui-icon ui-icon-trash'>Delete image</a>";
- function recycleImage( $item ) {
- $item.fadeOut(function() {
- $item
- .find( "a.ui-icon-refresh" )
- .remove()
- .end()
- .css( "width", "96px")
- .append( trash_icon )
- .find( "img" )
- .css( "height", "72px" )
- .end()
- .appendTo( $gallery )
- .fadeIn();
- });
- }
-
- // image preview function, demonstrating the ui.dialog used as a modal window
- function viewLargerImage( $link ) {
- var src = $link.attr( "href" ),
- title = $link.siblings( "img" ).attr( "alt" ),
- $modal = $( "img[src$='" + src + "']" );
-
- if ( $modal.length ) {
- $modal.dialog( "open" );
- } else {
- var img = $( "<img alt='" + title + "' width='384' height='288' style='display: none; padding: 8px;' />" )
- .attr( "src", src ).appendTo( "body" );
- setTimeout(function() {
- img.dialog({
- title: title,
- width: 400,
- modal: true
- });
- }, 1 );
- }
- }
-
- // resolve the icons behavior with event delegation
- $( "ul.gallery > li" ).click(function( event ) {
- var $item = $( this ),
- $target = $( event.target );
-
- if ( $target.is( "a.ui-icon-trash" ) ) {
- deleteImage( $item );
- } else if ( $target.is( "a.ui-icon-zoomin" ) ) {
- viewLargerImage( $target );
- } else if ( $target.is( "a.ui-icon-refresh" ) ) {
- recycleImage( $item );
- }
-
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo ui-widget ui-helper-clearfix">
-
-<ul id="gallery" class="gallery ui-helper-reset ui-helper-clearfix">
- <li class="ui-widget-content ui-corner-tr">
- <h5 class="ui-widget-header">High Tatras</h5>
- <img src="images/high_tatras_min.jpg" alt="The peaks of High Tatras" width="96" height="72" />
- <a href="images/high_tatras.jpg" title="View larger image" class="ui-icon ui-icon-zoomin">View larger</a>
- <a href="link/to/trash/script/when/we/have/js/off" title="Delete this image" class="ui-icon ui-icon-trash">Delete image</a>
- </li>
- <li class="ui-widget-content ui-corner-tr">
- <h5 class="ui-widget-header">High Tatras 2</h5>
- <img src="images/high_tatras2_min.jpg" alt="The chalet at the Green mountain lake" width="96" height="72" />
- <a href="images/high_tatras2.jpg" title="View larger image" class="ui-icon ui-icon-zoomin">View larger</a>
- <a href="link/to/trash/script/when/we/have/js/off" title="Delete this image" class="ui-icon ui-icon-trash">Delete image</a>
- </li>
- <li class="ui-widget-content ui-corner-tr">
- <h5 class="ui-widget-header">High Tatras 3</h5>
- <img src="images/high_tatras3_min.jpg" alt="Planning the ascent" width="96" height="72" />
- <a href="images/high_tatras3.jpg" title="View larger image" class="ui-icon ui-icon-zoomin">View larger</a>
- <a href="link/to/trash/script/when/we/have/js/off" title="Delete this image" class="ui-icon ui-icon-trash">Delete image</a>
- </li>
- <li class="ui-widget-content ui-corner-tr">
- <h5 class="ui-widget-header">High Tatras 4</h5>
- <img src="images/high_tatras4_min.jpg" alt="On top of Kozi kopka" width="96" height="72" />
- <a href="images/high_tatras4.jpg" title="View larger image" class="ui-icon ui-icon-zoomin">View larger</a>
- <a href="link/to/trash/script/when/we/have/js/off" title="Delete this image" class="ui-icon ui-icon-trash">Delete image</a>
- </li>
-</ul>
-
-<div id="trash" class="ui-widget-content ui-state-default">
- <h4 class="ui-widget-header"><span class="ui-icon ui-icon-trash">Trash</span> Trash</h4>
-</div>
-
-</div><!-- End demo -->
-
-
-<div class="demo-description">
-<p>You can delete an image either by dragging it to the Trash or by clicking the trash icon.</p>
-<p>You can "recycle" an image by dragging it back to the gallery or by clicking the recycle icon.</p>
-<p>You can view larger image by clicking the zoom icon. jQuery UI dialog widget is used for the modal window.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Prevent propagation</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable { width: 100px; height: 40px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
- #droppable, #droppable2 { width: 230px; height: 120px; padding: 0.5em; float: left; margin: 10px; }
- #droppable-inner, #droppable2-inner { width: 170px; height: 60px; padding: 0.5em; float: left; margin: 10px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable();
-
- $( "#droppable, #droppable-inner" ).droppable({
- activeClass: "ui-state-hover",
- hoverClass: "ui-state-active",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "> p" )
- .html( "Dropped!" );
- return false;
- }
- });
-
- $( "#droppable2, #droppable2-inner" ).droppable({
- greedy: true,
- activeClass: "ui-state-hover",
- hoverClass: "ui-state-active",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "> p" )
- .html( "Dropped!" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me to my target</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>Outer droppable</p>
- <div id="droppable-inner" class="ui-widget-header">
- <p>Inner droppable (not greedy)</p>
- </div>
-</div>
-
-<div id="droppable2" class="ui-widget-header">
- <p>Outer droppable</p>
- <div id="droppable2-inner" class="ui-widget-header">
- <p>Inner droppable (greedy)</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>When working with nested droppables — for example, you may have an editable directory structure displayed as a tree, with folder and document nodes — the <code>greedy</code> option set to true prevents event propagation when a draggable is dropped on a child node (droppable).</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Revert draggable position</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2 { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
- #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable({ revert: "valid" });
- $( "#draggable2" ).draggable({ revert: "invalid" });
-
- $( "#droppable" ).droppable({
- activeClass: "ui-state-hover",
- hoverClass: "ui-state-active",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "p" )
- .html( "Dropped!" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="draggable" class="ui-widget-content">
- <p>I revert when I'm dropped</p>
-</div>
-
-<div id="draggable2" class="ui-widget-content">
- <p>I revert when I'm not dropped</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>Drop me here</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Return the draggable (or it's helper) to its original location when dragging stops with the boolean <code>revert</code> option set on the draggable.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Shopping Cart Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <script src="../../ui/jquery.ui.accordion.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- h1 { padding: .2em; margin: 0; }
- #products { float:left; width: 500px; margin-right: 2em; }
- #cart { width: 200px; float: left; }
- /* style the list to maximize the droppable hitarea */
- #cart ol { margin: 0; padding: 1em 0 1em 3em; }
- </style>
- <script>
- $(function() {
- $( "#catalog" ).accordion();
- $( "#catalog li" ).draggable({
- appendTo: "body",
- helper: "clone"
- });
- $( "#cart ol" ).droppable({
- activeClass: "ui-state-default",
- hoverClass: "ui-state-hover",
- accept: ":not(.ui-sortable-helper)",
- drop: function( event, ui ) {
- $( this ).find( ".placeholder" ).remove();
- $( "<li></li>" ).text( ui.draggable.text() ).appendTo( this );
- }
- }).sortable({
- items: "li:not(.placeholder)",
- sort: function() {
- // gets added unintentionally by droppable interacting with sortable
- // using connectWithSortable fixes this, but doesn't allow you to customize active/hoverClass options
- $( this ).removeClass( "ui-state-default" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="products">
- <h1 class="ui-widget-header">Products</h1>
- <div id="catalog">
- <h3><a href="#">T-Shirts</a></h3>
- <div>
- <ul>
- <li>Lolcat Shirt</li>
- <li>Cheezeburger Shirt</li>
- <li>Buckit Shirt</li>
- </ul>
- </div>
- <h3><a href="#">Bags</a></h3>
- <div>
- <ul>
- <li>Zebra Striped</li>
- <li>Black Leather</li>
- <li>Alligator Leather</li>
- </ul>
- </div>
- <h3><a href="#">Gadgets</a></h3>
- <div>
- <ul>
- <li>iPhone</li>
- <li>iPod</li>
- <li>iPad</li>
- </ul>
- </div>
- </div>
-</div>
-
-<div id="cart">
- <h1 class="ui-widget-header">Shopping Cart</h1>
- <div class="ui-widget-content">
- <ol>
- <li class="placeholder">Add your items here</li>
- </ol>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Demonstrate how to use an accordion to structure products into a catalog and make use drag and drop for adding them to a shopping cart, where they are sortable.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Droppable - Visual feedback</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #draggable, #draggable2 { width: 90px; height: 90px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; }
- #droppable, #droppable2 { width: 120px; height: 120px; padding: 0.5em; float: left; margin: 10px; }
- </style>
- <script>
- $(function() {
- $( "#draggable" ).draggable();
- $( "#droppable" ).droppable({
- hoverClass: "ui-state-active",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "p" )
- .html( "Dropped!" );
- }
- });
-
- $( "#draggable2" ).draggable();
- $( "#droppable2" ).droppable({
- accept: "#draggable2",
- activeClass: "ui-state-hover",
- drop: function( event, ui ) {
- $( this )
- .addClass( "ui-state-highlight" )
- .find( "p" )
- .html( "Dropped!" );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<h3 class="docs">Feedback on hover:</h3>
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me to my target</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>Drop here</p>
-</div>
-
-<h3 class="docs">Feedback on activating draggable:</h3>
-
-<div id="draggable2" class="ui-widget-content">
- <p>Drag me to my target</p>
-</div>
-
-<div id="droppable2" class="ui-widget-header">
- <p>Drop here</p>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Change the droppable's appearance on hover, or when the droppable is active (an acceptable draggable is dropped on it). Use the <code>hoverClass</code> or <code>activeClass</code> options to specify respective classes.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Effect demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.bounce.js"></script>
- <script src="../../ui/jquery.effects.clip.js"></script>
- <script src="../../ui/jquery.effects.drop.js"></script>
- <script src="../../ui/jquery.effects.explode.js"></script>
- <script src="../../ui/jquery.effects.fade.js"></script>
- <script src="../../ui/jquery.effects.fold.js"></script>
- <script src="../../ui/jquery.effects.highlight.js"></script>
- <script src="../../ui/jquery.effects.pulsate.js"></script>
- <script src="../../ui/jquery.effects.scale.js"></script>
- <script src="../../ui/jquery.effects.shake.js"></script>
- <script src="../../ui/jquery.effects.slide.js"></script>
- <script src="../../ui/jquery.effects.transfer.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- .ui-effects-transfer { border: 2px dotted gray; }
- </style>
- <script>
- $(function() {
- // run the currently selected effect
- function runEffect() {
- // get effect type from
- var selectedEffect = $( "#effectTypes" ).val();
-
- // most effect types need no options passed by default
- var options = {};
- // some effects have required parameters
- if ( selectedEffect === "scale" ) {
- options = { percent: 0 };
- } else if ( selectedEffect === "transfer" ) {
- options = { to: "#button", className: "ui-effects-transfer" };
- } else if ( selectedEffect === "size" ) {
- options = { to: { width: 200, height: 60 } };
- }
-
- // run the effect
- $( "#effect" ).effect( selectedEffect, options, 500, callback );
- };
-
- // callback function to bring a hidden box back
- function callback() {
- setTimeout(function() {
- $( "#effect" ).removeAttr( "style" ).hide().fadeIn();
- }, 1000 );
- };
-
- // set effect from select menu value
- $( "#button" ).click(function() {
- runEffect();
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Effect</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<select name="effects" id="effectTypes">
- <option value="blind">Blind</option>
- <option value="bounce">Bounce</option>
- <option value="clip">Clip</option>
- <option value="drop">Drop</option>
- <option value="explode">Explode</option>
- <option value="fade">Fade</option>
- <option value="fold">Fold</option>
- <option value="highlight">Highlight</option>
- <option value="puff">Puff</option>
- <option value="pulsate">Pulsate</option>
- <option value="scale">Scale</option>
- <option value="shake">Shake</option>
- <option value="size">Size</option>
- <option value="slide">Slide</option>
- <option value="transfer">Transfer</option>
-</select>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to show the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Easing demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .graph {
- float: left;
- margin-left: 10px;
- }
- </style>
- <script>
- $(function() {
- if ( !$( "<canvas>" )[0].getContext ) {
- $( "<div>" ).text(
- "Your browser doesn't support canvas, which is required for this demo."
- ).appendTo( "#graphs" );
- return;
- }
-
- var i = 0,
- width = 100,
- height = 100;
-
- $.each( $.easing, function( name, impl ) {
- var graph = $( "<div>" ).addClass( "graph" ).appendTo( "#graphs" ),
- text = $( "<div>" ).text( ++i + ". " + name ).appendTo( graph ),
- wrap = $( "<div>" ).appendTo( graph ).css( 'overflow', 'hidden' ),
- canvas = $( "<canvas>" ).appendTo( wrap )[ 0 ];
-
- canvas.width = width;
- canvas.height = height;
- var drawHeight = height * 0.8,
- cradius = 10;
- ctx = canvas.getContext( "2d" );
- ctx.fillStyle = "black";
-
- // draw background
- ctx.beginPath();
- ctx.moveTo( cradius, 0 );
- ctx.quadraticCurveTo( 0, 0, 0, cradius );
- ctx.lineTo( 0, height - cradius );
- ctx.quadraticCurveTo( 0, height, cradius, height );
- ctx.lineTo( width - cradius, height );
- ctx.quadraticCurveTo( width, height, width, height - cradius );
- ctx.lineTo( width, 0 );
- ctx.lineTo( cradius, 0 );
- ctx.fill();
-
- // draw bottom line
- ctx.strokeStyle = "#555";
- ctx.beginPath();
- ctx.moveTo( width * 0.1, drawHeight + .5 );
- ctx.lineTo( width * 0.9, drawHeight + .5 );
- ctx.stroke();
-
- // draw top line
- ctx.strokeStyle = "#555";
- ctx.beginPath();
- ctx.moveTo( width * 0.1, drawHeight * .3 - .5 );
- ctx.lineTo( width * 0.9, drawHeight * .3 - .5 );
- ctx.stroke();
-
- // plot easing
- ctx.strokeStyle = "white";
- ctx.beginPath();
- ctx.lineWidth = 2;
- ctx.moveTo( width * 0.1, drawHeight );
- $.each( new Array( width ), function( position ) {
- var state = position / width,
- val = impl( state, position, 0, 1, width );
- ctx.lineTo( position * 0.8 + width * 0.1,
- drawHeight - drawHeight * val * 0.7 );
- });
- ctx.stroke();
-
- // animate on click
- graph.click(function() {
- wrap
- .animate( { height: "hide" }, 2000, name )
- .delay( 800 )
- .animate( { height: "show" }, 2000, name );
- });
-
- graph.width( width ).height( height + text.height() + 10 );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="graphs"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p><strong>All easings provided by jQuery UI are drawn above, using a HTML canvas element</strong>. Click a diagram to see the easing in action.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Hide Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.bounce.js"></script>
- <script src="../../ui/jquery.effects.clip.js"></script>
- <script src="../../ui/jquery.effects.drop.js"></script>
- <script src="../../ui/jquery.effects.explode.js"></script>
- <script src="../../ui/jquery.effects.fold.js"></script>
- <script src="../../ui/jquery.effects.highlight.js"></script>
- <script src="../../ui/jquery.effects.pulsate.js"></script>
- <script src="../../ui/jquery.effects.scale.js"></script>
- <script src="../../ui/jquery.effects.shake.js"></script>
- <script src="../../ui/jquery.effects.slide.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script>
- $(function() {
- // run the currently selected effect
- function runEffect() {
- // get effect type from
- var selectedEffect = $( "#effectTypes" ).val();
-
- // most effect types need no options passed by default
- var options = {};
- // some effects have required parameters
- if ( selectedEffect === "scale" ) {
- options = { percent: 0 };
- } else if ( selectedEffect === "size" ) {
- options = { to: { width: 200, height: 60 } };
- }
-
- // run the effect
- $( "#effect" ).hide( selectedEffect, options, 1000, callback );
- };
-
- // callback function to bring a hidden box back
- function callback() {
- setTimeout(function() {
- $( "#effect" ).removeAttr( "style" ).hide().fadeIn();
- }, 1000 );
- };
-
- // set effect from select menu value
- $( "#button" ).click(function() {
- runEffect();
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Hide</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<select name="effects" id="effectTypes">
- <option value="blind">Blind</option>
- <option value="bounce">Bounce</option>
- <option value="clip">Clip</option>
- <option value="drop">Drop</option>
- <option value="explode">Explode</option>
- <option value="fold">Fold</option>
- <option value="highlight">Highlight</option>
- <option value="puff">Puff</option>
- <option value="pulsate">Pulsate</option>
- <option value="scale">Scale</option>
- <option value="shake">Shake</option>
- <option value="size">Size</option>
- <option value="slide">Slide</option>
-</select>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Demos</title>
- <link rel="stylesheet" href="../themes/base/jquery.ui.all.css">
- <link rel="stylesheet" href="demos.css">
- <script src="../jquery-1.8.2.js"></script>
- <script src="../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../ui/jquery.ui.core.js"></script>
- <script src="../ui/jquery.ui.widget.js"></script>
- <script src="../ui/jquery.ui.mouse.js"></script>
- <script src="../ui/jquery.ui.accordion.js"></script>
- <script src="../ui/jquery.ui.autocomplete.js"></script>
- <script src="../ui/jquery.ui.button.js"></script>
- <script src="../ui/jquery.ui.datepicker.js"></script>
- <script src="../ui/jquery.ui.dialog.js"></script>
- <script src="../ui/jquery.ui.draggable.js"></script>
- <script src="../ui/jquery.ui.droppable.js"></script>
- <script src="../ui/jquery.ui.position.js"></script>
- <script src="../ui/jquery.ui.progressbar.js"></script>
- <script src="../ui/jquery.ui.resizable.js"></script>
- <script src="../ui/jquery.ui.selectable.js"></script>
- <script src="../ui/jquery.ui.slider.js"></script>
- <script src="../ui/jquery.ui.sortable.js"></script>
- <script src="../ui/jquery.ui.tabs.js"></script>
- <script src="../ui/jquery.effects.core.js"></script>
- <script src="../ui/jquery.effects.blind.js"></script>
- <script src="../ui/jquery.effects.bounce.js"></script>
- <script src="../ui/jquery.effects.clip.js"></script>
- <script src="../ui/jquery.effects.drop.js"></script>
- <script src="../ui/jquery.effects.explode.js"></script>
- <script src="../ui/jquery.effects.fold.js"></script>
- <script src="../ui/jquery.effects.highlight.js"></script>
- <script src="../ui/jquery.effects.pulsate.js"></script>
- <script src="../ui/jquery.effects.scale.js"></script>
- <script src="../ui/jquery.effects.shake.js"></script>
- <script src="../ui/jquery.effects.slide.js"></script>
- <script src="../ui/jquery.effects.transfer.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-af.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ar.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ar-DZ.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-az.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-bs.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-bg.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ca.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-cs.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-cy-GB.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-da.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-de.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-el.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-en-AU.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-en-GB.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-en-NZ.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-eo.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-es.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-et.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-eu.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-fa.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-fi.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-fo.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-fr.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-fr-CH.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-gl.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-he.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-hi.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-hr.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-hu.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-hy.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-id.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-is.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-it.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ja.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ka.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-kk.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-km.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ko.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-lb.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-lt.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-lv.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-mk.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ml.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ms.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-nl.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-nl-BE.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-no.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-pl.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-pt.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-pt-BR.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-rm.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ro.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ru.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sk.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sl.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sq.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sr.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sr-SR.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-sv.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-ta.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-th.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-tj.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-tr.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-uk.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-vi.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-zh-CN.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-zh-HK.js"></script>
- <script src="../ui/i18n/jquery.ui.datepicker-zh-TW.js"></script>
- <script>
- $(function() {
-
- $('.left-nav a').click(function(ev) {
- window.location.hash = this.href.replace(/.+\/([^\/]+)\/index\.html/,'$1') + '|default';
- loadPage(this.href);
- $('.left-nav a.selected').removeClass('selected');
- $(this).addClass('selected');
- ev.preventDefault();
- });
-
- if (window.location.hash) {
- if (window.location.hash.indexOf('|') === -1) {
- window.location.hash += '|default';
- }
- var path = window.location.href.replace(/(index\.html)?#/,'');
- path = path.replace('\|','/') + '.html';
- loadPage(path);
- }
-
- function loadPage(path) {
- var section = path.replace(/\/[^\/]+\.html/,'');
- var header = section.replace(/.+\/([^\/]+)/,'$1').replace(/_/, ' ');
-
- $('td.normal div.normal')
- .empty()
- .append('<h4 class="demo-subheader">Functional demo:</h4>')
- .append('<h3 class="demo-header">'+ header +'</h3>')
- .append('<div id="demo-config"></div>')
- .find('#demo-config')
- .append('<div id="demo-frame"></div><div id="demo-config-menu"></div><div id="demo-link"><a class="demoWindowLink" href="#"><span class="ui-icon ui-icon-newwin"></span>Open demo in a new window</a></div>')
- .find('#demo-config-menu')
- .load(section + '/index.html .demos-nav', function() {
- $('#demo-config-menu a').each(function() {
- this.setAttribute('href', section + '/' + this.getAttribute('href').replace(/.+\/([^\/]+)/,'$1'));
- $(this).attr('target', 'demo-frame');
- $(this).click(function() {
-
- resetDemos();
-
- $(this).parents('ul').find('li').removeClass('demo-config-on');
- $(this).parent().addClass('demo-config-on');
- $('#demo-notes').fadeOut();
-
- //Set the hash to the actual page without ".html"
- window.location.hash = header + '|' + this.getAttribute('href').match((/\/([^\/\\]+)\.html/))[1];
-
- loadDemo(this.getAttribute('href'));
-
- return false;
- });
- });
-
- if (window.location.hash) {
- var demo = window.location.hash.split('|')[1];
- $('#demo-config-menu a').each(function(){
- if (this.href.indexOf(demo + '.html') !== -1) {
- $(this).parents('ul').find('li').removeClass('demo-config-on');
- $(this).parent().addClass('demo-config-on');
- loadDemo(this.href);
- }
- });
- }
-
- updateDemoNotes();
- })
- .end()
- .find('#demo-link a')
- .bind('click', function(ev){
- window.open(this.href);
- ev.preventDefault();
- })
- .end()
- .end()
- ;
-
- resetDemos();
- }
-
- function loadDemo(path) {
- var directory = path.match(/([^\/]+)\/[^\/\.]+\.html$/)[1];
- $.get(path, function(data) {
- var source = data;
- data = data.replace(/<script.*>.*<\/script>/ig,""); // Remove script tags
- data = data.replace(/<\/?link.*>/ig,""); //Remove link tags
- data = data.replace(/<\/?html.*>/ig,""); //Remove html tag
- data = data.replace(/<\/?body.*>/ig,""); //Remove body tag
- data = data.replace(/<\/?head.*>/ig,""); //Remove head tag
- data = data.replace(/<\/?!doctype.*>/ig,""); //Remove doctype
- data = data.replace(/<title.*>.*<\/title>/ig,""); // Remove title tags
- data = data.replace(/((href|src)=["'])(?!(http|#))/ig, "$1" + directory + "/");
-
- $('#demo-style').remove();
- $('#demo-frame').empty().html(data);
- $('#demo-frame style').clone().appendTo('head').attr('id','demo-style');
- $('#demo-link a').attr('href', path);
- updateDemoNotes();
- updateDemoSource(source);
-
- if (/default.html$/.test(path)) {
- $.get("documentation/docs-" + path.match(/demos\/(.+)\//)[1] + ".html", function(html) {
- $("#demo-source").after(html);
- $("#widget-docs").tabs();
- $(".param-header").click(function() {
- $(this).parent().toggleClass("param-open").end().next().toggle();
- });
- $(".docs-list-header").each(function() {
- var header = $(this);
- var details = header.next().find(".param-details").hide();
- $("a:first", header).click(function() {
- details.show().parent().addClass("param-open");
- return false;
- });
- $("a:last", header).click(function() {
- details.hide().parent().removeClass("param-open");
- return false;
- });
- });
- }, "html" );
- }
- }, "html" );
- }
-
- function updateDemoNotes() {
- var notes = $('#demo-frame .demo-description');
- if ($('#demo-notes').length == 0) {
- $('<div id="demo-notes"></div>').insertAfter('#demo-config');
- }
- $('#demo-notes').hide().empty().html(notes.html());
- $('#demo-notes').show();
- notes.hide();
- }
-
- function updateDemoSource(source) {
- if ($('#demo-source').length == 0) {
- $('<div id="demo-source"><a href="#" class="source-closed">View Source</a><div><pre><code></code></pre></div></div>').insertAfter('#demo-notes');
- $('#demo-source').find(">a").click(function() {
- $(this).toggleClass("source-closed").toggleClass("source-open").next().toggle();
- return false;
- }).end().find(">div").hide();
- }
- var cleanedSource = source
- .replace('themes/base/jquery.ui.all.css', 'theme/jquery.ui.all.css')
- .replace(/\s*\x3Clink.*demos\x2Ecss.*\x3E\s*/, '\r\n\t')
- .replace(/\x2E\x2E\x2F\x2E\x2E\x2F/g, '');
-
- $('#demo-source code').empty().text(cleanedSource);
- }
-
- function resetDemos() {
- $.datepicker.setDefaults($.extend({showMonthAfterYear: false}, $.datepicker.regional['']));
- $(".ui-dialog-content").remove();
- }
-
- });
- </script>
-</head>
-<body>
-
-<table class="layout-grid" cellspacing="0" cellpadding="0">
- <tr>
- <td class="left-nav">
- <dl class="demos-nav">
- <dt>Interactions</dt>
- <dd><a href="draggable/index.html">Draggable</a></dd>
- <dd><a href="droppable/index.html">Droppable</a></dd>
- <dd><a href="resizable/index.html">Resizable</a></dd>
- <dd><a href="selectable/index.html">Selectable</a></dd>
- <dd><a href="sortable/index.html">Sortable</a></dd>
- <dt>Widgets</dt>
- <dd><a href="accordion/index.html">Accordion</a></dd>
- <dd><a href="autocomplete/index.html">Autocomplete</a></dd>
- <dd><a href="button/index.html">Button</a></dd>
- <dd><a href="datepicker/index.html">Datepicker</a></dd>
- <dd><a href="dialog/index.html">Dialog</a></dd>
- <dd><a href="progressbar/index.html">Progressbar</a></dd>
- <dd><a href="slider/index.html">Slider</a></dd>
- <dd><a href="tabs/index.html">Tabs</a></dd>
- <dt>Effects</dt>
- <dd><a href="animate/index.html">Color Animation</a></dd>
- <dd><a href="toggleClass/index.html">Toggle Class</a></dd>
- <dd><a href="addClass/index.html">Add Class</a></dd>
- <dd><a href="removeClass/index.html">Remove Class</a></dd>
- <dd><a href="switchClass/index.html">Switch Class</a></dd>
- <dd><a href="effect/index.html">Effect</a></dd>
- <dd><a href="toggle/index.html">Toggle</a></dd>
- <dd><a href="hide/index.html">Hide</a></dd>
- <dd><a href="show/index.html">Show</a></dd>
- <dt>Utilities</dt>
- <dd><a href="position/index.html">Position</a></dd>
- <dd><a href="widget/index.html">Widget</a></dd>
- <dt>About jQuery UI</dt>
- <dd><a href="http://jqueryui.com/docs/Getting_Started">Getting Started</a></dd>
- <dd><a href="http://jqueryui.com/docs/Upgrade_Guide">Upgrade Guide</a></dd>
- <dd><a href="http://jqueryui.com/docs/Changelog">Changelog</a></dd>
- <dd><a href="http://jqueryui.com/docs/Roadmap">Roadmap</a></dd>
- <dd><a href="http://jqueryui.com/docs/Subversion">Subversion Access</a></dd>
- <dd><a href="http://jqueryui.com/docs/Developer_Guide">UI Developer Guidelines</a></dd>
- <dt>Theming</dt>
- <dd><a href="http://jqueryui.com/docs/Theming">Theming jQuery UI</a></dd>
- <dd><a href="http://jqueryui.com/docs/Theming/API">jQuery UI CSS Framework</a></dd>
- <dd><a href="http://jqueryui.com/docs/Theming/Themeroller">ThemeRoller application</a></dd>
- <dd><a href="http://jqueryui.com/docs/Theming/ThemeSwitcher">Theme Switcher Widget</a></dd>
-
- </dl>
- </td>
- <td class="normal">
-
- <div class="normal">
-
- <h3>Instructions</h3>
- <p>
- These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them.
- </p>
-
- </div>
-
- </td>
- </tr>
-</table>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Position - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- html, body {
- margin: 0;
- padding: 0
- }
- </style>
- <script>
- $(function() {
- // TODO refactor into a widget and get rid of these plugin methods
- $.fn.position2 = function( options ) {
- return this.position( $.extend({
- of: window,
- using: function( to ) {
- $( this ).css({
- top: to.top,
- left: to.left
- })
- },
- collision: "none"
- }, options));
- }
-
- $.fn.left = function( using ) {
- return this.position2({
- my: "right middle",
- at: "left middle",
- offset: "25 0",
- using: using
- });
- }
- $.fn.right = function( using ) {
- return this.position2({
- my: "left middle",
- at: "right middle",
- offset: "-25 0",
- using: using
- });
- }
- $.fn.center = function( using ) {
- return this.position2({
- my: "center middle",
- at: "center middle",
- using: using
- });
- };
-
- $( "body" ).css({
- overflow: "hidden"
- })
- $( ".demo" ).css({
- position: "relative",
- });
- $( ".demo img" ).css({
- position: "absolute",
- });
-
- $( "img:eq(0)" ).left();
- $( "img:eq(1)" ).center();
- $( "img:eq(2)" ).right();
-
- function animate( to ) {
- $(this).stop( true, false ).animate( to );
- }
- function next( event ) {
- event.preventDefault();
- $( "img:eq(2)" ).center( animate );
- $( "img:eq(1)" ).left( animate )
- $( "img:eq(0)" ).right().appendTo( ".demo" );
- }
- function previous( event ) {
- event.preventDefault();
- $( "img:eq(0)" ).center( animate );
- $( "img:eq(1)" ).right( animate );
- $( "img:eq(2)" ).left().prependTo( ".demo" );
- }
- $( "#previous" ).click( previous );
- $( "#next" ).click( next );
-
- $( ".demo img" ).click(function( event ) {
- $( ".demo img" ).index( this ) === 0 ? previous( event ) : next( event );
- });
-
- $( window ).resize(function() {
- $( "img:eq(0)" ).left( animate );
- $( "img:eq(1)" ).center( animate );
- $( "img:eq(2)" ).right( animate );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<img src="images/earth.jpg" width="458" height="308" />
-<img src="images/flight.jpg" width="512" height="307" />
-<img src="images/rocket.jpg" width="300" height="353" />
-
-<a id="previous" href="#">Previous</a>
-<a id="next" href="#">Next</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>A prototype for the <a href="http://wiki.jqueryui.com/Photoviewer">Photoviewer</a> using Position to place images at the center, left and right and cycle them.
-<br/>Use the links at the top to cycle, or click on the images on the left and right.
-<br/>Note how the images are repositioned when resizing the window.
-<br/>Warning: Doesn't currently work inside the demo viewer; open in a new window instead!</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!doctype html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Position - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.draggable.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- div#parent {
- width: 60%;
- margin: 10px auto;
- padding: 5px;
- border: 1px solid #777;
- background-color: #fbca93;
- text-align: center;
- }
- div.positionable {
- width: 75px;
- height: 75px;
- position: absolute;
- display: block;
- right: 0;
- bottom: 0;
- background-color: #bcd5e6;
- text-align: center;
- }
- select, input {
- margin-left: 15px;
- }
- </style>
- <script>
- $(function() {
- function position() {
- $( ".positionable" ).position({
- of: $( "#parent" ),
- my: $( "#my_horizontal" ).val() + " " + $( "#my_vertical" ).val(),
- at: $( "#at_horizontal" ).val() + " " + $( "#at_vertical" ).val(),
- offset: $( "#offset" ).val(),
- collision: $( "#collision_horizontal" ).val() + " " + $( "#collision_vertical" ).val()
- });
- }
-
- $( ".positionable" ).css( "opacity", 0.5 );
-
- $( ":input" ).bind( "click keyup change", position );
-
- $( "#parent" ).draggable({
- drag: position
- });
-
- position();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="parent">
- <p>
- This is the position parent element.
- </p>
-</div>
-
-<div class="positionable">
- <p>
- to position
- </p>
-</div>
-
-<div class="positionable" style="width:120px; height: 40px;">
- <p>
- to position 2
- </p>
-</div>
-
-<div style="padding: 20px; margin-top: 75px;">
- position...
- <div style="padding-bottom: 20px;">
- <b>my:</b>
- <select id="my_horizontal">
- <option value="left">left</option>
- <option value="center">center</option>
- <option value="right">right</option>
- </select>
- <select id="my_vertical">
- <option value="top">top</option>
- <option value="middle">center</option>
- <option value="bottom">bottom</option>
- </select>
- </div>
- <div style="padding-bottom: 20px;">
- <b>at:</b>
- <select id="at_horizontal">
- <option value="left">left</option>
- <option value="center">center</option>
- <option value="right">right</option>
- </select>
- <select id="at_vertical">
- <option value="top">top</option>
- <option value="middle">center</option>
- <option value="bottom">bottom</option>
- </select>
- </div>
- <div style="padding-bottom: 20px;">
- <b>offset:</b>
- <input id="offset">
- </div>
- <div style="padding-bottom: 20px;">
- <b>collision:</b>
- <select id="collision_horizontal">
- <option value="flip">flip</option>
- <option value="fit">fit</option>
- <option value="none">none</option>
- </select>
- <select id="collision_vertical">
- <option value="flip">flip</option>
- <option value="fit">fit</option>
- <option value="none">none</option>
- </select>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Use the form controls to configure the positioning, or drag the positioned element to modify its offset.
-<br/>Drag around the parent element to see collision detection in action.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Progressbar - Animated</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.progressbar.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-progressbar .ui-progressbar-value { background-image: url(images/pbar-ani.gif); }
- </style>
- <script>
- $(function() {
- $( "#progressbar" ).progressbar({
- value: 59
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="progressbar"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
-This progressbar has an animated fill by setting the
-<code>background-image</code>
-on the
-<code>.ui-progressbar-value</code>
-element, using css.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Progressbar - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.progressbar.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#progressbar" ).progressbar({
- value: 37
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="progressbar"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Default determinate progress bar.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Progressbar - Resizable</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.progressbar.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#progressbar" ).progressbar({
- value: 37
- });
- $( "#progressbarWrapper" ).resizable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="progressbarWrapper" style="height:30px; " class="ui-widget-default">
- <div id="progressbar" style="height:100%;"></div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The progress bar's widths are specified in percentages for flexible sizing so it will resize to fit its container. Try resizing the height and width of this bar to see how it maintains the correct proportions. (This is not necessarily a real-world example, but it's a good illustration of how flexibly all the plugins are coded.)</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - removeClass Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { position: relative; width: 240px; padding: 1em; letter-spacing: 0; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
- .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
- </style>
- <script>
- $(function() {
- $( "#button" ).click(function() {
- $( "#effect" ).removeClass( "newClass", 1000, callback );
- return false;
- });
-
- function callback() {
- setTimeout(function() {
- $( "#effect" ).addClass( "newClass" );
- }, 1500 );
- }
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="newClass ui-corner-all">
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Animate</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- .ui-resizable-helper { border: 1px dotted gray; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- animate: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Animate</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Animate the resize action using the <code>animate</code> option (boolean). When this option is set to true, drag the outline to the desired location; the element animates to that size on drag stop.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Preserve aspect ratio</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 160px; height: 90px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- aspectRatio: 16 / 9
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Preserve aspect ratio</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Maintain the existing aspect ratio or set a new one to constrain the proportions on resize. Set the <code>aspectRatio</code> option to true, and optionally pass in a new ratio (i.e., 4/3)</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Constrain resize area</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #container { width: 300px; height: 300px; }
- #container h3 { text-align: center; margin: 0; margin-bottom: 10px; }
- #resizable { background-position: top left; width: 150px; height: 150px; }
- #resizable, #container { padding: 0.5em; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- containment: "#container"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="container" class="ui-widget-content">
- <h3 class="ui-widget-header">Containment</h3>
- <div id="resizable" class="ui-state-active">
- <h3 class="ui-widget-header">Resizable</h3>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Define the boundaries of the resizable area. Use the <code>containment</code> option to specify a parent DOM element or a jQuery selector, like 'document.'</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Resizable</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Enable any DOM element to be resizable. With the cursor grab the right or bottom border and drag to the desired width or height.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Delay start</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable, #resizable2 { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3, #resizable2 h3 { text-align: center; margin: 0; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- delay: 1000
- });
-
- $( "#resizable2" ).resizable({
- distance: 40
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<h3 class="docs">Time delay (ms):</h3>
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Time</h3>
-</div>
-
-<h3 class="docs">Distance delay (px):</h3>
-<div id="resizable2" class="ui-widget-content">
- <h3 class="ui-widget-header">Distance</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Delay the start of resizng for a number of milliseconds with the <code>delay</code> option; prevent resizing until the cursor is held down and dragged a specifed number of pixels with the <code>distance</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Helper</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- .ui-resizable-helper { border: 2px dotted #00F; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- helper: "ui-resizable-helper"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Helper</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Display only an outline of the element while resizing by setting the <code>helper</code> option to a CSS class.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Maximum / minimum size</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 200px; height: 150px; padding: 5px; }
- #resizable h3 { text-align: center; margin: 0; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- maxHeight: 250,
- maxWidth: 350,
- minHeight: 150,
- minWidth: 200
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Resize larger / smaller</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Limit the resizable element to a maximum or minimum height or width using the <code>maxHeight</code>, <code>maxWidth</code>, <code>minHeight</code>, and <code>minWidth</code> options.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Snap to grid</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- grid: 50
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Grid</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Snap the resizable element to a grid. Set the dimensions of grid cells (height and width in pixels) with the <code>grid</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Synchronous resize</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { background-position: top left; }
- #resizable, #also { width: 150px; height: 120px; padding: 0.5em; }
- #resizable h3, #also h3 { text-align: center; margin: 0; }
- #also { margin-top: 1em; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- alsoResize: "#also"
- });
- $( "#also" ).resizable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-header">
- <h3 class="ui-state-active">Resize</h3>
-</div>
-
-<div id="also" class="ui-widget-content">
- <h3 class="ui-widget-header">will also resize</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Resize multiple elements simultaneously by clicking and dragging the sides of one. Pass a shared selector into the <code>alsoResize</code> option.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Textarea</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .ui-resizable-se {
- bottom: 17px;
- }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- handles: "se"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<textarea id="resizable" rows="5" cols="20"></textarea>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Display only an outline of the element while resizing by setting the <code>helper</code> option to a CSS class.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Resizable - Visual feedback</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.resizable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #resizable { width: 150px; height: 150px; padding: 0.5em; }
- #resizable h3 { text-align: center; margin: 0; }
- .ui-resizable-ghost { border: 1px dotted gray; }
- </style>
- <script>
- $(function() {
- $( "#resizable" ).resizable({
- ghost: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="resizable" class="ui-widget-content">
- <h3 class="ui-widget-header">Ghost</h3>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Instead of showing the actual element during resize, set the <code>ghost</code> option to true to show a semi-transparent part of the element.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Selectable - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.selectable.js"></script>
- <link rel="stylesheet" href="../demos.css">
-
- <style>
- #feedback { font-size: 1.4em; }
- #selectable .ui-selecting { background: #FECA40; }
- #selectable .ui-selected { background: #F39814; color: white; }
- #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
- #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
- </style>
- <script>
- $(function() {
- $( "#selectable" ).selectable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<ol id="selectable">
- <li class="ui-widget-content">Item 1</li>
- <li class="ui-widget-content">Item 2</li>
- <li class="ui-widget-content">Item 3</li>
- <li class="ui-widget-content">Item 4</li>
- <li class="ui-widget-content">Item 5</li>
- <li class="ui-widget-content">Item 6</li>
- <li class="ui-widget-content">Item 7</li>
-</ol>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Enable a DOM element (or group of elements) to be selectable. Draw a box with your cursor to select items. Hold down the Ctrl key to make multiple non-adjacent selections. </p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Selectable - Display as grid</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.selectable.js"></script>
- <link rel="stylesheet" href="../demos.css">
-
- <style>
- #feedback { font-size: 1.4em; }
- #selectable .ui-selecting { background: #FECA40; }
- #selectable .ui-selected { background: #F39814; color: white; }
- #selectable { list-style-type: none; margin: 0; padding: 0; }
- #selectable li { margin: 3px; padding: 1px; float: left; width: 100px; height: 80px; font-size: 4em; text-align: center; }
- </style>
- <script>
- $(function() {
- $( "#selectable" ).selectable();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<ol id="selectable">
- <li class="ui-state-default">1</li>
- <li class="ui-state-default">2</li>
- <li class="ui-state-default">3</li>
- <li class="ui-state-default">4</li>
- <li class="ui-state-default">5</li>
- <li class="ui-state-default">6</li>
- <li class="ui-state-default">7</li>
- <li class="ui-state-default">8</li>
- <li class="ui-state-default">9</li>
- <li class="ui-state-default">10</li>
- <li class="ui-state-default">11</li>
- <li class="ui-state-default">12</li>
-</ol>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>To arrange selectable items as a grid, give them identical dimensions and float them using CSS.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Selectable - Serialize</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.selectable.js"></script>
- <link rel="stylesheet" href="../demos.css">
-
- <style>
- #feedback { font-size: 1.4em; }
- #selectable .ui-selecting { background: #FECA40; }
- #selectable .ui-selected { background: #F39814; color: white; }
- #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
- #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
- </style>
- <script>
- $(function() {
- $( "#selectable" ).selectable({
- stop: function() {
- var result = $( "#select-result" ).empty();
- $( ".ui-selected", this ).each(function() {
- var index = $( "#selectable li" ).index( this );
- result.append( " #" + ( index + 1 ) );
- });
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p id="feedback">
-<span>You've selected:</span> <span id="select-result">none</span>.
-</p>
-
-<ol id="selectable">
- <li class="ui-widget-content">Item 1</li>
- <li class="ui-widget-content">Item 2</li>
- <li class="ui-widget-content">Item 3</li>
- <li class="ui-widget-content">Item 4</li>
- <li class="ui-widget-content">Item 5</li>
- <li class="ui-widget-content">Item 6</li>
-</ol>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Write a function that fires on the <code>stop</code> event to collect the index values of selected items. Present values as feedback, or pass as a data string.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Show Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.bounce.js"></script>
- <script src="../../ui/jquery.effects.clip.js"></script>
- <script src="../../ui/jquery.effects.drop.js"></script>
- <script src="../../ui/jquery.effects.explode.js"></script>
- <script src="../../ui/jquery.effects.fold.js"></script>
- <script src="../../ui/jquery.effects.highlight.js"></script>
- <script src="../../ui/jquery.effects.pulsate.js"></script>
- <script src="../../ui/jquery.effects.scale.js"></script>
- <script src="../../ui/jquery.effects.shake.js"></script>
- <script src="../../ui/jquery.effects.slide.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script>
- $(function() {
- // run the currently selected effect
- function runEffect() {
- // get effect type from
- var selectedEffect = $( "#effectTypes" ).val();
-
- // most effect types need no options passed by default
- var options = {};
- // some effects have required parameters
- if ( selectedEffect === "scale" ) {
- options = { percent: 100 };
- } else if ( selectedEffect === "size" ) {
- options = { to: { width: 280, height: 185 } };
- }
-
- // run the effect
- $( "#effect" ).show( selectedEffect, options, 500, callback );
- };
-
- //callback function to bring a hidden box back
- function callback() {
- setTimeout(function() {
- $( "#effect:visible" ).removeAttr( "style" ).fadeOut();
- }, 1000 );
- };
-
- // set effect from select menu value
- $( "#button" ).click(function() {
- runEffect();
- return false;
- });
-
- $( "#effect" ).hide();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Show</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<select name="effects" id="effectTypes">
- <option value="blind">Blind</option>
- <option value="bounce">Bounce</option>
- <option value="clip">Clip</option>
- <option value="drop">Drop</option>
- <option value="explode">Explode</option>
- <option value="fold">Fold</option>
- <option value="highlight">Highlight</option>
- <option value="puff">Puff</option>
- <option value="pulsate">Pulsate</option>
- <option value="scale">Scale</option>
- <option value="shake">Shake</option>
- <option value="size">Size</option>
- <option value="slide">Slide</option>
-</select>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Colorpicker</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #red, #green, #blue {
- float: left;
- clear: left;
- width: 300px;
- margin: 15px;
- }
- #swatch {
- width: 120px;
- height: 100px;
- margin-top: 18px;
- margin-left: 350px;
- background-image: none;
- }
- #red .ui-slider-range { background: #ef2929; }
- #red .ui-slider-handle { border-color: #ef2929; }
- #green .ui-slider-range { background: #8ae234; }
- #green .ui-slider-handle { border-color: #8ae234; }
- #blue .ui-slider-range { background: #729fcf; }
- #blue .ui-slider-handle { border-color: #729fcf; }
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- function hexFromRGB(r, g, b) {
- var hex = [
- r.toString( 16 ),
- g.toString( 16 ),
- b.toString( 16 )
- ];
- $.each( hex, function( nr, val ) {
- if ( val.length === 1 ) {
- hex[ nr ] = "0" + val;
- }
- });
- return hex.join( "" ).toUpperCase();
- }
- function refreshSwatch() {
- var red = $( "#red" ).slider( "value" ),
- green = $( "#green" ).slider( "value" ),
- blue = $( "#blue" ).slider( "value" ),
- hex = hexFromRGB( red, green, blue );
- $( "#swatch" ).css( "background-color", "#" + hex );
- }
- $(function() {
- $( "#red, #green, #blue" ).slider({
- orientation: "horizontal",
- range: "min",
- max: 255,
- value: 127,
- slide: refreshSwatch,
- change: refreshSwatch
- });
- $( "#red" ).slider( "value", 255 );
- $( "#green" ).slider( "value", 140 );
- $( "#blue" ).slider( "value", 60 );
- });
- </script>
-</head>
-<body class="ui-widget-content" style="border:0;">
-
-<div class="demo">
-
-<p class="ui-state-default ui-corner-all ui-helper-clearfix" style="padding:4px;">
- <span class="ui-icon ui-icon-pencil" style="float:left; margin:-2px 5px 0 0;"></span>
- Simple Colorpicker
-</p>
-
-<div id="red"></div>
-<div id="green"></div>
-<div id="blue"></div>
-
-<div id="swatch" class="ui-widget-content ui-corner-all"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description" style="clear:left;">
-<p>Combine three sliders to create a simple RGB colorpicker.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8" >
- <title>jQuery UI Slider - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; }
- </style>
- <script>
- $(function() {
- $( "#slider" ).slider();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="slider"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>The basic slider is horizontal and has a single handle that can be moved with the mouse or by using the arrow keys.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Range with fixed minimum</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- var select = $( "#minbeds" );
- var slider = $( "<div id='slider'></div>" ).insertAfter( select ).slider({
- min: 1,
- max: 6,
- range: "min",
- value: select[ 0 ].selectedIndex + 1,
- slide: function( event, ui ) {
- select[ 0 ].selectedIndex = ui.value - 1;
- }
- });
- $( "#minbeds" ).change(function() {
- slider.slider( "value", this.selectedIndex + 1 );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<form id="reservation">
- <label for="minbeds">Minimum number of beds</label>
- <select name="minbeds" id="minbeds">
- <option>1</option>
- <option>2</option>
- <option>3</option>
- <option>4</option>
- <option>5</option>
- <option>6</option>
- </select>
-</form>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>How to bind a slider to an existing select element. The select stays visible to display the change. When the select is changed, the slider is updated, too.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Multiple sliders</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; }
- #eq span {
- height:120px; float:left; margin:15px
- }
- </style>
- <script>
- $(function() {
- // setup master volume
- $( "#master" ).slider({
- value: 60,
- orientation: "horizontal",
- range: "min",
- animate: true
- });
- // setup graphic EQ
- $( "#eq > span" ).each(function() {
- // read initial values from markup and remove that
- var value = parseInt( $( this ).text(), 10 );
- $( this ).empty().slider({
- value: value,
- range: "min",
- animate: true,
- orientation: "vertical"
- });
- });
- });
- </script>
-</head>
-<body class="ui-widget-content" style="border:0;">
-
-<div class="demo">
-
-<p class="ui-state-default ui-corner-all ui-helper-clearfix" style="padding:4px;">
- <span class="ui-icon ui-icon-volume-on" style="float:left; margin:-2px 5px 0 0;"></span>
- Master volume
-</p>
-
-<div id="master" style="width:260px; margin:15px;"></div>
-
-<p class="ui-state-default ui-corner-all" style="padding:4px;margin-top:4em;">
- <span class="ui-icon ui-icon-signal" style="float:left; margin:-2px 5px 0 0;"></span>
- Graphic EQ
-</p>
-
-<div id="eq">
- <span>88</span>
- <span>77</span>
- <span>55</span>
- <span>33</span>
- <span>40</span>
- <span>45</span>
- <span>70</span>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description" style="clear:left;">
-<p>Combine horizontal and vertical sliders, each with their own options, to create the UI for a music player.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Vertical range slider</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider-range" ).slider({
- orientation: "vertical",
- range: true,
- values: [ 17, 67 ],
- slide: function( event, ui ) {
- $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
- }
- });
- $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
- " - $" + $( "#slider-range" ).slider( "values", 1 ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Target sales goal (Millions):</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-
-<div id="slider-range" style="height:250px;"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Change the orientation of the range slider to vertical. Assign a height value via <code>.height()</code> or by setting the height through CSS, and set the <code>orientation</code> option to "vertical."</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Range slider</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider-range" ).slider({
- range: true,
- min: 0,
- max: 500,
- values: [ 75, 300 ],
- slide: function( event, ui ) {
- $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
- }
- });
- $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
- " - $" + $( "#slider-range" ).slider( "values", 1 ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Price range:</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-
-<div id="slider-range"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Set the <code>range</code> option to true to capture a range of values with two drag handles. The space between the handles is filled with a different background color to indicate those values are selected.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Range with fixed maximum</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider-range-max" ).slider({
- range: "max",
- min: 1,
- max: 10,
- value: 2,
- slide: function( event, ui ) {
- $( "#amount" ).val( ui.value );
- }
- });
- $( "#amount" ).val( $( "#slider-range-max" ).slider( "value" ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Minimum number of bedrooms:</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-<div id="slider-range-max"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Fix the maximum value of the range slider so that the user can only select a minimum. Set the <code>range</code> option to "max."</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Range with fixed minimum</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider-range-min" ).slider({
- range: "min",
- value: 37,
- min: 1,
- max: 700,
- slide: function( event, ui ) {
- $( "#amount" ).val( "$" + ui.value );
- }
- });
- $( "#amount" ).val( "$" + $( "#slider-range-min" ).slider( "value" ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Maximum price:</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-
-<div id="slider-range-min"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Fix the minimum value of the range slider so that the user can only select a maximum. Set the <code>range</code> option to "min."</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Slider scrollbar</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; }
- .scroll-pane { overflow: auto; width: 99%; float:left; }
- .scroll-content { width: 2440px; float: left; }
- .scroll-content-item { width: 100px; height: 100px; float: left; margin: 10px; font-size: 3em; line-height: 96px; text-align: center; }
- * html .scroll-content-item { display: inline; } /* IE6 float double margin bug */
- .scroll-bar-wrap { clear: left; padding: 0 4px 0 2px; margin: 0 -1px -1px -1px; }
- .scroll-bar-wrap .ui-slider { background: none; border:0; height: 2em; margin: 0 auto; }
- .scroll-bar-wrap .ui-handle-helper-parent { position: relative; width: 100%; height: 100%; margin: 0 auto; }
- .scroll-bar-wrap .ui-slider-handle { top:.2em; height: 1.5em; }
- .scroll-bar-wrap .ui-slider-handle .ui-icon { margin: -8px auto 0; position: relative; top: 50%; }
- </style>
- <script>
- $(function() {
- //scrollpane parts
- var scrollPane = $( ".scroll-pane" ),
- scrollContent = $( ".scroll-content" );
-
- //build slider
- var scrollbar = $( ".scroll-bar" ).slider({
- slide: function( event, ui ) {
- if ( scrollContent.width() > scrollPane.width() ) {
- scrollContent.css( "margin-left", Math.round(
- ui.value / 100 * ( scrollPane.width() - scrollContent.width() )
- ) + "px" );
- } else {
- scrollContent.css( "margin-left", 0 );
- }
- }
- });
-
- //append icon to handle
- var handleHelper = scrollbar.find( ".ui-slider-handle" )
- .mousedown(function() {
- scrollbar.width( handleHelper.width() );
- })
- .mouseup(function() {
- scrollbar.width( "100%" );
- })
- .append( "<span class='ui-icon ui-icon-grip-dotted-vertical'></span>" )
- .wrap( "<div class='ui-handle-helper-parent'></div>" ).parent();
-
- //change overflow to hidden now that slider handles the scrolling
- scrollPane.css( "overflow", "hidden" );
-
- //size scrollbar and handle proportionally to scroll distance
- function sizeScrollbar() {
- var remainder = scrollContent.width() - scrollPane.width();
- var proportion = remainder / scrollContent.width();
- var handleSize = scrollPane.width() - ( proportion * scrollPane.width() );
- scrollbar.find( ".ui-slider-handle" ).css({
- width: handleSize,
- "margin-left": -handleSize / 2
- });
- handleHelper.width( "" ).width( scrollbar.width() - handleSize );
- }
-
- //reset slider value based on scroll content position
- function resetValue() {
- var remainder = scrollPane.width() - scrollContent.width();
- var leftVal = scrollContent.css( "margin-left" ) === "auto" ? 0 :
- parseInt( scrollContent.css( "margin-left" ) );
- var percentage = Math.round( leftVal / remainder * 100 );
- scrollbar.slider( "value", percentage );
- }
-
- //if the slider is 100% and window gets larger, reveal content
- function reflowContent() {
- var showing = scrollContent.width() + parseInt( scrollContent.css( "margin-left" ), 10 );
- var gap = scrollPane.width() - showing;
- if ( gap > 0 ) {
- scrollContent.css( "margin-left", parseInt( scrollContent.css( "margin-left" ), 10 ) + gap );
- }
- }
-
- //change handle position on window resize
- $( window ).resize(function() {
- resetValue();
- sizeScrollbar();
- reflowContent();
- });
- //init scrollbar size
- setTimeout( sizeScrollbar, 10 );//safari wants a timeout
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="scroll-pane ui-widget ui-widget-header ui-corner-all">
- <div class="scroll-content">
- <div class="scroll-content-item ui-widget-header">1</div>
- <div class="scroll-content-item ui-widget-header">2</div>
- <div class="scroll-content-item ui-widget-header">3</div>
- <div class="scroll-content-item ui-widget-header">4</div>
- <div class="scroll-content-item ui-widget-header">5</div>
- <div class="scroll-content-item ui-widget-header">6</div>
- <div class="scroll-content-item ui-widget-header">7</div>
- <div class="scroll-content-item ui-widget-header">8</div>
- <div class="scroll-content-item ui-widget-header">9</div>
- <div class="scroll-content-item ui-widget-header">10</div>
- <div class="scroll-content-item ui-widget-header">11</div>
- <div class="scroll-content-item ui-widget-header">12</div>
- <div class="scroll-content-item ui-widget-header">13</div>
- <div class="scroll-content-item ui-widget-header">14</div>
- <div class="scroll-content-item ui-widget-header">15</div>
- <div class="scroll-content-item ui-widget-header">16</div>
- <div class="scroll-content-item ui-widget-header">17</div>
- <div class="scroll-content-item ui-widget-header">18</div>
- <div class="scroll-content-item ui-widget-header">19</div>
- <div class="scroll-content-item ui-widget-header">20</div>
- </div>
- <div class="scroll-bar-wrap ui-widget-content ui-corner-bottom">
- <div class="scroll-bar"></div>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Use a slider to manipulate the positioning of content on the page. In this case, it acts as a scrollbar with the potential to capture values if needed.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Vertical slider</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider-vertical" ).slider({
- orientation: "vertical",
- range: "min",
- min: 0,
- max: 100,
- value: 60,
- slide: function( event, ui ) {
- $( "#amount" ).val( ui.value );
- }
- });
- $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Volume:</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-
-<div id="slider-vertical" style="height:200px;"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Change the orientation of the slider to vertical. Assign a height value via <code>.height()</code> or by setting the height through CSS, and set the <code>orientation</code> option to "vertical."</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Snap to increments</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; };
- </style>
- <script>
- $(function() {
- $( "#slider" ).slider({
- value:100,
- min: 0,
- max: 500,
- step: 50,
- slide: function( event, ui ) {
- $( "#amount" ).val( "$" + ui.value );
- }
- });
- $( "#amount" ).val( "$" + $( "#slider" ).slider( "value" ) );
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="amount">Donation amount ($50 increments):</label>
- <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
-</p>
-
-<div id="slider"></div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Increment slider values with the <code>step</code> option set to an integer, commonly a dividend of the slider's maximum value. The default increment is 1.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Slider - Snap to increments</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <script src="../../ui/jquery.ui.slider.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #demo-frame > div.demo { padding: 10px !important; }
- </style>
- <script>
- $(function() {
- $( "#tabs" ).tabs({
- select: function( event, ui ) {
- $( "#slider" ).slider( "value", ui.index );
- }
- });
- $( "#slider" ).slider({
- min: 0,
- max: $( "#tabs" ).tabs( "length" ) - 1,
- slide: function( event, ui ) {
- $( "#tabs" ).tabs( "select", ui.value );
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="slider" style="width:100px"></div>
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Control tabs with a slider.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Connect lists with Tabs</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <script src="../../ui/jquery.ui.droppable.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }
- </style>
- <script>
- $(function() {
- $( "#sortable1, #sortable2" ).sortable().disableSelection();
-
- var $tabs = $( "#tabs" ).tabs();
-
- var $tab_items = $( "ul:first li", $tabs ).droppable({
- accept: ".connectedSortable li",
- hoverClass: "ui-state-hover",
- drop: function( event, ui ) {
- var $item = $( this );
- var $list = $( $item.find( "a" ).attr( "href" ) )
- .find( ".connectedSortable" );
-
- ui.draggable.hide( "slow", function() {
- $tabs.tabs( "select", $tab_items.index( $item ) );
- $( this ).appendTo( $list ).show( "slow" );
- });
- }
- });
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- </ul>
- <div id="tabs-1">
- <ul id="sortable1" class="connectedSortable ui-helper-reset">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
- </ul>
- </div>
- <div id="tabs-2">
- <ul id="sortable2" class="connectedSortable ui-helper-reset">
- <li class="ui-state-highlight">Item 1</li>
- <li class="ui-state-highlight">Item 2</li>
- <li class="ui-state-highlight">Item 3</li>
- <li class="ui-state-highlight">Item 4</li>
- <li class="ui-state-highlight">Item 5</li>
- </ul>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Sort items from one list into another and vice versa, by dropping the list item on the appropriate tab above.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Connect lists</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0 0 2.5em; float: left; margin-right: 10px; }
- #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }
- </style>
- <script>
- $(function() {
- $( "#sortable1, #sortable2" ).sortable({
- connectWith: ".connectedSortable"
- }).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<ul id="sortable1" class="connectedSortable">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
-</ul>
-
-<ul id="sortable2" class="connectedSortable">
- <li class="ui-state-highlight">Item 1</li>
- <li class="ui-state-highlight">Item 2</li>
- <li class="ui-state-highlight">Item 3</li>
- <li class="ui-state-highlight">Item 4</li>
- <li class="ui-state-highlight">Item 5</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Sort items from one list into another and vice versa, by passing a selector into
- the <code>connectWith</code> option. The simplest way to do this is to
- group all related lists with a CSS class, and then pass that class into the
- sortable function (i.e., <code>connectWith: '.myclass'</code>).
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
- #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
- #sortable li span { position: absolute; margin-left: -1.3em; }
- </style>
- <script>
- $(function() {
- $( "#sortable" ).sortable();
- $( "#sortable" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<ul id="sortable">
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Enable a group of DOM elements to be sortable. Click on and drag an
- element to a new spot within the list, and the other items will adjust to
- fit. By default, sortable items share <code>draggable</code> properties.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Delay start</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; margin-bottom: 15px;zoom: 1; }
- #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 95%; }
- </style>
- <script>
- $(function() {
- $( "#sortable1" ).sortable({
- delay: 300
- });
-
- $( "#sortable2" ).sortable({
- distance: 15
- });
-
- $( "li" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<h3 class="docs">Time delay of 300ms:</h3>
-
-<ul id="sortable1">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
-</ul>
-
-<h3 class="docs">Distance delay of 15px:</h3>
-
-<ul id="sortable2">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Prevent accidental sorting either by delay (time) or distance. Set a number of
- milliseconds the element needs to be dragged before sorting starts
- with the <code>delay</code> option. Set a distance in pixels the element
- needs to be dragged before sorting starts with the <code>distance</code>
- option.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Display as grid</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable { list-style-type: none; margin: 0; padding: 0; }
- #sortable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 100px; height: 90px; font-size: 4em; text-align: center; }
- </style>
- <script>
- $(function() {
- $( "#sortable" ).sortable();
- $( "#sortable" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<ul id="sortable">
- <li class="ui-state-default">1</li>
- <li class="ui-state-default">2</li>
- <li class="ui-state-default">3</li>
- <li class="ui-state-default">4</li>
- <li class="ui-state-default">5</li>
- <li class="ui-state-default">6</li>
- <li class="ui-state-default">7</li>
- <li class="ui-state-default">8</li>
- <li class="ui-state-default">9</li>
- <li class="ui-state-default">10</li>
- <li class="ui-state-default">11</li>
- <li class="ui-state-default">12</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- To arrange sortable items as a grid, give them identical dimensions and
- float them using CSS.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Handle empty lists</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable1, #sortable2, #sortable3 { list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;}
- #sortable1 li, #sortable2 li, #sortable3 li { margin: 5px; padding: 5px; font-size: 1.2em; width: 120px; }
- </style>
- <script>
- $(function() {
- $( "ul.droptrue" ).sortable({
- connectWith: "ul"
- });
-
- $( "ul.dropfalse" ).sortable({
- connectWith: "ul",
- dropOnEmpty: false
- });
-
- $( "#sortable1, #sortable2, #sortable3" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<ul id="sortable1" class='droptrue'>
- <li class="ui-state-default">Can be dropped..</li>
- <li class="ui-state-default">..on an empty list</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
-</ul>
-
-<ul id="sortable2" class='dropfalse'>
- <li class="ui-state-highlight">Cannot be dropped..</li>
- <li class="ui-state-highlight">..on an empty list</li>
- <li class="ui-state-highlight">Item 3</li>
- <li class="ui-state-highlight">Item 4</li>
- <li class="ui-state-highlight">Item 5</li>
-</ul>
-
-<ul id="sortable3" class='droptrue'>
-</ul>
-
-<br clear="both" />
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Prevent all items in a list from being dropped into a separate, empty list
- using the <code>dropOnEmpty</code> option set to <code>false</code>. By default,
- sortable items can be dropped on empty lists.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Include / exclude items</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; zoom: 1; }
- #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 3px; width: 90%; }
- </style>
- <script>
- $(function() {
- $( "#sortable1" ).sortable({
- items: "li:not(.ui-state-disabled)"
- });
-
- $( "#sortable2" ).sortable({
- cancel: ".ui-state-disabled"
- });
-
- $( "#sortable1 li, #sortable2 li" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<h3 class="docs">Specify which items are sortable:</h3>
-
-<ul id="sortable1">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default ui-state-disabled">(I'm not sortable or a drop target)</li>
- <li class="ui-state-default ui-state-disabled">(I'm not sortable or a drop target)</li>
- <li class="ui-state-default">Item 4</li>
-</ul>
-
-<h3 class="docs">Cancel sorting (but keep as drop targets):</h3>
-
-<ul id="sortable2">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default ui-state-disabled">(I'm not sortable)</li>
- <li class="ui-state-default ui-state-disabled">(I'm not sortable)</li>
- <li class="ui-state-default">Item 4</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Specify which items are eligible to sort by passing a jQuery selector into
- the <code>items</code> option. Items excluded from this option are not
- sortable, nor are they valid targets for sortable items.
-</p>
-<p>
- To only prevent sorting on certain items, pass a jQuery selector into the
- <code>cancel</code> option. Cancelled items remain valid sort targets for
- others.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Drop placeholder</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
- #sortable li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; height: 1.5em; }
- html>body #sortable li { height: 1.5em; line-height: 1.2em; }
- .ui-state-highlight { height: 1.5em; line-height: 1.2em; }
- </style>
- <script>
- $(function() {
- $( "#sortable" ).sortable({
- placeholder: "ui-state-highlight"
- });
- $( "#sortable" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<ul id="sortable">
- <li class="ui-state-default">Item 1</li>
- <li class="ui-state-default">Item 2</li>
- <li class="ui-state-default">Item 3</li>
- <li class="ui-state-default">Item 4</li>
- <li class="ui-state-default">Item 5</li>
- <li class="ui-state-default">Item 6</li>
- <li class="ui-state-default">Item 7</li>
-</ul>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- When dragging a sortable item to a new location, other items will make room
- for the that item by shifting to allow white space between them. Pass a
- class into the <code>placeholder</code> option to style that space to
- be visible. Use the boolean <code>forcePlaceholderSize</code> option
- to set dimensions on the placeholder.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Sortable - Portlets</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .column { width: 170px; float: left; padding-bottom: 100px; }
- .portlet { margin: 0 1em 1em 0; }
- .portlet-header { margin: 0.3em; padding-bottom: 4px; padding-left: 0.2em; }
- .portlet-header .ui-icon { float: right; }
- .portlet-content { padding: 0.4em; }
- .ui-sortable-placeholder { border: 1px dotted black; visibility: visible !important; height: 50px !important; }
- .ui-sortable-placeholder * { visibility: hidden; }
- </style>
- <script>
- $(function() {
- $( ".column" ).sortable({
- connectWith: ".column"
- });
-
- $( ".portlet" ).addClass( "ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" )
- .find( ".portlet-header" )
- .addClass( "ui-widget-header ui-corner-all" )
- .prepend( "<span class='ui-icon ui-icon-minusthick'></span>")
- .end()
- .find( ".portlet-content" );
-
- $( ".portlet-header .ui-icon" ).click(function() {
- $( this ).toggleClass( "ui-icon-minusthick" ).toggleClass( "ui-icon-plusthick" );
- $( this ).parents( ".portlet:first" ).find( ".portlet-content" ).toggle();
- });
-
- $( ".column" ).disableSelection();
- });
- </script>
-</head>
-<body>
-<div class="demo">
-
-<div class="column">
-
- <div class="portlet">
- <div class="portlet-header">Feeds</div>
- <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
- </div>
-
- <div class="portlet">
- <div class="portlet-header">News</div>
- <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
- </div>
-
-</div>
-
-<div class="column">
-
- <div class="portlet">
- <div class="portlet-header">Shopping</div>
- <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
- </div>
-
-</div>
-
-<div class="column">
-
- <div class="portlet">
- <div class="portlet-header">Links</div>
- <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
- </div>
-
- <div class="portlet">
- <div class="portlet-header">Images</div>
- <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div>
- </div>
-
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>
- Enable portlets (styled divs) as sortables and use the <code>connectWith</code>
- option to allow sorting between columns.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - switchClass Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect {position: relative; }
- .newClass { width: 240px; padding: 1em; letter-spacing: 0; font-size: 1.2em; margin: 0; }
- .anotherNewClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
- </style>
- <script>
- $(function() {
- $( "#button" ).click(function(){
- $( ".newClass" ).switchClass( "newClass", "anotherNewClass", 1000 );
- $( ".anotherNewClass" ).switchClass( "anotherNewClass", "newClass", 1000 );
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="newClass ui-corner-all">
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
- </div>
-</div>
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Content via Ajax</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs({
- ajaxOptions: {
- error: function( xhr, status, index, anchor ) {
- $( anchor.hash ).html(
- "Couldn't load this tab. We'll try to fix this as soon as possible. " +
- "If this wouldn't be a demo." );
- }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Preloaded</a></li>
- <li><a href="ajax/content1.html">Tab 1</a></li>
- <li><a href="ajax/content2.html">Tab 2</a></li>
- <li><a href="ajax/content3-slow.php">Tab 3 (slow)</a></li>
- <li><a href="ajax/content4-broken.php">Tab 4 (broken)</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Fetch external content via Ajax for the tabs by setting an href value in the tab links. While the Ajax request is waiting for a response, the tab label changes to say "Loading...", then returns to the normal label once loaded.</p>
-<p>Tabs 3 and 4 demonstrate slow-loading and broken AJAX tabs, and how to handle serverside errors in those cases. Note: These two require a webserver to interpret PHP. They won't work from the filesystem.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Tabs at bottom</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs();
- $( ".tabs-bottom .ui-tabs-nav, .tabs-bottom .ui-tabs-nav > *" )
- .removeClass( "ui-corner-all ui-corner-top" )
- .addClass( "ui-corner-bottom" );
- });
- </script>
- <style>
- #tabs { height: 200px; }
- .tabs-bottom { position: relative; }
- .tabs-bottom .ui-tabs-panel { height: 140px; overflow: auto; }
- .tabs-bottom .ui-tabs-nav { position: absolute !important; left: 0; bottom: 0; right:0; padding: 0 0.2em 0.2em 0; }
- .tabs-bottom .ui-tabs-nav li { margin-top: -2px !important; margin-bottom: 1px !important; border-top: none; border-bottom-width: 1px; }
- .ui-tabs-selected { margin-top: -3px !important; }
- </style>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs" class="tabs-bottom">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>With some additional CSS (for positioning) and JS (to put the right classes on elements) the tabs can be placed below their content.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Collapse content</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs({
- collapsible: true
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p><strong>Click this tab again to close the content pane.</strong></p>
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p><strong>Click this tab again to close the content pane.</strong></p>
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p><strong>Click this tab again to close the content pane.</strong></p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the selected tab to toggle its content closed/open. To enable this functionality, set the <code>collapsible</code> option to true.</p>
-<pre><code>collapsible: true
-</code></pre>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../external/jquery.cookie.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs({
- cookie: {
- // store cookie for a day, without, it would be a session cookie
- expires: 1
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Looks the same as the default demo, but uses cookie to store the selected tab, and restore it when the page (re)loads.
-The cookie is stored for a day, so tabs will be restored even after closing the browser. Use cookie: {} for using cookies with default options.</p>
-<p>The cookie option requires the cookie plugin, which can be found in the development-bundle > external folder from the download builder.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click tabs to swap between content that is broken into logical sections.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Simple manipulation</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <script src="../../ui/jquery.ui.dialog.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- #dialog label, #dialog input { display:block; }
- #dialog label { margin-top: 0.5em; }
- #dialog input, #dialog textarea { width: 95%; }
- #tabs { margin-top: 1em; }
- #tabs li .ui-icon-close { float: left; margin: 0.4em 0.2em 0 0; cursor: pointer; }
- #add_tab { cursor: pointer; }
- </style>
- <script>
- $(function() {
- var $tab_title_input = $( "#tab_title"),
- $tab_content_input = $( "#tab_content" );
- var tab_counter = 2;
-
- // tabs init with a custom tab template and an "add" callback filling in the content
- var $tabs = $( "#tabs").tabs({
- tabTemplate: "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close'>Remove Tab</span></li>",
- add: function( event, ui ) {
- var tab_content = $tab_content_input.val() || "Tab " + tab_counter + " content.";
- $( ui.panel ).append( "<p>" + tab_content + "</p>" );
- }
- });
-
- // modal dialog init: custom buttons and a "close" callback reseting the form inside
- var $dialog = $( "#dialog" ).dialog({
- autoOpen: false,
- modal: true,
- buttons: {
- Add: function() {
- addTab();
- $( this ).dialog( "close" );
- },
- Cancel: function() {
- $( this ).dialog( "close" );
- }
- },
- open: function() {
- $tab_title_input.focus();
- },
- close: function() {
- $form[ 0 ].reset();
- }
- });
-
- // addTab form: calls addTab function on submit and closes the dialog
- var $form = $( "form", $dialog ).submit(function() {
- addTab();
- $dialog.dialog( "close" );
- return false;
- });
-
- // actual addTab function: adds new tab using the title input from the form above
- function addTab() {
- var tab_title = $tab_title_input.val() || "Tab " + tab_counter;
- $tabs.tabs( "add", "#tabs-" + tab_counter, tab_title );
- tab_counter++;
- }
-
- // addTab button: just opens the dialog
- $( "#add_tab" )
- .button()
- .click(function() {
- $dialog.dialog( "open" );
- });
-
- // close icon: removing the tab on click
- // note: closable tabs gonna be an option in the future - see http://dev.jqueryui.com/ticket/3924
- $( "#tabs span.ui-icon-close" ).live( "click", function() {
- var index = $( "li", $tabs ).index( $( this ).parent() );
- $tabs.tabs( "remove", index );
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
- <div id="dialog" title="Tab data">
- <form>
- <fieldset class="ui-helper-reset">
- <label for="tab_title">Title</label>
- <input type="text" name="tab_title" id="tab_title" value="" class="ui-widget-content ui-corner-all" />
- <label for="tab_content">Content</label>
- <textarea name="tab_content" id="tab_content" class="ui-widget-content ui-corner-all"></textarea>
- </fieldset>
- </form>
- </div>
-
- <button id="add_tab">Add Tab</button>
-
- <div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a> <span class="ui-icon ui-icon-close">Remove Tab</span></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- </div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Simple tabs adding and removing.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Open on mouseover</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs({
- event: "mouseover"
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Toggle sections open/closed on mouseover with the <code>event</code> option. The default value for event is "click."</p>
-<pre><code>event: 'mouseover'
-</code></pre>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Sortable</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.mouse.js"></script>
- <script src="../../ui/jquery.ui.sortable.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs().find( ".ui-tabs-nav" ).sortable({ axis: "x" });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Drag the tabs above to re-order them.</p>
-<p>
-Making tabs sortable is as simple as calling
-<code>.sortable()</code>
-on the
-<code>.ui-tabs-nav</code>
-element.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Tabs - Vertical Tabs functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.tabs.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#tabs" ).tabs().addClass( "ui-tabs-vertical ui-helper-clearfix" );
- $( "#tabs li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );
- });
- </script>
- <style>
- .ui-tabs-vertical { width: 55em; }
- .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; }
- .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
- .ui-tabs-vertical .ui-tabs-nav li a { display:block; }
- .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
- .ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;}
- </style>
-</head>
-<body>
-
-<div class="demo">
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">Nunc tincidunt</a></li>
- <li><a href="#tabs-2">Proin dolor</a></li>
- <li><a href="#tabs-3">Aenean lacinia</a></li>
- </ul>
- <div id="tabs-1">
- <h2>Content heading 1</h2>
- <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus. Curabitur nec arcu. Donec sollicitudin mi sit amet mauris. Nam elementum quam ullamcorper ante. Etiam aliquet massa et lorem. Mauris dapibus lacus auctor risus. Aenean tempor ullamcorper leo. Vivamus sed magna quis ligula eleifend adipiscing. Duis orci. Aliquam sodales tortor vitae ipsum. Aliquam nulla. Duis aliquam molestie erat. Ut et mauris vel pede varius sollicitudin. Sed ut dolor nec orci tincidunt interdum. Phasellus ipsum. Nunc tristique tempus lectus.</p>
- </div>
- <div id="tabs-2">
- <h2>Content heading 2</h2>
- <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
- </div>
- <div id="tabs-3">
- <h2>Content heading 3</h2>
- <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. Aliquam vulputate, pede vel vehicula accumsan, mi neque rutrum erat, eu congue orci lorem eget lorem. Vestibulum non ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Fusce sodales. Quisque eu urna vel enim commodo pellentesque. Praesent eu risus hendrerit ligula tempus pretium. Curabitur lorem enim, pretium nec, feugiat nec, luctus a, lacus.</p>
- <p>Duis cursus. Maecenas ligula eros, blandit nec, pharetra at, semper at, magna. Nullam ac lacus. Nulla facilisi. Praesent viverra justo vitae neque. Praesent blandit adipiscing velit. Suspendisse potenti. Donec mattis, pede vel pharetra blandit, magna ligula faucibus eros, id euismod lacus dolor eget odio. Nam scelerisque. Donec non libero sed nulla mattis commodo. Ut sagittis. Donec nisi lectus, feugiat porttitor, tempor ac, tempor vitae, pede. Aenean vehicula velit eu tellus interdum rutrum. Maecenas commodo. Pellentesque nec elit. Fusce in lacus. Vivamus a libero vitae lectus hendrerit hendrerit.</p>
- </div>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click tabs to swap between content that is broken into logical sections.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - Toggle Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <script src="../../ui/jquery.effects.blind.js"></script>
- <script src="../../ui/jquery.effects.bounce.js"></script>
- <script src="../../ui/jquery.effects.clip.js"></script>
- <script src="../../ui/jquery.effects.drop.js"></script>
- <script src="../../ui/jquery.effects.explode.js"></script>
- <script src="../../ui/jquery.effects.fold.js"></script>
- <script src="../../ui/jquery.effects.highlight.js"></script>
- <script src="../../ui/jquery.effects.pulsate.js"></script>
- <script src="../../ui/jquery.effects.scale.js"></script>
- <script src="../../ui/jquery.effects.shake.js"></script>
- <script src="../../ui/jquery.effects.slide.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; }
- #effect h3 { margin: 0; padding: 0.4em; text-align: center; }
- </style>
- <script>
- $(function() {
- // run the currently selected effect
- function runEffect() {
- // get effect type from
- var selectedEffect = $( "#effectTypes" ).val();
-
- // most effect types need no options passed by default
- var options = {};
- // some effects have required parameters
- if ( selectedEffect === "scale" ) {
- options = { percent: 0 };
- } else if ( selectedEffect === "size" ) {
- options = { to: { width: 200, height: 60 } };
- }
-
- // run the effect
- $( "#effect" ).toggle( selectedEffect, options, 500 );
- };
-
- // set effect from select menu value
- $( "#button" ).click(function() {
- runEffect();
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="ui-widget-content ui-corner-all">
- <h3 class="ui-widget-header ui-corner-all">Toggle</h3>
- <p>
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi.
- </p>
- </div>
-</div>
-
-<select name="effects" id="effectTypes">
- <option value="blind">Blind</option>
- <option value="bounce">Bounce</option>
- <option value="clip">Clip</option>
- <option value="drop">Drop</option>
- <option value="explode">Explode</option>
- <option value="fold">Fold</option>
- <option value="highlight">Highlight</option>
- <option value="puff">Puff</option>
- <option value="pulsate">Pulsate</option>
- <option value="scale">Scale</option>
- <option value="shake">Shake</option>
- <option value="size">Size</option>
- <option value="slide">Slide</option>
-</select>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Effects - toggleClass Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.effects.core.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .toggler { width: 500px; height: 200px; position: relative; }
- #button { padding: .5em 1em; text-decoration: none; }
- #effect {position: relative; width: 240px; padding: 1em; letter-spacing: 0; font-size: 1.2em; border: 1px solid #000; background: #eee; color: #333; }
- .newClass { text-indent: 40px; letter-spacing: .4em; width: 410px; height: 100px; padding: 30px; margin: 10px; font-size: 1.6em; }
- </style>
- <script>
- $(function() {
- $( "#button" ).click(function() {
- $( "#effect" ).toggleClass( "newClass", 1000 );
- return false;
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div class="toggler">
- <div id="effect" class="newClass ui-corner-all">
- Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede.
- </div>
-</div>
-
-<a href="#" id="button" class="ui-state-default ui-corner-all">Run Effect</a>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>Click the button above to preview the effect.</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Widget - Default functionality</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.2.js"></script>
- <script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.position.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
- <script src="../../ui/jquery.ui.button.js"></script>
- <link rel="stylesheet" href="../demos.css">
- <style>
- .custom-colorize {
- font-size: 20px;
- position: relative;
- width: 75px;
- height: 75px;
- }
- .custom-colorize-changer {
- font-size: 10px;
- position: absolute;
- right: 0;
- bottom: 0;
- }
- </style>
- <script>
- $(function() {
- // the widget definition, where "custom" is the namespace,
- // "colorize" the widget name
- $.widget( "custom.colorize", {
- // default options
- options: {
- red: 255,
- green: 0,
- blue: 0,
-
- // callbacks
- change: null,
- random: null
- },
-
- // the constructor
- _create: function() {
- this.element
- // add a class for theming
- .addClass( "custom-colorize" )
- // prevent double click to select text
- .disableSelection();
-
- this.changer = $( "<button>", {
- text: "change",
- "class": "custom-colorize-changer"
- })
- .appendTo( this.element )
- .button();
-
- // bind click events on the changer button to the random method
- // in 1.9 would use this._bind( this.changer, { click: "random" });
- var that = this;
- this.changer.bind("click.colorize", function() {
- // _bind would handle this check
- if (that.options.disabled) {
- return;
- }
- that.random.apply(that, arguments);
- });
- this._refresh();
- },
-
- // called when created, and later when changing options
- _refresh: function() {
- this.element.css( "background-color", "rgb(" +
- this.options.red +"," +
- this.options.green + "," +
- this.options.blue + ")"
- );
-
- // trigger a callback/event
- this._trigger( "change" );
- },
-
- // a public method to change the color to a random value
- // can be called directly via .colorize( "random" )
- random: function( event ) {
- var colors = {
- red: Math.floor( Math.random() * 256 ),
- green: Math.floor( Math.random() * 256 ),
- blue: Math.floor( Math.random() * 256 )
- };
-
- // trigger an event, check if it's canceled
- if ( this._trigger( "random", event, colors ) !== false ) {
- this.option( colors );
- }
- },
-
- // events bound via _bind are removed automatically
- // revert other modifications here
- _destroy: function() {
- // remove generated elements
- this.changer.remove();
-
- this.element
- .removeClass( "custom-colorize" )
- .enableSelection()
- .css( "background-color", "transparent" );
- },
-
- // _setOptions is called with a hash of all options that are changing
- // always refresh when changing options
- _setOptions: function() {
- // in 1.9 would use _superApply
- $.Widget.prototype._setOptions.apply( this, arguments );
- this._refresh();
- },
-
- // _setOption is called for each individual option that is changing
- _setOption: function( key, value ) {
- // prevent invalid color values
- if ( /red|green|blue/.test(key) && (value < 0 || value > 255) ) {
- return;
- }
- // in 1.9 would use _super
- $.Widget.prototype._setOption.call( this, key, value );
- }
- });
-
- // initialize with default options
- $( "#my-widget1" ).colorize();
-
- // initialize with two customized options
- $( "#my-widget2" ).colorize({
- red: 60,
- blue: 60
- });
-
- // initialize with custom green value
- // and a random callback to allow only colors with enough green
- $( "#my-widget3" ).colorize( {
- green: 128,
- random: function( event, ui ) {
- return ui.green > 128;
- }
- });
-
- // click to toggle enabled/disabled
- $( "#disable" ).toggle(function() {
- // use the custom selector created for each widget to find all instances
- $( ":custom-colorize" ).colorize( "disable" );
- }, function() {
- $( ":custom-colorize" ).colorize( "enable" );
- });
-
- // click to set options after initalization
- $( "#black" ).click( function() {
- $( ":custom-colorize" ).colorize( "option", {
- red: 0,
- green: 0,
- blue: 0
- });
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<div>
- <div id="my-widget1">color me</div>
- <div id="my-widget2">color me</div>
- <div id="my-widget3">color me</div>
- <button id="disable">Toggle disabled option</button>
- <button id="black">Go black</button>
-</div>
-
-</div><!-- End demo -->
-
-
-
-<div class="demo-description">
-<p>This demo shows a simple custom widget built using the widget factory (jquery.ui.widget.js).</p>
-<p>The three boxes are initialized in different ways. Clicking them changes their background color. View source to see how it works, its heavily commented</p>
-<p><a href="http://wiki.jqueryui.com/w/page/12138135/Widget-factory">For more details on the widget factory, visit the jQuery UI planning wiki.</a></p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+++ /dev/null
-{
- "name": "jquery-ui",
- "title": "jQuery UI",
- "description": "Abstractions for low-level interaction and animation, advanced effects and high-level, themeable widgets, built on top of the jQuery JavaScript Library, that you can use to build highly interactive web applications.",
- "version": "1.8.24",
- "homepage": "https://github.com/jquery/jquery-ui",
- "author": {
- "name": "AUTHORS.txt"
- },
- "repository": {
- "type": "git",
- "url": "git://github.com/jquery/jquery-ui.git"
- },
- "bugs": {
- "url": "http://bugs.jqueryui.com/"
- },
- "licenses": [
- {
- "type": "MIT",
- "url": "http://www.opensource.org/licenses/MIT"
- },
- {
- "type": "GPL",
- "url": "http://www.opensource.org/licenses/GPL-2.0"
- }
- ],
- "dependencies": {},
- "devDependencies": {
- "grunt": "0.3.9",
- "grunt-css": "0.1.1",
- "grunt-compare-size": "0.1.1",
- "request": "2.9.153",
- "rimraf": "2.0.1"
- },
- "keywords": []
-}
There is a new UI 1.9.x compatible, built from scratch version, please see issue #140.
DOWNLOAD
-Latest: https://github.com/fnagel/jquery-ui/zipball/selectmenu (jQuery 1.7.2 / UI 1.8.20)
-Stable: https://github.com/fnagel/jquery-ui/zipball/selectmenu_v1.2.1 (jQuery 1.6.4 / UI 1.8.17)
+Latest: https://github.com/fnagel/jquery-ui/zipball/selectmenu (jQuery 1.8.2 / UI 1.8.24)
+Current stable: https://github.com/fnagel/jquery-ui/zipball/selectmenu_v1.2.2 (jQuery 1.7.2 / UI 1.8.20)
+Old stable: https://github.com/fnagel/jquery-ui/zipball/selectmenu_v1.2.1 (jQuery 1.6.4 / UI 1.8.17)
SUPPORT
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons">
- <h3 class="ui-accordion-header ui-accordion-header-active ui-helper-reset ui-state-active ui-corner-top" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-s"></span>
- <a href="#">Accordion Header 1</a>
- </h3>
- <div class="ui-accordion-content ui-accordion-content-active ui-helper-reset ui-widget-content ui-corner-bottom">
- Accordion Content 1
- </div>
- <h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 2</a>
- </h3>
- <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px; display: none;">
- Accordion Content 2
- </div>
- <h3 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 3</a>
- </h3>
- <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px; display: none;">
- Accordion Content 2
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Static Test : DL</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<dl class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons">
- <dt class="ui-accordion-header ui-accordion-header-active ui-helper-reset ui-state-active ui-corner-top" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-s"></span>
- <a href="#">Accordion Header 1</a>
- </dt>
- <dd class="ui-accordion-content ui-accordion-content-active ui-helper-reset ui-widget-content ui-corner-bottom">
- Accordion Content 1
- </dd>
- <dt class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 2</a>
- </dt>
- <dd class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px;">
- Accordion Content 2
- </dd>
- <dt class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 3</a>
- </dt>
- <dd class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px;">
- Accordion Content 2
- </dd>
-</dl>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Static Test : UL</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<ul class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons">
- <li>
- <h2 class="ui-accordion-header ui-accordion-header-active ui-helper-reset ui-state-active ui-corner-top" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-s"></span>
- <a href="#">Accordion Header 1</a>
- </h2>
- <div class="ui-accordion-content ui-accordion-content-active ui-helper-reset ui-widget-content ui-corner-bottom">
- Accordion Content 1
- <ul>
- <li>Some list item</li>
- <li>Some list item</li>
- </ul>
- </div>
- </li>
- <li>
- <h2 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 2</a>
- </h2>
- <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px;">
- Accordion Content 2
- </div>
- </li>
- <li>
- <h2 class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all" tabindex="0">
- <span class="ui-icon ui-icon-triangle-1-e"></span>
- <a href="#">Accordion Header 3</a>
- </h2>
- <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="height: 95px;">
- Accordion Content 3
- </div>
- </li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
- <style>
- div { margin: 0 0 1em; }
- h2 { margin: 2em 0 1em; }
- </style>
-</head>
-<body>
-
- <h2>Using button elements</h2>
-
- <div>
- <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Button</span>
- </button>
-
- <button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </button>
-
- <button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </button>
-
- <button class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </button>
-
- <button class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </button>
-
- <button class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Both icons</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </button>
-
- <button class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">No text</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </button>
- </div>
-
- <h2>Using anchor elements</h2>
-
- <div>
- <a href="#" class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Button</span>
- </a>
-
- <a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </a>
-
- <a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </a>
-
- <a href="#" class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </a>
-
- <a href="#" class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </a>
-
- <a href="#" class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Both icons</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </a>
-
- <a href="#" class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">No text</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </a>
- </div>
-
-
-
- <h2>Using label elements (used when proxying to radio or check inputs)</h2>
-
- <div>
- <label class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Button</span>
- </label>
-
- <label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </label>
-
- <label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </label>
-
- <label class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Primary icon</span>
- </label>
-
- <label class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-text">Secondary icon</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </label>
-
- <label class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">Both icons</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </label>
-
- <label class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
- <span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
- <span class="ui-button-text">No text</span>
- <span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
- </label>
- </div>
-
-
- <h2>Button Sets</h2>
-
- <div class="ui-buttonset">
- <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-left"><span class="ui-button-text">First</span></button>
- <button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Middle</span></button>
- <button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Middle</span></button>
- <button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-right"><span class="ui-button-text">Last</span></button>
- </div>
-
-
-
-<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
-<script>
- $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-</script>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Datepicker Static Markup Test Page</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
- <style type="text/css">
- .ui-datepicker { float:left; margin: 0 2em 2em 0;}
- .ui-datepicker-multi { clear:left; }
- </style>
- <!--[if gte IE 7]>
- <style type="text/css">
- .ui-datepicker { float:none; }
- </style>
- <![endif]-->
-</head>
-<body style="font-size: 62.5%;">
-
-<!-- Datepicker with read only month/year -->
-<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">December</span>
- <span class="ui-datepicker-year">2008</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
-</div>
-
-<!-- Datepicker with 1 combined select -->
-<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <select class="ui-datepicker-month-year">
- <optgroup name="2007">
- <option value="2007_0">January 2007</option>
- <option value="2007_1">February 2007</option>
- <option value="2007_2">March 2007</option>
- <option value="2007_3">April 2007</option>
- <option value="2007_4">May 2007</option>
- <option value="2007_5">June 2007</option>
- <option value="2007_6">July 2007</option>
- <option value="2007_7">August 2007</option>
- <option value="2007_8">September 2007</option>
- <option value="2007_9">October 2007</option>
- <option value="2007_10">November 2007</option>
- <option value="2007_11">December 2007</option>
- </optgroup>
- <optgroup name="2008">
- <option value="2008_0">January 2008</option>
- <option value="2008_1">February 2008</option>
- <option value="2008_2">March 2008</option>
- <option value="2008_3">April 2008</option>
- <option value="2008_4">May 2008</option>
- <option value="2008_5">June 2008</option>
- <option value="2008_6">July 2008</option>
- <option value="2008_7">August 2008</option>
- <option value="2008_8">September 2008</option>
- <option value="2008_9">October 2008</option>
- <option value="2008_10">November 2008</option>
- <option selected="selected" value="2008_11">December 2008</option>
- </optgroup>
- <optgroup name="2009">
- <option value="2009_0">January 2009</option>
- <option value="2009_1">February 2009</option>
- <option value="2009_2">March 2009</option>
- <option value="2009_3">April 2009</option>
- <option value="2009_4">May 2009</option>
- <option value="2009_5">June 2009</option>
- <option value="2009_6">July 2009</option>
- <option value="2009_7">August 2009</option>
- <option value="2009_8">September 2009</option>
- <option value="2009_9">October 2009</option>
- <option value="2009_10">November 2009</option>
- <option value="2009_11">December 2009</option>
- </optgroup>
- <optgroup name="2010">
- <option value="2010_0">January 2010</option>
- <option value="2010_1">February 2010</option>
- <option value="2010_2">March 2010</option>
- <option value="2010_3">April 2010</option>
- <option value="2010_4">May 2010</option>
- <option value="2010_5">June 2010</option>
- <option value="2010_6">July 2010</option>
- <option value="2010_7">August 2010</option>
- <option value="2010_8">September 2010</option>
- <option value="2010_9">October 2010</option>
- <option value="2010_10">November 2010</option>
- <option value="2010_11">December 2010</option>
- </optgroup>
- </select>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
-</div>
-
-<!-- Datepicker with 2 selects -->
-<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <select class="ui-datepicker-month">
- <option value="0">Jan</option>
- <option value="1">Feb</option>
- <option value="2">Mar</option>
- <option value="3">Apr</option>
- <option value="4">May</option>
- <option value="5">Jun</option>
- <option value="6">Jul</option>
- <option value="7">Aug</option>
- <option value="8">Sep</option>
- <option value="9">Oct</option>
- <option value="10">Nov</option>
- <option value="11" selected="selected">Dec</option>
- </select>
- <select class="ui-datepicker-year">
- <option value="1998">1998</option>
- <option value="1999">1999</option>
- <option value="2000">2000</option>
- <option value="2001">2001</option>
- <option value="2002">2002</option>
- <option value="2003">2003</option>
- <option value="2004">2004</option>
- <option value="2005">2005</option>
- <option value="2006">2006</option>
- <option value="2007">2007</option>
- <option value="2008" selected="selected">2008</option>
- <option value="2009">2009</option>
- <option value="2010">2010</option>
- <option value="2011">2011</option>
- <option value="2012">2012</option>
- <option value="2013">2013</option>
- <option value="2014">2014</option>
- <option value="2015">2015</option>
- <option value="2016">2016</option>
- <option value="2017">2017</option>
- <option value="2018">2018</option>
- </select>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
-</div>
-
-<!-- Datepicker with button bar -->
-<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <select class="ui-datepicker-month">
- <option value="0">Jan</option>
- <option value="1">Feb</option>
- <option value="2">Mar</option>
- <option value="3">Apr</option>
- <option value="4">May</option>
- <option value="5">Jun</option>
- <option value="6">Jul</option>
- <option value="7">Aug</option>
- <option value="8">Sep</option>
- <option value="9">Oct</option>
- <option value="10">Nov</option>
- <option value="11" selected="selected">Dec</option>
- </select>
- <select class="ui-datepicker-year">
- <option value="1998">1998</option>
- <option value="1999">1999</option>
- <option value="2000">2000</option>
- <option value="2001">2001</option>
- <option value="2002">2002</option>
- <option value="2003">2003</option>
- <option value="2004">2004</option>
- <option value="2005">2005</option>
- <option value="2006">2006</option>
- <option value="2007">2007</option>
- <option value="2008" selected="selected">2008</option>
- <option value="2009">2009</option>
- <option value="2010">2010</option>
- <option value="2011">2011</option>
- <option value="2012">2012</option>
- <option value="2013">2013</option>
- <option value="2014">2014</option>
- <option value="2015">2015</option>
- <option value="2016">2016</option>
- <option value="2017">2017</option>
- <option value="2018">2018</option>
- </select>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
- <div class="ui-datepicker-buttonpane ui-widget-content">
- <button class="ui-state-default ui-priority-primary ui-corner-all">Done</button>
- <button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all">Today</button>
- </div>
-</div>
-
-<!-- Multiple Datepickers with read only month/year -->
-<div class="ui-datepicker ui-datepicker-multi ui-datepicker-multi-2 ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="width:34em;">
- <div class="ui-datepicker-group ui-datepicker-group-first">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-left">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">December</span>
- <span class="ui-datepicker-year">2008</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-last">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-right">
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">January</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
-</div>
-
-<!-- Multiple Datepickers with read only month/year -->
-<div class="ui-datepicker ui-datepicker-multi ui-datepicker-multi-3 ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="width:51em;">
- <div class="ui-datepicker-group ui-datepicker-group-first">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-left">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">December</span>
- <span class="ui-datepicker-year">2008</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-middle">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">January</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-last">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-right">
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">February</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-buttonpane ui-widget-content">
- <button class="ui-state-default ui-priority-primary ui-corner-all">Done</button>
- <button class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all">Today</button>
- </div>
-</div>
-
-<!-- Multiple Datepickers with read only month/year -->
-<div class="ui-datepicker ui-datepicker-multi ui-datepicker-multi-4 ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" style="width:60em;">
- <div class="ui-datepicker-group ui-datepicker-group-first">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-left">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">December</span>
- <span class="ui-datepicker-year">2008</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-middle">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">January</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">1</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class=""><a href="#" class="ui-state-default">6</a></td>
- <td class=""><a href="#" class="ui-state-default">7</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">8</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class=""><a href="#" class="ui-state-default">13</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">14</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">15</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class=""><a href="#" class="ui-state-default">19</a></td>
- <td class=""><a href="#" class="ui-state-default">20</a></td>
- <td class=""><a href="#" class="ui-state-default">21</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">22</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class=""><a href="#" class="ui-state-default">27</a></td>
- <td class=""><a href="#" class="ui-state-default">28</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">29</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-middle">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">February</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-last">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-right">
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">March</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
-
- <div class="ui-datepicker-row-break"></div>
- <div class="ui-datepicker-group ui-datepicker-group-first">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">April</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-middle">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">May</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-middle">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">June</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
- </div>
- <div class="ui-datepicker-group ui-datepicker-group-last">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-right">
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">July</span>
- <span class="ui-datepicker-year">2009</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">1</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class=""><a href="#" class="ui-state-default">6</a></td>
- <td class=""><a href="#" class="ui-state-default">7</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">8</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class=""><a href="#" class="ui-state-default">13</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">14</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">15</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class=""><a href="#" class="ui-state-default">19</a></td>
- <td class=""><a href="#" class="ui-state-default">20</a></td>
- <td class=""><a href="#" class="ui-state-default">21</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">22</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class=""><a href="#" class="ui-state-default">27</a></td>
- <td class=""><a href="#" class="ui-state-default">28</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">29</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled"></td>
- </tr>
- </tbody>
- </table>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all">
- <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all">
- <a title="Prev" class="ui-datepicker-prev ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a>
- <a title="Next" class="ui-datepicker-next ui-corner-all" href="#"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a>
- <div class="ui-datepicker-title">
- <span class="ui-datepicker-month">December</span>
- <span class="ui-datepicker-year">2008</span>
- </div>
- </div>
- <table class="ui-datepicker-calendar">
- <thead>
- <tr>
- <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th>
- <th><span title="Monday">Mo</span></th>
- <th><span title="Tuesday">Tu</span></th>
- <th><span title="Wednesday">We</span></th>
- <th><span title="Thursday">Th</span></th>
- <th><span title="Friday">Fr</span></th>
- <th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class=""><a href="#" class="ui-state-default">1</a></td>
- <td class="ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight">2</a></td>
- <td class=""><a href="#" class="ui-state-default">3</a></td>
- <td class=""><a href="#" class="ui-state-default">4</a></td>
- <td class=""><a href="#" class="ui-state-default">5</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">6</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">7</a></td>
- <td class=""><a href="#" class="ui-state-default">8</a></td>
- <td class=""><a href="#" class="ui-state-default">9</a></td>
- <td class=""><a href="#" class="ui-state-default">10</a></td>
- <td class=""><a href="#" class="ui-state-default">11</a></td>
- <td class=""><a href="#" class="ui-state-default">12</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">13</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">14</a></td>
- <td class=""><a href="#" class="ui-state-default">15</a></td>
- <td class=""><a href="#" class="ui-state-default">16</a></td>
- <td class=""><a href="#" class="ui-state-default">17</a></td>
- <td class=""><a href="#" class="ui-state-default">18</a></td>
- <td class="ui-datepicker-current-day"><a href="#" class="ui-state-active">19</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">20</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">21</a></td>
- <td class=""><a href="#" class="ui-state-default">22</a></td>
- <td class=""><a href="#" class="ui-state-default">23</a></td>
- <td class=""><a href="#" class="ui-state-default">24</a></td>
- <td class=""><a href="#" class="ui-state-default">25</a></td>
- <td class=""><a href="#" class="ui-state-default">26</a></td>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">27</a></td>
- </tr>
- <tr>
- <td class="ui-datepicker-week-end"><a href="#" class="ui-state-default">28</a></td>
- <td class=""><a href="#" class="ui-state-default">29</a></td>
- <td class=""><a href="#" class="ui-state-default">30</a></td>
- <td class=""><a href="#" class="ui-state-default">31</a></td>
- <td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td><td class="ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">
- </td></tr>
- </tbody>
- </table>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-dialog ui-widget ui-widget-content ui-corner-all" role="dialog" aria-labelledby="ui-dialog-title-1">
- <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
- <span class="ui-dialog-title" id="ui-dialog-title-1">Dialog Title</span>
- <a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button" title="Close"><span class="ui-icon ui-icon-closethick">Close</span></a>
- </div>
- <div class="ui-dialog-content ui-widget-content" style="height: 13em;">
- <p> Dialog Content </p>
- </div>
- <div class="ui-resizable-n ui-resizable-handle"></div>
- <div class="ui-resizable-s ui-resizable-handle"></div>
- <div class="ui-resizable-e ui-resizable-handle"></div>
- <div class="ui-resizable-w ui-resizable-handle"></div>
- <div class="ui-resizable-ne ui-resizable-handle"></div>
- <div class="ui-resizable-se ui-resizable-handle ui-icon ui-icon-grip-diagonal-se"></div>
- <div class="ui-resizable-sw ui-resizable-handle"></div>
- <div class="ui-resizable-nw ui-resizable-handle"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Dialog Static Markup Test Page</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body style="font-size: 62.5%;">
-
-<!-- Dialog -->
-<div class="ui-dialog ui-widget ui-widget-content ui-corner-all" role="dialog" aria-labelledby="ui-dialog-title-1">
- <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
- <span class="ui-dialog-title" id="ui-dialog-title-1">Dialog Title</span>
- <a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button" title="Close"><span class="ui-icon ui-icon-closethick">Close</span></a>
- </div>
- <div class="ui-dialog-content ui-widget-content" style="height: 13em;">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div>
- <div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
- <button class="ui-state-default ui-priority-primary ui-corner-all">Primary</button>
- <button class="ui-state-default ui-priority-secondary ui-corner-all">Secondary</button>
- <button class="ui-state-default ui-state-disabled ui-corner-all">Disabled</button>
- </div>
- <div class="ui-resizable-n ui-resizable-handle"></div>
- <div class="ui-resizable-s ui-resizable-handle"></div>
- <div class="ui-resizable-e ui-resizable-handle"></div>
- <div class="ui-resizable-w ui-resizable-handle"></div>
- <div class="ui-resizable-ne ui-resizable-handle"></div>
- <div class="ui-resizable-se ui-resizable-handle ui-icon ui-icon-grip-diagonal-se"></div>
- <div class="ui-resizable-sw ui-resizable-handle"></div>
- <div class="ui-resizable-nw ui-resizable-handle"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-draggable"><p>Draggable</p></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-droppable"><p>Droppable</p></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>Themeroller CSS Framework Demo</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="static.js"></script>
- <style type="text/css">
- body {font-size: 62.5%; margin: 20px; font-family: Verdana, sans-serif; color: #444;}
- h1 {font-size: 1.5em; margin: 1em 0;}
- h2 {font-size: 1.3em; margin: 2em 0 .5em;}
- h2 a {font-size: .8em;}
- p {font-size: 1em; margin: 0; }
- form {margin: 4em 0;}
- div {padding: .2em .5em;}
- .ui-icon {float: left; margin-right: .5em;}
- form div.ui-state-error-text {background: none; border: 0;}
- </style>
-</head>
-<body>
-
-<div class="ui-widget">
- <div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
- <p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
- <strong>Alert:</strong> Sample ui-state-error style.</p>
- </div>
-
-
- <div class="ui-state-highlight ui-corner-all" style="margin-top: 20px; padding: 0 .7em;">
- <p><span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;"></span>
- <strong>Tip!</strong> Sample ui-state-highlight style.</p>
- </div>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI CSS Framework Icons Test Page</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
-
- <style type="text/css">
- body {font-size: 62.5%; margin: 20px; font-family: Verdana, sans-serif; color: #444;}
- h1 {font-size: 1.5em; margin: 1em 0;}
- h2 {font-size: 1.3em; margin: 2em 0 .5em;}
- h2 a {font-size: .8em;}
- p {font-size: 1.2em; }
- ul {margin: 0; padding: 0;}
- td div {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;}
- span.ui-icon { float: left; margin: 0 4px;}
- </style>
-
- <script type="text/javascript">
- $(function(){
- $('.ui-state-default').hover(
- function(){ $(this).addClass('ui-state-hover'); },
- function(){ $(this).removeClass('ui-state-hover'); }
- );
-
- $('.ui-state-default').click(function(){
- $(this).toggleClass('ui-state-active');
- });
-
- });
- </script>
-</head>
-<body>
-
-<p class="icons"></p>
-
-<table class="ui-widget icon-collection" cellpaddding="0" cellspacing="0">
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-n"><span class="ui-icon ui-icon-carat-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-ne"><span class="ui-icon ui-icon-carat-1-ne"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-e"><span class="ui-icon ui-icon-carat-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-se"><span class="ui-icon ui-icon-carat-1-se"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-s"><span class="ui-icon ui-icon-carat-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-sw"><span class="ui-icon ui-icon-carat-1-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-w"><span class="ui-icon ui-icon-carat-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-nw"><span class="ui-icon ui-icon-carat-1-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n-s"><span class="ui-icon ui-icon-carat-2-n-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e-w"><span class="ui-icon ui-icon-carat-2-e-w"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n"><span class="ui-icon ui-icon-triangle-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-ne"><span class="ui-icon ui-icon-triangle-1-ne"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-e"><span class="ui-icon ui-icon-triangle-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-se"><span class="ui-icon ui-icon-triangle-1-se"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s"><span class="ui-icon ui-icon-triangle-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-sw"><span class="ui-icon ui-icon-triangle-1-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-w"><span class="ui-icon ui-icon-triangle-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-nw"><span class="ui-icon ui-icon-triangle-1-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-n-s"><span class="ui-icon ui-icon-triangle-2-n-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-e-w"><span class="ui-icon ui-icon-triangle-2-e-w"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-n"><span class="ui-icon ui-icon-arrow-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-ne"><span class="ui-icon ui-icon-arrow-1-ne"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-e"><span class="ui-icon ui-icon-arrow-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-se"><span class="ui-icon ui-icon-arrow-1-se"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-s"><span class="ui-icon ui-icon-arrow-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-sw"><span class="ui-icon ui-icon-arrow-1-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-w"><span class="ui-icon ui-icon-arrow-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-nw"><span class="ui-icon ui-icon-arrow-1-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-n-s"><span class="ui-icon ui-icon-arrow-2-n-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-ne-sw"><span class="ui-icon ui-icon-arrow-2-ne-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-e-w"><span class="ui-icon ui-icon-arrow-2-e-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-se-nw"><span class="ui-icon ui-icon-arrow-2-se-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-n"><span class="ui-icon ui-icon-arrowstop-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-e"><span class="ui-icon ui-icon-arrowstop-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-s"><span class="ui-icon ui-icon-arrowstop-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-w"><span class="ui-icon ui-icon-arrowstop-1-w"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-n"><span class="ui-icon ui-icon-arrowthick-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-ne"><span class="ui-icon ui-icon-arrowthick-1-ne"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-e"><span class="ui-icon ui-icon-arrowthick-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-se"><span class="ui-icon ui-icon-arrowthick-1-se"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-s"><span class="ui-icon ui-icon-arrowthick-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-sw"><span class="ui-icon ui-icon-arrowthick-1-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-w"><span class="ui-icon ui-icon-arrowthick-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-nw"><span class="ui-icon ui-icon-arrowthick-1-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-n-s"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-ne-sw"><span class="ui-icon ui-icon-arrowthick-2-ne-sw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-e-w"><span class="ui-icon ui-icon-arrowthick-2-e-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-se-nw"><span class="ui-icon ui-icon-arrowthick-2-se-nw"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-n"><span class="ui-icon ui-icon-arrowthickstop-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-e"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-s"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-w"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-w"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-n"><span class="ui-icon ui-icon-arrowreturnthick-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-e"><span class="ui-icon ui-icon-arrowreturnthick-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-s"><span class="ui-icon ui-icon-arrowreturnthick-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-w"><span class="ui-icon ui-icon-arrowreturn-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-n"><span class="ui-icon ui-icon-arrowreturn-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-e"><span class="ui-icon ui-icon-arrowreturn-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-s"><span class="ui-icon ui-icon-arrowreturn-1-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-w"><span class="ui-icon ui-icon-arrowrefresh-1-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-n"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-e"><span class="ui-icon ui-icon-arrowrefresh-1-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-s"><span class="ui-icon ui-icon-arrowrefresh-1-s"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4"><span class="ui-icon ui-icon-arrow-4"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4-diag"><span class="ui-icon ui-icon-arrow-4-diag"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-extlink"><span class="ui-icon ui-icon-extlink"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-newwin"><span class="ui-icon ui-icon-newwin"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-refresh"><span class="ui-icon ui-icon-refresh"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-shuffle"><span class="ui-icon ui-icon-shuffle"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-transfer-e-w"><span class="ui-icon ui-icon-transfer-e-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-transferthick-e-w"><span class="ui-icon ui-icon-transferthick-e-w"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-folder-collapsed"><span class="ui-icon ui-icon-folder-collapsed"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-folder-open"><span class="ui-icon ui-icon-folder-open"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-document"><span class="ui-icon ui-icon-document"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-document-b"><span class="ui-icon ui-icon-document-b"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-note"><span class="ui-icon ui-icon-note"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-mail-open"><span class="ui-icon ui-icon-mail-open"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-suitcase"><span class="ui-icon ui-icon-suitcase"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-comment"><span class="ui-icon ui-icon-comment"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-person"><span class="ui-icon ui-icon-person"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-print"><span class="ui-icon ui-icon-print"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-trash"><span class="ui-icon ui-icon-trash"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-locked"><span class="ui-icon ui-icon-locked"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-unlocked"><span class="ui-icon ui-icon-unlocked"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-bookmark"><span class="ui-icon ui-icon-bookmark"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-tag"><span class="ui-icon ui-icon-tag"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-home"><span class="ui-icon ui-icon-home"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-flag"><span class="ui-icon ui-icon-flag"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-calculator"><span class="ui-icon ui-icon-calculator"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-cart"><span class="ui-icon ui-icon-cart"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-pencil"><span class="ui-icon ui-icon-pencil"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-clock"><span class="ui-icon ui-icon-clock"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-disk"><span class="ui-icon ui-icon-disk"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-calendar"><span class="ui-icon ui-icon-calendar"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-zoomin"><span class="ui-icon ui-icon-zoomin"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-zoomout"><span class="ui-icon ui-icon-zoomout"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-search"><span class="ui-icon ui-icon-search"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-wrench"><span class="ui-icon ui-icon-wrench"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-gear"><span class="ui-icon ui-icon-gear"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-heart"><span class="ui-icon ui-icon-heart"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-star"><span class="ui-icon ui-icon-star"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-link"><span class="ui-icon ui-icon-link"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-cancel"><span class="ui-icon ui-icon-cancel"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-plus"><span class="ui-icon ui-icon-plus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-minus"><span class="ui-icon ui-icon-minus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-minusthick"><span class="ui-icon ui-icon-minusthick"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-close"><span class="ui-icon ui-icon-close"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-closethick"><span class="ui-icon ui-icon-closethick"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-key"><span class="ui-icon ui-icon-key"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-lightbulb"><span class="ui-icon ui-icon-lightbulb"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-scissors"><span class="ui-icon ui-icon-scissors"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-clipboard"><span class="ui-icon ui-icon-clipboard"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-copy"><span class="ui-icon ui-icon-copy"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-contact"><span class="ui-icon ui-icon-contact"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-image"><span class="ui-icon ui-icon-image"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-video"><span class="ui-icon ui-icon-video"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-script"><span class="ui-icon ui-icon-script"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-alert"><span class="ui-icon ui-icon-alert"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-info"><span class="ui-icon ui-icon-info"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-notice"><span class="ui-icon ui-icon-notice"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-help"><span class="ui-icon ui-icon-help"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-bullet"><span class="ui-icon ui-icon-bullet"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-radio-off"><span class="ui-icon ui-icon-radio-off"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-radio-on"><span class="ui-icon ui-icon-radio-on"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-pin-w"><span class="ui-icon ui-icon-pin-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-pin-s"><span class="ui-icon ui-icon-pin-s"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-volume-off"><span class="ui-icon ui-icon-volume-off"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-volume-on"><span class="ui-icon ui-icon-volume-on"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-power"><span class="ui-icon ui-icon-power"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-signal-diag"><span class="ui-icon ui-icon-signal-diag"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-signal"><span class="ui-icon ui-icon-signal"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-battery-0"><span class="ui-icon ui-icon-battery-0"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-battery-1"><span class="ui-icon ui-icon-battery-1"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-battery-2"><span class="ui-icon ui-icon-battery-2"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-battery-3"><span class="ui-icon ui-icon-battery-3"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-plus"><span class="ui-icon ui-icon-circle-plus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-minus"><span class="ui-icon ui-icon-circle-minus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-close"><span class="ui-icon ui-icon-circle-close"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-e"><span class="ui-icon ui-icon-circle-triangle-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-s"><span class="ui-icon ui-icon-circle-triangle-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-w"><span class="ui-icon ui-icon-circle-triangle-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-n"><span class="ui-icon ui-icon-circle-triangle-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-e"><span class="ui-icon ui-icon-circle-arrow-e"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-s"><span class="ui-icon ui-icon-circle-arrow-s"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-w"><span class="ui-icon ui-icon-circle-arrow-w"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-n"><span class="ui-icon ui-icon-circle-arrow-n"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomin"><span class="ui-icon ui-icon-circle-zoomin"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomout"><span class="ui-icon ui-icon-circle-zoomout"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circle-check"><span class="ui-icon ui-icon-circle-check"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-plus"><span class="ui-icon ui-icon-circlesmall-plus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-minus"><span class="ui-icon ui-icon-circlesmall-minus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-close"><span class="ui-icon ui-icon-circlesmall-close"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-plus"><span class="ui-icon ui-icon-squaresmall-plus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-minus"><span class="ui-icon ui-icon-squaresmall-minus"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-close"><span class="ui-icon ui-icon-squaresmall-close"></span></div></td>
- </tr>
- <tr>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-vertical"><span class="ui-icon ui-icon-grip-dotted-vertical"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-horizontal"><span class="ui-icon ui-icon-grip-dotted-horizontal"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-vertical"><span class="ui-icon ui-icon-grip-solid-vertical"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-horizontal"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-gripsmall-diagonal-se"><span class="ui-icon ui-icon-gripsmall-diagonal-se"></span></div></td>
- <td><div class="ui-state-default ui-corner-all" title=".ui-icon-grip-diagonal-se"><span class="ui-icon ui-icon-grip-diagonal-se"></span></div></td></ul>
- </tr>
-</table>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Static Tests</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript">
- $(function() {
-
- });
- </script>
-</head>
-
-<body>
-
-<h1>jQuery UI Static Tests</h1>
-
-<h2>Interactions</h2>
-<ul>
- <li><a href="draggable/default.html">Draggable</a></li>
- <li><a href="droppable/default.html">Droppable</a></li>
- <li><a href="resizable/default.html">Resizable</a></li>
- <li><a href="selectable/default.html">Selectable</a></li>
- <li><a href="sortable/default.html">Sortable</a></li>
-</ul>
-
-<h2>Widgets</h2>
-<ul>
- <li><a href="accordion/default.html">Accordion</a></li>
- <li><a href="autocomplete/default.html">Autocomplete</a></li>
- <li><a href="button/default.html">Button</a></li>
- <li><a href="datepicker/default.html">Datepicker</a></li>
- <li><a href="dialog/default.html">Dialog</a></li>
- <li><a href="progressbar/default.html">Progressbar</a></li>
- <li><a href="slider/default.html">Slider</a></li>
- <li><a href="tabs/default.html">Tabs</a></li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Menu Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-
- <script src="http://jqueryui.com/themeroller/themeswitchertool/" type="text/javascript"></script>
- <script>
- $(document).ready(function(){
- $('#switcher').themeswitcher();
- });
- </script>
-
-
-
- <style type="text/css">
-/* styles for this page only */
-.ui-menu { width: 200px; }
-#flyout .ui-menu { position: relative; }
-#flyout .ui-menu.ui-menu-icons { position: absolute; }
-
-.ui-menu.ui-menu-icons { position: relative; }
-.ui-menu.ui-menu-icons .ui-menu-item a { position: relative; padding-left: 2em; }
-
-/* left-aligned icon */
-.ui-menu .ui-icon { position: absolute; top: .2em; left: .2em; }
-
-/* right-aligned icon */
-.ui-menu .ui-icon.ui-menu-icon { position: static; float: right; }
- </style>
-
-</head>
-<body>
-
-<div id="switcher" style="position: absolute; top: 20px; right: 20px;"></div>
-
-
-<!-- NOTES:
-
-* Added "ui-menu-icons" class to set a left indent value for all menu items in a single menu
-
--->
-
-
-<h2>Default</h2>
-
-<ul role="menu" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-bottom">
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-print"></span>Aberdeen</a></li>
- <li class="ui-menu-item" role="menuitem" id="ui-active-menuitem"><a href="#" tabindex="-1" class="ui-state-hover ui-corner-all">Ada</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adamsville</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-scissors"></span>Addyston really long menu option to show wrap</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-wrench"></span>Adelphi</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all"><span class="ui-icon ui-icon-star"></span>Adena</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adrian</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Akron</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Albany</a></li>
-</ul>
-
-<br /><br />
-
-<div id="drilldown">
-
-<h2>Drilldown</h2>
-
-<ul role="listbox" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
- <li role="menuitem" class="ui-menu-item">
- <a href="#" tabindex="-1" class="ui-state-hover ui-corner-all"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Amsterdam</a>
- <ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Aberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Ada</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Adamsville</a>
- <ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Cologne</a>
- <ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Frankfurt</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Addyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Amesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-star"></span>Anaheim</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-heart"></span>Cologne</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-key"></span>Frankfurt</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Magdeburg</a>
- <ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-widget ui-widget-content ui-corner-all" style="display: none;">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Munich</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Utrecht</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Zurich</a></li>
-</ul>
-
-</div>
-
-<br /><br />
-
-<div id="flyout">
-
-<h2>Flyout / nested</h2>
-
-<ul aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all" id="menu">
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-scissors"></span>Amsterdam</a>
- <ul style="display: block; top: 88.5px; left: 205px;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Aberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Ada</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-state-active ui-corner-all" href="#"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Adamsville</a>
- <ul style="display: block; top: 73px; left: -11px; z-index: 9999;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-corner-all" href="#">Cologne</a>
- <ul style="display: none;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-state-hover ui-corner-all" href="#">Frankfurt</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Addyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Amesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Anaheim</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-pencil"></span>Cologne</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-clock"></span>Frankfurt</a></li>
- <li role="menuitem" class="ui-menu-item">
- <a tabindex="-1" class="ui-state-active ui-corner-all" href="#"><span class="ui-icon ui-icon-print"></span><span class="ui-icon ui-menu-icon ui-icon-carat-1-e"></span>Magdeburg</a>
- <ul style="display: none;" aria-activedescendant="ui-active-menuitem" role="listbox" class="ui-menu ui-menu-icons ui-widget ui-widget-content ui-corner-all">
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mberdeen</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mda</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mdamsville</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mddyston</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Mmesville</a></li>
- </ul>
- </li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-lightbulb"></span>Munich</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#"><span class="ui-icon ui-icon-clipboard"></span>Utrecht</a></li>
- <li role="menuitem" class="ui-menu-item"><a tabindex="-1" class="ui-corner-all" href="#">Zurich</a></li>
-</ul>
-
-</div>
-
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Menu Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-
-</head>
-<body>
-
-
-<ul role="menu" aria-activedescendant="ui-active-menuitem" class="ui-menu ui-widget ui-widget-content ui-corner-bottom">
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Aberdeen</a></li>
- <li class="ui-menu-item" role="menuitem" id="ui-active-menuitem"><a href="#" tabindex="-1" class="ui-state-hover ui-corner-all">Ada</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adamsville</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Addyston</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adelphi</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adena</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Adrian</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Akron</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Albany</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alexandria</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alger</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alledonia</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alliance</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alpha</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvada</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Alvordton</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amanda</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amelia</a></li>
- <li class="ui-menu-item" role="menuitem"><a href="#" tabindex="-1" class="ui-corner-all">Amesville</a></li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Dialog Static Markup Test Page</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="static.js"></script>
- <script type="text/javascript">
-
- //overlay sample plugin ( to become part of positionTo )
- $.fn.overlay = function(){
- var that = this;
- //overlay widget markup
- var overlay = $('<div class="ui-overlay">'+
- '<iframe class="ui-helper-zfix" src="#" frameborder="0"></iframe>'+
- '<div class="ui-widget-overlay"></div>'+
- '<div class="ui-widget-shadow ui-corner-all"></div>'+
- '</div>');
- //ui-widget-shadow gets set to exact widget dims and offset (TL). Shadow appearance/thickness is handled in ui.theme.css through margins and padding
- overlay.find('.ui-widget-shadow')
- .width( $(that)[0].offsetWidth )
- .height( $(that)[0].offsetHeight )
- .css({
- position: 'absolute',
- left: $(that)[0].offsetLeft,
- top: $(that)[0].offsetTop
- });
- $(that).before(overlay);
- return this;
- };
-
- //call overlay
- $(function(){
- $('.ui-dialog').overlay();
- });
-
- </script>
-</head>
-<body style="font-size: 62.5%;">
-
-
-
-
-<!-- ui-dialog -->
-<div class="ui-dialog ui-widget ui-widget-content ui-corner-all" style="position: absolute; left: 40px; top: 40px; ">
- <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
- <span class="ui-dialog-title">Dialog Title</span>
- <a href="#" class="ui-dialog-titlebar-close ui-corner-all" title="Close"><span class="ui-icon ui-icon-closethick">Close</span></a>
- </div>
- <div class="ui-dialog-content ui-widget-content" style="height: 13em;">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div>
- <div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
- <button class="ui-state-default ui-priority-primary ui-corner-all">Primary</button>
- <button class="ui-state-default ui-priority-secondary ui-corner-all">Secondary</button>
- <button class="ui-state-default ui-state-disabled ui-corner-all">Disabled</button>
- </div>
- <div class="ui-resizable-n ui-resizable-handle"></div>
- <div class="ui-resizable-s ui-resizable-handle"></div>
- <div class="ui-resizable-e ui-resizable-handle"></div>
- <div class="ui-resizable-w ui-resizable-handle"></div>
- <div class="ui-resizable-ne ui-resizable-handle"></div>
- <div class="ui-resizable-se ui-resizable-handle ui-icon ui-icon-grip-diagonal-se"></div>
- <div class="ui-resizable-sw ui-resizable-handle"></div>
- <div class="ui-resizable-nw ui-resizable-handle"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Progressbar Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-progressbar ui-widget ui-widget-content ui-corner-all" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="13">
- <div class="ui-progressbar-value ui-widget-header ui-corner-left" style="width: 0%;"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Progressbar Static Markup Test Page</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body style="font-size: 62.5%;">
-
-<!-- Progressbar -->
-<div class="ui-progressbar ui-widget ui-widget-content ui-corner-all" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="13">
- <div class="ui-progressbar-value ui-widget-header ui-corner-left" style="width:13%;"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-resizable">
- <p>
- Resizable
- </p>
- <div class="ui-resizable-handle ui-resizable-e"></div>
- <div class="ui-resizable-handle ui-resizable-s"></div>
- <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Selectable Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-selectable">
- <div class="ui-selectee">Selectable 1</div>
- <div class="ui-selectee">Selectable 2</div>
- <div class="ui-selectee">Selectable 3</div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Default vertical</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 0%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider horizontal</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><a style="left: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider horizontal range</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="left: 25%; width: 50%;" class="ui-slider-range ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider horizontal range max</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width:25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="left: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider horizontal range min</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"><div style="width: 25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="left: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider vertical</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><a style="bottom: 50%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider vertical range</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="bottom: 25%; height: 50%;" class="ui-slider-range ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider vertical range max</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height: 25%;" class="ui-slider-range ui-slider-range-max ui-widget-header"></div><a style="bottom: 75%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Static Test : Slider vertical range min</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-slider ui-slider-vertical ui-widget ui-widget-content ui-corner-all"><div style="height:25%;" class="ui-slider-range ui-slider-range-min ui-widget-header"></div><a style="bottom: 25%;" class="ui-slider-handle ui-state-default ui-corner-all" href="#"></a></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-sortable"><div>Sortable 1</div><div>Sortable 2</div><div>Sortable 3</div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Tabs Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-tabs ui-widget ui-widget-content ui-corner-all">
- <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
- <li class="ui-state-default ui-state-active ui-tabs-selected ui-corner-top"><a href="#fragment-1">First</a></li>
- <li class="ui-state-default ui-corner-top"><a href="#fragment-2">Second</span></a></li>
- <li class="ui-state-default ui-corner-top"><a href="#fragment-3">Third</a></li>
- <li class="ui-state-default ui-state-disabled ui-corner-top"><a href="#fragment-3">Disabled</a></li>
- </ul>
- <div id="fragment-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
- </div>
- <div id="fragment-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
- Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.
- </div>
- <div id="fragment-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
- Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Tabs Static Test : Default</title>
- <link rel="stylesheet" href="../static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../static.js"></script>
-</head>
-<body>
-
-<div class="ui-tabs ui-widget ui-widget-content ui-corner-all">
- <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
- <li class="ui-state-default ui-state-active ui-tabs-selected ui-corner-top"><a href="#fragment-1">First</a></li>
- <li class="ui-state-default ui-corner-top"><a href="#fragment-2">Second</span></a></li>
- <li class="ui-state-default ui-corner-top"><a href="#fragment-3">Third</a></li>
- <li class="ui-state-default ui-state-disabled ui-corner-top"><a href="#fragment-3">Disabled</a></li>
- </ul>
- <div id="fragment-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
- </div>
- <div id="fragment-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
- Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.
- </div>
- <div id="fragment-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
- Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion();
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Static Test : Accordion dl</title>
- <link rel="stylesheet" href="../../static/static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("dl").accordion({
- change: function(event, ui) {
- console.log("new: " + ui.newContent.text());
- console.log("old: " + ui.oldContent.text());
- }
- });
- });
- </script>
-</head>
-<body>
-
-<dl>
- <dt><a href="#">Accordion Header 1</a></dt>
- <dd>
- Accordion Content 1
- <dl>
- <dt><a href="#">Term 1</a></dt>
- <dd>Definition 1</dd>
- <dt><a href="#">Term 2</a></dt>
- <dd>Definition 2</dd>
- </dl>
- </dd>
- <dt><a href="#">Accordion Header 2</a></dt>
- <dd>
- Accordion Content 2
- </dd>
- <dt><a href="#">Accordion Header 3</a></dt>
- <dd>
- Accordion Content 3
- </dd>
-</dl>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion method destroy</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion().accordion("destroy");
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion method disable</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion().accordion("disable");
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option animated 'bounceslide'</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- animated: 'bounceslide'
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option animated easeslide</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- animated: 'easeslide'
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option animated false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- animated: false
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option animated slide</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- animated: 'slide'
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option animated true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- animated: true
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option autoHeight false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- autoHeight: false
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- <ul>
- <li>list item</li>
- <li>list item</li>
- <li>list item</li>
- </ul>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option autoHeight true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- autoHeight: true
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- <ul>
- <li>list item</li>
- <li>list item</li>
- <li>list item</li>
- </ul>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option autoHeight true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- fillSpace: true
- });
- })
- </script>
-</head>
-<body>
-
-<div style="height: 500px; width: 500px; border: 1px solid red;">
- <div id="accordion" style="width:490px;">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div style="padding-top: 1em">
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div style="padding-top: 3em">
- Accordion Content 2
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- <p>paragraph</p>
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div style="padding-top: 0">
- Accordion Content 3
- <ul>
- <li>list item</li>
- <li>list item</li>
- <li>list item</li>
- </ul>
- </div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion option navigation true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- navigation: true
- });
- })
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#sec1">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#sec2">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#sec3">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-<h2>Note: you have to refresh the page after clicking each link below</h2>
-
-<ul>
- <li><a href="#sec1">Section 1</a></li>
- <li><a href="#sec2">Section 2</a></li>
- <li><a href="#sec3">Section 3</a></li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion ticket #4322</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <style>
- p {margin: .5em 0;}
- </style>
- <script type="text/javascript">
- $(function() {
- $("#accordion1, #accordion2").accordion();
- })
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4322">#4322 - Accordion going smaller and smaller in IE 6</a></h1>
-
- <div id="accordion1" style="width:200px">
- <h3><a href="#">Section 1</a></h3>
- <div>
-
- <p>
- Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
- ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
- amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
- odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
- </p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>
- Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
- purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
- velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
- suscipit faucibus urna.
- </p>
- </div>
- </div>
-
- content below
-
- <div id="accordion2">
- <h3><a href="#">Section 1</a></h3>
- <div>
-
- <p>
- Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
- ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
- amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
- odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
- </p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>
- Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
- purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
- velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
- suscipit faucibus urna.
- </p>
- </div>
- </div>
-
- content below
-
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion ticket #4331</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion();
- })
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4331">#4331 - Accordion requires theme CSS to function in IE</a></h1>
-
-<div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion ticket #4444</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({
- autoHeight: false
- });
- })
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4444">#4444 - Accordion Content disappears with autoHeight set to false in IE 6</a></h1>
-
-<div id="accordion" >
- <h3><a href="#">Section 1</a></h3>
- <div >
- Accordion Content 1<br>
- <a href="#">Link Test #1</a>
- </div>
-
- <h3><a href="#">Section 2</a></h3>
- <div>
- <a href="#" >Accordion Content 2</a>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>Accordion Content 3 </p>
- <ul>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- <li>List item</li>
- </ul>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Accordion Visual Test : Accordion ul</title>
- <link rel="stylesheet" href="../../static/static.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.base.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.theme.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript">
- $(function(){
- $("#accordion").accordion()
- });
- </script>
-</head>
-<body>
- <ul id="accordion">
- <li>
- <h2>
- <a href="#">Accordion Header 1</a>
- </h2>
- <div>
- Accordion Content 1
- <ul>
- <li>Some list item</li>
- <li>Some list item</li>
- </ul>
- </div>
- </li>
- <li>
- <h2>
- <a href="#">Accordion Header 2</a>
- </h2>
- <div>Accordion Content 2</div>
- </li>
- <li>
- <h2>
- <a href="#">Accordion Header 3</a>
- </h2>
- <div>Accordion Content 2</div>
- </li>
- </ul>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Simple All</title>
- <link rel="stylesheet" href="all.css" type="text/css">
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.progressbar.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.selectable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion({ header: "h3" });
- $("#autocomplete").autocomplete({
- source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"]
- });
- $("#button").button();
- $("#buttonset").buttonset();
- $("#datepicker").datepicker();
- $("#dialog button").click(function() {
- $("#dlg").clone().dialog();
- });
- $("#draggable").draggable();
- $(".draggable").draggable();
- $("#droppable").droppable({
- accept: '.draggable',
- drop: function(ev, ui) {
- ui.draggable.css({ position: 'relative', top: 0, left: 0 }).clone().appendTo(this);
- }
- });
- $("#progressbar").progressbar({ value: 37 });
- $("#resizable").resizable();
- $("#selectable").selectable();
- $("#slider").slider();
- $("#sortable").sortable();
- $("#tabs").tabs();
- });
- </script>
-</head>
-<body>
-
-<ul class="plugins">
-<li class="plugin">
- Accordion
- <div id="accordion">
- <div>
- <h3><a href="#">First</a></h3>
- <div>
- Lorem ipsum dolor sit amet.
- </div>
- </div>
- <div>
- <h3><a href="#">Second</a></h3>
- <div>
- Phasellus mattis tincidunt nibh.
- </div>
- </div>
- <div>
- <h3><a href="#">Third</a></h3>
- <div>
- Nam dui erat, auctor a, dignissim quis.
- </div>
- </div>
- </div>
-</li>
-<li class="plugin">
- Autocomplete
- <div>
- <input id="autocomplete" />
- <select>
- <option>iframe test</option>
- </select>
- </div>
-</li>
-<li class="plugin">
- Button
- <div>
- <button id="button">A button element</button>
- <form style="margin-top: 1em;">
- <div id="buttonset">
- <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
- <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
- <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
- </div>
- </form>
- </div>
-</li>
-<li class="plugin">
- Datepicker
- <div>
- <input type="text" id="datepicker">
- </div>
-</li>
-<li class="plugin">
- Dialog
- <div id="dialog">
- <button>Open</button>
- <div id="dlg" title="Dialog Title">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div>
- </div>
-</li>
-<li class="plugin">
- Draggable
- <div id="draggable"></div>
-</li>
-<li class="plugin">
- Droppable
- <div class="draggable">D</div>
- <div class="draggable">R</div>
- <div class="draggable">A</div>
- <div class="draggable">G</div>
- <div id="droppable">
- DROP
- <hr>
- </div>
-</li>
-<li class="plugin">
- Progressbar
- <div id="progressbar"></div>
-</li>
-<li class="plugin">
- Resizable
- <div id="resizable"></div>
-</li>
-<li class="plugin">
- Selectable
- <div id="selectable">
- <div>1</div>
- <div>2</div>
- <div>3</div>
- <div>4</div>
- <div>5</div>
- <div>6</div>
- <div>7</div>
- <div>8</div>
- <div>9</div>
- </div>
-</li>
-<li class="plugin">
- Slider
- <div id="slider"></div>
-</li>
-<li class="plugin">
- Sortable
- <div id="sortable">
- <div>C</div>
- <div>I</div>
- <div>G</div>
- <div>F</div>
- <div>D</div>
- <div>H</div>
- <div>A</div>
- <div>E</div>
- <div>B</div>
- </div>
-</li>
-<li class="plugin">
- Tabs
- <div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- <li><a href="#tabs-3">Third</a></li>
- </ul>
- <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
- <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
- <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
- </div>
-</li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Animate Visual Test : Animate backgroundColor hex</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- function hexFromRGB (r, g, b) {
- var hex = [
- r.toString(16),
- g.toString(16),
- b.toString(16)
- ];
- $.each(hex, function (nr, val) {
- if (val.length == 1) {
- hex[nr] = '0' + val;
- }
- });
- return hex.join('').toUpperCase();
- }
- function randomColorHex() {
- return '#' + hexFromRGB(Math.floor(Math.random()*256), Math.floor(Math.random()*256), Math.floor(Math.random()*256));
- }
- $(function() {
- $("#go").click(function() {
- $("#animate-backgroundColor").stop().animate({ backgroundColor: randomColorHex() }, "fast");
- });
- })
- </script>
- <style type="text/css">
- #animate-backgroundColor { width: 100px; height: 100px; background-color: gray; }
- </style>
-</head>
-<body>
-
-<div id="animate-backgroundColor"></div>
-
-<button id="go">Go</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Animate Visual Test : Animate backgroundColor rgb</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- function randomColorRGB() {
- return 'rgb('
- + Math.floor(Math.random()*256)
- + ', ' + Math.floor(Math.random()*256)
- + ', ' + Math.floor(Math.random()*256)
- + ')';
- }
- $(function() {
- $("#go").click(function() {
- $("#animate-backgroundColor").stop().animate({ backgroundColor: randomColorRGB() }, "fast");
- });
- })
- </script>
- <style type="text/css">
- #animate-backgroundColor { width: 100px; height: 100px; background-color: gray; }
- </style>
-</head>
-<body>
-
-<div id="animate-backgroundColor"></div>
-
-<button id="go">Go</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Animate Visual Test : Animate color hex</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- function hexFromRGB (r, g, b) {
- var hex = [
- r.toString(16),
- g.toString(16),
- b.toString(16)
- ];
- $.each(hex, function (nr, val) {
- if (val.length == 1) {
- hex[nr] = '0' + val;
- }
- });
- return hex.join('').toUpperCase();
- }
- function randomColorHex() {
- return '#' + hexFromRGB(Math.floor(Math.random()*256), Math.floor(Math.random()*256), Math.floor(Math.random()*256));
- }
- $(function() {
- $("#go").click(function() {
- $("#animate-color").stop().animate({ color: randomColorHex() }, "fast");
- });
- })
- </script>
- <style type="text/css">
- #animate-color { width: 250px; height: 100px; color: gray; }
- </style>
-</head>
-<body>
-
-<div id="animate-color">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
-
-<button id="go">Go</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Animate Visual Test : Animate color rgb</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript">
- function randomColorRGB() {
- return 'rgb('
- + Math.floor(Math.random()*256)
- + ', ' + Math.floor(Math.random()*256)
- + ', ' + Math.floor(Math.random()*256)
- + ')';
- }
- $(function() {
- $("#go").click(function() {
- $("#animate-color").stop().animate({ color: randomColorRGB() }, "fast");
- });
- })
- </script>
- <style type="text/css">
- #animate-color { width: 250px; height: 100px; color: gray; }
- </style>
-</head>
-<body>
-
-<div id="animate-color">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</div>
-
-<button id="go">Go</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Autocomplete Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- function log(message) {
- $("<div/>").text(message).prependTo("#log");
- $("#log").scrollTop(0);
- }
-
- function enable() {
- $("#tags").autocomplete({
- source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"],
- delay: 0,
- search: function() {
- log("Searching for: " + this.value);
- },
- open: function() {
- log("Found something");
- },
- focus: function(event, ui) {
- log("Moving focus to " + ui.item.label);
- },
- close: function() {
- log("Hiding suggestions");
- },
- select: function(event, ui) {
- log("Selected: " + ui.item.value);
- },
- change: function(event, ui) {
- log(ui.item ? ("Changed to: " + ui.item.value) : "Nothing selected, input was " + this.value);
- }
- });
- }
- enable();
- $("#toggle").toggle(function() {
- $("#tags").autocomplete("destroy");
- }, enable);
- });
- </script>
-</head>
-<body>
-
-<div class="ui-widget">
- <label for="tags">Tags: </label>
- <input class="ui-widget ui-widget-content ui-corner-all" id="tags" />
-</div>
-<div>
- <label for="tags">Select: </label>
- <select>
- <option>label</option>
- </select>
-</div>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-<button id="toggle">Toggle widget</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual push: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <style type="text/css">
- #toolbar { margin-top: 2em; padding:0.2em; }
- #ops1, #ops2, #format, #mode { margin-right: 1em }
- </style>
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.metadata.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
- var buttons = $('#push button, #check').button();
- var buttonSets = $('#radio0, #radio1, #radio2, #ops1, #format, #ops2, #mode, #inputs, #anchors').buttonset();
-
- buttons.add(buttonSets).click(function(event) {
- var target = $(event.target);
- if (target.closest('.ui-button:not(.ui-state-disabled)').length) {
- $("<div></div>")
- .text("Clicked " + (target.text() || target.val()))
- .appendTo("#log");
- window.console && console.log(this, arguments);
- }
- });
-
- $("#disable-widgets").toggle(function() {
- buttons.button("disable");
- buttonSets.buttonset("disable");
- }, function() {
- buttons.button("enable");
- buttonSets.buttonset("enable");
- });
- $("#toggle-widgets").toggle(function() {
- buttons.button();
- buttonSets.buttonset();
- }, function() {
- buttons.button("destroy");
- buttonSets.buttonset("destroy");
- }).click();
- });
- </script>
-</head>
-<body>
-
-<div id="push">
- <div>
- No icon
- <button>Simple button, only text</button>
- <button class="ui-priority-secondary">Secondary priority button</button>
- </div>
- <br/>
- <div>
- With icon
- <button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
- <button class="{button:{icons:{primary:'ui-icon-locked'}}}">Primary icon</button>
- <button class="{button:{icons:{secondary:'ui-icon-triangle-1-s'}}}">Secondary icon</button>
- <button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Both icons</button>
- <button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons and no text</button>
- </div>
-</div>
-
-<div id="toggle" style="margin-top: 2em;">
- <input type="checkbox" id="check" /><label for="check">Toggle</label>
-</div>
-
-<div id="radio0" style="margin-top: 2em;">
- <input type="radio" id="radio01" name="radio" checked="checked" /><label for="radio01">Choice 1</label>
- <input type="radio" id="radio02" name="radio" /><label for="radio02">Choice 2</label>
- <input type="radio" id="radio03" name="radio" /><label for="radio03">Choice 3</label>
-</div>
-<form>
- <div id="radio1" style="margin-top: 2em;">
- <input type="radio" id="radio11" name="radio" /><label for="radio11">Choice 1</label>
- <input type="radio" id="radio12" name="radio" checked="checked" /><label for="radio12">Choice 2</label>
- <input type="radio" id="radio13" name="radio" /><label for="radio13">Choice 3</label>
- </div>
-</form>
-<form>
- <div id="radio2" style="margin-top: 2em;">
- <input type="radio" id="radio21" name="radio" /><label for="radio21">Choice 1</label>
- <input type="radio" id="radio22" name="radio" /><label for="radio22">Choice 2</label>
- <input type="radio" id="radio23" name="radio" checked="checked" /><label for="radio23">Choice 3</label>
- </div>
-</form>
-
-<div id="toolbar" class="ui-widget-header ui-corner-all ui-helper-clearfix">
- <span id="ops1">
- <button class="{button:{icons:{primary:'ui-icon-folder-open'},text:false}}">Open</button>
- <button class="{button:{icons:{primary:'ui-icon-disk'},text:false}}">Save</button>
- <button class="{button:{icons:{primary:'ui-icon-trash'},text:false}}">Delete</button>
- </span>
- <span id="format">
- <input type="checkbox" id="check1" /><label for="check1">B</label>
- <input type="checkbox" id="check2" /><label for="check2">I</label>
- <input type="checkbox" id="check3" /><label for="check3">U</label>
- </span>
- <span id="ops2">
- <button class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Print...</button>
- <button class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Mail to...</button>
- </span>
- <span id="mode">
- <input type="radio" id="mode1" name="radio2" checked="checked" /><label for="mode1">Edit</label>
- <input type="radio" id="mode2" name="radio2" /><label for="mode2">View</label>
- </span>
-</div>
-
-<div id="inputs" style="margin-top: 2em;">
- <input type="submit" value="Submit button" />
- <input type="reset" value="Reset button" class="{button:{label:'Custom reset'}}" />
-</div>
-
-<div id="anchors" style="margin-top: 2em;">
- <a href="#">Anchor 1</a>
- <a href="#" class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Anchor 2</a>
- <a href="#" class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Anchor 3</a>
- <a href="#">Anchor 4</a>
-</div>
-
-<div style="margin-top: 2em;">
- <button id="disable-widgets">Toggle disabled</button>
- <button id="toggle-widgets">Toggle widget</button>
-</div>
-<div id="log"></div>
-
-<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
-<script type="text/javascript">
- $.fn.themeswitcher && $('<div></div>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-</script>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button disabled true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $("#button1").button({
- disabled: true
- });
-
- $("#anchor1").button({
- disabled: true
- });
-
- $("#inputbutton1").button({
- disabled: true
- });
-
- $("#radio1, #radio2, #radio3").button({
- disabled: true
- });
-
- $("#checkbox1, #checkbox2, #checkbox3").button({
- disabled: true
- });
-
- });
- </script>
-</head>
-<body>
-
-<fieldset>
- <legend>button</legend>
- <button disabled="disabled">button</button>
- <hr />
- <button id="button1">button</button>
-</fieldset>
-
-<fieldset>
- <legend>anchor</legend>
- <a href="javascript:void(0)" disabled="disabled">anchor 1</a>
- <hr />
- <a href="javascript:void(0)" id="anchor1">anchor 1</a>
-</fieldset>
-
-<fieldset>
- <legend>input type="button"</legend>
- <input type="button" disabled="disabled" value="input button 1" />
- <hr />
- <input type="button" id="inputbutton1" value="input button 1" />
-</fieldset>
-
-<fieldset>
- <legend>input type="radio"</legend>
- <input type="radio" name="radioletter" id="radioa" disabled="disabled" /><label for="radioa">radio a</label>
- <input type="radio" name="radioletter" id="radiob" disabled="disabled" /><label for="radiob">radio b</label>
- <input type="radio" name="radioletter" id="radioc" disabled="disabled" /><label for="radioc">radio c</label>
- <hr />
- <input type="radio" name="radionumber" id="radio1" /><label for="radio1">radio 1</label>
- <input type="radio" name="radionumber" id="radio2" /><label for="radio2">radio 2</label>
- <input type="radio" name="radionumber" id="radio3" /><label for="radio3">radio 3</label>
-</fieldset>
-
-<fieldset>
- <legend>input type="checkbox"</legend>
- <input type="checkbox" id="checkboxa" disabled="disabled" /><label for="checkboxa">checkbox a</label>
- <input type="checkbox" id="checkboxb" disabled="disabled" /><label for="checkboxb">checkbox b</label>
- <input type="checkbox" id="checkboxc" disabled="disabled" /><label for="checkboxc">checkbox c</label>
- <hr />
- <input type="checkbox" id="checkbox1" /><label for="checkbox1">checkbox 1</label>
- <input type="checkbox" id="checkbox2" /><label for="checkbox2">checkbox 2</label>
- <input type="checkbox" id="checkbox3" /><label for="checkbox3">checkbox 3</label>
-</fieldset>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button input type checkbox</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('#check').button();
-
- });
- </script>
-</head>
-<body>
-
-<input type="checkbox" id="check" /><label for="check">Toggle</label>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button disabled true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $("#button1").button({
- disabled: true
- });
-
- $("#anchor1").button({
- disabled: true
- });
-
- $("#inputbutton1").button({
- disabled: true
- });
-
- $("#radio1, #radio2, #radio3").button({
- disabled: true
- });
-
- $("#checkbox1, #checkbox2, #checkbox3").button({
- disabled: true
- });
-
- });
- </script>
-</head>
-<body>
-
-<fieldset>
- <legend>button</legend>
- <button disabled="disabled">button</button>
- <hr />
- <button id="button1">button</button>
-</fieldset>
-
-<fieldset>
- <legend>anchor</legend>
- <a href="javascript:void(0)" disabled="disabled">anchor 1</a>
- <hr />
- <a href="javascript:void(0)" id="anchor1">anchor 1</a>
-</fieldset>
-
-<fieldset>
- <legend>input type="button"</legend>
- <input type="button" disabled="disabled" value="input button 1" />
- <hr />
- <input type="button" id="inputbutton1" value="input button 1" />
-</fieldset>
-
-<fieldset>
- <legend>input type="radio"</legend>
- <input type="radio" name="radioletter" id="radioa" disabled="disabled" /><label for="radioa">radio a</label>
- <input type="radio" name="radioletter" id="radiob" disabled="disabled" /><label for="radiob">radio b</label>
- <input type="radio" name="radioletter" id="radioc" disabled="disabled" /><label for="radioc">radio c</label>
- <hr />
- <input type="radio" name="radionumber" id="radio1" /><label for="radio1">radio 1</label>
- <input type="radio" name="radionumber" id="radio2" /><label for="radio2">radio 2</label>
- <input type="radio" name="radionumber" id="radio3" /><label for="radio3">radio 3</label>
-</fieldset>
-
-<fieldset>
- <legend>input type="checkbox"</legend>
- <input type="checkbox" id="checkboxa" disabled="disabled" /><label for="checkboxa">checkbox a</label>
- <input type="checkbox" id="checkboxb" disabled="disabled" /><label for="checkboxb">checkbox b</label>
- <input type="checkbox" id="checkboxc" disabled="disabled" /><label for="checkboxc">checkbox c</label>
- <hr />
- <input type="checkbox" id="checkbox1" /><label for="checkbox1">checkbox 1</label>
- <input type="checkbox" id="checkbox2" /><label for="checkbox2">checkbox 2</label>
- <input type="checkbox" id="checkbox3" /><label for="checkbox3">checkbox 3</label>
-</fieldset>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual push: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <style type="text/css">
- #toolbar { margin-top: 2em; padding:0.2em; }
- #ops1, #ops2, #format, #mode { margin-right: 1em }
- </style>
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.metadata.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
- var start = +new Date();
- $("button").button();
- var end = +new Date();
- $("<p></p>").text( "Time to initialize: " + (end - start) + "ms" ).prependTo("body");
- });
- </script>
-</head>
-<body>
-
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-<button>Simple button, only text</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button>
-<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button>
-<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button ticket #5254</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('#b1').button();
-
- $('#b2').button();
-
- $('#b3').button().click(function() {
- return false;
- });
-
- $('#ua').text(navigator.userAgent);
-
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5254">#5254 - Input, button and anchor buttons aren't consistent in IE7</a></h1>
-
-<dl>
-<dt><h2>Screenshot from ticket:</h2></dt>
-<dd><img src="http://dev.jqueryui.com/raw-attachment/ticket/5254/button.png"></dd>
-</dl>
-
-<hr>
-
-<dl>
-<dt><h2>Visual test:</h2></dt>
-<dd>
- <div id="vt">
- <input id="b1" type="button" value="Input" style="" />
- <button id="b2">Button</button>
- <a id="b3" href="#">Anchor</a>
- </div>
-</dd>
-<dt><h2>User agent:</h2></dt>
-<dd>
- <h3 id="ua"></h3>
-</dd>
-</dl>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button ticket #5261</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('#id1').button().change(function(e) {
- console.log('change', e);
- });
- $('#id1').bind('change', function(e) {
- console.log('bound change', e);
- });
- $("body").live('change', function(e) {
- console.log('live change on body', e);
- });
- $(document).delegate('input', 'change', function(e) {
- console.log('delegated input change', e);
- });
- $(document).change(function(e) {
- console.log('delegated change on document', e);
- });
-
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5261">#5261 - button change events don't fire in IE 7/8</a></h1>
-
-<input name="1" id="id1" type="checkbox"/>
-<label for="id1">Checkbox</label>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Button Visual Test : Button ticket #5278</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('#id1, #id2, #id3, #id4').button();
-
- $('#r1, #r2, #r3, #r4').button();
-
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5278">#5278 - ui.buttons doesn't visually reset on form "reset" event or input "change" event</a></h1>
-
-<form>
-
-<input name="a1" id="id1" type="checkbox"/>
-<label for="id1">Checkbox</label>
-
-<input name="a2" id="id2" type="checkbox"/>
-<label for="id2">Checkbox</label>
-
-<input name="a3" id="id3" type="checkbox" checked="checked" />
-<label for="id3">Checkbox</label>
-
-<input name="a4" id="id4" type="checkbox"/>
-<label for="id4">Checkbox</label>
-
-<input type="reset"/>
-
-<input name="r" id="r1" type="radio"/>
-<label for="r1">Radio</label>
-
-<input name="r" id="r2" type="radio"/>
-<label for="r2">Radio</label>
-
-<input name="r" id="r3" type="radio" checked="checked" />
-<label for="r3">Radio</label>
-
-<input name="r" id="r4" type="radio"/>
-<label for="r4">Radio</label>
-
-
-</form>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Accordion in Dialog</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#accordion').accordion({
- collapsible: true,
- active: false
- });
- $('#dialog').dialog({
- buttons: {
- Test: $.noop
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div id="dialog">
- <div id="accordion">
- <h3><a href="#">Section 1</a></h3>
- <div>
- <p>
- Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
- ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
- amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
- odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
- </p>
- </div>
- <h3><a href="#">Section 2</a></h3>
- <div>
- <p>
- Cras dictum. Pellentesque habitant morbi tristique senectus et netus
- et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
- faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
- mauris vel est.
- </p>
- <p>
- Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
- Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
- inceptos himenaeos.
- </p>
- </div>
- <h3><a href="#">Section 3</a></h3>
- <div>
- <p>
- Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
- Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
- ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
- lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
- </p>
- <ul>
- <li>List item one</li>
- <li>List item two</li>
- <li>List item three</li>
- </ul>
- </div>
- </div>
-</div>
-
-<p>
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Accordion in Tabs</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#tabs').tabs();
- $('#accordion-1, #accordion-2').accordion();
- });
- </script>
-</head>
-<body>
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- </ul>
- <div id="tabs-1">
- <div id="accordion-1">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- </div>
- </div>
- </div>
- <div id="tabs-2">
- <div id="accordion-2">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- </div>
- </div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Datepicker in Dialog</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#datepicker').datepicker();
- $('#dialog').dialog();
- });
- </script>
-</head>
-<body>
-
-<div id="dialog">
- <input id="datepicker">
-</div>
-
-<p>
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Draggable in Accordion</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <style type="text/css">
- .draggable {
- width: 10em;
- margin: 0.5em;
- }
- </style>
- <script type="text/javascript">
- $(function() {
- $( "#accordion" ).accordion();
- $( ".draggable" ).addClass( "ui-widget ui-widget-content ui-corner-all" )
- $( "#first .draggable" ).draggable();
- $( "#second .draggable" ).draggable({
- appendTo: "body"
- });
- $( "#third .draggable" ).draggable({
- helper: "clone",
- appendTo: "body"
- });
- });
- </script>
-</head>
-<body>
-
-<div id="accordion">
- <h3><a href="#">.draggable()</a></h3>
- <div id="first">
- <div class="draggable">Draggable 1-1</div>
- <div class="draggable">Draggable 1-2</div>
- <div class="draggable">Draggable 1-3</div>
- <div class="draggable">Draggable 1-4</div>
- <div class="draggable">Draggable 1-5</div>
- </div>
- <h3><a href="#">.draggable({ appendTo: "body" })</a></h3>
- <div id="second">
- <div class="draggable">Draggable 2-1</div>
- <div class="draggable">Draggable 2-2</div>
- <div class="draggable">Draggable 2-3</div>
- <div class="draggable">Draggable 2-4</div>
- <div class="draggable">Draggable 2-5</div>
- </div>
- <h3><a href="#">.draggable({ helper: "clone", appendTo: "body" })</a></h3>
- <div id="third">
- <div class="draggable">Draggable 3-1</div>
- <div class="draggable">Draggable 3-2</div>
- <div class="draggable">Draggable 3-3</div>
- <div class="draggable">Draggable 3-4</div>
- <div class="draggable">Draggable 3-5</div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Draggable in Accordion</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <style type="text/css">
- #main-draggable {
- width: 300px;
- position: absolute;
- right: 100px;
- }
- #main-draggable-handle {
- padding: 1em;
- margin: 0;
- }
- .draggable {
- width: 10em;
- margin: 0.5em;
- }
- </style>
- <script type="text/javascript">
- $(function() {
- $( ".draggable" ).addClass( "ui-widget ui-widget-content ui-corner-all" )
- $( ".draggable" ).draggable({
- helper: "clone",
- appendTo: "body"
- });
-
- // PROBLEM: nested accordions must be initialized before outer accordion
- $( "#accordion > div" ).accordion();
- $( "#accordion" ).accordion();
-
-
- // PROBLEM: nested widgets must be initialized before tabs
- $( "#tabs" ).tabs();
-
- $( "#main-draggable" ).draggable({
- handle: "#main-draggable-handle"
- });
- });
- </script>
-</head>
-<body>
-<div id="main-draggable" class="ui-widget ui-widget-content ui-corner-all">
- <p id="main-draggable-handle" class="ui-widget-header ui-corner-all">Drag me around!</p>
- <div id="tabs">
- <ul>
- <li><a href="#tabs-1">First Tab</a></li>
- <li><a href="#tabs-2">Second Tab</a></li>
- </ul>
- <div id="tabs-1">
- <p>Click the other tab!</p>
- </div>
- <div id="tabs-2">
- <div id="accordion">
- <h3><a>Accordion Group 1</a></h3>
- <div id="accordion-1-1">
- <h3><a href="#">Header 1-1</a></h3>
- <div>
- <div class="draggable">Draggable 1-1</div>
- <div class="draggable">Draggable 1-2</div>
- <div class="draggable">Draggable 1-3</div>
- <div class="draggable">Draggable 1-4</div>
- <div class="draggable">Draggable 1-5</div>
- </div>
- <h3><a href="#">Header 1-2</a></h3>
- <div>
- <div class="draggable">Draggable 2-1</div>
- <div class="draggable">Draggable 2-2</div>
- <div class="draggable">Draggable 2-3</div>
- <div class="draggable">Draggable 2-4</div>
- <div class="draggable">Draggable 2-5</div>
- </div>
- </div>
- <h3><a>Accordion Group 2</a></h3>
- <div id="accordion-1-2">
- <h3><a href="#">Header 2-1</a></h3>
- <div>
- <div class="draggable">Draggable 1-1</div>
- <div class="draggable">Draggable 1-2</div>
- <div class="draggable">Draggable 1-3</div>
- <div class="draggable">Draggable 1-4</div>
- <div class="draggable">Draggable 1-5</div>
- </div>
- <h3><a href="#">Header 2-2</a></h3>
- <div>
- <div class="draggable">Draggable 2-1</div>
- <div class="draggable">Draggable 2-2</div>
- <div class="draggable">Draggable 2-3</div>
- <div class="draggable">Draggable 2-4</div>
- <div class="draggable">Draggable 2-5</div>
- </div>
- </div>
- </div>
- </div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Accordion in Tabs</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $( "#accordion-1, #accordion-2" )
- .accordion({
- header: "> div > h3"
- })
- .sortable();
-
- $( "#tabs" )
- .tabs()
- .find( ".ui-tabs-nav" )
- .sortable();
- });
- </script>
-</head>
-<body>
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- </ul>
- <div id="tabs-1">
- <div id="accordion-1">
- <div>
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- </div>
- </div>
- <div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- </div>
- </div>
- <div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- </div>
- </div>
- </div>
- </div>
- <div id="tabs-2">
- <div id="accordion-1">
- <div>
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- <p>Accordion Content 1</p>
- </div>
- </div>
- <div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- <p>Accordion Content 2</p>
- </div>
- </div>
- <div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- <p>Accordion Content 3</p>
- </div>
- </div>
- </div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : Tabs in Tabs</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#tabs, #tabs-a, #tabs-b').tabs();
- });
- </script>
-</head>
-<body>
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- </ul>
- <div id="tabs-1">
- <div id="tabs-a">
- <ul>
- <li><a href="#tabs-a-1">First</a></li>
- <li><a href="#tabs-a-2">Second</a></li>
- </ul>
- <div id="tabs-a-1">
- <p>nested tabs a-1</p>
- <p>nested tabs a-1</p>
- <p>nested tabs a-1</p>
- <p>nested tabs a-1</p>
- <p>nested tabs a-1</p>
- </div>
- <div id="tabs-a-2">
- <p>nested tabs a-2</p>
- <p>nested tabs a-2</p>
- <p>nested tabs a-2</p>
- <p>nested tabs a-2</p>
- <p>nested tabs a-2</p>
- </div>
- </div>
- </div>
- <div id="tabs-2">
- <div id="tabs-b">
- <ul>
- <li><a href="#tabs-b-1">First</a></li>
- <li><a href="#tabs-b-2">Second</a></li>
- </ul>
- <div id="tabs-b-1">
- <p>nested tabs b-1</p>
- <p>nested tabs b-1</p>
- <p>nested tabs b-1</p>
- <p>nested tabs b-1</p>
- <p>nested tabs b-1</p>
- </div>
- <div id="tabs-b-2">
- <p>nested tabs b-2</p>
- <p>nested tabs b-2</p>
- <p>nested tabs b-2</p>
- <p>nested tabs b-2</p>
- <p>nested tabs b-2</p>
- </div>
- </div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Compound Visual Test : All Widgets in Dialog</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.progressbar.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#accordion").accordion();
- $("#autocomplete").autocomplete({
- source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"]
- });
- $("button").button().click(function() {
- $("#dialog2").dialog("open");
- });
- $("#datepicker").datepicker();
- $("#progressbar").progressbar({
- value: 30
- });
- $("#slider").slider({
- // should be animated
- animate: true,
- value: 30,
- slide: function(event, ui) {
- $("#progress").val(ui.value);
- $("#progressbar").progressbar("option", "value", ui.value);
- }
- });
- $("#tabs").tabs();
-
- $("#dialog").dialog();
- $("#dialog2").dialog({
- autoOpen: false,
- width: 100,
- height: 75,
- modal: true
- })
- });
- </script>
-</head>
-<body>
-
-<div id="dialog">
- <div id="accordion">
- <h3><a href="#">Accordion Header 1</a></h3>
- <div>
- Accordion Content 1
- </div>
- <h3><a href="#">Accordion Header 2</a></h3>
- <div>
- Accordion Content 2
- </div>
- <h3><a href="#">Accordion Header 3</a></h3>
- <div>
- Accordion Content 3
- </div>
- </div>
- <input id="autocomplete">
- <button>A Button</button>
- <input id="datepicker">
- <button>Another button</button>
- <div>
- <label for="progress">Progress: <input id="progress" /></label>
- </div>
- <div id="progressbar">
- </div>
- <div id="slider"></div>
- <div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- <li><a href="#tabs-3">Third</a></li>
- </ul>
- <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
- <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
- <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
- </div>
-</div>
-<div id="dialog2">
- Yay, another dialog.
-</div>
-
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar.
-</p>
-<p>
-Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci.
-</p>
-<p>
-Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida.
-</p>
-<p>
-Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper.
-</p>
-<p>
-Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor.
-</p>
-<p>
-
-Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi.
-</p>
-<p>
-Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae.
-</p>
-<p>
-Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat.
-</p>
-<p>
-Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna.
-</p>
-<p>
-Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc.
-</p>
-<p>
-Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod.
-</p>
-
-<p>
-Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
-</p>
-<p>
-Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis.
-</p>
-<p>
-Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis.
-</p>
-<p>
-In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est.
-</p>
-<p>
-Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat.
-</p>
-<p>
-Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida.
-
-</p>
-<p>
-Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl.
-</p>
-<p>
-Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia.
-</p>
-<p>
-Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis.
-</p>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#datepicker').datepicker();
- });
- </script>
-</head>
-<body>
-
-<div id="datepicker"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Simple Datepicker</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
- // simple datepicker
- $('#d1').datepicker();
- $('button.disable-d1').click(function(event){
- $('#d1').datepicker('disable');
- event.preventDefault();
- });
- $('button.enable-d1').click(function(event){
- $('#d1').datepicker('enable');
- event.preventDefault();
- });
- $('button.destroy-d1').click(function(event){
- $('#d1').datepicker('destroy');
- event.preventDefault();
- });
-
- // multi datepicker
- $('#d2').datepicker({numberOfMonths: 3, showButtonPanel: true});
- $('button.disable-d2').click(function(event){
- $('#d2').datepicker('disable');
- event.preventDefault();
- });
- $('button.enable-d2').click(function(event){
- $('#d2').datepicker('enable');
- event.preventDefault();
- });
- $('button.destroy-d2').click(function(event){
- $('#d2').datepicker('destroy');
- event.preventDefault();
- });
-
- // inline datepicker
- $('#inl').datepicker({minDate: -20, maxDate: '+1M +10D'});
- $('button.disable-inl').click(function(event){
- $('#inl').datepicker('disable');
- event.preventDefault();
- });
- $('button.enable-inl').click(function(event){
- $('#inl').datepicker('enable');
- event.preventDefault();
- });
- $('button.destroy-inl').click(function(event){
- $('#inl').datepicker('destroy');
- event.preventDefault();
- });
-
- // disabled input datepicker
- $('#d3').datepicker();
-
- // bottom-right datepicker
- $('#d4').datepicker({numberOfMonths: 3});
- });
- </script>
-</head>
-<body>
-
-<ul class="plugins">
- <li class="plugin">
- <button class="disable-d1">Disable</button>
- <button class="enable-d1">Enable</button>
- <button class="destroy-d1">Destroy</button>
-
- Datepicker Simple
- <div>
- <input type="text" id="d1" />
- </div>
- </li>
- <li class="plugin">
- <button class="disable-d2">Disable</button>
- <button class="enable-d2">Enable</button>
- <button class="destroy-d2">Destroy</button>
-
- Datepicker Multi
- <div>
- <input type="text" id="d2" />
- </div>
- </li>
- <li class="plugin">
- <button class="disable-inl">Disable</button>
- <button class="enable-inl">Enable</button>
- <button class="destroy-inl">Destroy</button>
-
- Datepicker Inline
- <div id="inl"></div>
- </li>
- <li class="plugin">
- Datepicker disabled input
- <div>
- <input type="text" id="d3" disabled="disabled" />
- </div>
- </li>
- <li class="plugin" style="position: absolute; right: 0; bottom: 0; height: 40px">
- Datepicker - positioned bottom-right
- <div>
- <input type="text" id="d4">
- </div>
- </li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Datepicker ticket #4071</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
-
-function ValidatorHookupEvent(control, eventType, functionPrefix) {
- var ev;
- eval("ev = control." + eventType + ";");
- if (typeof(ev) == "function") {
- ev = ev.toString();
- ev = ev.substring(ev.indexOf("{") + 1, ev.lastIndexOf("}"));
- }
- else {
- ev = "";
- }
- var func;
- if (navigator.appName.toLowerCase().indexOf('explorer') > -1) {
- func = new Function(functionPrefix + " " + ev);
- }
- else {
- func = new Function("event", functionPrefix + " " + ev);
- }
- eval("control." + eventType + " = func;");
-}
-
-function HandleChange(event, boundBy) {
- var boundBy = boundBy ? boundBy : '$(control).change(function(event){...})';
- var type = event.type,
- srcOrTarget = event.srcElement ? 'srcElement' : 'target',
- tagName = event[srcOrTarget].tagName;
- alert('[' + boundBy + ']\nevent.type: ' + type + '\nevent.' + srcOrTarget + '.tagName: ' + tagName);
-}
-
- $(function() {
- var control = $('#myInput')[0], eventType="onchange";
-
- $(control).datepicker();
- $(control).change(HandleChange);
- $('#changeButton').click(function() {
- $(control).change();
- });
- $('#triggerButton').click(function() {
- $(control).trigger('change');
- });
- $('#triggerHandlerButton').click(function() {
- $(control).triggerHandler('change');
- });
- $('#fireEventButton').click(function() {
- control.fireEvent('onchange');
- });
- if (!control.fireEvent) { $('#fireEventButton').remove(); }
-
- ValidatorHookupEvent(control, eventType, "HandleChange(event, 'eval(control.onchange = func)')");
-
- });
- </script>
- <style type="text/css">
- button { display: block; }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4071">#4071 - 'length' is null or not an object</a></h1>
-
-<h2>Summary</h2>
-In Internet Explorer, when a event such as click on one element causes a change event on another element to trigger programmatically, any change event handler that was bound to that second element through onchange gets the click event instead of the change event.
-
-<h2>Steps to reproduce</h2>
-<p>
-To demonstrate the issue, do one of the following:
-</p>
-<ul>
- <li>Click the input to open the Datepicker, then select a date</li>
- <li>Or press a number in the text field and blur</li>
- <li>Or click a button below</li>
-</ul>
-<p>
-Each will trigger change on the text input. The input has a handler bound in three different ways. Notice the difference when pressing a number in the input and bluring versus either selecting a date or pressing one of the first three buttons. In Internet Explorer, when the issue is present, 2 out of the three event objects are of type 'click' instead of 'change' and have the wrong corresponding srcElement/target when the datepicker or one of the first three buttons are clicked.
-</p>
-
-<input type="text" id="myInput" onchange="HandleChange(event, '<input onchange=\'...\' />')" />
-<button id="changeButton">Click to trigger change event via $(control).change();</button>
-<button id="triggerButton">Click to trigger change event via $(control).trigger('change');</button>
-<button id="triggerHandlerButton">Click to trigger change event via $(control).triggerHandler('change');</button>
-<button id="fireEventButton">Click to fire change event via control.fireEvent('onchange');</button>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Datepicker ticket #4240</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#destroystart").click(function() {
- $("#startdate").datepicker('destroy');
- });
- $("#destroyend").click(function() {
- $("#enddate").datepicker('destroy');
- });
- $("#disablestart").click(function() {
- $("#startdate").datepicker('disable');
- });
- $("#disableend").click(function() {
- $("#enddate").datepicker('disable');
- });
- $("#enablestart").click(function() {
- $("#startdate").datepicker('enable');
- });
- $("#enableend").click(function() {
- $("#enddate").datepicker('enable');
- });
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4240">#4240 - Datepicker destroy affects other datepickers</a></h1>
-
- <input type="text" id="startdate" />
- <input type="text" id="enddate" />
- <br /> <br />
- <input type="button" value="Init Startdate" onclick="$('#startdate').datepicker({showOn: 'both', buttonImage:'calendar.gif', buttonImageOnly:'true'});" />
- <input type="button" value="Init Enddate" onclick="$('#enddate').datepicker({showOn: 'both', buttonImage:'calendar.gif', buttonImageOnly:'true'});" />
- <br /> <br />
- <input type="button" id="destroystart" value="Destroy Startdate" />
- <input type="button" id="destroyend" value="Destroy Enddate" />
- <br /> <br />
- <input type="button" id="enablestart" value="Enable Startdate" />
- <input type="button" id="enableend" value="Enable Enddate" />
- <br /> <br />
- <input type="button" id="disablestart" value="Disable Startdate" />
- <input type="button" id="disableend" value="Disable Enddate" />
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Datepicker ticket #4443</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <link rel="stylesheet" href="http://jquery.com/demo/thickbox/thickbox-code/thickbox.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script src="http://jquery.com/demo/thickbox/thickbox-code/thickbox-compressed.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('.datepicker').datepicker();
-
- });
- </script>
- <style type="text/css">
- button { display: block; }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4443">#4443 - Datepicker's vertical position in thickbox is wrong</a></h1>
-
-<p><input alt="#TB_inline?height=150&width=400&inlineId=myOnPageContent" title="add a caption to title attribute / or leave blank" class="thickbox" type="button" value="Show" /></p>
-
-<div id="myOnPageContent" style="display:none">
- <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
- <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
- <input type="text" class="datepicker" />
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Datepicker ticket #5676</title>
- <link href="../visual.css" type="text/css" rel="stylesheet" />
- <link href="../../../themes/base/jquery.ui.all.css" type="text/css" rel="stylesheet">
- <script src="../../../jquery-1.8.2.js"></script>
- <script src="../../../ui/jquery.ui.core.js"></script>
- <script src="../../../ui/jquery.ui.widget.js"></script>
- <script src="../../../ui/jquery.ui.datepicker.js"></script>
- <script>
- $(function() {
-
- $('.datepicker').datepicker({
- defaultDate: +7
- }).focus();
-
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5676">#5676 - DatePicker Dialog defaultDate incorrect behaviour</a></h1>
-
-<div class="datepicker"></div>
-<input class="datepicker" />
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Datepicker ticket #7552</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
- $('<div></div>').datepicker().appendTo("body");
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/7552">#7552 - A Datepicker created on a detached div has zero height</a></h1>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Datepicker Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript">
- $(function() {
- $('#datepicker').datepicker({numberOfMonths: [4,3], showButtonPanel: true });
- });
- </script>
-</head>
-<body>
-
-<div id="datepicker"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Mon 26JanTest application details - by chrisv from #3863 (Viewport test)</title>
- <link href="css/styling.css" rel="stylesheet" type="text/css">
- <style type="text/css">
- label {
- float: left;
- min-width: 12em;
- }
- tr.rule-above td {
- border-top: solid 1px #CCCCCC;
- margin-top: 1em;
- }
- </style>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.datepicker.js"></script>
- <style type="text/css">
- label.error {
- color: #ff4c00;
- font-style: italic;
- }
- input.error {
- border: 1px dotted red;
- }
-
- </style>
- <style type="text/css">
- .ui-datepicker {
- font-size: 80%;
- }
- </style>
- <script type="text/javascript"> /* configure date picker */
- $(function() {
- $(".datepicker").datepicker({
- dateFormat: 'd M yy',
- firstDay: 1,
- changeMonth: false, changeYear: false,
- showOtherMonths: true,
- mandatory: true
- });
- });
- </script>
-</head>
-<body>
-<div id="container">
- <div id="center" class="column">
- <h2>Mon 26JanTest</h2>
- <h3>Application progress</h3>
- <form name="frm" id="frm" method="post" action="">
-
- <table>
- <tr>
- <td><label for="Firstname">First name:</label></td>
- <td><input name="Firstname" id="Firstname" size="12" value="Mon"></td>
- </tr>
- <tr>
- <td><label for="Lastname">Last name:</label></td>
- <td><input name="Lastname" id="Lastname" size="12" value="26JanTest"></td>
-
- </tr>
- <tr>
- <td><label for="Email">Email:</label></td>
- <td><input name="Email" id="Email" size="18" value="x@y.com"></td>
- </tr>
- <tr>
- <td><label for="RegionalMentorID">Responsible RM:</label></td>
- <td><select name="RegionalMentorID" id="RegionalMentorID">
-
- <option value="">–</option>
- </select>
- </td>
- </tr>
- <tr>
- <td><label for="Status">Status:</label></td>
- <td><select name="Status" id="Status">
- <option selected value="Active">Active</option>
-
- <option value="Dropped out">Dropped out</option>
- <option value="Completed">Completed</option>
- </select>
- </td>
- </tr>
- <tr class="rule-above">
- <td>Applic’n rec’d</td>
-
- <td><input type="text" name="ApplicationReceivedOn" id="ApplicationReceivedOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date"></td>
- </tr>
- <tr class="rule-above">
- <td>Stage 1 mtg</td>
- <td><input type="text" name="Stage1MtgOnD" id="Stage1MtgOnD" value="27 Jan 2009" class="datepicker" size="12" title="Enter date">
- <input type="text" name="Stage1MtgOnT" id="Stage1MtgOnT" value="11:00" size="4" title="Enter time">
- @
- <input name="Stage1MtgAt" id="Stage1MtgAt" value="someplace">
- </td>
-
- </tr>
- <tr>
- <td> </td>
- <td><label>Confirmed on</label>
- <input type="text" name="Stage1MtgConfirmedOn" id="Stage1MtgConfirmedOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- </td>
- </tr>
- <tr>
-
- <td> </td>
- <td><label>Attended</label>
- <input type="radio" name="Stage1MtgAttended" id="Stage1MtgAttendedY" value="Y">
- Yes
- <input type="radio" name="Stage1MtgAttended" id="Stage1MtgAttendedY" checked value="N">
- No </td>
- </tr>
- <tr>
-
- <td> </td>
- <td><label>Hard-copy given</label>
- <input name="Stage1HardCopyGiven" type="radio" value="Y">
- Yes
- <input name="Stage1HardCopyGiven" type="radio" checked value="N">
- No </td>
- </tr>
- <tr>
-
- <td> </td>
- <td><br>
- <label>Handover on</label>
- <input type="text" name="Stage1HandoverOn" id="Stage1HandoverOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- </td>
- </tr>
- <tr class="rule-above">
- <td>Stage 2 mtg</td>
-
- <td><input type="text" name="Stage2MtgOnD" id="Stage2MtgOnD" value="28 Jan 2009" class="datepicker" size="12" title="Enter date">
- <input type="text" name="Stage2MtgOnT" id="Stage2MtgOnT" value="11:00" size="4" title="Enter time">
- @
- <input name="Stage2MtgAt" id="Stage2MtgAt" value="someplace">
- <br>
- <label>Confirmed on</label>
- <input type="text" name="Stage2MtgConfirmedOn" id="Stage2MtgConfirmedOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- <br>
- <label>Contacts:</label>
-
- <i></i> <br>
- <label>Postcode areas:</label>
- <i></i> <br>
- <label>Document explanations given</label>
- <input name="Stage2DocExplanGiven" type="radio" value="Y">
- Yes
- <input name="Stage2DocExplanGiven" type="radio" checked value="N">
-
- No <br>
- <label>Franchisee contacts given</label>
- <input name="Stage2ContactFranchiseesGiven" type="radio" value="Y">
- Yes
- <input name="Stage2ContactFranchiseesGiven" type="radio" checked value="N">
- No <br>
- <label>Finance options given</label>
-
- <input name="Stage2FinanceOptionsGiven" type="radio" value="Y">
- Yes
- <input name="Stage2FinanceOptionsGiven" type="radio" checked value="N">
- No <br>
- <label>Financials given</label>
- <input name="Stage2FinancialsGiven" type="radio" value="Y">
- Yes
- <input name="Stage2FinancialsGiven" type="radio" checked value="N">
- No <br>
-
- <label>Business plan given</label>
- <input name="Stage2BusinessPlanGiven" type="radio" value="Y">
- Yes
- <input name="Stage2BusinessPlanGiven" type="radio" checked value="N">
- No <br>
- <label>Agreement given</label>
- <input name="Stage2AgreementGiven" type="radio" value="Y">
- Yes
- <input name="Stage2AgreementGiven" type="radio" checked value="N">
-
- No <br>
- <label>Disclosure letter given</label>
- <input name="Stage2DisclosureLetterGiven" type="radio" value="Y">
- Yes
- <input name="Stage2DisclosureLetterGiven" type="radio" checked value="N">
- No <br>
- <label>Medical letter given</label>
-
- <input name="Stage2MedicalLetterGiven" type="radio" value="Y">
- Yes
- <input name="Stage2MedicalLetterGiven" type="radio" checked value="N">
- No <br>
- <label>Attended</label>
- <input name="Stage2MtgAttended" type="radio" value="Y">
- Yes
- <input name="Stage2MtgAttended" type="radio" checked value="N">
- No </td>
-
- </tr>
- <tr class="rule-above">
- <td>Site visit</td>
- <td><input type="text" name="SiteVisitOnD" id="SiteVisitOnD" value="29 Jan 2009" class="datepicker" size="12" title="Enter date">
- <input type="text" name="SiteVisitOnT" id="SiteVisitOnT" value="13:00" size="4" title="Enter time">
- @
- <input name="SiteVisitAt" id="SiteVisitAt" value="somewhere else">
- <br>
- <label>Site visit contact</label>
-
- <br>
- <label>Confirmed on</label>
- <input type="text" name="SiteVisitConfirmedOn" id="SiteVisitConfirmedOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- <br>
- <label>Attended</label>
- <input name="SiteVisitAttended" type="radio" value="Y">
- Yes
- <input name="SiteVisitAttended" type="radio" checked value="N">
-
- No </td>
- </tr>
- <tr class="rule-above">
- <td>Director interview</td>
- <td><input type="text" name="DirectorInterviewOnD" id="DirectorInterviewOnD" value="30 Jan 2009" class="datepicker" size="12" title="Enter date">
- <input type="text" name="DirectorInterviewOnT" id="DirectorInterviewOnT" value="13:00" size="4" title="Enter time">
- @
- <input name="DirectorInterviewAt" id="DirectorInterviewAt" value="boss pad">
-
- <br>
- <label>Confirmed on</label>
- <input type="text" name="DirectorInterviewConfirmedOn" id="DirectorInterviewConfirmedOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- <br>
- <label>Attended</label>
- <input name="DirectorInterviewAttended" type="radio" value="Y">
- Yes
- <input name="DirectorInterviewAttended" type="radio" checked value="N">
-
- No <br>
- <label>Financials Recd</label>
- <input name="DirectorFinancialsRecd" type="radio" value="Y">
- Yes
- <input name="DirectorFinancialsRecd" type="radio" checked value="N">
- No <br>
- <label>Business plan Recd</label>
-
- <input name="DirectorBusinessPlanRecd" type="radio" value="Y">
- Yes
- <input name="DirectorBusinessPlanRecd" type="radio" checked value="N">
- No <br>
- <label>Agreement Recd</label>
- <input name="DirectorAgreementRecd" type="radio" value="Y">
- Yes
- <input name="DirectorAgreementRecd" type="radio" checked value="N">
- No <br>
-
- <label>Disclosure letter Recd</label>
- <input name="DirectorDisclosureLetterRecd" type="radio" value="Y">
- Yes
- <input name="DirectorDisclosureLetterRecd" type="radio" checked value="N">
- No <br>
- <label>Medical letter Recd</label>
- <input name="DirectorMedicalLetterRecd" type="radio" value="Y">
- Yes
- <input name="DirectorMedicalLetterRecd" type="radio" checked value="N">
-
- No <br>
- <label>Accept/decline sent on</label>
- <input type="text" name="AcceptDeclineLetterSentOn" id="AcceptDeclineLetterSentOn" value="26 Jan 2009" class="datepicker" size="12" title="Enter date">
- </td>
- </tr>
- </table>
- </form>
- </div>
-
-</div>
-<!-- 11ms -->
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog();
- });
- </script>
-</head>
-<body>
-
-<div id="dialog" title="Dialog Title">
- <p>
- Dialog Content
- </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Modal Dialog in Large DOM</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- modal: true,
- autoOpen: false
- });
- $('#opener').click(function() {
- $('#dialog').dialog('open');
- });
- });
- </script>
-</head>
-<body>
-
-<button id="opener">open dialog</button>
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
- <input type="text">
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-<div>
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="text">
-<input type="checkbox"><input type="checkbox"><input type="checkbox">
-<select>
- <option value="a">option</option>
- <option value="b">option</option>
- <option value="c">option</option>
- <option value="d">option</option>
- <option value="e">option</option>
- <option value="f">option</option>
- <option value="g">option</option>
- <option value="h">option</option>
- <option value="i">option</option>
-</select>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog on page with scrollbars</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog();
- });
- </script>
-</head>
-<body style="height:2000px;">
-
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option buttons OK Cancel</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- buttons: {
- "OK": function() { $(this).dialog('close'); },
- "Cancel": function() { $(this).dialog('close'); }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div id="dialog" title="Dialog Title">
- <p>
- Dialog Content
- </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option closeOnEscape true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- closeOnEscape: false
- });
- });
- </script>
-</head>
-<body>
-
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option closeOnEscape true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- closeOnEscape: true
- });
- });
- </script>
-</head>
-<body>
-
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option modal false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- modal: false
- });
- });
- </script>
-</head>
-<body>
-<input />
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option modal true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- modal: true
- });
- });
- </script>
-</head>
-<body>
-<input />
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog option position right top</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $("#dialog").dialog({
- position: ['right', 'top']
- });
-
- });
- </script>
-</head>
-<body>
-
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog ticket #4350</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#dialog").dialog({
- height: 200
- });
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4350">#4350 - Dialog: No Scrollbars in IE in Quirksmode</a></h1>
-
-<input />
-<div id="dialog" title="Dialog Title">
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
- foo<p/>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Dialog Visual Test : Dialog ticket #4826</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript">
- $(function() {
-
- $('#dialog').dialog({ resizable: false });
-
- $('#handle').click(function() {
- $('#dialog')
- .dialog('option', {
- resizable: false
- })
- .dialog('open');
-
- return false;
- });
-
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4826">#4826 - Setting resizable false toggles resizable on dialog</a></h1>
-
-<button id="handle">Click me!</button>
-<div id="dialog" title="Dialog Title">
- <p id="msg">I should <strong>NEVER</strong> be resizable!</p>
-</div>
-
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable();
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Scroll Tests</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <style type="text/css">
- .draggable {
- width:100px;
- height:100px;
- background-color:green;
- color: #fff;
- padding: 5px;
- margin: 5px;
- border: 5px solid red;
- }
- .container {
- width: 500px;
- height: 200px;
- border: 5px solid black;
- padding: 5px;
- margin: 5px;
- float: left;
- background: #fff;
- }
- .enlarge {
- width: 1000px;
- height: 1000px;
- }
- </style>
- <script type="text/javascript">
- $(function(){
- $(".draggable").draggable({
- //helper: 'clone',
- drag: function(e, ui) {
- //console.log(ui.helper.offset());
- },
- scroll:true
- //containment:"parent"
- });
- });
- </script>
-</head>
-<body>
-
-<div class='draggable' style='z-index: 1000;'>Simple draggable</div>
-<br clear='both' />
-
-
-<div class='container' style="overflow:scroll;">
- <div class='draggable'>(Broken in IE)</div>
- <div class='enlarge'></div>
-</div>
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='draggable'></div>
- <div class='enlarge'></div>
-</div>
-
-<div class='container' style="overflow:scroll;">
- <div class='draggable' style='position: absolute;top:0px;left:1000px;'>Absolute</div>
- <div class='enlarge'></div>
-</div>
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='draggable' style='position: absolute;'>Absolute</div>
- <div class='enlarge'></div>
-</div>
-
-<div class='container' style="overflow:scroll;">
- <div class='draggable' style='position: fixed;'>Fixed</div>
- <div class='enlarge'></div>
-</div>
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='draggable' style='position: fixed;'>Fixed</div>
- <div class='enlarge'></div>
-</div>
-
-<!-- Relative draggable with two containers -->
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='container'>
- <div class='draggable'>Relative</div>
- <div class='enlarge'></div>
- </div>
-
-</div>
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='container' style='position: relative;'>
- <div class='draggable'>Relative</div>
- <div class='enlarge'></div>
- </div>
-</div>
-
-<div class='container' style="position: relative;">
- <div class='container' style='overflow: scroll;'>
- <div class='draggable'>Relative (Broken in IE)</div>
- <div class='enlarge'></div>
- </div>
-
-</div>
-
-<div class='container' style="position: relative;">
- <div class='container' style='position: relative; overflow: scroll;'>
- <div class='draggable'>Relative</div>
- <div class='enlarge'></div>
- </div>
-</div>
-
-<!-- Absolute draggable with two containers -->
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='container'>
- <div class='draggable' style='position: absolute;'>Absolute</div>
- <div class='enlarge'></div>
- </div>
-
-</div>
-
-<div class='container' style="overflow:scroll; position: relative;">
- <div class='container' style='position: relative;'>
- <div class='draggable' style='position: absolute;'>Absolute</div>
- <div class='enlarge'></div>
- </div>
-</div>
-
-<div class='container' style="position: relative;">
- <div class='container' style='overflow: scroll;'>
- <div class='draggable' style='position: absolute;top:0px;left:0px;'>Absolute</div>
- <div class='enlarge'></div>
- </div>
-
-</div>
-
-<div class='container' style="position: relative;">
- <div class='container' style='position: relative; overflow: scroll;'>
- <div class='draggable' style='position: absolute;'>Absolute</div>
- <div class='enlarge'></div>
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option containment array</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- containment: [50, 100, 400, 350]
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option cursorAt object</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- cursorAt: { top: -15, right: 15 }
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option handle selector</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- handle: ".handle"
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
- <p class="handle">Handle</p>
- <p>Not handle</p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option iframeFix false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- cursorAt: { top: -10, left: -10 },
- iframeFix: false
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-<iframe id="iframe1"></iframe>
-<iframe id="iframe2"></iframe>
-<iframe id="iframe3"></iframe>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option iframeFix selector</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- cursorAt: { top: -10, left: -10 },
- iframeFix: "#iframe2"
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-<iframe id="iframe1"></iframe>
-<iframe id="iframe2"></iframe>
-<iframe id="iframe3"></iframe>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Draggable Visual Test : Draggable option iframeFix true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable({
- cursorAt: { top: -10, left: -10 },
- iframeFix: true
- });
- });
- </script>
-</head>
-<body>
-<div id="draggable">
- <p> Draggable </p>
-</div>
-<iframe id="iframe1"></iframe>
-<iframe id="iframe2"></iframe>
-<iframe id="iframe3"></iframe>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable();
- $("#droppable").droppable({
- drop: function() {
- alert("Dropped something");
- }
- });
- });
- </script>
-</head>
-<body>
- <div id="draggable">
- <p> Draggable </p>
-</div>
-<div id="droppable">
- <p> Droppable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test : Draggable option accept default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="droppable.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggables *").draggable({
- revert: true
- });
- $("#droppable").droppable({
- drop: function(event, ui) {
- $(this).append('<div>' + ui.draggable.text() + '</div>');
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div id="draggables">
- <div>Draggable div</div>
- <p>Draggable p</p>
- <span>Draggable span</div>
-</div>
-
-<div id="droppable" class="ui-widget-content ui-corner-all">
- <p class="ui-widget-header ui-corner-all"> Droppable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test : Draggable option accept function</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="droppable.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggables *").draggable({
- revert: true
- });
- $("#droppable").droppable({
- accept: function(draggable) {
- return (draggable.text() === 'Draggable p');
- },
- drop: function(event, ui) {
- $(this).append('<div>' + ui.draggable.text() + '</div>');
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div id="draggables">
- <div>Draggable div</div>
- <p>Draggable p</p>
- <span>Draggable span</div>
-</div>
-
-<div id="droppable" class="ui-widget-content ui-corner-all">
- <p class="ui-widget-header ui-corner-all"> Droppable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test : Draggable option accept selector</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="droppable.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#draggables *").draggable({
- revert: true
- });
- $("#droppable").droppable({
- accept: 'p',
- drop: function(event, ui) {
- $(this).append('<div>' + ui.draggable.text() + '</div>');
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div id="draggables">
- <div>Draggable div</div>
- <p>Draggable p</p>
- <span>Draggable span</div>
-</div>
-
-<div id="droppable" class="ui-widget-content ui-corner-all">
- <p class="ui-widget-header ui-corner-all"> Droppable </p>
-</div>
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test - Droppable ticket 4087</title>
- <link type="text/css" href="../../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px; }
- #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#draggable").draggable();
- $("#droppable").droppable({
- drop: function(event, ui) {
- ui.draggable.remove();
- }
- });
- });
- </script>
-</head>
-<body>
-
-<h1>
-Ticket <a href="http://dev.jqueryui.com/ticket/4087">#4087</a> - Removing ui.draggable immediately after the drop callback raises an error.
-</h2>
-<h2>
-TEST: Drag 'Drag me' to the div labelled 'Drop here'
-</h2>
-
-<div id="draggable" class="ui-widget-content">
- <p>Drag me</p>
-</div>
-
-<div id="droppable" class="ui-widget-header">
- <p>Drop here</p>
-</div>
-
-<h3 style="clear:left;">
-ASSERT: No exception '$(this).data("draggable") is undefined'
-</h3>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Droppable Visual Test - Droppable ticket 4088</title>
- <link type="text/css" href="../../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <style type="text/css">
- #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
- #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
- #sortable li span { position: absolute; margin-left: -1.3em; }
-
- #trash { width: 58%; height: 8em; padding: 1%; margin-top: 1%; }
- #trash h4 { line-height: 16px; margin: 0 0 0.4em; }
- #trash h4 .ui-icon { float: left; }
- </style>
- <script type="text/javascript">
- $(function() {
- $("#sortable").sortable();
- $("#trash").droppable({
- accept: '#sortable > li',
- activeClass: 'ui-state-highlight',
- drop: function(ev, ui) {
- if (ui.draggable.is('#special')) {
- setTimeout(function() { ui.draggable.remove(); }, 1);
- } else {
- ui.draggable.remove();
- ui.draggable.html('<strong>I was dropped and removed, but still here I am!</strong>');
- }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<h1>
-Ticket <a href="http://dev.jqueryui.com/ticket/4088">#4088</a> - Unable to remove() ui.draggable (sortable item) immediately after the drop callback.
-</h2>
-<h2>
-TEST: Drag 'Special Item' to the div labelled 'Drop here'
-</h2>
-<h2>
-TEST: Drag a 'Normal Item' to the div labelled 'Drop here'
-</h2>
-
-<ul id="sortable">
- <li class="ui-state-default" id="special"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Special Item</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Normal Item 1</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Normal Item 2</li>
- <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Normal Item 3</li>
-</ul>
-
-<div id="trash" class="ui-widget-content ui-state-default">
- <h4 class="ui-widget-header"><span class="ui-icon ui-icon-trash">Trash</span> Drop here</h4>
-</div>
-
-<h3>
-ASSERT: The dropped item is removed from the original list and the following text does not appear: "<strong>I was dropped and removed, but still here I am!</strong>"
-</h3>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>jQuery UI Effects Test Suite</title>
- <link rel="stylesheet" href="effects.all.css" type="text/css" />
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.core.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.blind.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.bounce.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.clip.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.drop.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.explode.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.fold.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.highlight.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.pulsate.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.scale.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.shake.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.slide.js"></script>
- <script type="text/javascript" src="../../ui/jquery.effects.transfer.js"></script>
- <script type="text/javascript" src="effects.all.js"></script>
-</head>
-<body>
-
-<ul class="effects">
-
- <li>
- <div class="effect" id="blindHorizontally">
- <p>Blind horizontally</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="blindVertically">
- <p>Blind vertically</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="bounce3times">
- <p>Bounce 3 times</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="clipHorizontally">
- <p>Clip horizontally</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="clipVertically">
- <p>Clip vertically</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="dropDown">
- <p>Drop down</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="dropUp">
- <p>Drop up</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="dropLeft">
- <p>Drop left</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="dropRight">
- <p>Drop right</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="explode9">
- <p>Explode in 9 pieces</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="explode36">
- <p>Explode in 36 pieces</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="fold">
- <p>Fold</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="highlight">
- <p>Highlight</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="pulsate">
- <p>Pulsate 2 times</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="puff">
- <p>Puff</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="scale">
- <p>Scale</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="shake">
- <p>Shake</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="slideDown">
- <p>Slide down</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="slideUp">
- <p>Slide up</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="slideLeft">
- <p>Slide left</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="slideRight">
- <p>Slide right</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="transfer">
- <p>Transfer to first element</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="addClass">
- <p>addClass</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="removeClass">
- <p>removeClass</p>
- </div>
- </li>
-
- <li>
- <div class="effect" id="toggleClass">
- <p>toggleClass</p>
- </div>
- </li>
-
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!doctype html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- var menus = $("#menu1, #menu2").menu({
- selected: function(event, ui) {
- $("#log").append("<div>Selected " + ui.item.text() + "</div>");
- }
- }).hide();
-
-
- $("button").click(function(event) {
- // TODO required to prevent the click handler below from handling this event
- event.stopPropagation();
- $("#menu" + this.id).menu("deactivate").show().position({
- my: "left top",
- at: "right top",
- of: event.pageX > 0 ? event : this
- });
- $(document).one("click", function() {
- menus.hide();
- })
- }).keydown(function(event) {
- var menu = $("#menu" + this.id).data("menu");
- if (menu.widget().is(":hidden"))
- return;
- event.stopPropagation();
- switch (event.keyCode) {
- case $.ui.keyCode.PAGE_UP:
- menu.previousPage();
- break;
- case $.ui.keyCode.PAGE_DOWN:
- menu.nextPage();
- break;
- case $.ui.keyCode.UP:
- menu.previous();
- break;
- case $.ui.keyCode.DOWN:
- menu.next();
- event.preventDefault();
- break;
- case $.ui.keyCode.ENTER:
- case $.ui.keyCode.TAB:
- menu.select();
- menu.widget().hide();
- event.preventDefault();
- break;
- case $.ui.keyCode.ESCAPE:
- menu.widget().hide();
- break;
- default:
- clearTimeout(menu.filterTimer);
- var prev = menu.previousFilter || "";
- var character = String.fromCharCode(event.keyCode);
- var skip = false;
- if (character == prev) {
- skip = true;
- } else {
- character = prev + character;
- }
-
- var match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($(this).text());
- });
- var match = skip && match.index(menu.active.next()) != -1 ? match.next() : match;
- if (!match.length) {
- character = String.fromCharCode(event.keyCode);
- match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($(this).text());
- });
- }
- if (match.length) {
- menu.activate(match);
- if (match.length > 1) {
- menu.previousFilter = character;
- menu.filterTimer = setTimeout(function() {
- delete menu.previousFilter;
- }, 1000);
- } else {
- delete menu.previousFilter;
- }
- } else {
- delete menu.previousFilter;
- }
- }
- });
- });
- </script>
- <style>
- body { font-size:62.5%; }
- .ui-menu { width: 200px; position: absolute; }
- #menu2 { height: 200px; overflow: auto; }
- </style>
-</head>
-<body>
-
-<button id="1">Show context menu 1</button>
-
-<ul id="menu1">
- <li><a href="#">Amsterdam</a></li>
- <li><a href="#">Anaheim</a></li>
- <li><a href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li><a href="#">Magdeburg</a></li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
-</ul>
-
-<ul id="menu2">
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
-</ul>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-<button id="2">Show context menu 2</button>
-
-</body>
-</html>
+++ /dev/null
-<!doctype html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript">
- $(function() {
- $.widget("ui.drilldown", {
- _init: function() {
- var self = this;
- this.active = this.element.find(">ul").attr("tabindex", 0);
-
- // hide submenus and create indicator icons
- this.element.find("ul").hide().prev("a").prepend('<span class="ui-icon ui-icon-carat-1-e"></span>').end().filter(":first").show();
-
- this.element.find("ul").menu({
- focus: function(event, ui) {
- self.activeItem = ui.item;
- },
- selected: function(event, ui) {
- if (this != self.active[0]) {
- return;
- }
- var nested = $(">ul", ui.item);
- if (nested.length) {
- self._open(nested);
- } else {
- self.element.find("h3").text(ui.item.text());
- self.options.selected.apply(this, arguments);
- }
- }
- });
-
- this.back = this.element.children(":last").button({
- icons: {
- primary: "ui-icon-carat-1-w"
- }
- }).click(function() {
- self.up();
- return false;
- }).hide();
- },
-
- _open: function(submenu) {
- this.active = submenu.show().css({
- top: 0,
- left: 0,
- opacity: 0
- }).position({
- my: "left top",
- at: "right top",
- of: this.widget()
- }).position({
- my: "left top",
- at: "left top",
- of: this.widget(),
- using: function(to) {
- $(this).animate({
- left: to.left,
- top: to.top,
- opacity: 1
- });
- }
- });
- this.back.show();
- },
-
- up: function() {
- if (this.active.parent()[0] == this.element[0]) {
- return;
- }
- this.active.position({
- my: "left top",
- at: "right top",
- of: this.widget(),
- using: function(to) {
- $(this).animate({
- left: to.left,
- top: to.top,
- opacity: 0
- });
- }
- });
- this.active = this.active.parent().parent().show();
- this.activeItem = this.active.data("menu").active;
- if (!this.active.parent().parent().is(":ui-menu")) {
- this.back.hide();
- }
- },
-
- down: function(event) {
- var nested = this.activeItem.find(">ul");
- if (nested.length) {
- this._open(nested);
- nested.menu("activate", event, nested.children(":first"))
- }
- },
-
- show: function() {
- },
-
- hide: function() {
- },
-
- widget: function() {
- return this.element.find(">ul");
- }
- });
-
- var drilldown = $("#drilldown").drilldown({
- selected: function(event, ui) {
- $("#log").append("<div>Selected " + ui.item.text() + "</div>");
- }
- });
-
- drilldown.drilldown("widget").keydown(function(event) {
- var menu = drilldown.data("drilldown").active.data("menu");
- if (menu.widget().is(":hidden"))
- return;
- event.stopPropagation();
- switch (event.keyCode) {
- case $.ui.keyCode.PAGE_UP:
- menu.previousPage();
- break;
- case $.ui.keyCode.PAGE_DOWN:
- menu.nextPage();
- break;
- case $.ui.keyCode.UP:
- menu.previous();
- break;
- case $.ui.keyCode.LEFT:
- drilldown.drilldown("up");
- break;
- case $.ui.keyCode.RIGHT:
- drilldown.drilldown("down");
- break;
- case $.ui.keyCode.DOWN:
- menu.next();
- event.preventDefault();
- break;
- case $.ui.keyCode.ENTER:
- case $.ui.keyCode.TAB:
- menu.select();
- drilldown.drilldown("hide");
- event.preventDefault();
- break;
- case $.ui.keyCode.ESCAPE:
- drilldown.drilldown("hide", event);
- break;
- default:
- clearTimeout(menu.filterTimer);
- var prev = menu.previousFilter || "";
- var character = String.fromCharCode(event.keyCode);
- var skip = false;
- if (character == prev) {
- skip = true;
- } else {
- character = prev + character;
- }
-
- var match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($("a", this).text());
- });
- var match = skip && match.index(menu.active.next()) != -1 ? match.next() : match;
- if (!match.length) {
- character = String.fromCharCode(event.keyCode);
- match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($(this).text());
- });
- }
- if (match.length) {
- menu.activate(event, match);
- if (match.length > 1) {
- menu.previousFilter = character;
- menu.filterTimer = setTimeout(function() {
- delete menu.previousFilter;
- }, 1000);
- } else {
- delete menu.previousFilter;
- }
- } else {
- delete menu.previousFilter;
- }
- }
- });
- });
- </script>
- <style>
- body { font-size:62.5%; }
- .ui-menu { width: 200px; height: 170px; }
- .ui-menu .ui-menu { position: absolute; }
- .ui-menu .ui-icon { float: right; }
- </style>
-</head>
-<body>
-
-<div id="drilldown">
- <h3>Make a selection...</h3>
- <ul>
- <li>
- <a href="#">Amsterdam</a>
- <ul>
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li>
- <a href="#">Adamsville</a>
- <ul>
- <li><a href="#">Anaheim</a></li>
- <li>
- <a href="#">Cologne</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Frankfurt</a></li>
- </ul>
- </li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Amesville</a></li>
- </ul>
- </li>
- <li><a href="#">Anaheim</a></li>
- <li><a href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li>
- <a href="#">Magdeburg</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
- </ul>
- <a href="#">Go back</a>
-</div>
-
-<div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!doctype html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- var menus = $("#menu1, #menu2").menu({
- selected: function(event, ui) {
- $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
- }
- }).keydown(function(event) {
- var menu = $(this).data("menu");
- if (menu.widget().is(":hidden"))
- return;
- event.stopPropagation();
- switch (event.keyCode) {
- case $.ui.keyCode.PAGE_UP:
- menu.previousPage();
- event.preventDefault();
- break;
- case $.ui.keyCode.PAGE_DOWN:
- menu.nextPage();
- event.preventDefault();
- break;
- case $.ui.keyCode.UP:
- menu.previous();
- event.preventDefault();
- break;
- case $.ui.keyCode.DOWN:
- menu.next();
- event.preventDefault();
- break;
- case $.ui.keyCode.ENTER:
- menu.select();
- event.preventDefault();
- break;
- }
- });
-
- });
- </script>
- <style>
- body { font-size:62.5%; }
- .ui-menu { width: 200px; }
- #menu2 { height: 200px; overflow: auto; }
- </style>
-</head>
-<body>
-
-<ul id="menu1" tabindex="0">
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
-</ul>
-
-<ul id="menu2" tabindex="0">
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li><a href="#">Adamsville</a></li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Adelphi</a></li>
- <li><a href="#">Adena</a></li>
- <li><a href="#">Adrian</a></li>
- <li><a href="#">Akron</a></li>
- <li><a href="#">Albany</a></li>
- <li><a href="#">Alexandria</a></li>
- <li><a href="#">Alger</a></li>
- <li><a href="#">Alledonia</a></li>
- <li><a href="#">Alliance</a></li>
- <li><a href="#">Alpha</a></li>
- <li><a href="#">Alvada</a></li>
- <li><a href="#">Alvordton</a></li>
- <li><a href="#">Amanda</a></li>
- <li><a href="#">Amelia</a></li>
- <li><a href="#">Amesville</a></li>
-</ul>
-
-<div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!doctype html>
-<html>
-<head>
- <title>Menu Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- $.fn.themeswitcher && $('<div/>').css({
- position: "absolute",
- right: 10,
- top: 10
- }).appendTo(document.body).themeswitcher();
-
- $.widget("ui.nestedmenu", {
- _init: function() {
- var self = this;
- this.active = this.element;
-
- // hide submenus and create indicator icons
- this.element.find("ul").hide().prev("a").prepend('<span class="ui-icon ui-icon-carat-1-e"></span>');
-
- this.element.find("ul").andSelf().menu({
- selected: this.options.selected,
- focus: function(event, ui) {
- self.active = ui.item.parent();
- self.activeItem = ui.item;
- ui.item.parent().find("ul").hide();
- var nested = $(">ul", ui.item);
- if (nested.length && /^mouse/.test(event.originalEvent.type)) {
- self._open(nested);
- }
- }
- })
- },
-
- _open: function(submenu) {
- submenu.show().css({
- top: 0,
- left: 0
- }).position({
- my: "left top",
- at: "right top",
- of: this.activeItem
- });
- },
-
- up: function(event) {
- this.active = this.active.menu("deactivate").hide().parent().parent();
- this.activeItem = this.active.data("menu").active;
- },
-
- down: function(event) {
- var submenu = $(">ul", this.activeItem);
- this._open(submenu, this.activeItem);
- submenu.menu("activate", event, submenu.children(":first"));
- },
-
- show: function() {
- this.active = this.element;
- this.element.show();
- },
-
- hide: function() {
- this.element.find("ul").andSelf().menu("deactivate").hide();
- }
-
- });
-
- var nestedmenu = $("#menu").nestedmenu({
- selected: function(event, ui) {
- $("#log").append("<div>Selected " + ui.item.text() + "</div>");
- }
- }).hide();
-
- $("button").click(function(event) {
- // TODO required to prevent the click handler below from handling this event
- event.stopPropagation();
- nestedmenu.nestedmenu("show")
- .css({
- top: 0,
- left: 0
- })
- .position({
- my: "left top",
- at: "right top",
- of: this
- });
- $(document).one("click", function() {
- nestedmenu.nestedmenu("hide");
- })
- }).keydown(function(event) {
- var menu = nestedmenu.data("nestedmenu").active.data("menu");
- if (menu.widget().is(":hidden"))
- return;
- event.stopPropagation();
- switch (event.keyCode) {
- case $.ui.keyCode.PAGE_UP:
- menu.previousPage(event);
- break;
- case $.ui.keyCode.PAGE_DOWN:
- menu.nextPage(event);
- break;
- case $.ui.keyCode.UP:
- menu.previous(event);
- break;
- case $.ui.keyCode.LEFT:
- nestedmenu.nestedmenu("up", event);
- break;
- case $.ui.keyCode.RIGHT:
- nestedmenu.nestedmenu("down", event);
- break;
- case $.ui.keyCode.DOWN:
- menu.next(event);
- event.preventDefault();
- break;
- case $.ui.keyCode.ENTER:
- case $.ui.keyCode.TAB:
- menu.select();
- nestedmenu.nestedmenu("hide");
- event.preventDefault();
- break;
- case $.ui.keyCode.ESCAPE:
- nestedmenu.nestedmenu("hide");
- break;
- default:
- clearTimeout(menu.filterTimer);
- var prev = menu.previousFilter || "";
- var character = String.fromCharCode(event.keyCode);
- var skip = false;
- if (character == prev) {
- skip = true;
- } else {
- character = prev + character;
- }
-
- var match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($("a", this).text());
- });
- var match = skip && match.index(menu.active.next()) != -1 ? match.next() : match;
- if (!match.length) {
- character = String.fromCharCode(event.keyCode);
- match = menu.widget().children("li").filter(function() {
- return new RegExp("^" + character, "i").test($(this).text());
- });
- }
- if (match.length) {
- menu.activate(event, match);
- if (match.length > 1) {
- menu.previousFilter = character;
- menu.filterTimer = setTimeout(function() {
- delete menu.previousFilter;
- }, 1000);
- } else {
- delete menu.previousFilter;
- }
- } else {
- delete menu.previousFilter;
- }
- }
- });
- });
- </script>
- <style>
- body { font-size:62.5%; }
- .ui-menu { width: 200px; position: absolute; }
- .ui-menu .ui-icon { float: right; }
- </style>
-</head>
-<body>
-
-<button>Show context menu</button>
-<br/>
-<select>
- <option>some option with some text</option>
-</select>
-
-<ul id="menu">
- <li>
- <a href="#">Amsterdam</a>
- <ul>
- <li><a href="#">Aberdeen</a></li>
- <li><a href="#">Ada</a></li>
- <li>
- <a href="#">Adamsville</a>
- <ul>
- <li><a href="#">Anaheim</a></li>
- <li>
- <a href="#">Cologne</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Frankfurt</a></li>
- </ul>
- </li>
- <li><a href="#">Addyston</a></li>
- <li><a href="#">Amesville</a></li>
- </ul>
- </li>
- <li><a href="#">Anaheim</a></li>
- <li><a href="#">Cologne</a></li>
- <li><a href="#">Frankfurt</a></li>
- <li>
- <a href="#">Magdeburg</a>
- <ul>
- <li><a href="#">Mberdeen</a></li>
- <li><a href="#">Mda</a></li>
- <li><a href="#">Mdamsville</a></li>
- <li><a href="#">Mddyston</a></li>
- <li><a href="#">Mmesville</a></li>
- </ul>
- </li>
- <li><a href="#">Munich</a></li>
- <li><a href="#">Utrecht</a></li>
- <li><a href="#">Zurich</a></li>
-</ul>
-
-<div class="ui-widget" style="margin-top:2em; font-family:Arial">
- Log:
- <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset=utf-8 />
- <title>Test for Issue #6946</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <style type="text/css" media="screen">
-
- body {
- background: white;
- font-size: 90%;
- }
- .error {
- color: #f55;
- font-style: italic;
- }
- #sortable div:hover {
- cursor: move;
- }
-
- </style>
-</head>
-<body>
- <h1>Test for Issue #6946</h1>
- <p>Use the following list to test the steps listed below:</p>
- <div id="sortable">
- <div>One</div>
- <div>Two</div>
- <div>Three</div>
- </div>
- <div id="events"></div>
- <h2>Expected</h2>
- <ol>
- <li>Drag an item to a new position in the list and release.</li>
- <li>The click event should be received (appropriately suppressed by jQuery UI).</li>
- <li>Click the same item.</li>
- <li>The click event should be received.</li>
- <li>Click the same item again.</li>
- <li>The click event should be received.</li>
- </ol>
- <h2>Experienced (Gecko/Opera)</h2>
- <ol>
- <li>Drag an item to a new position in the list and release.</li>
- <li>The click event is not received <em>(never sent by browser)</em>.</li>
- <li>Click the same item.</li>
- <li class="error">The click event is not received (erroneously suppressed by jQuery UI).</li>
- <li>Click the same item again.</li>
- <li>The click event is finally received.</li>
- </ol>
- <script type="text/javascript">
-
- $(function () {
- $('#sortable').sortable();
- $('#sortable').bind('click', function () {
- $('#events').append('Click event received!<br />');
- });
- });
-
- </script>
-</body>
-</html>
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Position Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- var inputs = $("input");
- $("ul").insertAfter(inputs);
- $(window).resize(function() {
- inputs.each(function() {
- $(this).position({
- my: this.id.replace(/-/, " "),
- at: this.id.replace(/-/, " "),
- of: "#container",
- collision: "none"
- });
- $(this).next().menu().position({
- my: "left top",
- at: "left bottom",
- of: this
- });
- });
- }).resize();
- });
- </script>
- <style>
- input, .ui-menu { position: absolute; }
- .ui-menu { width: 200px; }
- html, body { width: 99%; height: 99% }
- #container { width: 95%; height: 95%; border: 1px solid black; margin: auto; }
- </style>
-</head>
-<body>
-
-<div id="container"></div>
-
-<input id="left-top" />
-<input id="left-center" />
-<input id="left-bottom" />
-<input id="center-top" />
-<input id="center-center" />
-<input id="center-bottom" />
-<input id="right-top" />
-<input id="right-center" />
-<input id="right-bottom" />
-
-<ul>
- <li><a href="#">Java</a></li>
- <li><a href="#">JavaScript</a></li>
- <li><a href="#">Perl</a></li>
- <li><a href="#">Ruby</a></li>
- <li><a href="#">C++</a></li>
- <li><a href="#">Python</a></li>
- <li><a href="#">C#</a></li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Position Visual Test: Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script type="text/javascript">
- $(function() {
- $( "#elem" ).position({
- my: "right bottom",
- at: "right bottom",
- of: window,
- collision: "fit"
- });
- });
- </script>
- <style>
- #elem {
- position: absolute;
- top: 100px;
- left: 100px;
- width: 200px;
- height: 200px;
- box-shadow: 10px 10px 5px #888;
- -moz-box-shadow: 10px 10px 5px #888;
- -webkit-box-shadow: 10px 10px 5px #888;
- background-color: #aaa;
- margin: 15px;
- }
- </style>
-</head>
-<body>
-
-<div id="elem"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Progressbar Visual Test: Default</title>
- <link rel="stylesheet" href="../all.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.progressbar.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#progressbar").progressbar({ value: 37 });
- });
- </script>
-</head>
-<body>
-
-<ul class="plugins">
-<li class="plugin">
- Progressbar
- <div id="progressbar"></div>
-</li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable();
- });
- </script>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option alsoResize child</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#parentDiv").resizable({
- handles: 'all',
- alsoResize: "#childDiv"
- });
- });
- </script>
- <style type="text/css">
- #parentDiv {
- position: absolute;
- padding: 1em;
- width: 200px;
- height: 200px;
- background: silver;
- border: 1px solid gray;
- }
- #childDiv {
- position:relative;
- padding: 1em;
- border: 1px solid gray;
- }
- </style>
-</head>
-<body>
-
-<div id="parentDiv">
- parent
- <div id="childDiv">
- child
- </div>
- parent
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 0.5</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 0.5
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.0</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 1.0
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.5</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 1.5
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxHeight 150</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve',
- maxHeight: 150
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxWidth 150</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve',
- maxWidth: 150
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.0 minHeight 50</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve',
- minHeight: 50
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable option aspectRatio 1.0 maxWidth 50</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve',
- minWidth: 50
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve'
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve'
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 50px; height: 100px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- aspectRatio: 'preserve'
- });
- });
- </script>
- <style type="text/css">
- #resizable { width: 100px; height: 50px; background: silver; }
- </style>
-</head>
-<body>
-
-<div id="resizable">Resizable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable ticket #3053</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- handles: 'all',
- aspectRatio: true,
- transparent: true,
- ghost: true
- });
- });
- </script>
- <style type="text/css">
- .ui-resizable-handle { width: 8px; height: 8px; border: 1px solid rgb(128, 128, 128); background: rgb(242, 242, 242); }
- .ui-resizable-n, .ui-resizable-s { left: 45%; }
- .ui-resizable-e, .ui-resizable-w { top: 45%; }
- .ui-resizable-se { bottom: -5px; right: -5px; }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/3053">#3053 - when resizing a image a row of pixels can disappear</a></h1>
-
-<img id="resizable" src="images/test.png">
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable ticket #4199</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- containment:"#container",
- aspectRatio: true
- });
- });
- </script>
- <style type="text/css">
- #container { width: 250px; height: 250px; border: 1px solid black; }
- #resizable { background: gray; width: 70px; height: 30px; }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4199">#4199 - resizable with containment boundary - aspectRatio breaks.</a></h1>
-
-<div id="container">
-
-<div id="resizable">Resizable</div>
-
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable ticket #4217</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable({
- handles: 'all',
- containment: 'parent'
- });
- });
- </script>
- <style type="text/css">
- #rprnt { width: 425px; height: 200px; border: 1px solid black; }
- #resizable { background: #cec; height: 100px; border: 1px dotted gray; }
- .ui-resizable-handle { width: 8px; height: 8px; border: 1px solid rgb(128, 128, 128); background: rgb(242, 242, 242); }
- .ui-resizable-n, .ui-resizable-s { left: 45%; }
- .ui-resizable-e, .ui-resizable-w { top: 45%; }
- .ui-resizable-se { bottom: -5px; right: -5px; }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4217">#4217 - Resizable: displacement of element (in case of constraint resize area)</a></h1>
-<img src="http://dev.jqueryui.com/raw-attachment/ticket/4217/resizable.PNG">
-
-<div id="rprnt">
-
-<div id="resizable">
- <p>
- Resizable
- </p>
-</div>
-
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable ticket #4940</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#resizable").resizable().resizable('destroy');
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4940">#4940 - resizable('destroy') moves images to end of parent element</a></h1>
-
-before
-
-<textarea id="resizable"></textarea>
-
-after
-
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
- <head>
- <meta charset="UTF-8" />
- <title>Resizable Visual Test : Resizable ticket #5335</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript">
- $(function() {
- $('.item.to-be-draggable').draggable({ revert: true });
- $('.item').resizable({ maxWidth: 500, minHeight: 150, minWidth: 170, maxHeight: 400,handles: 'n,s' });
- }
- );
- </script>
- <style type="text/css">
- #main {
- width: 900px;
- height: 500px;
- overflow: scroll;
- }
- .item {
- width: 170px;
- height: 150px;
- margin: 10px;
- border: 1px solid #aaa;
- }
- #sub {
- height: 2000px;
- }
- .i1 { background-color: #acacac; }
- .i2 { background-color: #bcacac; }
-
- </style>
- </head>
- <body>
- <h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5335">#5335 - Resizable: position set to absolute at end of resize</a></h1>
- <div id="main">
- <div id="sub">
- <div class="item i1 to-be-draggable">Draggable</div>
- <div class="item i2">Not draggable</div>
- </div>
-
- </div>
- </body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Selectable Visual Test : Default</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.selectable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#selectable").selectable();
- });
- </script>
-</head>
-
-<body>
-
-<ul class="plugins">
-<li class="plugin">
- Selectable
- <div id="selectable">
- <div>1</div>
- <div>2</div>
- <div>3</div>
- <div>4</div>
- <div>5</div>
- <div>6</div>
- <div>7</div>
- <div>8</div>
- <div>9</div>
- </div>
-</li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Selectable Visual Test : Selectable ticket #4341</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.selectable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#selectable").selectable({
- appendTo: "#container"
- });
- });
- </script>
- <style type="text/css">
- body { margin: 0; padding: 0; }
- #container { width: 600px; height: 400px; border: 1px solid gray; position: relative; overflow: hidden; }
- #selectable { width: 400px; height: 300px; border: 1px solid silver; margin: 1em; }
- #selectable * { margin: 1em; padding: 1em; }
- .ui-selecting { background-color: #eef; }
- .ui-selected { background-color: silver; }
- </style>
-</head>
-<body>
-
-<div id="container">
-
-<div id="selectable">
- <div>Selectable 1</div>
- <div>Selectable 2</div>
- <div>Selectable 3</div>
- <div>Selectable 4</div>
- <div>Selectable 5</div>
-</div>
-
-</div>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4341">#4341 - Selectable: option appendTo is ignored, helper always appends to body</a></h1>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider1").slider();
- });
- </script>
-</head>
-<body>
-
-<div id="slider1"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider horizontal</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'horizontal',
- value: 50
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider horizontal range</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'horizontal',
- range: true,
- values: [25, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider horizontal range max</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'horizontal',
- range: 'max',
- value: 75
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider horizontal range min</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'horizontal',
- range: 'min',
- value: 25
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider in container with scrollbars</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({ value: 50 });
- });
- </script>
-</head>
-<body>
-
-<h1>
-TEST: press UP, DOWN, LEFT, RIGHT, HOME, END on a slider which is inside a container with scrollbars.
-</h1>
-
-<div style="width: 200px; height: 150px; overflow:scroll;">
-
-<div style="width: 220px; height: 180px;">
-
-<div style="width: 100px; margin-left: 40px; margin-top: 60px;" id="slider"></div>
-
-</div>
-
-</div>
-
-<h2>
-ASSERT: the scrollbars do not move when the focus is on the slider handle and an arrow key or HOME or END are pressed.
-</h2>
-<h2>
-ASSERT: the scrollbars move when the focus is not on the slider handle and an arrow key or HOME or END are pressed.
-</h2>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider method destroy</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: true,
- values: [25, 75]
- });
- $("#slider").slider("destroy");
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider method disable</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: true,
- values: [25, 75]
- });
- $("#slider").slider("disable");
- $(".hover").disableSelection().addClass("ui-corner-all");
- $("#hover-enable").mouseover(function() {
- $("#slider").slider("enable");
- });
- $("#hover-disable").mouseover(function() {
- $("#slider").slider("disable");
- });
- });
- </script>
- <style type="text/css">
- .hover { width: 250px; height: 75px; color: white; font-size: 3em; text-align: center; line-height: 2.5em; cursor: default; margin: 1em 1em 0 0; float: left; }
- #hover-enable { background: #4e9a06; }
- #hover-disable { background: #cc0000; }
- </style>
-</head>
-<body>
-
-<a href="#">tab before</a>
-<div id="slider"></div>
-<a href="#">tab after</a>
-
-<hr style="margin-top:100px;"/>
-
-<div id="hover-enable" class="hover">hover to enable</div>
-<div id="hover-disable" class="hover">hover to disable</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option animate false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- animate: false
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option animate true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
-
- <style type="text/css">
- fieldset { padding: 1em; margin: 1em; }
- legend { font-size: 1.3em; font-family: monospace; font-weight: bold; }
- #slider1 { margin: 1em; }
- #slider2 { margin: 1em; height: 400px; }
- </style>
-
- <script type="text/javascript">
- $(function() {
- $("#slider1").slider({
- animate: true,
- step: 10
- });
- $("#slider2").slider({
- animate: true,
- orientation: 'vertical',
- step: 5,
- values: [5, 15, 35, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<fieldset>
- <legend>$("#slider1").slider({
- animate: true,
- step: 10
- });</legend>
-<div id="slider1"></div>
-<button onclick="$('#slider1').slider('value', 15);">method value: 15</button>
-<button onclick="$('#slider1').slider('value', 75);">method value: 75</button>
-<button onclick="$('#slider1').slider('option', 'value', 25);">option value: 25</button>
-<button onclick="$('#slider1').slider('option', 'value', 85);">option value: 85</button>
-</fieldset>
-
-<fieldset>
- <legend>$("#slider2").slider({
- animate: true,
- orientation: 'vertical',
- step: 5,
- values: [5, 15, 35, 75]
- });</legend>
-<div id="slider2"></div>
-<button onclick="$('#slider2').slider('values', [10, 20, 30, 40]);">method values: [10, 20, 30, 40]</button>
-<button onclick="$('#slider2').slider('values', [80, 70, 60, 50]);">method values: [80, 70, 60, 50]</button>
-<button onclick="$('#slider2').slider('option', 'values', [20, 30, 40, 50]);">option values: [20, 30, 40, 50]</button>
-<button onclick="$('#slider2').slider('option', 'values', [90, 80, 70, 60]);">option values: [90, 80, 70, 60]</button>
-</fieldset>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option max 3</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- max: 3
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option max 30</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- max: 30
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option max 300</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- max: 300
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option min -3</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- min: -3,
- max: 0
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option min -30</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- min: -30,
- max: 0
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option min -300</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- min: -300,
- max: 0
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option orientation 'horizontal'</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- orientation: 'horizontal'
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option orientation 'vertical'</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- orientation: 'vertical'
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option range false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: false,
- value: 50
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option range 'max'</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: 'max',
- value: 40
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option range 'min'</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: 'min',
- value: 60
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option range true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: true,
- values: [25, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option step 25</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- step: 25
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option step 5</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- step: 5
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option value 3</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- value: 3
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option value 30</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- value: 30
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option values 25 50 75</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- values: [25, 50, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option values 25 75</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- values: [25, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider option values 50</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- values: [50]
- });
- });
- </script>
-</head>
-<body>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider ticket #3736</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- values: [25, 50, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/3736">#3736 - Some handles get stuck when using two or more handles</a></h1>
-
-<h2>
-TEST: Move all three handles with the mouse and the keyboard.
-</h2>
-
-<div id="slider"></div>
-
-<h3>
-ASSERT: Each handle can be moved along the full slider, not restricted by value of other handle(s).
-</h3>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider ticket #3762</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({ values: [5,0], range: true});
- $("#slider1").slider({ values: [-1,5], range: true});
- $("#slider2").slider({ values: [5,200], range: true});
- $("#slider3").slider({ values: [5,0], range: true});
- $("#slider4").slider({range: true});
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/3762">#3762 - slider handles not restricted properly when set programmatically</a></h1>
-
-<div id="slider"></div>
-
-<div>- if less than min, set to min</div>
-<div id="slider1"></div>
-
-<div>- if greater than max, set to max</div>
-<div id="slider2"></div>
-
-<div>- if less than previous handle value, set to previous handle value</div>
-<div id="slider3"></div>
-
-<div>no values set</div>
-<div id="slider4"></div>
-
-
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider ticket #4385</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: true,
- min: 0,
- max: 500,
- values: [75, 300],
- slide: function(event, ui) {
- var minMet = ((ui.values[1] - ui.values[0]) > 50);
- minMet && $("#rangevalue").text(ui.values[0] + ' - ' + ui.values[1]);
- return minMet;
- }
- });
- $("#rangevalue").text($("#slider").slider("values", 0) + ' - ' + $("#slider").slider("values", 1));
- });
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4385">#4385 - event slide callback returning false can lead to stuck range handles</a></h1>
-
-<p>
-<label for="rangevalue">Price range:</label>
-<span id="rangevalue"></span>
-</p>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider ticket #4467</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#slider").slider({
- range: true,
- values: [25, 75]
- });
- });
- </script>
- <style type="text/css">
- .ui-slider-handle {
- width: 100px !important;
- }
- </style>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/4467">#4467 - slider handle jumps few pixels right or left if it's clicked on it</a></h1>
-
-<div id="slider"></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider vertical</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'vertical',
- value: 50
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider vertical range</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'vertical',
- range: true,
- values: [25, 75]
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider vertical range max</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'vertical',
- range: 'max',
- value: 75
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Slider Visual Test : Slider vertical range min</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript">
- $(function() {
- $("body").children(":first").slider({
- orientation: 'vertical',
- range: 'min',
- value: 25
- });
- });
- </script>
-</head>
-<body>
-
-<div></div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Visual Test : Default</title>
- <link rel="stylesheet" href="../all.css" type="text/css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#sortable").sortable();
- });
- </script>
-</head>
-
-<body>
-
-<ul class="plugins">
-<li class="plugin">
- Sortable
- <div id="sortable">
- <div>C</div>
- <div>I</div>
- <div>G</div>
- <div>F</div>
- <div>D</div>
- <div>H</div>
- <div>A</div>
- <div>E</div>
- <div>B</div>
- </div>
-</li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Massive Scale Test</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <style>
- ul {
- list-style: none;
- padding: 0;
- border: 1px solid black;
- width: 210px;
- float: left;
- margin-right: 10px;
- }
- li {
- width: 200px;
- background: #eee;
- margin: 5px;
- }
- </style>
- <script type="text/javascript">
- $(function() {
- $('ul').not(".draggable").sortable({ items: "li" });
- $("ul.draggable li").draggable({ helper: "clone", connectToSortable: "ul" });
- });
- </script>
-</head>
-<body>
-
-<ul class="draggable">
- <li>Draggable</li>
-</ul>
-
-<ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
-</ul>
-
-<ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
-</ul>
-
-<ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
-</ul>
-
-<ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
-</ul>
-
-<ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- <li>Item 4</li>
- <li>Item 5</li>
- <li>Item 6</li>
- <li>Item 7</li>
- <li>Item 8</li>
- <li>Item 9</li>
- <li>Item 10</li>
- <li>Item 11</li>
- <li>Item 12</li>
- <li>Item 13</li>
- <li>Item 14</li>
- <li>Item 15</li>
- <li>Item 16</li>
- <li>Item 17</li>
- <li>Item 18</li>
- <li>Item 19</li>
- <li>Item 20</li>
-</ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Visual Test : Sortable option revert false</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#sortable").sortable({
- revert: false
- });
- });
- </script>
-</head>
-
-<body>
-
-<div id="sortable">
- <div>Sortable 1</div>
- <div>Sortable 2</div>
- <div>Sortable 3</div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Visual Test : Sortable option revert true</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" />
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#sortable").sortable({
- revert: true
- });
- });
- </script>
-</head>
-
-<body>
-
-<div id="sortable">
- <div>Sortable 1</div>
- <div>Sortable 2</div>
- <div>Sortable 3</div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Visual testcase for #4231</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <style>
- .scrollArea {
- overflow: auto;
- width: 400px;
- height: 600px;
- }
- .dropArea {
- height: 100px;
- width: 380px;
- padding: 0 0 0 0;
- background-color: #CCCCCC;
- margin: 10px 0 10px 0;
- }
- .dragArea {
- width: 100px;
- height: 30px;
- background-color: #FF0000;
- margin: 10px 0 10px 0;
- }
- .inv {
- position: absolute;
- left: 450px;
- top: 10px;
- width: 150px;
- height: 600px;
- }
- </style>
- <script>jQuery(document).ready(function(){
- $(".dropArea").droppable({
- drop: function(ev, ui) { $(ui.draggable).html("dropped"); }
- })
- .sortable();
- $(".dragArea").draggable({
- connectToSortable: '.dropArea',
- revert: 'invalid',
- helper: 'clone'
- });
- });
-</script>
-</head>
-<body>
- <div class="scrollArea">
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- <ul class="dropArea"></ul>
- </div>
-
- <ul class="inv">
- <li class="dragArea">Drag me</li>
- <li class="dragArea">Drag me</li>
- <li class="dragArea">Drag me</li>
- </ul>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Sortable Visual Test : Sortable ticket #5355</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.sortable.js"></script>
- <style>
- #main {
- height: 2000px;
- padding-top: 1000px;
- }
- </style>
- <script>
- $( function() {
- $( ".AdminSidebar" ).sortable( {
- connectWith: '.AdminSidebar',
- handle: '.moveWidget'
- } );
- } );
- </script>
-</head>
-<body>
-
-<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5355">#5355 - cssPosition in sortable</a></h1>
-
-<div id="main">
- <div class="AdminSidebar" style="float:left">
- <div class="AdminWidget">
- <span class="moveWidget">handle</span>
- <div class="WidgetContent">....</div>
- </div>
- <div class="AdminWidget">
- <span class="moveWidget">handle</span>
- <div class="WidgetContent">....</div>
- </div>
- </div>
- <div class="AdminSidebar" style="float:left;">
- <div class="AdminWidget">
- <span class="moveWidget">handle</span>
- <div class="WidgetContent">....</div>
- </div>
- <div class="AdminWidget">
- <span class="moveWidget">handle</span>
- <div class="WidgetContent">....</div>
- </div>.
- </div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>Tabs Visual Test : Default</title>
- <link rel="stylesheet" href="../visual.css" type="text/css" />
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function() {
- $("#tabs").tabs();
- });
- </script>
-</head>
-<body>
-
-<div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- <li><a href="#tabs-3">Third</a></li>
- </ul>
- <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
- <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
- <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
-</div>
-
-</body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>jQuery UI Example Page</title>
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css">
- <script type="text/javascript" src="../../jquery-1.8.2.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.accordion.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.droppable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.progressbar.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.selectable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.sortable.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
- <script type="text/javascript">
- $(function(){
-
- // Accordion
- $(".accordion").accordion({ header: "h3" });
- $(".accordion").last().accordion("option", "icons", false);
-
-
- // Tabs
- $('#tabs').tabs();
-
-
- // Dialog
- $('#dialog').dialog({
- autoOpen: false,
- width: 600,
- buttons: {
- "Ok": function() {
- $(this).dialog("close");
- },
- "Cancel": function() {
- $(this).dialog("close");
- }
- }
- });
-
- // Dialog Link
- $('#dialog_link').click(function(){
- $('#dialog').dialog('open');
- return false;
- });
-
- // Datepicker
- $('#datepicker').datepicker({
- inline: true,
- showWeek: true
- });
-
- $('#multidatepicker').datepicker({
- numberOfMonths: 3,
- showButtonPanel: true,
- inline: true
- });
-
- // Slider
- $('.slider').slider({
- range: true,
- values: [17, 67]
- });
-
- $("#eq > span").each(function() {
- var value = parseInt($(this).text());
- $(this).empty().slider({
- value: value,
- range: "min",
- animate: true,
- orientation: "vertical"
- });
- });
-
-
- // Progressbar
- $("#progressbar").progressbar({
- value: 20
- });
-
- //hover states on the static widgets
- $('#dialog_link, ul#icons li').hover(
- function() { $(this).addClass('ui-state-hover'); },
- function() { $(this).removeClass('ui-state-hover'); }
- );
-
- $(".buttonset > button").button()
- .next()
- .button({
- text: false,
- icons: {
- primary: "ui-icon-triangle-1-s"
- }
- })
- .parent()
- .buttonset();
-
-
- $('#beginning').button({
- text: false,
- icons: {
- primary: 'ui-icon-seek-start'
- }
- });
- $('#rewind').button({
- text: false,
- icons: {
- primary: 'ui-icon-seek-prev'
- }
- });
- $('#play').button({
- text: false,
- icons: {
- primary: 'ui-icon-play'
- }
- });
- $('#stop').button({
- text: false,
- icons: {
- primary: 'ui-icon-stop'
- }
- });
- $('#forward').button({
- text: false,
- icons: {
- primary: 'ui-icon-seek-next'
- }
- });
- $('#end').button({
- text: false,
- icons: {
- primary: 'ui-icon-seek-end'
- }
- });
- $("#shuffle").button();
- $("#repeat").buttonset();
-
- });
- </script>
- <style type="text/css">
- /*demo page css*/
- body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
- .demoHeaders { margin-top: 2em; clear:both; }
- #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
- #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
- ul#icons {margin: 0; padding: 0;}
- ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left; list-style: none;}
- ul#icons span.ui-icon {float: left; margin: 0 4px;}
- .columnbox { height: 150px; width: 48%; float:left; margin-right: 1%; }
- #eq span { height:120px; float:left; margin:15px }
- .buttonset {margin-bottom: 5px; }
- #toolbar { padding: 10px 4px; }
- </style>
- </head>
- <body>
-
- <!-- <p style="font-size: 1.3em; line-height: 1.5; margin: 1em 0; width: 50%;">This page demonstrates the widgets using a theme.</p> -->
- <div id="switcher" style="position:absolute; right: 20px; top: 20px;"></div>
-
- <!-- Accordion -->
- <h2 class="demoHeaders">Accordion</h2>
- <div class="columnbox">
- <div class="accordion">
- <div>
- <h3><a href="#">First</a></h3>
- <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
- </div>
- <div>
- <h3><a href="#">Second</a></h3>
- <div>Phasellus mattis tincidunt nibh.</div>
- </div>
- <div>
- <h3><a href="#">Third</a></h3>
- <div>Nam dui erat, auctor a, dignissim quis.</div>
- </div>
- </div>
- </div>
- <div class="columnbox">
- <div class="accordion">
- <div>
- <h3><a href="#">First no icons</a></h3>
- <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
- </div>
- <div>
- <h3><a href="#">Second no icons</a></h3>
- <div>Phasellus mattis tincidunt nibh.</div>
- </div>
- <div>
- <h3><a href="#">Third no icons</a></h3>
- <div>Nam dui erat, auctor a, dignissim quis.</div>
- </div>
- </div>
- </div>
-
-
- <!-- Tabs -->
- <h2 class="demoHeaders">Tabs</h2>
- <div id="tabs">
- <ul>
- <li><a href="#tabs-1">First</a></li>
- <li><a href="#tabs-2">Second</a></li>
- <li><a href="#tabs-3">Third</a></li>
- </ul>
- <div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
- <div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
- <div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
- </div>
-
- <!-- Dialog NOTE: Dialog is not generated by UI in this demo so it can be visually styled in themeroller-->
- <h2 class="demoHeaders">Dialog</h2>
- <p><a href="#" id="dialog_link" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-newwin"></span>Open Dialog</a></p>
-
- <div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable ui-resizable" ><div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"><span class="ui-dialog-title">Inline Dialog</span><a href="#" class="ui-dialog-titlebar-close ui-corner-all" ><span class="ui-icon ui-icon-closethick" >close</span></a></div><div class="ui-dialog-content ui-widget-content" >
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div><div class="ui-resizable-handle ui-resizable-n" ></div><div class="ui-resizable-handle ui-resizable-e" ></div><div class="ui-resizable-handle ui-resizable-s" ></div><div class="ui-resizable-handle ui-resizable-w" ></div><div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se" ></div><div class="ui-resizable-handle ui-resizable-sw" ></div><div class="ui-resizable-handle ui-resizable-ne" ></div><div class="ui-resizable-handle ui-resizable-nw" ></div><div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix"><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Ok</span></button><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Cancel</span></button></div></div>
-
-
- <h2 class="demoHeaders">Overlay and Shadow Classes <em>(not currently used in UI widgets)</em></h2>
- <div style="position: relative; width: 96%; height: 200px; padding:1% 4%; overflow:hidden;" class="fakewindowcontain">
- <p>Lorem ipsum dolor sit amet, Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. </p><p>Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. </p><p>Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. </p><p>Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. </p>
-
- <!-- ui-dialog -->
- <div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all" style="width: 302px; height: 152px; position: absolute; left: 50px; top: 30px;"></div></div>
- <div style="position: absolute; width: 280px; height: 130px;left: 50px; top: 30px; padding: 10px;" class="ui-widget ui-widget-content ui-corner-all">
- <div class="ui-dialog-content ui-widget-content" style="background: none; border: 0;">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div>
- </div>
-
- </div>
-
-
- <!-- ui-dialog -->
- <div id="dialog" title="Dialog Title">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
- </div>
-
-
-
- <h2 class="demoHeaders">Framework Icons (content color preview)</h2>
- <ul id="icons" class="ui-widget ui-helper-clearfix">
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-n"><span class="ui-icon ui-icon-carat-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-ne"><span class="ui-icon ui-icon-carat-1-ne"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-e"><span class="ui-icon ui-icon-carat-1-e"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-se"><span class="ui-icon ui-icon-carat-1-se"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-s"><span class="ui-icon ui-icon-carat-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-sw"><span class="ui-icon ui-icon-carat-1-sw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-w"><span class="ui-icon ui-icon-carat-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-nw"><span class="ui-icon ui-icon-carat-1-nw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n-s"><span class="ui-icon ui-icon-carat-2-n-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e-w"><span class="ui-icon ui-icon-carat-2-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n"><span class="ui-icon ui-icon-triangle-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-ne"><span class="ui-icon ui-icon-triangle-1-ne"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-e"><span class="ui-icon ui-icon-triangle-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-se"><span class="ui-icon ui-icon-triangle-1-se"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s"><span class="ui-icon ui-icon-triangle-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-sw"><span class="ui-icon ui-icon-triangle-1-sw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-w"><span class="ui-icon ui-icon-triangle-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-nw"><span class="ui-icon ui-icon-triangle-1-nw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-n-s"><span class="ui-icon ui-icon-triangle-2-n-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-e-w"><span class="ui-icon ui-icon-triangle-2-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-n"><span class="ui-icon ui-icon-arrow-1-n"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-ne"><span class="ui-icon ui-icon-arrow-1-ne"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-e"><span class="ui-icon ui-icon-arrow-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-se"><span class="ui-icon ui-icon-arrow-1-se"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-s"><span class="ui-icon ui-icon-arrow-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-sw"><span class="ui-icon ui-icon-arrow-1-sw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-w"><span class="ui-icon ui-icon-arrow-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-nw"><span class="ui-icon ui-icon-arrow-1-nw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-n-s"><span class="ui-icon ui-icon-arrow-2-n-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-ne-sw"><span class="ui-icon ui-icon-arrow-2-ne-sw"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-e-w"><span class="ui-icon ui-icon-arrow-2-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-se-nw"><span class="ui-icon ui-icon-arrow-2-se-nw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-n"><span class="ui-icon ui-icon-arrowstop-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-e"><span class="ui-icon ui-icon-arrowstop-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-s"><span class="ui-icon ui-icon-arrowstop-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-w"><span class="ui-icon ui-icon-arrowstop-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-n"><span class="ui-icon ui-icon-arrowthick-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-ne"><span class="ui-icon ui-icon-arrowthick-1-ne"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-e"><span class="ui-icon ui-icon-arrowthick-1-e"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-se"><span class="ui-icon ui-icon-arrowthick-1-se"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-s"><span class="ui-icon ui-icon-arrowthick-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-sw"><span class="ui-icon ui-icon-arrowthick-1-sw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-w"><span class="ui-icon ui-icon-arrowthick-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-nw"><span class="ui-icon ui-icon-arrowthick-1-nw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-n-s"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-ne-sw"><span class="ui-icon ui-icon-arrowthick-2-ne-sw"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-e-w"><span class="ui-icon ui-icon-arrowthick-2-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-se-nw"><span class="ui-icon ui-icon-arrowthick-2-se-nw"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-n"><span class="ui-icon ui-icon-arrowthickstop-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-e"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-s"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-w"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-w"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-n"><span class="ui-icon ui-icon-arrowreturnthick-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-e"><span class="ui-icon ui-icon-arrowreturnthick-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-s"><span class="ui-icon ui-icon-arrowreturnthick-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-w"><span class="ui-icon ui-icon-arrowreturn-1-w"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-n"><span class="ui-icon ui-icon-arrowreturn-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-e"><span class="ui-icon ui-icon-arrowreturn-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-s"><span class="ui-icon ui-icon-arrowreturn-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-w"><span class="ui-icon ui-icon-arrowrefresh-1-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-n"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-e"><span class="ui-icon ui-icon-arrowrefresh-1-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-s"><span class="ui-icon ui-icon-arrowrefresh-1-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4"><span class="ui-icon ui-icon-arrow-4"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4-diag"><span class="ui-icon ui-icon-arrow-4-diag"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-extlink"><span class="ui-icon ui-icon-extlink"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-newwin"><span class="ui-icon ui-icon-newwin"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-refresh"><span class="ui-icon ui-icon-refresh"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-shuffle"><span class="ui-icon ui-icon-shuffle"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-transfer-e-w"><span class="ui-icon ui-icon-transfer-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-transferthick-e-w"><span class="ui-icon ui-icon-transferthick-e-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-folder-collapsed"><span class="ui-icon ui-icon-folder-collapsed"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-folder-open"><span class="ui-icon ui-icon-folder-open"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-document"><span class="ui-icon ui-icon-document"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-document-b"><span class="ui-icon ui-icon-document-b"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-note"><span class="ui-icon ui-icon-note"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-mail-open"><span class="ui-icon ui-icon-mail-open"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-suitcase"><span class="ui-icon ui-icon-suitcase"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-comment"><span class="ui-icon ui-icon-comment"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-person"><span class="ui-icon ui-icon-person"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-print"><span class="ui-icon ui-icon-print"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-trash"><span class="ui-icon ui-icon-trash"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-locked"><span class="ui-icon ui-icon-locked"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-unlocked"><span class="ui-icon ui-icon-unlocked"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-bookmark"><span class="ui-icon ui-icon-bookmark"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-tag"><span class="ui-icon ui-icon-tag"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-home"><span class="ui-icon ui-icon-home"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-flag"><span class="ui-icon ui-icon-flag"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-calculator"><span class="ui-icon ui-icon-calculator"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-cart"><span class="ui-icon ui-icon-cart"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-pencil"><span class="ui-icon ui-icon-pencil"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-clock"><span class="ui-icon ui-icon-clock"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-disk"><span class="ui-icon ui-icon-disk"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-calendar"><span class="ui-icon ui-icon-calendar"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-zoomin"><span class="ui-icon ui-icon-zoomin"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-zoomout"><span class="ui-icon ui-icon-zoomout"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-search"><span class="ui-icon ui-icon-search"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-wrench"><span class="ui-icon ui-icon-wrench"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-gear"><span class="ui-icon ui-icon-gear"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-heart"><span class="ui-icon ui-icon-heart"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-star"><span class="ui-icon ui-icon-star"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-link"><span class="ui-icon ui-icon-link"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-cancel"><span class="ui-icon ui-icon-cancel"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-plus"><span class="ui-icon ui-icon-plus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-minus"><span class="ui-icon ui-icon-minus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-minusthick"><span class="ui-icon ui-icon-minusthick"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-close"><span class="ui-icon ui-icon-close"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-closethick"><span class="ui-icon ui-icon-closethick"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-key"><span class="ui-icon ui-icon-key"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-lightbulb"><span class="ui-icon ui-icon-lightbulb"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-scissors"><span class="ui-icon ui-icon-scissors"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-clipboard"><span class="ui-icon ui-icon-clipboard"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-copy"><span class="ui-icon ui-icon-copy"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-contact"><span class="ui-icon ui-icon-contact"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-image"><span class="ui-icon ui-icon-image"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-video"><span class="ui-icon ui-icon-video"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-script"><span class="ui-icon ui-icon-script"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-alert"><span class="ui-icon ui-icon-alert"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-info"><span class="ui-icon ui-icon-info"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-notice"><span class="ui-icon ui-icon-notice"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-help"><span class="ui-icon ui-icon-help"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-bullet"><span class="ui-icon ui-icon-bullet"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-radio-off"><span class="ui-icon ui-icon-radio-off"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-radio-on"><span class="ui-icon ui-icon-radio-on"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-pin-w"><span class="ui-icon ui-icon-pin-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-pin-s"><span class="ui-icon ui-icon-pin-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-volume-off"><span class="ui-icon ui-icon-volume-off"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-volume-on"><span class="ui-icon ui-icon-volume-on"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-power"><span class="ui-icon ui-icon-power"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-signal-diag"><span class="ui-icon ui-icon-signal-diag"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-signal"><span class="ui-icon ui-icon-signal"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-battery-0"><span class="ui-icon ui-icon-battery-0"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-battery-1"><span class="ui-icon ui-icon-battery-1"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-battery-2"><span class="ui-icon ui-icon-battery-2"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-battery-3"><span class="ui-icon ui-icon-battery-3"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-plus"><span class="ui-icon ui-icon-circle-plus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-minus"><span class="ui-icon ui-icon-circle-minus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-close"><span class="ui-icon ui-icon-circle-close"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-e"><span class="ui-icon ui-icon-circle-triangle-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-s"><span class="ui-icon ui-icon-circle-triangle-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-w"><span class="ui-icon ui-icon-circle-triangle-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-n"><span class="ui-icon ui-icon-circle-triangle-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-e"><span class="ui-icon ui-icon-circle-arrow-e"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-s"><span class="ui-icon ui-icon-circle-arrow-s"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-w"><span class="ui-icon ui-icon-circle-arrow-w"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-n"><span class="ui-icon ui-icon-circle-arrow-n"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomin"><span class="ui-icon ui-icon-circle-zoomin"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomout"><span class="ui-icon ui-icon-circle-zoomout"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circle-check"><span class="ui-icon ui-icon-circle-check"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-plus"><span class="ui-icon ui-icon-circlesmall-plus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-minus"><span class="ui-icon ui-icon-circlesmall-minus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-close"><span class="ui-icon ui-icon-circlesmall-close"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-plus"><span class="ui-icon ui-icon-squaresmall-plus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-minus"><span class="ui-icon ui-icon-squaresmall-minus"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-close"><span class="ui-icon ui-icon-squaresmall-close"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-vertical"><span class="ui-icon ui-icon-grip-dotted-vertical"></span></li>
-
- <li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-horizontal"><span class="ui-icon ui-icon-grip-dotted-horizontal"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-vertical"><span class="ui-icon ui-icon-grip-solid-vertical"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-horizontal"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-gripsmall-diagonal-se"><span class="ui-icon ui-icon-gripsmall-diagonal-se"></span></li>
- <li class="ui-state-default ui-corner-all" title=".ui-icon-grip-diagonal-se"><span class="ui-icon ui-icon-grip-diagonal-se"></span></li>
- </ul>
-
-
- <!-- Slider -->
- <h2 class="demoHeaders">Slider</h2>
- <div class="columnbox">
- <div class="slider"></div>
- </div>
- <div class="columnbox">
- <div id="eq">
- <span>88</span>
- <span>77</span>
- <span>55</span>
- <span>33</span>
- <span>40</span>
- <span>45</span>
- <span>70</span>
- </div>
- </div>
-
-
- <!-- Datepicker -->
- <h2 class="demoHeaders">Datepicker</h2>
- <div class="columnbox" style="width: 32%">
- <div id="datepicker"></div>
- </div>
- <div class="columnbox" style="width: 66%; height: 220px;">
- <div id="multidatepicker"></div>
- </div>
-
-
- <!-- Progressbar -->
- <h2 class="demoHeaders">Progressbar</h2>
- <div id="progressbar"></div>
-
- <!-- Highlight / Error -->
- <h2 class="demoHeaders">Highlight / Error</h2>
- <div class="ui-widget">
- <div class="ui-state-highlight ui-corner-all" style="margin-top: 20px; padding: 0 .7em;">
- <p><span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;"></span>
- <strong>Hey!</strong> Sample ui-state-highlight style.</p>
- </div>
- </div>
- <br/>
- <div class="ui-widget">
- <div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
- <p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
- <strong>Alert:</strong> Sample ui-state-error style.</p>
- </div>
- </div>
-
- <h2 class="demoHeaders">Button</h2>
-
- <div class="buttonset">
- <button id="rerun">Run last action</button>
- <button id="select">Select an action</button>
- </div>
-
- <span id="toolbar" class="ui-widget-header ui-corner-all">
- <button id="beginning">go to beginning</button>
- <button id="rewind">rewind</button>
- <button id="play">play</button>
- <button id="stop">stop</button>
- <button id="forward">fast forward</button>
- <button id="end">go to end</button>
-
- <input type="checkbox" id="shuffle" /><label for="shuffle">Shuffle</label>
-
- <span id="repeat">
- <input type="radio" id="repeat0" name="repeat" checked="checked" /><label for="repeat0">No Repeat</label>
- <input type="radio" id="repeat1" name="repeat" /><label for="repeat1">Once</label>
- <input type="radio" id="repeatall" name="repeat" /><label for="repeatall">All</label>
- </span>
- </span>
-
- <!-- theme switcher -->
-
- <script src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
- <script>
- $('#switcher').themeswitcher();
- </script>
-
-
-
- </body>
-</html>
-
-
+++ /dev/null
-/*!
- * jQuery UI Datepicker @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Datepicker#theming
- */
-.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; }
-.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
-.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
-.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
-.ui-datepicker .ui-datepicker-prev { left:2px; }
-.ui-datepicker .ui-datepicker-next { right:2px; }
-.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
-.ui-datepicker .ui-datepicker-next-hover { right:1px; }
-.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
-.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
-.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
-.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
-.ui-datepicker select.ui-datepicker-month,
-.ui-datepicker select.ui-datepicker-year { width: 49%;}
-.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
-.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; }
-.ui-datepicker td { border: 0; padding: 1px; }
-.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
-.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
-.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
-.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
-
-/* with multiple calendars */
-.ui-datepicker.ui-datepicker-multi { width:auto; }
-.ui-datepicker-multi .ui-datepicker-group { float:left; }
-.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
-.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
-.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
-.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
-.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
-.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
-.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
-.ui-datepicker-row-break { clear:both; width:100%; font-size:0em; }
-
-/* RTL support */
-.ui-datepicker-rtl { direction: rtl; }
-.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
-.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
-.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
-.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
-.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
-.ui-datepicker-rtl .ui-datepicker-group { float:right; }
-.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
-.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
-
-/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
-.ui-datepicker-cover {
- position: absolute; /*must have*/
- z-index: -1; /*must have*/
- filter: mask(); /*must have*/
- top: -4px; /*must have*/
- left: -4px; /*must have*/
- width: 200px; /*must have*/
- height: 200px; /*must have*/
-}
\ No newline at end of file
+++ /dev/null
-/* Arabic Translation for jQuery UI date picker plugin. */
-/* Khaled Alhourani -- me@khaledalhourani.com */
-/* NOTE: monthNames are the original months names and they are the Arabic names, not the new months name فبراير - يناير and there isn't any Arabic roots for these months */
-jQuery(function($){
- $.datepicker.regional['ar'] = {
- closeText: 'إغلاق',
- prevText: '<السابق',
- nextText: 'التالي>',
- currentText: 'اليوم',
- monthNames: ['كانون الثاني', 'شباط', 'آذار', 'نيسان', 'مايو', 'حزيران',
- 'تموز', 'آب', 'أيلول', 'تشرين الأول', 'تشرين الثاني', 'كانون الأول'],
- monthNamesShort: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
- dayNames: ['الأحد', 'الاثنين', 'الثلاثاء', 'الأربعاء', 'الخميس', 'الجمعة', 'السبت'],
- dayNamesShort: ['الأحد', 'الاثنين', 'الثلاثاء', 'الأربعاء', 'الخميس', 'الجمعة', 'السبت'],
- dayNamesMin: ['ح', 'ن', 'ث', 'ر', 'خ', 'ج', 'س'],
- weekHeader: 'أسبوع',
- dateFormat: 'dd/mm/yy',
- firstDay: 6,
- isRTL: true,
- showMonthAfterYear: false,
- yearSuffix: ''};
- $.datepicker.setDefaults($.datepicker.regional['ar']);
-});
\ No newline at end of file
+++ /dev/null
-/* Euskarako oinarria 'UI date picker' jquery-ko extentsioarentzat */
-/* Karrikas-ek itzulia (karrikas@karrikas.com) */
-jQuery(function($){
- $.datepicker.regional['eu'] = {
- closeText: 'Egina',
- prevText: '<Aur',
- nextText: 'Hur>',
- currentText: 'Gaur',
- monthNames: ['urtarrila','otsaila','martxoa','apirila','maiatza','ekaina',
- 'uztaila','abuztua','iraila','urria','azaroa','abendua'],
- monthNamesShort: ['urt.','ots.','mar.','api.','mai.','eka.',
- 'uzt.','abu.','ira.','urr.','aza.','abe.'],
- dayNames: ['igandea','astelehena','asteartea','asteazkena','osteguna','ostirala','larunbata'],
- dayNamesShort: ['ig.','al.','ar.','az.','og.','ol.','lr.'],
- dayNamesMin: ['ig','al','ar','az','og','ol','lr'],
- weekHeader: 'As',
- dateFormat: 'yy-mm-dd',
- firstDay: 1,
- isRTL: false,
- showMonthAfterYear: false,
- yearSuffix: ''};
- $.datepicker.setDefaults($.datepicker.regional['eu']);
-});
\ No newline at end of file
+++ /dev/null
-/* Georgian (UTF-8) initialisation for the jQuery UI date picker plugin. */
-/* Written by Lado Lomidze (lado.lomidze@gmail.com). */
-jQuery(function($){
- $.datepicker.regional['ka'] = {
- closeText: 'დახურვა',
- prevText: '< წინა',
- nextText: 'შემდეგი >',
- currentText: 'დღეს',
- monthNames: ['იანვარი','თებერვალი','მარტი','აპრილი','მაისი','ივნისი', 'ივლისი','აგვისტო','სექტემბერი','ოქტომბერი','ნოემბერი','დეკემბერი'],
- monthNamesShort: ['იან','თებ','მარ','აპრ','მაი','ივნ', 'ივლ','აგვ','სექ','ოქტ','ნოე','დეკ'],
- dayNames: ['კვირა','ორშაბათი','სამშაბათი','ოთხშაბათი','ხუთშაბათი','პარასკევი','შაბათი'],
- dayNamesShort: ['კვ','ორშ','სამ','ოთხ','ხუთ','პარ','შაბ'],
- dayNamesMin: ['კვ','ორშ','სამ','ოთხ','ხუთ','პარ','შაბ'],
- weekHeader: 'კვირა',
- dateFormat: 'dd-mm-yy',
- firstDay: 1,
- isRTL: false,
- showMonthAfterYear: false,
- yearSuffix: ''};
- $.datepicker.setDefaults($.datepicker.regional['ka']);
-});
+++ /dev/null
-/* Chinese initialisation for the jQuery UI date picker plugin. */
-/* Written by Cloudream (cloudream@gmail.com). */
-jQuery(function($){
- $.datepicker.regional['zh-CN'] = {
- closeText: '关闭',
- prevText: '<上月',
- nextText: '下月>',
- currentText: '今天',
- monthNames: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- monthNamesShort: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
- dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
- dayNamesMin: ['日','一','二','三','四','五','六'],
- weekHeader: '周',
- dateFormat: 'yy-mm-dd',
- firstDay: 1,
- isRTL: false,
- showMonthAfterYear: true,
- yearSuffix: '年'};
- $.datepicker.setDefaults($.datepicker.regional['zh-CN']);
-});
+++ /dev/null
-/* Chinese initialisation for the jQuery UI date picker plugin. */
-/* Written by SCCY (samuelcychan@gmail.com). */
-jQuery(function($){
- $.datepicker.regional['zh-HK'] = {
- closeText: '關閉',
- prevText: '<上月',
- nextText: '下月>',
- currentText: '今天',
- monthNames: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- monthNamesShort: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
- dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
- dayNamesMin: ['日','一','二','三','四','五','六'],
- weekHeader: '周',
- dateFormat: 'dd-mm-yy',
- firstDay: 0,
- isRTL: false,
- showMonthAfterYear: true,
- yearSuffix: '年'};
- $.datepicker.setDefaults($.datepicker.regional['zh-HK']);
-});
+++ /dev/null
-/* Chinese initialisation for the jQuery UI date picker plugin. */
-/* Written by Ressol (ressol@gmail.com). */
-jQuery(function($){
- $.datepicker.regional['zh-TW'] = {
- closeText: '關閉',
- prevText: '<上月',
- nextText: '下月>',
- currentText: '今天',
- monthNames: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- monthNamesShort: ['一月','二月','三月','四月','五月','六月',
- '七月','八月','九月','十月','十一月','十二月'],
- dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
- dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
- dayNamesMin: ['日','一','二','三','四','五','六'],
- weekHeader: '周',
- dateFormat: 'yy/mm/dd',
- firstDay: 1,
- isRTL: false,
- showMonthAfterYear: true,
- yearSuffix: '年'};
- $.datepicker.setDefaults($.datepicker.regional['zh-TW']);
-});
+++ /dev/null
-/*!
- * jQuery UI Effects Bounce @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Effects/Bounce
- *
- * Depends:
- * jquery.effects.core.js
- */
-(function( $, undefined ) {
-
-$.effects.bounce = function(o) {
-
- return this.queue(function() {
-
- // Create element
- var el = $(this), props = ['position','top','bottom','left','right'];
-
- // Set options
- var mode = $.effects.setMode(el, o.options.mode || 'effect'); // Set Mode
- var direction = o.options.direction || 'up'; // Default direction
- var distance = o.options.distance || 20; // Default distance
- var times = o.options.times || 5; // Default # of times
- var speed = o.duration || 250; // Default speed per bounce
- if (/show|hide/.test(mode)) props.push('opacity'); // Avoid touching opacity to prevent clearType and PNG issues in IE
-
- // Adjust
- $.effects.save(el, props); el.show(); // Save & Show
- $.effects.createWrapper(el); // Create Wrapper
- var ref = (direction == 'up' || direction == 'down') ? 'top' : 'left';
- var motion = (direction == 'up' || direction == 'left') ? 'pos' : 'neg';
- var distance = o.options.distance || (ref == 'top' ? el.outerHeight(true) / 3 : el.outerWidth(true) / 3);
- if (mode == 'show') el.css('opacity', 0).css(ref, motion == 'pos' ? -distance : distance); // Shift
- if (mode == 'hide') distance = distance / (times * 2);
- if (mode != 'hide') times--;
-
- // Animate
- if (mode == 'show') { // Show Bounce
- var animation = {opacity: 1};
- animation[ref] = (motion == 'pos' ? '+=' : '-=') + distance;
- el.animate(animation, speed / 2, o.options.easing);
- distance = distance / 2;
- times--;
- };
- for (var i = 0; i < times; i++) { // Bounces
- var animation1 = {}, animation2 = {};
- animation1[ref] = (motion == 'pos' ? '-=' : '+=') + distance;
- animation2[ref] = (motion == 'pos' ? '+=' : '-=') + distance;
- el.animate(animation1, speed / 2, o.options.easing).animate(animation2, speed / 2, o.options.easing);
- distance = (mode == 'hide') ? distance * 2 : distance / 2;
- };
- if (mode == 'hide') { // Last Bounce
- var animation = {opacity: 0};
- animation[ref] = (motion == 'pos' ? '-=' : '+=') + distance;
- el.animate(animation, speed / 2, o.options.easing, function(){
- el.hide(); // Hide
- $.effects.restore(el, props); $.effects.removeWrapper(el); // Restore
- if(o.callback) o.callback.apply(this, arguments); // Callback
- });
- } else {
- var animation1 = {}, animation2 = {};
- animation1[ref] = (motion == 'pos' ? '-=' : '+=') + distance;
- animation2[ref] = (motion == 'pos' ? '+=' : '-=') + distance;
- el.animate(animation1, speed / 2, o.options.easing).animate(animation2, speed / 2, o.options.easing, function(){
- $.effects.restore(el, props); $.effects.removeWrapper(el); // Restore
- if(o.callback) o.callback.apply(this, arguments); // Callback
- });
- };
- el.queue('fx', function() { el.dequeue(); });
- el.dequeue();
- });
-
-};
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Effects @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Effects/
- */
-;jQuery.effects || (function($, undefined) {
-
-$.effects = {};
-
-
-
-/******************************************************************************/
-/****************************** COLOR ANIMATIONS ******************************/
-/******************************************************************************/
-
-// override the animation for color styles
-$.each(['backgroundColor', 'borderBottomColor', 'borderLeftColor',
- 'borderRightColor', 'borderTopColor', 'borderColor', 'color', 'outlineColor'],
-function(i, attr) {
- $.fx.step[attr] = function(fx) {
- if (!fx.colorInit) {
- fx.start = getColor(fx.elem, attr);
- fx.end = getRGB(fx.end);
- fx.colorInit = true;
- }
-
- fx.elem.style[attr] = 'rgb(' +
- Math.max(Math.min(parseInt((fx.pos * (fx.end[0] - fx.start[0])) + fx.start[0], 10), 255), 0) + ',' +
- Math.max(Math.min(parseInt((fx.pos * (fx.end[1] - fx.start[1])) + fx.start[1], 10), 255), 0) + ',' +
- Math.max(Math.min(parseInt((fx.pos * (fx.end[2] - fx.start[2])) + fx.start[2], 10), 255), 0) + ')';
- };
-});
-
-// Color Conversion functions from highlightFade
-// By Blair Mitchelmore
-// http://jquery.offput.ca/highlightFade/
-
-// Parse strings looking for color tuples [255,255,255]
-function getRGB(color) {
- var result;
-
- // Check if we're already dealing with an array of colors
- if ( color && color.constructor == Array && color.length == 3 )
- return color;
-
- // Look for rgb(num,num,num)
- if (result = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(color))
- return [parseInt(result[1],10), parseInt(result[2],10), parseInt(result[3],10)];
-
- // Look for rgb(num%,num%,num%)
- if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(color))
- return [parseFloat(result[1])*2.55, parseFloat(result[2])*2.55, parseFloat(result[3])*2.55];
-
- // Look for #a0b1c2
- if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(color))
- return [parseInt(result[1],16), parseInt(result[2],16), parseInt(result[3],16)];
-
- // Look for #fff
- if (result = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(color))
- return [parseInt(result[1]+result[1],16), parseInt(result[2]+result[2],16), parseInt(result[3]+result[3],16)];
-
- // Look for rgba(0, 0, 0, 0) == transparent in Safari 3
- if (result = /rgba\(0, 0, 0, 0\)/.exec(color))
- return colors['transparent'];
-
- // Otherwise, we're most likely dealing with a named color
- return colors[$.trim(color).toLowerCase()];
-}
-
-function getColor(elem, attr) {
- var color;
-
- do {
- // jQuery <1.4.3 uses curCSS, in 1.4.3 - 1.7.2 curCSS = css, 1.8+ only has css
- color = ($.curCSS || $.css)(elem, attr);
-
- // Keep going until we find an element that has color, or we hit the body
- if ( color != '' && color != 'transparent' || $.nodeName(elem, "body") )
- break;
-
- attr = "backgroundColor";
- } while ( elem = elem.parentNode );
-
- return getRGB(color);
-};
-
-// Some named colors to work with
-// From Interface by Stefan Petre
-// http://interface.eyecon.ro/
-
-var colors = {
- aqua:[0,255,255],
- azure:[240,255,255],
- beige:[245,245,220],
- black:[0,0,0],
- blue:[0,0,255],
- brown:[165,42,42],
- cyan:[0,255,255],
- darkblue:[0,0,139],
- darkcyan:[0,139,139],
- darkgrey:[169,169,169],
- darkgreen:[0,100,0],
- darkkhaki:[189,183,107],
- darkmagenta:[139,0,139],
- darkolivegreen:[85,107,47],
- darkorange:[255,140,0],
- darkorchid:[153,50,204],
- darkred:[139,0,0],
- darksalmon:[233,150,122],
- darkviolet:[148,0,211],
- fuchsia:[255,0,255],
- gold:[255,215,0],
- green:[0,128,0],
- indigo:[75,0,130],
- khaki:[240,230,140],
- lightblue:[173,216,230],
- lightcyan:[224,255,255],
- lightgreen:[144,238,144],
- lightgrey:[211,211,211],
- lightpink:[255,182,193],
- lightyellow:[255,255,224],
- lime:[0,255,0],
- magenta:[255,0,255],
- maroon:[128,0,0],
- navy:[0,0,128],
- olive:[128,128,0],
- orange:[255,165,0],
- pink:[255,192,203],
- purple:[128,0,128],
- violet:[128,0,128],
- red:[255,0,0],
- silver:[192,192,192],
- white:[255,255,255],
- yellow:[255,255,0],
- transparent: [255,255,255]
-};
-
-
-
-/******************************************************************************/
-/****************************** CLASS ANIMATIONS ******************************/
-/******************************************************************************/
-
-var classAnimationActions = ['add', 'remove', 'toggle'],
- shorthandStyles = {
- border: 1,
- borderBottom: 1,
- borderColor: 1,
- borderLeft: 1,
- borderRight: 1,
- borderTop: 1,
- borderWidth: 1,
- margin: 1,
- padding: 1
- };
-
-function getElementStyles() {
- var style = document.defaultView
- ? document.defaultView.getComputedStyle(this, null)
- : this.currentStyle,
- newStyle = {},
- key,
- camelCase;
-
- // webkit enumerates style porperties
- if (style && style.length && style[0] && style[style[0]]) {
- var len = style.length;
- while (len--) {
- key = style[len];
- if (typeof style[key] == 'string') {
- camelCase = key.replace(/\-(\w)/g, function(all, letter){
- return letter.toUpperCase();
- });
- newStyle[camelCase] = style[key];
- }
- }
- } else {
- for (key in style) {
- if (typeof style[key] === 'string') {
- newStyle[key] = style[key];
- }
- }
- }
-
- return newStyle;
-}
-
-function filterStyles(styles) {
- var name, value;
- for (name in styles) {
- value = styles[name];
- if (
- // ignore null and undefined values
- value == null ||
- // ignore functions (when does this occur?)
- $.isFunction(value) ||
- // shorthand styles that need to be expanded
- name in shorthandStyles ||
- // ignore scrollbars (break in IE)
- (/scrollbar/).test(name) ||
-
- // only colors or values that can be converted to numbers
- (!(/color/i).test(name) && isNaN(parseFloat(value)))
- ) {
- delete styles[name];
- }
- }
-
- return styles;
-}
-
-function styleDifference(oldStyle, newStyle) {
- var diff = { _: 0 }, // http://dev.jquery.com/ticket/5459
- name;
-
- for (name in newStyle) {
- if (oldStyle[name] != newStyle[name]) {
- diff[name] = newStyle[name];
- }
- }
-
- return diff;
-}
-
-$.effects.animateClass = function(value, duration, easing, callback) {
- if ($.isFunction(easing)) {
- callback = easing;
- easing = null;
- }
-
- return this.queue(function() {
- var that = $(this),
- originalStyleAttr = that.attr('style') || ' ',
- originalStyle = filterStyles(getElementStyles.call(this)),
- newStyle,
- className = that.attr('class') || "";
-
- $.each(classAnimationActions, function(i, action) {
- if (value[action]) {
- that[action + 'Class'](value[action]);
- }
- });
- newStyle = filterStyles(getElementStyles.call(this));
- that.attr('class', className);
-
- that.animate(styleDifference(originalStyle, newStyle), {
- queue: false,
- duration: duration,
- easing: easing,
- complete: function() {
- $.each(classAnimationActions, function(i, action) {
- if (value[action]) { that[action + 'Class'](value[action]); }
- });
- // work around bug in IE by clearing the cssText before setting it
- if (typeof that.attr('style') == 'object') {
- that.attr('style').cssText = '';
- that.attr('style').cssText = originalStyleAttr;
- } else {
- that.attr('style', originalStyleAttr);
- }
- if (callback) { callback.apply(this, arguments); }
- $.dequeue( this );
- }
- });
- });
-};
-
-$.fn.extend({
- _addClass: $.fn.addClass,
- addClass: function(classNames, speed, easing, callback) {
- return speed ? $.effects.animateClass.apply(this, [{ add: classNames },speed,easing,callback]) : this._addClass(classNames);
- },
-
- _removeClass: $.fn.removeClass,
- removeClass: function(classNames,speed,easing,callback) {
- return speed ? $.effects.animateClass.apply(this, [{ remove: classNames },speed,easing,callback]) : this._removeClass(classNames);
- },
-
- _toggleClass: $.fn.toggleClass,
- toggleClass: function(classNames, force, speed, easing, callback) {
- if ( typeof force == "boolean" || force === undefined ) {
- if ( !speed ) {
- // without speed parameter;
- return this._toggleClass(classNames, force);
- } else {
- return $.effects.animateClass.apply(this, [(force?{add:classNames}:{remove:classNames}),speed,easing,callback]);
- }
- } else {
- // without switch parameter;
- return $.effects.animateClass.apply(this, [{ toggle: classNames },force,speed,easing]);
- }
- },
-
- switchClass: function(remove,add,speed,easing,callback) {
- return $.effects.animateClass.apply(this, [{ add: add, remove: remove },speed,easing,callback]);
- }
-});
-
-
-
-/******************************************************************************/
-/*********************************** EFFECTS **********************************/
-/******************************************************************************/
-
-$.extend($.effects, {
- version: "@VERSION",
-
- // Saves a set of properties in a data storage
- save: function(element, set) {
- for(var i=0; i < set.length; i++) {
- if(set[i] !== null) element.data("ec.storage."+set[i], element[0].style[set[i]]);
- }
- },
-
- // Restores a set of previously saved properties from a data storage
- restore: function(element, set) {
- for(var i=0; i < set.length; i++) {
- if(set[i] !== null) element.css(set[i], element.data("ec.storage."+set[i]));
- }
- },
-
- setMode: function(el, mode) {
- if (mode == 'toggle') mode = el.is(':hidden') ? 'show' : 'hide'; // Set for toggle
- return mode;
- },
-
- getBaseline: function(origin, original) { // Translates a [top,left] array into a baseline value
- // this should be a little more flexible in the future to handle a string & hash
- var y, x;
- switch (origin[0]) {
- case 'top': y = 0; break;
- case 'middle': y = 0.5; break;
- case 'bottom': y = 1; break;
- default: y = origin[0] / original.height;
- };
- switch (origin[1]) {
- case 'left': x = 0; break;
- case 'center': x = 0.5; break;
- case 'right': x = 1; break;
- default: x = origin[1] / original.width;
- };
- return {x: x, y: y};
- },
-
- // Wraps the element around a wrapper that copies position properties
- createWrapper: function(element) {
-
- // if the element is already wrapped, return it
- if (element.parent().is('.ui-effects-wrapper')) {
- return element.parent();
- }
-
- // wrap the element
- var props = {
- width: element.outerWidth(true),
- height: element.outerHeight(true),
- 'float': element.css('float')
- },
- wrapper = $('<div></div>')
- .addClass('ui-effects-wrapper')
- .css({
- fontSize: '100%',
- background: 'transparent',
- border: 'none',
- margin: 0,
- padding: 0
- }),
- active = document.activeElement;
-
- // support: Firefox
- // Firefox incorrectly exposes anonymous content
- // https://bugzilla.mozilla.org/show_bug.cgi?id=561664
- try {
- active.id;
- } catch( e ) {
- active = document.body;
- }
-
- element.wrap( wrapper );
-
- // Fixes #7595 - Elements lose focus when wrapped.
- if ( element[ 0 ] === active || $.contains( element[ 0 ], active ) ) {
- $( active ).focus();
- }
-
- wrapper = element.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually loose the reference to the wrapped element
-
- // transfer positioning properties to the wrapper
- if (element.css('position') == 'static') {
- wrapper.css({ position: 'relative' });
- element.css({ position: 'relative' });
- } else {
- $.extend(props, {
- position: element.css('position'),
- zIndex: element.css('z-index')
- });
- $.each(['top', 'left', 'bottom', 'right'], function(i, pos) {
- props[pos] = element.css(pos);
- if (isNaN(parseInt(props[pos], 10))) {
- props[pos] = 'auto';
- }
- });
- element.css({position: 'relative', top: 0, left: 0, right: 'auto', bottom: 'auto' });
- }
-
- return wrapper.css(props).show();
- },
-
- removeWrapper: function(element) {
- var parent,
- active = document.activeElement;
-
- if (element.parent().is('.ui-effects-wrapper')) {
- parent = element.parent().replaceWith(element);
- // Fixes #7595 - Elements lose focus when wrapped.
- if ( element[ 0 ] === active || $.contains( element[ 0 ], active ) ) {
- $( active ).focus();
- }
- return parent;
- }
-
- return element;
- },
-
- setTransition: function(element, list, factor, value) {
- value = value || {};
- $.each(list, function(i, x){
- var unit = element.cssUnit(x);
- if (unit[0] > 0) value[x] = unit[0] * factor + unit[1];
- });
- return value;
- }
-});
-
-
-function _normalizeArguments(effect, options, speed, callback) {
- // shift params for method overloading
- if (typeof effect == 'object') {
- callback = options;
- speed = null;
- options = effect;
- effect = options.effect;
- }
- if ($.isFunction(options)) {
- callback = options;
- speed = null;
- options = {};
- }
- if (typeof options == 'number' || $.fx.speeds[options]) {
- callback = speed;
- speed = options;
- options = {};
- }
- if ($.isFunction(speed)) {
- callback = speed;
- speed = null;
- }
-
- options = options || {};
-
- speed = speed || options.duration;
- speed = $.fx.off ? 0 : typeof speed == 'number'
- ? speed : speed in $.fx.speeds ? $.fx.speeds[speed] : $.fx.speeds._default;
-
- callback = callback || options.complete;
-
- return [effect, options, speed, callback];
-}
-
-function standardSpeed( speed ) {
- // valid standard speeds
- if ( !speed || typeof speed === "number" || $.fx.speeds[ speed ] ) {
- return true;
- }
-
- // invalid strings - treat as "normal" speed
- if ( typeof speed === "string" && !$.effects[ speed ] ) {
- return true;
- }
-
- return false;
-}
-
-$.fn.extend({
- effect: function(effect, options, speed, callback) {
- var args = _normalizeArguments.apply(this, arguments),
- // TODO: make effects take actual parameters instead of a hash
- args2 = {
- options: args[1],
- duration: args[2],
- callback: args[3]
- },
- mode = args2.options.mode,
- effectMethod = $.effects[effect];
-
- if ( $.fx.off || !effectMethod ) {
- // delegate to the original method (e.g., .show()) if possible
- if ( mode ) {
- return this[ mode ]( args2.duration, args2.callback );
- } else {
- return this.each(function() {
- if ( args2.callback ) {
- args2.callback.call( this );
- }
- });
- }
- }
-
- return effectMethod.call(this, args2);
- },
-
- _show: $.fn.show,
- show: function(speed) {
- if ( standardSpeed( speed ) ) {
- return this._show.apply(this, arguments);
- } else {
- var args = _normalizeArguments.apply(this, arguments);
- args[1].mode = 'show';
- return this.effect.apply(this, args);
- }
- },
-
- _hide: $.fn.hide,
- hide: function(speed) {
- if ( standardSpeed( speed ) ) {
- return this._hide.apply(this, arguments);
- } else {
- var args = _normalizeArguments.apply(this, arguments);
- args[1].mode = 'hide';
- return this.effect.apply(this, args);
- }
- },
-
- // jQuery core overloads toggle and creates _toggle
- __toggle: $.fn.toggle,
- toggle: function(speed) {
- if ( standardSpeed( speed ) || typeof speed === "boolean" || $.isFunction( speed ) ) {
- return this.__toggle.apply(this, arguments);
- } else {
- var args = _normalizeArguments.apply(this, arguments);
- args[1].mode = 'toggle';
- return this.effect.apply(this, args);
- }
- },
-
- // helper functions
- cssUnit: function(key) {
- var style = this.css(key), val = [];
- $.each( ['em','px','%','pt'], function(i, unit){
- if(style.indexOf(unit) > 0)
- val = [parseFloat(style), unit];
- });
- return val;
- }
-});
-
-
-
-/******************************************************************************/
-/*********************************** EASING ***********************************/
-/******************************************************************************/
-
-// based on easing equations from Robert Penner (http://www.robertpenner.com/easing)
-
-var baseEasings = {};
-
-$.each( [ "Quad", "Cubic", "Quart", "Quint", "Expo" ], function( i, name ) {
- baseEasings[ name ] = function( p ) {
- return Math.pow( p, i + 2 );
- };
-});
-
-$.extend( baseEasings, {
- Sine: function ( p ) {
- return 1 - Math.cos( p * Math.PI / 2 );
- },
- Circ: function ( p ) {
- return 1 - Math.sqrt( 1 - p * p );
- },
- Elastic: function( p ) {
- return p === 0 || p === 1 ? p :
- -Math.pow( 2, 8 * (p - 1) ) * Math.sin( ( (p - 1) * 80 - 7.5 ) * Math.PI / 15 );
- },
- Back: function( p ) {
- return p * p * ( 3 * p - 2 );
- },
- Bounce: function ( p ) {
- var pow2,
- bounce = 4;
-
- while ( p < ( ( pow2 = Math.pow( 2, --bounce ) ) - 1 ) / 11 ) {}
- return 1 / Math.pow( 4, 3 - bounce ) - 7.5625 * Math.pow( ( pow2 * 3 - 2 ) / 22 - p, 2 );
- }
-});
-
-$.each( baseEasings, function( name, easeIn ) {
- $.easing[ "easeIn" + name ] = easeIn;
- $.easing[ "easeOut" + name ] = function( p ) {
- return 1 - easeIn( 1 - p );
- };
- $.easing[ "easeInOut" + name ] = function( p ) {
- return p < .5 ?
- easeIn( p * 2 ) / 2 :
- easeIn( p * -2 + 2 ) / -2 + 1;
- };
-});
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Effects Drop @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Effects/Drop
- *
- * Depends:
- * jquery.effects.core.js
- */
-(function( $, undefined ) {
-
-$.effects.drop = function(o) {
-
- return this.queue(function() {
-
- // Create element
- var el = $(this), props = ['position','top','bottom','left','right','opacity'];
-
- // Set options
- var mode = $.effects.setMode(el, o.options.mode || 'hide'); // Set Mode
- var direction = o.options.direction || 'left'; // Default Direction
-
- // Adjust
- $.effects.save(el, props); el.show(); // Save & Show
- $.effects.createWrapper(el); // Create Wrapper
- var ref = (direction == 'up' || direction == 'down') ? 'top' : 'left';
- var motion = (direction == 'up' || direction == 'left') ? 'pos' : 'neg';
- var distance = o.options.distance || (ref == 'top' ? el.outerHeight( true ) / 2 : el.outerWidth( true ) / 2);
- if (mode == 'show') el.css('opacity', 0).css(ref, motion == 'pos' ? -distance : distance); // Shift
-
- // Animation
- var animation = {opacity: mode == 'show' ? 1 : 0};
- animation[ref] = (mode == 'show' ? (motion == 'pos' ? '+=' : '-=') : (motion == 'pos' ? '-=' : '+=')) + distance;
-
- // Animate
- el.animate(animation, { queue: false, duration: o.duration, easing: o.options.easing, complete: function() {
- if(mode == 'hide') el.hide(); // Hide
- $.effects.restore(el, props); $.effects.removeWrapper(el); // Restore
- if(o.callback) o.callback.apply(this, arguments); // Callback
- el.dequeue();
- }});
-
- });
-
-};
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Effects Slide @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Effects/Slide
- *
- * Depends:
- * jquery.effects.core.js
- */
-(function( $, undefined ) {
-
-$.effects.slide = function(o) {
-
- return this.queue(function() {
-
- // Create element
- var el = $(this), props = ['position','top','bottom','left','right'];
-
- // Set options
- var mode = $.effects.setMode(el, o.options.mode || 'show'); // Set Mode
- var direction = o.options.direction || 'left'; // Default Direction
-
- // Adjust
- $.effects.save(el, props); el.show(); // Save & Show
- $.effects.createWrapper(el).css({overflow:'hidden'}); // Create Wrapper
- var ref = (direction == 'up' || direction == 'down') ? 'top' : 'left';
- var motion = (direction == 'up' || direction == 'left') ? 'pos' : 'neg';
- var distance = o.options.distance || (ref == 'top' ? el.outerHeight( true ) : el.outerWidth( true ));
- if (mode == 'show') el.css(ref, motion == 'pos' ? (isNaN(distance) ? "-" + distance : -distance) : distance); // Shift
-
- // Animation
- var animation = {};
- animation[ref] = (mode == 'show' ? (motion == 'pos' ? '+=' : '-=') : (motion == 'pos' ? '-=' : '+=')) + distance;
-
- // Animate
- el.animate(animation, { queue: false, duration: o.duration, easing: o.options.easing, complete: function() {
- if(mode == 'hide') el.hide(); // Hide
- $.effects.restore(el, props); $.effects.removeWrapper(el); // Restore
- if(o.callback) o.callback.apply(this, arguments); // Callback
- el.dequeue();
- }});
-
- });
-
-};
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Datepicker @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Datepicker
- *
- * Depends:
- * jquery.ui.core.js
- */
-(function( $, undefined ) {
-
-$.extend($.ui, { datepicker: { version: "@VERSION" } });
-
-var PROP_NAME = 'datepicker';
-var dpuuid = new Date().getTime();
-var instActive;
-
-/* Date picker manager.
- Use the singleton instance of this class, $.datepicker, to interact with the date picker.
- Settings for (groups of) date pickers are maintained in an instance object,
- allowing multiple different settings on the same page. */
-
-function Datepicker() {
- this.debug = false; // Change this to true to start debugging
- this._curInst = null; // The current instance in use
- this._keyEvent = false; // If the last event was a key event
- this._disabledInputs = []; // List of date picker inputs that have been disabled
- this._datepickerShowing = false; // True if the popup picker is showing , false if not
- this._inDialog = false; // True if showing within a "dialog", false if not
- this._mainDivId = 'ui-datepicker-div'; // The ID of the main datepicker division
- this._inlineClass = 'ui-datepicker-inline'; // The name of the inline marker class
- this._appendClass = 'ui-datepicker-append'; // The name of the append marker class
- this._triggerClass = 'ui-datepicker-trigger'; // The name of the trigger marker class
- this._dialogClass = 'ui-datepicker-dialog'; // The name of the dialog marker class
- this._disableClass = 'ui-datepicker-disabled'; // The name of the disabled covering marker class
- this._unselectableClass = 'ui-datepicker-unselectable'; // The name of the unselectable cell marker class
- this._currentClass = 'ui-datepicker-current-day'; // The name of the current day marker class
- this._dayOverClass = 'ui-datepicker-days-cell-over'; // The name of the day hover marker class
- this.regional = []; // Available regional settings, indexed by language code
- this.regional[''] = { // Default regional settings
- closeText: 'Done', // Display text for close link
- prevText: 'Prev', // Display text for previous month link
- nextText: 'Next', // Display text for next month link
- currentText: 'Today', // Display text for current month link
- monthNames: ['January','February','March','April','May','June',
- 'July','August','September','October','November','December'], // Names of months for drop-down and formatting
- monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], // For formatting
- dayNames: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], // For formatting
- dayNamesShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], // For formatting
- dayNamesMin: ['Su','Mo','Tu','We','Th','Fr','Sa'], // Column headings for days starting at Sunday
- weekHeader: 'Wk', // Column header for week of the year
- dateFormat: 'mm/dd/yy', // See format options on parseDate
- firstDay: 0, // The first day of the week, Sun = 0, Mon = 1, ...
- isRTL: false, // True if right-to-left language, false if left-to-right
- showMonthAfterYear: false, // True if the year select precedes month, false for month then year
- yearSuffix: '' // Additional text to append to the year in the month headers
- };
- this._defaults = { // Global defaults for all the date picker instances
- showOn: 'focus', // 'focus' for popup on focus,
- // 'button' for trigger button, or 'both' for either
- showAnim: 'fadeIn', // Name of jQuery animation for popup
- showOptions: {}, // Options for enhanced animations
- defaultDate: null, // Used when field is blank: actual date,
- // +/-number for offset from today, null for today
- appendText: '', // Display text following the input box, e.g. showing the format
- buttonText: '...', // Text for trigger button
- buttonImage: '', // URL for trigger button image
- buttonImageOnly: false, // True if the image appears alone, false if it appears on a button
- hideIfNoPrevNext: false, // True to hide next/previous month links
- // if not applicable, false to just disable them
- navigationAsDateFormat: false, // True if date formatting applied to prev/today/next links
- gotoCurrent: false, // True if today link goes back to current selection instead
- changeMonth: false, // True if month can be selected directly, false if only prev/next
- changeYear: false, // True if year can be selected directly, false if only prev/next
- yearRange: 'c-10:c+10', // Range of years to display in drop-down,
- // either relative to today's year (-nn:+nn), relative to currently displayed year
- // (c-nn:c+nn), absolute (nnnn:nnnn), or a combination of the above (nnnn:-n)
- showOtherMonths: false, // True to show dates in other months, false to leave blank
- selectOtherMonths: false, // True to allow selection of dates in other months, false for unselectable
- showWeek: false, // True to show week of the year, false to not show it
- calculateWeek: this.iso8601Week, // How to calculate the week of the year,
- // takes a Date and returns the number of the week for it
- shortYearCutoff: '+10', // Short year values < this are in the current century,
- // > this are in the previous century,
- // string value starting with '+' for current year + value
- minDate: null, // The earliest selectable date, or null for no limit
- maxDate: null, // The latest selectable date, or null for no limit
- duration: 'fast', // Duration of display/closure
- beforeShowDay: null, // Function that takes a date and returns an array with
- // [0] = true if selectable, false if not, [1] = custom CSS class name(s) or '',
- // [2] = cell title (optional), e.g. $.datepicker.noWeekends
- beforeShow: null, // Function that takes an input field and
- // returns a set of custom settings for the date picker
- onSelect: null, // Define a callback function when a date is selected
- onChangeMonthYear: null, // Define a callback function when the month or year is changed
- onClose: null, // Define a callback function when the datepicker is closed
- numberOfMonths: 1, // Number of months to show at a time
- showCurrentAtPos: 0, // The position in multipe months at which to show the current month (starting at 0)
- stepMonths: 1, // Number of months to step back/forward
- stepBigMonths: 12, // Number of months to step back/forward for the big links
- altField: '', // Selector for an alternate field to store selected dates into
- altFormat: '', // The date format to use for the alternate field
- constrainInput: true, // The input is constrained by the current date format
- showButtonPanel: false, // True to show button panel, false to not show it
- autoSize: false, // True to size the input for the date format, false to leave as is
- disabled: false // The initial disabled state
- };
- $.extend(this._defaults, this.regional['']);
- this.dpDiv = bindHover($('<div id="' + this._mainDivId + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>'));
-}
-
-$.extend(Datepicker.prototype, {
- /* Class name added to elements to indicate already configured with a date picker. */
- markerClassName: 'hasDatepicker',
-
- //Keep track of the maximum number of rows displayed (see #7043)
- maxRows: 4,
-
- /* Debug logging (if enabled). */
- log: function () {
- if (this.debug)
- console.log.apply('', arguments);
- },
-
- // TODO rename to "widget" when switching to widget factory
- _widgetDatepicker: function() {
- return this.dpDiv;
- },
-
- /* Override the default settings for all instances of the date picker.
- @param settings object - the new settings to use as defaults (anonymous object)
- @return the manager object */
- setDefaults: function(settings) {
- extendRemove(this._defaults, settings || {});
- return this;
- },
-
- /* Attach the date picker to a jQuery selection.
- @param target element - the target input field or division or span
- @param settings object - the new settings to use for this date picker instance (anonymous) */
- _attachDatepicker: function(target, settings) {
- // check for settings on the control itself - in namespace 'date:'
- var inlineSettings = null;
- for (var attrName in this._defaults) {
- var attrValue = target.getAttribute('date:' + attrName);
- if (attrValue) {
- inlineSettings = inlineSettings || {};
- try {
- inlineSettings[attrName] = eval(attrValue);
- } catch (err) {
- inlineSettings[attrName] = attrValue;
- }
- }
- }
- var nodeName = target.nodeName.toLowerCase();
- var inline = (nodeName == 'div' || nodeName == 'span');
- if (!target.id) {
- this.uuid += 1;
- target.id = 'dp' + this.uuid;
- }
- var inst = this._newInst($(target), inline);
- inst.settings = $.extend({}, settings || {}, inlineSettings || {});
- if (nodeName == 'input') {
- this._connectDatepicker(target, inst);
- } else if (inline) {
- this._inlineDatepicker(target, inst);
- }
- },
-
- /* Create a new instance object. */
- _newInst: function(target, inline) {
- var id = target[0].id.replace(/([^A-Za-z0-9_-])/g, '\\\\$1'); // escape jQuery meta chars
- return {id: id, input: target, // associated target
- selectedDay: 0, selectedMonth: 0, selectedYear: 0, // current selection
- drawMonth: 0, drawYear: 0, // month being drawn
- inline: inline, // is datepicker inline or not
- dpDiv: (!inline ? this.dpDiv : // presentation div
- bindHover($('<div class="' + this._inlineClass + ' ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>')))};
- },
-
- /* Attach the date picker to an input field. */
- _connectDatepicker: function(target, inst) {
- var input = $(target);
- inst.append = $([]);
- inst.trigger = $([]);
- if (input.hasClass(this.markerClassName))
- return;
- this._attachments(input, inst);
- input.addClass(this.markerClassName).keydown(this._doKeyDown).
- keypress(this._doKeyPress).keyup(this._doKeyUp).
- bind("setData.datepicker", function(event, key, value) {
- inst.settings[key] = value;
- }).bind("getData.datepicker", function(event, key) {
- return this._get(inst, key);
- });
- this._autoSize(inst);
- $.data(target, PROP_NAME, inst);
- //If disabled option is true, disable the datepicker once it has been attached to the input (see ticket #5665)
- if( inst.settings.disabled ) {
- this._disableDatepicker( target );
- }
- },
-
- /* Make attachments based on settings. */
- _attachments: function(input, inst) {
- var appendText = this._get(inst, 'appendText');
- var isRTL = this._get(inst, 'isRTL');
- if (inst.append)
- inst.append.remove();
- if (appendText) {
- inst.append = $('<span class="' + this._appendClass + '">' + appendText + '</span>');
- input[isRTL ? 'before' : 'after'](inst.append);
- }
- input.unbind('focus', this._showDatepicker);
- if (inst.trigger)
- inst.trigger.remove();
- var showOn = this._get(inst, 'showOn');
- if (showOn == 'focus' || showOn == 'both') // pop-up date picker when in the marked field
- input.focus(this._showDatepicker);
- if (showOn == 'button' || showOn == 'both') { // pop-up date picker when button clicked
- var buttonText = this._get(inst, 'buttonText');
- var buttonImage = this._get(inst, 'buttonImage');
- inst.trigger = $(this._get(inst, 'buttonImageOnly') ?
- $('<img/>').addClass(this._triggerClass).
- attr({ src: buttonImage, alt: buttonText, title: buttonText }) :
- $('<button type="button"></button>').addClass(this._triggerClass).
- html(buttonImage == '' ? buttonText : $('<img/>').attr(
- { src:buttonImage, alt:buttonText, title:buttonText })));
- input[isRTL ? 'before' : 'after'](inst.trigger);
- inst.trigger.click(function() {
- if ($.datepicker._datepickerShowing && $.datepicker._lastInput == input[0])
- $.datepicker._hideDatepicker();
- else if ($.datepicker._datepickerShowing && $.datepicker._lastInput != input[0]) {
- $.datepicker._hideDatepicker();
- $.datepicker._showDatepicker(input[0]);
- } else
- $.datepicker._showDatepicker(input[0]);
- return false;
- });
- }
- },
-
- /* Apply the maximum length for the date format. */
- _autoSize: function(inst) {
- if (this._get(inst, 'autoSize') && !inst.inline) {
- var date = new Date(2009, 12 - 1, 20); // Ensure double digits
- var dateFormat = this._get(inst, 'dateFormat');
- if (dateFormat.match(/[DM]/)) {
- var findMax = function(names) {
- var max = 0;
- var maxI = 0;
- for (var i = 0; i < names.length; i++) {
- if (names[i].length > max) {
- max = names[i].length;
- maxI = i;
- }
- }
- return maxI;
- };
- date.setMonth(findMax(this._get(inst, (dateFormat.match(/MM/) ?
- 'monthNames' : 'monthNamesShort'))));
- date.setDate(findMax(this._get(inst, (dateFormat.match(/DD/) ?
- 'dayNames' : 'dayNamesShort'))) + 20 - date.getDay());
- }
- inst.input.attr('size', this._formatDate(inst, date).length);
- }
- },
-
- /* Attach an inline date picker to a div. */
- _inlineDatepicker: function(target, inst) {
- var divSpan = $(target);
- if (divSpan.hasClass(this.markerClassName))
- return;
- divSpan.addClass(this.markerClassName).append(inst.dpDiv).
- bind("setData.datepicker", function(event, key, value){
- inst.settings[key] = value;
- }).bind("getData.datepicker", function(event, key){
- return this._get(inst, key);
- });
- $.data(target, PROP_NAME, inst);
- this._setDate(inst, this._getDefaultDate(inst), true);
- this._updateDatepicker(inst);
- this._updateAlternate(inst);
- //If disabled option is true, disable the datepicker before showing it (see ticket #5665)
- if( inst.settings.disabled ) {
- this._disableDatepicker( target );
- }
- // Set display:block in place of inst.dpDiv.show() which won't work on disconnected elements
- // http://bugs.jqueryui.com/ticket/7552 - A Datepicker created on a detached div has zero height
- inst.dpDiv.css( "display", "block" );
- },
-
- /* Pop-up the date picker in a "dialog" box.
- @param input element - ignored
- @param date string or Date - the initial date to display
- @param onSelect function - the function to call when a date is selected
- @param settings object - update the dialog date picker instance's settings (anonymous object)
- @param pos int[2] - coordinates for the dialog's position within the screen or
- event - with x/y coordinates or
- leave empty for default (screen centre)
- @return the manager object */
- _dialogDatepicker: function(input, date, onSelect, settings, pos) {
- var inst = this._dialogInst; // internal instance
- if (!inst) {
- this.uuid += 1;
- var id = 'dp' + this.uuid;
- this._dialogInput = $('<input type="text" id="' + id +
- '" style="position: absolute; top: -100px; width: 0px;"/>');
- this._dialogInput.keydown(this._doKeyDown);
- $('body').append(this._dialogInput);
- inst = this._dialogInst = this._newInst(this._dialogInput, false);
- inst.settings = {};
- $.data(this._dialogInput[0], PROP_NAME, inst);
- }
- extendRemove(inst.settings, settings || {});
- date = (date && date.constructor == Date ? this._formatDate(inst, date) : date);
- this._dialogInput.val(date);
-
- this._pos = (pos ? (pos.length ? pos : [pos.pageX, pos.pageY]) : null);
- if (!this._pos) {
- var browserWidth = document.documentElement.clientWidth;
- var browserHeight = document.documentElement.clientHeight;
- var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
- var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
- this._pos = // should use actual width/height below
- [(browserWidth / 2) - 100 + scrollX, (browserHeight / 2) - 150 + scrollY];
- }
-
- // move input on screen for focus, but hidden behind dialog
- this._dialogInput.css('left', (this._pos[0] + 20) + 'px').css('top', this._pos[1] + 'px');
- inst.settings.onSelect = onSelect;
- this._inDialog = true;
- this.dpDiv.addClass(this._dialogClass);
- this._showDatepicker(this._dialogInput[0]);
- if ($.blockUI)
- $.blockUI(this.dpDiv);
- $.data(this._dialogInput[0], PROP_NAME, inst);
- return this;
- },
-
- /* Detach a datepicker from its control.
- @param target element - the target input field or division or span */
- _destroyDatepicker: function(target) {
- var $target = $(target);
- var inst = $.data(target, PROP_NAME);
- if (!$target.hasClass(this.markerClassName)) {
- return;
- }
- var nodeName = target.nodeName.toLowerCase();
- $.removeData(target, PROP_NAME);
- if (nodeName == 'input') {
- inst.append.remove();
- inst.trigger.remove();
- $target.removeClass(this.markerClassName).
- unbind('focus', this._showDatepicker).
- unbind('keydown', this._doKeyDown).
- unbind('keypress', this._doKeyPress).
- unbind('keyup', this._doKeyUp);
- } else if (nodeName == 'div' || nodeName == 'span')
- $target.removeClass(this.markerClassName).empty();
- },
-
- /* Enable the date picker to a jQuery selection.
- @param target element - the target input field or division or span */
- _enableDatepicker: function(target) {
- var $target = $(target);
- var inst = $.data(target, PROP_NAME);
- if (!$target.hasClass(this.markerClassName)) {
- return;
- }
- var nodeName = target.nodeName.toLowerCase();
- if (nodeName == 'input') {
- target.disabled = false;
- inst.trigger.filter('button').
- each(function() { this.disabled = false; }).end().
- filter('img').css({opacity: '1.0', cursor: ''});
- }
- else if (nodeName == 'div' || nodeName == 'span') {
- var inline = $target.children('.' + this._inlineClass);
- inline.children().removeClass('ui-state-disabled');
- inline.find("select.ui-datepicker-month, select.ui-datepicker-year").
- removeAttr("disabled");
- }
- this._disabledInputs = $.map(this._disabledInputs,
- function(value) { return (value == target ? null : value); }); // delete entry
- },
-
- /* Disable the date picker to a jQuery selection.
- @param target element - the target input field or division or span */
- _disableDatepicker: function(target) {
- var $target = $(target);
- var inst = $.data(target, PROP_NAME);
- if (!$target.hasClass(this.markerClassName)) {
- return;
- }
- var nodeName = target.nodeName.toLowerCase();
- if (nodeName == 'input') {
- target.disabled = true;
- inst.trigger.filter('button').
- each(function() { this.disabled = true; }).end().
- filter('img').css({opacity: '0.5', cursor: 'default'});
- }
- else if (nodeName == 'div' || nodeName == 'span') {
- var inline = $target.children('.' + this._inlineClass);
- inline.children().addClass('ui-state-disabled');
- inline.find("select.ui-datepicker-month, select.ui-datepicker-year").
- attr("disabled", "disabled");
- }
- this._disabledInputs = $.map(this._disabledInputs,
- function(value) { return (value == target ? null : value); }); // delete entry
- this._disabledInputs[this._disabledInputs.length] = target;
- },
-
- /* Is the first field in a jQuery collection disabled as a datepicker?
- @param target element - the target input field or division or span
- @return boolean - true if disabled, false if enabled */
- _isDisabledDatepicker: function(target) {
- if (!target) {
- return false;
- }
- for (var i = 0; i < this._disabledInputs.length; i++) {
- if (this._disabledInputs[i] == target)
- return true;
- }
- return false;
- },
-
- /* Retrieve the instance data for the target control.
- @param target element - the target input field or division or span
- @return object - the associated instance data
- @throws error if a jQuery problem getting data */
- _getInst: function(target) {
- try {
- return $.data(target, PROP_NAME);
- }
- catch (err) {
- throw 'Missing instance data for this datepicker';
- }
- },
-
- /* Update or retrieve the settings for a date picker attached to an input field or division.
- @param target element - the target input field or division or span
- @param name object - the new settings to update or
- string - the name of the setting to change or retrieve,
- when retrieving also 'all' for all instance settings or
- 'defaults' for all global defaults
- @param value any - the new value for the setting
- (omit if above is an object or to retrieve a value) */
- _optionDatepicker: function(target, name, value) {
- var inst = this._getInst(target);
- if (arguments.length == 2 && typeof name == 'string') {
- return (name == 'defaults' ? $.extend({}, $.datepicker._defaults) :
- (inst ? (name == 'all' ? $.extend({}, inst.settings) :
- this._get(inst, name)) : null));
- }
- var settings = name || {};
- if (typeof name == 'string') {
- settings = {};
- settings[name] = value;
- }
- if (inst) {
- if (this._curInst == inst) {
- this._hideDatepicker();
- }
- var date = this._getDateDatepicker(target, true);
- var minDate = this._getMinMaxDate(inst, 'min');
- var maxDate = this._getMinMaxDate(inst, 'max');
- extendRemove(inst.settings, settings);
- // reformat the old minDate/maxDate values if dateFormat changes and a new minDate/maxDate isn't provided
- if (minDate !== null && settings['dateFormat'] !== undefined && settings['minDate'] === undefined)
- inst.settings.minDate = this._formatDate(inst, minDate);
- if (maxDate !== null && settings['dateFormat'] !== undefined && settings['maxDate'] === undefined)
- inst.settings.maxDate = this._formatDate(inst, maxDate);
- this._attachments($(target), inst);
- this._autoSize(inst);
- this._setDate(inst, date);
- this._updateAlternate(inst);
- this._updateDatepicker(inst);
- }
- },
-
- // change method deprecated
- _changeDatepicker: function(target, name, value) {
- this._optionDatepicker(target, name, value);
- },
-
- /* Redraw the date picker attached to an input field or division.
- @param target element - the target input field or division or span */
- _refreshDatepicker: function(target) {
- var inst = this._getInst(target);
- if (inst) {
- this._updateDatepicker(inst);
- }
- },
-
- /* Set the dates for a jQuery selection.
- @param target element - the target input field or division or span
- @param date Date - the new date */
- _setDateDatepicker: function(target, date) {
- var inst = this._getInst(target);
- if (inst) {
- this._setDate(inst, date);
- this._updateDatepicker(inst);
- this._updateAlternate(inst);
- }
- },
-
- /* Get the date(s) for the first entry in a jQuery selection.
- @param target element - the target input field or division or span
- @param noDefault boolean - true if no default date is to be used
- @return Date - the current date */
- _getDateDatepicker: function(target, noDefault) {
- var inst = this._getInst(target);
- if (inst && !inst.inline)
- this._setDateFromField(inst, noDefault);
- return (inst ? this._getDate(inst) : null);
- },
-
- /* Handle keystrokes. */
- _doKeyDown: function(event) {
- var inst = $.datepicker._getInst(event.target);
- var handled = true;
- var isRTL = inst.dpDiv.is('.ui-datepicker-rtl');
- inst._keyEvent = true;
- if ($.datepicker._datepickerShowing)
- switch (event.keyCode) {
- case 9: $.datepicker._hideDatepicker();
- handled = false;
- break; // hide on tab out
- case 13: var sel = $('td.' + $.datepicker._dayOverClass + ':not(.' +
- $.datepicker._currentClass + ')', inst.dpDiv);
- if (sel[0])
- $.datepicker._selectDay(event.target, inst.selectedMonth, inst.selectedYear, sel[0]);
- var onSelect = $.datepicker._get(inst, 'onSelect');
- if (onSelect) {
- var dateStr = $.datepicker._formatDate(inst);
-
- // trigger custom callback
- onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]);
- }
- else
- $.datepicker._hideDatepicker();
- return false; // don't submit the form
- break; // select the value on enter
- case 27: $.datepicker._hideDatepicker();
- break; // hide on escape
- case 33: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
- break; // previous month/year on page up/+ ctrl
- case 34: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
- break; // next month/year on page down/+ ctrl
- case 35: if (event.ctrlKey || event.metaKey) $.datepicker._clearDate(event.target);
- handled = event.ctrlKey || event.metaKey;
- break; // clear on ctrl or command +end
- case 36: if (event.ctrlKey || event.metaKey) $.datepicker._gotoToday(event.target);
- handled = event.ctrlKey || event.metaKey;
- break; // current on ctrl or command +home
- case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? +1 : -1), 'D');
- handled = event.ctrlKey || event.metaKey;
- // -1 day on ctrl or command +left
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
- // next month/year on alt +left on Mac
- break;
- case 38: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -7, 'D');
- handled = event.ctrlKey || event.metaKey;
- break; // -1 week on ctrl or command +up
- case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? -1 : +1), 'D');
- handled = event.ctrlKey || event.metaKey;
- // +1 day on ctrl or command +right
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
- // next month/year on alt +right
- break;
- case 40: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +7, 'D');
- handled = event.ctrlKey || event.metaKey;
- break; // +1 week on ctrl or command +down
- default: handled = false;
- }
- else if (event.keyCode == 36 && event.ctrlKey) // display the date picker on ctrl+home
- $.datepicker._showDatepicker(this);
- else {
- handled = false;
- }
- if (handled) {
- event.preventDefault();
- event.stopPropagation();
- }
- },
-
- /* Filter entered characters - based on date format. */
- _doKeyPress: function(event) {
- var inst = $.datepicker._getInst(event.target);
- if ($.datepicker._get(inst, 'constrainInput')) {
- var chars = $.datepicker._possibleChars($.datepicker._get(inst, 'dateFormat'));
- var chr = String.fromCharCode(event.charCode == undefined ? event.keyCode : event.charCode);
- return event.ctrlKey || event.metaKey || (chr < ' ' || !chars || chars.indexOf(chr) > -1);
- }
- },
-
- /* Synchronise manual entry and field/alternate field. */
- _doKeyUp: function(event) {
- var inst = $.datepicker._getInst(event.target);
- if (inst.input.val() != inst.lastVal) {
- try {
- var date = $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'),
- (inst.input ? inst.input.val() : null),
- $.datepicker._getFormatConfig(inst));
- if (date) { // only if valid
- $.datepicker._setDateFromField(inst);
- $.datepicker._updateAlternate(inst);
- $.datepicker._updateDatepicker(inst);
- }
- }
- catch (err) {
- $.datepicker.log(err);
- }
- }
- return true;
- },
-
- /* Pop-up the date picker for a given input field.
- If false returned from beforeShow event handler do not show.
- @param input element - the input field attached to the date picker or
- event - if triggered by focus */
- _showDatepicker: function(input) {
- input = input.target || input;
- if (input.nodeName.toLowerCase() != 'input') // find from button/image trigger
- input = $('input', input.parentNode)[0];
- if ($.datepicker._isDisabledDatepicker(input) || $.datepicker._lastInput == input) // already here
- return;
- var inst = $.datepicker._getInst(input);
- if ($.datepicker._curInst && $.datepicker._curInst != inst) {
- $.datepicker._curInst.dpDiv.stop(true, true);
- if ( inst && $.datepicker._datepickerShowing ) {
- $.datepicker._hideDatepicker( $.datepicker._curInst.input[0] );
- }
- }
- var beforeShow = $.datepicker._get(inst, 'beforeShow');
- var beforeShowSettings = beforeShow ? beforeShow.apply(input, [input, inst]) : {};
- if(beforeShowSettings === false){
- //false
- return;
- }
- extendRemove(inst.settings, beforeShowSettings);
- inst.lastVal = null;
- $.datepicker._lastInput = input;
- $.datepicker._setDateFromField(inst);
- if ($.datepicker._inDialog) // hide cursor
- input.value = '';
- if (!$.datepicker._pos) { // position below input
- $.datepicker._pos = $.datepicker._findPos(input);
- $.datepicker._pos[1] += input.offsetHeight; // add the height
- }
- var isFixed = false;
- $(input).parents().each(function() {
- isFixed |= $(this).css('position') == 'fixed';
- return !isFixed;
- });
- if (isFixed && $.browser.opera) { // correction for Opera when fixed and scrolled
- $.datepicker._pos[0] -= document.documentElement.scrollLeft;
- $.datepicker._pos[1] -= document.documentElement.scrollTop;
- }
- var offset = {left: $.datepicker._pos[0], top: $.datepicker._pos[1]};
- $.datepicker._pos = null;
- //to avoid flashes on Firefox
- inst.dpDiv.empty();
- // determine sizing offscreen
- inst.dpDiv.css({position: 'absolute', display: 'block', top: '-1000px'});
- $.datepicker._updateDatepicker(inst);
- // fix width for dynamic number of date pickers
- // and adjust position before showing
- offset = $.datepicker._checkOffset(inst, offset, isFixed);
- inst.dpDiv.css({position: ($.datepicker._inDialog && $.blockUI ?
- 'static' : (isFixed ? 'fixed' : 'absolute')), display: 'none',
- left: offset.left + 'px', top: offset.top + 'px'});
- if (!inst.inline) {
- var showAnim = $.datepicker._get(inst, 'showAnim');
- var duration = $.datepicker._get(inst, 'duration');
- var postProcess = function() {
- var cover = inst.dpDiv.find('iframe.ui-datepicker-cover'); // IE6- only
- if( !! cover.length ){
- var borders = $.datepicker._getBorders(inst.dpDiv);
- cover.css({left: -borders[0], top: -borders[1],
- width: inst.dpDiv.outerWidth(), height: inst.dpDiv.outerHeight()});
- }
- };
- inst.dpDiv.zIndex($(input).zIndex()+1);
- $.datepicker._datepickerShowing = true;
- if ($.effects && $.effects[showAnim])
- inst.dpDiv.show(showAnim, $.datepicker._get(inst, 'showOptions'), duration, postProcess);
- else
- inst.dpDiv[showAnim || 'show']((showAnim ? duration : null), postProcess);
- if (!showAnim || !duration)
- postProcess();
- if (inst.input.is(':visible') && !inst.input.is(':disabled'))
- inst.input.focus();
- $.datepicker._curInst = inst;
- }
- },
-
- /* Generate the date picker content. */
- _updateDatepicker: function(inst) {
- var self = this;
- self.maxRows = 4; //Reset the max number of rows being displayed (see #7043)
- var borders = $.datepicker._getBorders(inst.dpDiv);
- instActive = inst; // for delegate hover events
- inst.dpDiv.empty().append(this._generateHTML(inst));
- this._attachHandlers(inst);
- var cover = inst.dpDiv.find('iframe.ui-datepicker-cover'); // IE6- only
- if( !!cover.length ){ //avoid call to outerXXXX() when not in IE6
- cover.css({left: -borders[0], top: -borders[1], width: inst.dpDiv.outerWidth(), height: inst.dpDiv.outerHeight()})
- }
- inst.dpDiv.find('.' + this._dayOverClass + ' a').mouseover();
- var numMonths = this._getNumberOfMonths(inst);
- var cols = numMonths[1];
- var width = 17;
- inst.dpDiv.removeClass('ui-datepicker-multi-2 ui-datepicker-multi-3 ui-datepicker-multi-4').width('');
- if (cols > 1)
- inst.dpDiv.addClass('ui-datepicker-multi-' + cols).css('width', (width * cols) + 'em');
- inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') +
- 'Class']('ui-datepicker-multi');
- inst.dpDiv[(this._get(inst, 'isRTL') ? 'add' : 'remove') +
- 'Class']('ui-datepicker-rtl');
- if (inst == $.datepicker._curInst && $.datepicker._datepickerShowing && inst.input &&
- // #6694 - don't focus the input if it's already focused
- // this breaks the change event in IE
- inst.input.is(':visible') && !inst.input.is(':disabled') && inst.input[0] != document.activeElement)
- inst.input.focus();
- // deffered render of the years select (to avoid flashes on Firefox)
- if( inst.yearshtml ){
- var origyearshtml = inst.yearshtml;
- setTimeout(function(){
- //assure that inst.yearshtml didn't change.
- if( origyearshtml === inst.yearshtml && inst.yearshtml ){
- inst.dpDiv.find('select.ui-datepicker-year:first').replaceWith(inst.yearshtml);
- }
- origyearshtml = inst.yearshtml = null;
- }, 0);
- }
- },
-
- /* Retrieve the size of left and top borders for an element.
- @param elem (jQuery object) the element of interest
- @return (number[2]) the left and top borders */
- _getBorders: function(elem) {
- var convert = function(value) {
- return {thin: 1, medium: 2, thick: 3}[value] || value;
- };
- return [parseFloat(convert(elem.css('border-left-width'))),
- parseFloat(convert(elem.css('border-top-width')))];
- },
-
- /* Check positioning to remain on screen. */
- _checkOffset: function(inst, offset, isFixed) {
- var dpWidth = inst.dpDiv.outerWidth();
- var dpHeight = inst.dpDiv.outerHeight();
- var inputWidth = inst.input ? inst.input.outerWidth() : 0;
- var inputHeight = inst.input ? inst.input.outerHeight() : 0;
- var viewWidth = document.documentElement.clientWidth + (isFixed ? 0 : $(document).scrollLeft());
- var viewHeight = document.documentElement.clientHeight + (isFixed ? 0 : $(document).scrollTop());
-
- offset.left -= (this._get(inst, 'isRTL') ? (dpWidth - inputWidth) : 0);
- offset.left -= (isFixed && offset.left == inst.input.offset().left) ? $(document).scrollLeft() : 0;
- offset.top -= (isFixed && offset.top == (inst.input.offset().top + inputHeight)) ? $(document).scrollTop() : 0;
-
- // now check if datepicker is showing outside window viewport - move to a better place if so.
- offset.left -= Math.min(offset.left, (offset.left + dpWidth > viewWidth && viewWidth > dpWidth) ?
- Math.abs(offset.left + dpWidth - viewWidth) : 0);
- offset.top -= Math.min(offset.top, (offset.top + dpHeight > viewHeight && viewHeight > dpHeight) ?
- Math.abs(dpHeight + inputHeight) : 0);
-
- return offset;
- },
-
- /* Find an object's position on the screen. */
- _findPos: function(obj) {
- var inst = this._getInst(obj);
- var isRTL = this._get(inst, 'isRTL');
- while (obj && (obj.type == 'hidden' || obj.nodeType != 1 || $.expr.filters.hidden(obj))) {
- obj = obj[isRTL ? 'previousSibling' : 'nextSibling'];
- }
- var position = $(obj).offset();
- return [position.left, position.top];
- },
-
- /* Hide the date picker from view.
- @param input element - the input field attached to the date picker */
- _hideDatepicker: function(input) {
- var inst = this._curInst;
- if (!inst || (input && inst != $.data(input, PROP_NAME)))
- return;
- if (this._datepickerShowing) {
- var showAnim = this._get(inst, 'showAnim');
- var duration = this._get(inst, 'duration');
- var postProcess = function() {
- $.datepicker._tidyDialog(inst);
- };
- if ($.effects && $.effects[showAnim])
- inst.dpDiv.hide(showAnim, $.datepicker._get(inst, 'showOptions'), duration, postProcess);
- else
- inst.dpDiv[(showAnim == 'slideDown' ? 'slideUp' :
- (showAnim == 'fadeIn' ? 'fadeOut' : 'hide'))]((showAnim ? duration : null), postProcess);
- if (!showAnim)
- postProcess();
- this._datepickerShowing = false;
- var onClose = this._get(inst, 'onClose');
- if (onClose)
- onClose.apply((inst.input ? inst.input[0] : null),
- [(inst.input ? inst.input.val() : ''), inst]);
- this._lastInput = null;
- if (this._inDialog) {
- this._dialogInput.css({ position: 'absolute', left: '0', top: '-100px' });
- if ($.blockUI) {
- $.unblockUI();
- $('body').append(this.dpDiv);
- }
- }
- this._inDialog = false;
- }
- },
-
- /* Tidy up after a dialog display. */
- _tidyDialog: function(inst) {
- inst.dpDiv.removeClass(this._dialogClass).unbind('.ui-datepicker-calendar');
- },
-
- /* Close date picker if clicked elsewhere. */
- _checkExternalClick: function(event) {
- if (!$.datepicker._curInst)
- return;
-
- var $target = $(event.target),
- inst = $.datepicker._getInst($target[0]);
-
- if ( ( ( $target[0].id != $.datepicker._mainDivId &&
- $target.parents('#' + $.datepicker._mainDivId).length == 0 &&
- !$target.hasClass($.datepicker.markerClassName) &&
- !$target.closest("." + $.datepicker._triggerClass).length &&
- $.datepicker._datepickerShowing && !($.datepicker._inDialog && $.blockUI) ) ) ||
- ( $target.hasClass($.datepicker.markerClassName) && $.datepicker._curInst != inst ) )
- $.datepicker._hideDatepicker();
- },
-
- /* Adjust one of the date sub-fields. */
- _adjustDate: function(id, offset, period) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- if (this._isDisabledDatepicker(target[0])) {
- return;
- }
- this._adjustInstDate(inst, offset +
- (period == 'M' ? this._get(inst, 'showCurrentAtPos') : 0), // undo positioning
- period);
- this._updateDatepicker(inst);
- },
-
- /* Action for current link. */
- _gotoToday: function(id) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- if (this._get(inst, 'gotoCurrent') && inst.currentDay) {
- inst.selectedDay = inst.currentDay;
- inst.drawMonth = inst.selectedMonth = inst.currentMonth;
- inst.drawYear = inst.selectedYear = inst.currentYear;
- }
- else {
- var date = new Date();
- inst.selectedDay = date.getDate();
- inst.drawMonth = inst.selectedMonth = date.getMonth();
- inst.drawYear = inst.selectedYear = date.getFullYear();
- }
- this._notifyChange(inst);
- this._adjustDate(target);
- },
-
- /* Action for selecting a new month/year. */
- _selectMonthYear: function(id, select, period) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- inst['selected' + (period == 'M' ? 'Month' : 'Year')] =
- inst['draw' + (period == 'M' ? 'Month' : 'Year')] =
- parseInt(select.options[select.selectedIndex].value,10);
- this._notifyChange(inst);
- this._adjustDate(target);
- },
-
- /* Action for selecting a day. */
- _selectDay: function(id, month, year, td) {
- var target = $(id);
- if ($(td).hasClass(this._unselectableClass) || this._isDisabledDatepicker(target[0])) {
- return;
- }
- var inst = this._getInst(target[0]);
- inst.selectedDay = inst.currentDay = $('a', td).html();
- inst.selectedMonth = inst.currentMonth = month;
- inst.selectedYear = inst.currentYear = year;
- this._selectDate(id, this._formatDate(inst,
- inst.currentDay, inst.currentMonth, inst.currentYear));
- },
-
- /* Erase the input field and hide the date picker. */
- _clearDate: function(id) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- this._selectDate(target, '');
- },
-
- /* Update the input field with the selected date. */
- _selectDate: function(id, dateStr) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- dateStr = (dateStr != null ? dateStr : this._formatDate(inst));
- if (inst.input)
- inst.input.val(dateStr);
- this._updateAlternate(inst);
- var onSelect = this._get(inst, 'onSelect');
- if (onSelect)
- onSelect.apply((inst.input ? inst.input[0] : null), [dateStr, inst]); // trigger custom callback
- else if (inst.input)
- inst.input.trigger('change'); // fire the change event
- if (inst.inline)
- this._updateDatepicker(inst);
- else {
- this._hideDatepicker();
- this._lastInput = inst.input[0];
- if (typeof(inst.input[0]) != 'object')
- inst.input.focus(); // restore focus
- this._lastInput = null;
- }
- },
-
- /* Update any alternate field to synchronise with the main field. */
- _updateAlternate: function(inst) {
- var altField = this._get(inst, 'altField');
- if (altField) { // update alternate field too
- var altFormat = this._get(inst, 'altFormat') || this._get(inst, 'dateFormat');
- var date = this._getDate(inst);
- var dateStr = this.formatDate(altFormat, date, this._getFormatConfig(inst));
- $(altField).each(function() { $(this).val(dateStr); });
- }
- },
-
- /* Set as beforeShowDay function to prevent selection of weekends.
- @param date Date - the date to customise
- @return [boolean, string] - is this date selectable?, what is its CSS class? */
- noWeekends: function(date) {
- var day = date.getDay();
- return [(day > 0 && day < 6), ''];
- },
-
- /* Set as calculateWeek to determine the week of the year based on the ISO 8601 definition.
- @param date Date - the date to get the week for
- @return number - the number of the week within the year that contains this date */
- iso8601Week: function(date) {
- var checkDate = new Date(date.getTime());
- // Find Thursday of this week starting on Monday
- checkDate.setDate(checkDate.getDate() + 4 - (checkDate.getDay() || 7));
- var time = checkDate.getTime();
- checkDate.setMonth(0); // Compare with Jan 1
- checkDate.setDate(1);
- return Math.floor(Math.round((time - checkDate) / 86400000) / 7) + 1;
- },
-
- /* Parse a string value into a date object.
- See formatDate below for the possible formats.
-
- @param format string - the expected format of the date
- @param value string - the date in the above format
- @param settings Object - attributes include:
- shortYearCutoff number - the cutoff year for determining the century (optional)
- dayNamesShort string[7] - abbreviated names of the days from Sunday (optional)
- dayNames string[7] - names of the days from Sunday (optional)
- monthNamesShort string[12] - abbreviated names of the months (optional)
- monthNames string[12] - names of the months (optional)
- @return Date - the extracted date value or null if value is blank */
- parseDate: function (format, value, settings) {
- if (format == null || value == null)
- throw 'Invalid arguments';
- value = (typeof value == 'object' ? value.toString() : value + '');
- if (value == '')
- return null;
- var shortYearCutoff = (settings ? settings.shortYearCutoff : null) || this._defaults.shortYearCutoff;
- shortYearCutoff = (typeof shortYearCutoff != 'string' ? shortYearCutoff :
- new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10));
- var dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort;
- var dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames;
- var monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort;
- var monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames;
- var year = -1;
- var month = -1;
- var day = -1;
- var doy = -1;
- var literal = false;
- // Check whether a format character is doubled
- var lookAhead = function(match) {
- var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match);
- if (matches)
- iFormat++;
- return matches;
- };
- // Extract a number from the string value
- var getNumber = function(match) {
- var isDoubled = lookAhead(match);
- var size = (match == '@' ? 14 : (match == '!' ? 20 :
- (match == 'y' && isDoubled ? 4 : (match == 'o' ? 3 : 2))));
- var digits = new RegExp('^\\d{1,' + size + '}');
- var num = value.substring(iValue).match(digits);
- if (!num)
- throw 'Missing number at position ' + iValue;
- iValue += num[0].length;
- return parseInt(num[0], 10);
- };
- // Extract a name from the string value and convert to an index
- var getName = function(match, shortNames, longNames) {
- var names = $.map(lookAhead(match) ? longNames : shortNames, function (v, k) {
- return [ [k, v] ];
- }).sort(function (a, b) {
- return -(a[1].length - b[1].length);
- });
- var index = -1;
- $.each(names, function (i, pair) {
- var name = pair[1];
- if (value.substr(iValue, name.length).toLowerCase() == name.toLowerCase()) {
- index = pair[0];
- iValue += name.length;
- return false;
- }
- });
- if (index != -1)
- return index + 1;
- else
- throw 'Unknown name at position ' + iValue;
- };
- // Confirm that a literal character matches the string value
- var checkLiteral = function() {
- if (value.charAt(iValue) != format.charAt(iFormat))
- throw 'Unexpected literal at position ' + iValue;
- iValue++;
- };
- var iValue = 0;
- for (var iFormat = 0; iFormat < format.length; iFormat++) {
- if (literal)
- if (format.charAt(iFormat) == "'" && !lookAhead("'"))
- literal = false;
- else
- checkLiteral();
- else
- switch (format.charAt(iFormat)) {
- case 'd':
- day = getNumber('d');
- break;
- case 'D':
- getName('D', dayNamesShort, dayNames);
- break;
- case 'o':
- doy = getNumber('o');
- break;
- case 'm':
- month = getNumber('m');
- break;
- case 'M':
- month = getName('M', monthNamesShort, monthNames);
- break;
- case 'y':
- year = getNumber('y');
- break;
- case '@':
- var date = new Date(getNumber('@'));
- year = date.getFullYear();
- month = date.getMonth() + 1;
- day = date.getDate();
- break;
- case '!':
- var date = new Date((getNumber('!') - this._ticksTo1970) / 10000);
- year = date.getFullYear();
- month = date.getMonth() + 1;
- day = date.getDate();
- break;
- case "'":
- if (lookAhead("'"))
- checkLiteral();
- else
- literal = true;
- break;
- default:
- checkLiteral();
- }
- }
- if (iValue < value.length){
- throw "Extra/unparsed characters found in date: " + value.substring(iValue);
- }
- if (year == -1)
- year = new Date().getFullYear();
- else if (year < 100)
- year += new Date().getFullYear() - new Date().getFullYear() % 100 +
- (year <= shortYearCutoff ? 0 : -100);
- if (doy > -1) {
- month = 1;
- day = doy;
- do {
- var dim = this._getDaysInMonth(year, month - 1);
- if (day <= dim)
- break;
- month++;
- day -= dim;
- } while (true);
- }
- var date = this._daylightSavingAdjust(new Date(year, month - 1, day));
- if (date.getFullYear() != year || date.getMonth() + 1 != month || date.getDate() != day)
- throw 'Invalid date'; // E.g. 31/02/00
- return date;
- },
-
- /* Standard date formats. */
- ATOM: 'yy-mm-dd', // RFC 3339 (ISO 8601)
- COOKIE: 'D, dd M yy',
- ISO_8601: 'yy-mm-dd',
- RFC_822: 'D, d M y',
- RFC_850: 'DD, dd-M-y',
- RFC_1036: 'D, d M y',
- RFC_1123: 'D, d M yy',
- RFC_2822: 'D, d M yy',
- RSS: 'D, d M y', // RFC 822
- TICKS: '!',
- TIMESTAMP: '@',
- W3C: 'yy-mm-dd', // ISO 8601
-
- _ticksTo1970: (((1970 - 1) * 365 + Math.floor(1970 / 4) - Math.floor(1970 / 100) +
- Math.floor(1970 / 400)) * 24 * 60 * 60 * 10000000),
-
- /* Format a date object into a string value.
- The format can be combinations of the following:
- d - day of month (no leading zero)
- dd - day of month (two digit)
- o - day of year (no leading zeros)
- oo - day of year (three digit)
- D - day name short
- DD - day name long
- m - month of year (no leading zero)
- mm - month of year (two digit)
- M - month name short
- MM - month name long
- y - year (two digit)
- yy - year (four digit)
- @ - Unix timestamp (ms since 01/01/1970)
- ! - Windows ticks (100ns since 01/01/0001)
- '...' - literal text
- '' - single quote
-
- @param format string - the desired format of the date
- @param date Date - the date value to format
- @param settings Object - attributes include:
- dayNamesShort string[7] - abbreviated names of the days from Sunday (optional)
- dayNames string[7] - names of the days from Sunday (optional)
- monthNamesShort string[12] - abbreviated names of the months (optional)
- monthNames string[12] - names of the months (optional)
- @return string - the date in the above format */
- formatDate: function (format, date, settings) {
- if (!date)
- return '';
- var dayNamesShort = (settings ? settings.dayNamesShort : null) || this._defaults.dayNamesShort;
- var dayNames = (settings ? settings.dayNames : null) || this._defaults.dayNames;
- var monthNamesShort = (settings ? settings.monthNamesShort : null) || this._defaults.monthNamesShort;
- var monthNames = (settings ? settings.monthNames : null) || this._defaults.monthNames;
- // Check whether a format character is doubled
- var lookAhead = function(match) {
- var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match);
- if (matches)
- iFormat++;
- return matches;
- };
- // Format a number, with leading zero if necessary
- var formatNumber = function(match, value, len) {
- var num = '' + value;
- if (lookAhead(match))
- while (num.length < len)
- num = '0' + num;
- return num;
- };
- // Format a name, short or long as requested
- var formatName = function(match, value, shortNames, longNames) {
- return (lookAhead(match) ? longNames[value] : shortNames[value]);
- };
- var output = '';
- var literal = false;
- if (date)
- for (var iFormat = 0; iFormat < format.length; iFormat++) {
- if (literal)
- if (format.charAt(iFormat) == "'" && !lookAhead("'"))
- literal = false;
- else
- output += format.charAt(iFormat);
- else
- switch (format.charAt(iFormat)) {
- case 'd':
- output += formatNumber('d', date.getDate(), 2);
- break;
- case 'D':
- output += formatName('D', date.getDay(), dayNamesShort, dayNames);
- break;
- case 'o':
- output += formatNumber('o',
- Math.round((new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() - new Date(date.getFullYear(), 0, 0).getTime()) / 86400000), 3);
- break;
- case 'm':
- output += formatNumber('m', date.getMonth() + 1, 2);
- break;
- case 'M':
- output += formatName('M', date.getMonth(), monthNamesShort, monthNames);
- break;
- case 'y':
- output += (lookAhead('y') ? date.getFullYear() :
- (date.getYear() % 100 < 10 ? '0' : '') + date.getYear() % 100);
- break;
- case '@':
- output += date.getTime();
- break;
- case '!':
- output += date.getTime() * 10000 + this._ticksTo1970;
- break;
- case "'":
- if (lookAhead("'"))
- output += "'";
- else
- literal = true;
- break;
- default:
- output += format.charAt(iFormat);
- }
- }
- return output;
- },
-
- /* Extract all possible characters from the date format. */
- _possibleChars: function (format) {
- var chars = '';
- var literal = false;
- // Check whether a format character is doubled
- var lookAhead = function(match) {
- var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match);
- if (matches)
- iFormat++;
- return matches;
- };
- for (var iFormat = 0; iFormat < format.length; iFormat++)
- if (literal)
- if (format.charAt(iFormat) == "'" && !lookAhead("'"))
- literal = false;
- else
- chars += format.charAt(iFormat);
- else
- switch (format.charAt(iFormat)) {
- case 'd': case 'm': case 'y': case '@':
- chars += '0123456789';
- break;
- case 'D': case 'M':
- return null; // Accept anything
- case "'":
- if (lookAhead("'"))
- chars += "'";
- else
- literal = true;
- break;
- default:
- chars += format.charAt(iFormat);
- }
- return chars;
- },
-
- /* Get a setting value, defaulting if necessary. */
- _get: function(inst, name) {
- return inst.settings[name] !== undefined ?
- inst.settings[name] : this._defaults[name];
- },
-
- /* Parse existing date and initialise date picker. */
- _setDateFromField: function(inst, noDefault) {
- if (inst.input.val() == inst.lastVal) {
- return;
- }
- var dateFormat = this._get(inst, 'dateFormat');
- var dates = inst.lastVal = inst.input ? inst.input.val() : null;
- var date, defaultDate;
- date = defaultDate = this._getDefaultDate(inst);
- var settings = this._getFormatConfig(inst);
- try {
- date = this.parseDate(dateFormat, dates, settings) || defaultDate;
- } catch (event) {
- this.log(event);
- dates = (noDefault ? '' : dates);
- }
- inst.selectedDay = date.getDate();
- inst.drawMonth = inst.selectedMonth = date.getMonth();
- inst.drawYear = inst.selectedYear = date.getFullYear();
- inst.currentDay = (dates ? date.getDate() : 0);
- inst.currentMonth = (dates ? date.getMonth() : 0);
- inst.currentYear = (dates ? date.getFullYear() : 0);
- this._adjustInstDate(inst);
- },
-
- /* Retrieve the default date shown on opening. */
- _getDefaultDate: function(inst) {
- return this._restrictMinMax(inst,
- this._determineDate(inst, this._get(inst, 'defaultDate'), new Date()));
- },
-
- /* A date may be specified as an exact value or a relative one. */
- _determineDate: function(inst, date, defaultDate) {
- var offsetNumeric = function(offset) {
- var date = new Date();
- date.setDate(date.getDate() + offset);
- return date;
- };
- var offsetString = function(offset) {
- try {
- return $.datepicker.parseDate($.datepicker._get(inst, 'dateFormat'),
- offset, $.datepicker._getFormatConfig(inst));
- }
- catch (e) {
- // Ignore
- }
- var date = (offset.toLowerCase().match(/^c/) ?
- $.datepicker._getDate(inst) : null) || new Date();
- var year = date.getFullYear();
- var month = date.getMonth();
- var day = date.getDate();
- var pattern = /([+-]?[0-9]+)\s*(d|D|w|W|m|M|y|Y)?/g;
- var matches = pattern.exec(offset);
- while (matches) {
- switch (matches[2] || 'd') {
- case 'd' : case 'D' :
- day += parseInt(matches[1],10); break;
- case 'w' : case 'W' :
- day += parseInt(matches[1],10) * 7; break;
- case 'm' : case 'M' :
- month += parseInt(matches[1],10);
- day = Math.min(day, $.datepicker._getDaysInMonth(year, month));
- break;
- case 'y': case 'Y' :
- year += parseInt(matches[1],10);
- day = Math.min(day, $.datepicker._getDaysInMonth(year, month));
- break;
- }
- matches = pattern.exec(offset);
- }
- return new Date(year, month, day);
- };
- var newDate = (date == null || date === '' ? defaultDate : (typeof date == 'string' ? offsetString(date) :
- (typeof date == 'number' ? (isNaN(date) ? defaultDate : offsetNumeric(date)) : new Date(date.getTime()))));
- newDate = (newDate && newDate.toString() == 'Invalid Date' ? defaultDate : newDate);
- if (newDate) {
- newDate.setHours(0);
- newDate.setMinutes(0);
- newDate.setSeconds(0);
- newDate.setMilliseconds(0);
- }
- return this._daylightSavingAdjust(newDate);
- },
-
- /* Handle switch to/from daylight saving.
- Hours may be non-zero on daylight saving cut-over:
- > 12 when midnight changeover, but then cannot generate
- midnight datetime, so jump to 1AM, otherwise reset.
- @param date (Date) the date to check
- @return (Date) the corrected date */
- _daylightSavingAdjust: function(date) {
- if (!date) return null;
- date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);
- return date;
- },
-
- /* Set the date(s) directly. */
- _setDate: function(inst, date, noChange) {
- var clear = !date;
- var origMonth = inst.selectedMonth;
- var origYear = inst.selectedYear;
- var newDate = this._restrictMinMax(inst, this._determineDate(inst, date, new Date()));
- inst.selectedDay = inst.currentDay = newDate.getDate();
- inst.drawMonth = inst.selectedMonth = inst.currentMonth = newDate.getMonth();
- inst.drawYear = inst.selectedYear = inst.currentYear = newDate.getFullYear();
- if ((origMonth != inst.selectedMonth || origYear != inst.selectedYear) && !noChange)
- this._notifyChange(inst);
- this._adjustInstDate(inst);
- if (inst.input) {
- inst.input.val(clear ? '' : this._formatDate(inst));
- }
- },
-
- /* Retrieve the date(s) directly. */
- _getDate: function(inst) {
- var startDate = (!inst.currentYear || (inst.input && inst.input.val() == '') ? null :
- this._daylightSavingAdjust(new Date(
- inst.currentYear, inst.currentMonth, inst.currentDay)));
- return startDate;
- },
-
- /* Attach the onxxx handlers. These are declared statically so
- * they work with static code transformers like Caja.
- */
- _attachHandlers: function(inst) {
- var stepMonths = this._get(inst, 'stepMonths');
- var id = '#' + inst.id.replace( /\\\\/g, "\\" );
- inst.dpDiv.find('[data-handler]').map(function () {
- var handler = {
- prev: function () {
- window['DP_jQuery_' + dpuuid].datepicker._adjustDate(id, -stepMonths, 'M');
- },
- next: function () {
- window['DP_jQuery_' + dpuuid].datepicker._adjustDate(id, +stepMonths, 'M');
- },
- hide: function () {
- window['DP_jQuery_' + dpuuid].datepicker._hideDatepicker();
- },
- today: function () {
- window['DP_jQuery_' + dpuuid].datepicker._gotoToday(id);
- },
- selectDay: function () {
- window['DP_jQuery_' + dpuuid].datepicker._selectDay(id, +this.getAttribute('data-month'), +this.getAttribute('data-year'), this);
- return false;
- },
- selectMonth: function () {
- window['DP_jQuery_' + dpuuid].datepicker._selectMonthYear(id, this, 'M');
- return false;
- },
- selectYear: function () {
- window['DP_jQuery_' + dpuuid].datepicker._selectMonthYear(id, this, 'Y');
- return false;
- }
- };
- $(this).bind(this.getAttribute('data-event'), handler[this.getAttribute('data-handler')]);
- });
- },
-
- /* Generate the HTML for the current state of the date picker. */
- _generateHTML: function(inst) {
- var today = new Date();
- today = this._daylightSavingAdjust(
- new Date(today.getFullYear(), today.getMonth(), today.getDate())); // clear time
- var isRTL = this._get(inst, 'isRTL');
- var showButtonPanel = this._get(inst, 'showButtonPanel');
- var hideIfNoPrevNext = this._get(inst, 'hideIfNoPrevNext');
- var navigationAsDateFormat = this._get(inst, 'navigationAsDateFormat');
- var numMonths = this._getNumberOfMonths(inst);
- var showCurrentAtPos = this._get(inst, 'showCurrentAtPos');
- var stepMonths = this._get(inst, 'stepMonths');
- var isMultiMonth = (numMonths[0] != 1 || numMonths[1] != 1);
- var currentDate = this._daylightSavingAdjust((!inst.currentDay ? new Date(9999, 9, 9) :
- new Date(inst.currentYear, inst.currentMonth, inst.currentDay)));
- var minDate = this._getMinMaxDate(inst, 'min');
- var maxDate = this._getMinMaxDate(inst, 'max');
- var drawMonth = inst.drawMonth - showCurrentAtPos;
- var drawYear = inst.drawYear;
- if (drawMonth < 0) {
- drawMonth += 12;
- drawYear--;
- }
- if (maxDate) {
- var maxDraw = this._daylightSavingAdjust(new Date(maxDate.getFullYear(),
- maxDate.getMonth() - (numMonths[0] * numMonths[1]) + 1, maxDate.getDate()));
- maxDraw = (minDate && maxDraw < minDate ? minDate : maxDraw);
- while (this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1)) > maxDraw) {
- drawMonth--;
- if (drawMonth < 0) {
- drawMonth = 11;
- drawYear--;
- }
- }
- }
- inst.drawMonth = drawMonth;
- inst.drawYear = drawYear;
- var prevText = this._get(inst, 'prevText');
- prevText = (!navigationAsDateFormat ? prevText : this.formatDate(prevText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepMonths, 1)),
- this._getFormatConfig(inst)));
- var prev = (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ?
- '<a class="ui-datepicker-prev ui-corner-all" data-handler="prev" data-event="click"' +
- ' title="' + prevText + '"><span class="ui-icon ui-icon-circle-triangle-' + ( isRTL ? 'e' : 'w') + '">' + prevText + '</span></a>' :
- (hideIfNoPrevNext ? '' : '<a class="ui-datepicker-prev ui-corner-all ui-state-disabled" title="'+ prevText +'"><span class="ui-icon ui-icon-circle-triangle-' + ( isRTL ? 'e' : 'w') + '">' + prevText + '</span></a>'));
- var nextText = this._get(inst, 'nextText');
- nextText = (!navigationAsDateFormat ? nextText : this.formatDate(nextText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepMonths, 1)),
- this._getFormatConfig(inst)));
- var next = (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
- '<a class="ui-datepicker-next ui-corner-all" data-handler="next" data-event="click"' +
- ' title="' + nextText + '"><span class="ui-icon ui-icon-circle-triangle-' + ( isRTL ? 'w' : 'e') + '">' + nextText + '</span></a>' :
- (hideIfNoPrevNext ? '' : '<a class="ui-datepicker-next ui-corner-all ui-state-disabled" title="'+ nextText + '"><span class="ui-icon ui-icon-circle-triangle-' + ( isRTL ? 'w' : 'e') + '">' + nextText + '</span></a>'));
- var currentText = this._get(inst, 'currentText');
- var gotoDate = (this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today);
- currentText = (!navigationAsDateFormat ? currentText :
- this.formatDate(currentText, gotoDate, this._getFormatConfig(inst)));
- var controls = (!inst.inline ? '<button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all" data-handler="hide" data-event="click">' +
- this._get(inst, 'closeText') + '</button>' : '');
- var buttonPanel = (showButtonPanel) ? '<div class="ui-datepicker-buttonpane ui-widget-content">' + (isRTL ? controls : '') +
- (this._isInRange(inst, gotoDate) ? '<button type="button" class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all" data-handler="today" data-event="click"' +
- '>' + currentText + '</button>' : '') + (isRTL ? '' : controls) + '</div>' : '';
- var firstDay = parseInt(this._get(inst, 'firstDay'),10);
- firstDay = (isNaN(firstDay) ? 0 : firstDay);
- var showWeek = this._get(inst, 'showWeek');
- var dayNames = this._get(inst, 'dayNames');
- var dayNamesShort = this._get(inst, 'dayNamesShort');
- var dayNamesMin = this._get(inst, 'dayNamesMin');
- var monthNames = this._get(inst, 'monthNames');
- var monthNamesShort = this._get(inst, 'monthNamesShort');
- var beforeShowDay = this._get(inst, 'beforeShowDay');
- var showOtherMonths = this._get(inst, 'showOtherMonths');
- var selectOtherMonths = this._get(inst, 'selectOtherMonths');
- var calculateWeek = this._get(inst, 'calculateWeek') || this.iso8601Week;
- var defaultDate = this._getDefaultDate(inst);
- var html = '';
- for (var row = 0; row < numMonths[0]; row++) {
- var group = '';
- this.maxRows = 4;
- for (var col = 0; col < numMonths[1]; col++) {
- var selectedDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, inst.selectedDay));
- var cornerClass = ' ui-corner-all';
- var calender = '';
- if (isMultiMonth) {
- calender += '<div class="ui-datepicker-group';
- if (numMonths[1] > 1)
- switch (col) {
- case 0: calender += ' ui-datepicker-group-first';
- cornerClass = ' ui-corner-' + (isRTL ? 'right' : 'left'); break;
- case numMonths[1]-1: calender += ' ui-datepicker-group-last';
- cornerClass = ' ui-corner-' + (isRTL ? 'left' : 'right'); break;
- default: calender += ' ui-datepicker-group-middle'; cornerClass = ''; break;
- }
- calender += '">';
- }
- calender += '<div class="ui-datepicker-header ui-widget-header ui-helper-clearfix' + cornerClass + '">' +
- (/all|left/.test(cornerClass) && row == 0 ? (isRTL ? next : prev) : '') +
- (/all|right/.test(cornerClass) && row == 0 ? (isRTL ? prev : next) : '') +
- this._generateMonthYearHeader(inst, drawMonth, drawYear, minDate, maxDate,
- row > 0 || col > 0, monthNames, monthNamesShort) + // draw month headers
- '</div><table class="ui-datepicker-calendar"><thead>' +
- '<tr>';
- var thead = (showWeek ? '<th class="ui-datepicker-week-col">' + this._get(inst, 'weekHeader') + '</th>' : '');
- for (var dow = 0; dow < 7; dow++) { // days of the week
- var day = (dow + firstDay) % 7;
- thead += '<th' + ((dow + firstDay + 6) % 7 >= 5 ? ' class="ui-datepicker-week-end"' : '') + '>' +
- '<span title="' + dayNames[day] + '">' + dayNamesMin[day] + '</span></th>';
- }
- calender += thead + '</tr></thead><tbody>';
- var daysInMonth = this._getDaysInMonth(drawYear, drawMonth);
- if (drawYear == inst.selectedYear && drawMonth == inst.selectedMonth)
- inst.selectedDay = Math.min(inst.selectedDay, daysInMonth);
- var leadDays = (this._getFirstDayOfMonth(drawYear, drawMonth) - firstDay + 7) % 7;
- var curRows = Math.ceil((leadDays + daysInMonth) / 7); // calculate the number of rows to generate
- var numRows = (isMultiMonth ? this.maxRows > curRows ? this.maxRows : curRows : curRows); //If multiple months, use the higher number of rows (see #7043)
- this.maxRows = numRows;
- var printDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1 - leadDays));
- for (var dRow = 0; dRow < numRows; dRow++) { // create date picker rows
- calender += '<tr>';
- var tbody = (!showWeek ? '' : '<td class="ui-datepicker-week-col">' +
- this._get(inst, 'calculateWeek')(printDate) + '</td>');
- for (var dow = 0; dow < 7; dow++) { // create date picker days
- var daySettings = (beforeShowDay ?
- beforeShowDay.apply((inst.input ? inst.input[0] : null), [printDate]) : [true, '']);
- var otherMonth = (printDate.getMonth() != drawMonth);
- var unselectable = (otherMonth && !selectOtherMonths) || !daySettings[0] ||
- (minDate && printDate < minDate) || (maxDate && printDate > maxDate);
- tbody += '<td class="' +
- ((dow + firstDay + 6) % 7 >= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
- (otherMonth ? ' ui-datepicker-other-month' : '') + // highlight days from other months
- ((printDate.getTime() == selectedDate.getTime() && drawMonth == inst.selectedMonth && inst._keyEvent) || // user pressed key
- (defaultDate.getTime() == printDate.getTime() && defaultDate.getTime() == selectedDate.getTime()) ?
- // or defaultDate is current printedDate and defaultDate is selectedDate
- ' ' + this._dayOverClass : '') + // highlight selected day
- (unselectable ? ' ' + this._unselectableClass + ' ui-state-disabled': '') + // highlight unselectable days
- (otherMonth && !showOtherMonths ? '' : ' ' + daySettings[1] + // highlight custom dates
- (printDate.getTime() == currentDate.getTime() ? ' ' + this._currentClass : '') + // highlight selected day
- (printDate.getTime() == today.getTime() ? ' ui-datepicker-today' : '')) + '"' + // highlight today (if different)
- ((!otherMonth || showOtherMonths) && daySettings[2] ? ' title="' + daySettings[2] + '"' : '') + // cell title
- (unselectable ? '' : ' data-handler="selectDay" data-event="click" data-month="' + printDate.getMonth() + '" data-year="' + printDate.getFullYear() + '"') + '>' + // actions
- (otherMonth && !showOtherMonths ? ' ' : // display for other months
- (unselectable ? '<span class="ui-state-default">' + printDate.getDate() + '</span>' : '<a class="ui-state-default' +
- (printDate.getTime() == today.getTime() ? ' ui-state-highlight' : '') +
- (printDate.getTime() == currentDate.getTime() ? ' ui-state-active' : '') + // highlight selected day
- (otherMonth ? ' ui-priority-secondary' : '') + // distinguish dates from other months
- '" href="#">' + printDate.getDate() + '</a>')) + '</td>'; // display selectable date
- printDate.setDate(printDate.getDate() + 1);
- printDate = this._daylightSavingAdjust(printDate);
- }
- calender += tbody + '</tr>';
- }
- drawMonth++;
- if (drawMonth > 11) {
- drawMonth = 0;
- drawYear++;
- }
- calender += '</tbody></table>' + (isMultiMonth ? '</div>' +
- ((numMonths[0] > 0 && col == numMonths[1]-1) ? '<div class="ui-datepicker-row-break"></div>' : '') : '');
- group += calender;
- }
- html += group;
- }
- html += buttonPanel + ($.browser.msie && parseInt($.browser.version,10) < 7 && !inst.inline ?
- '<iframe src="javascript:false;" class="ui-datepicker-cover" frameborder="0"></iframe>' : '');
- inst._keyEvent = false;
- return html;
- },
-
- /* Generate the month and year header. */
- _generateMonthYearHeader: function(inst, drawMonth, drawYear, minDate, maxDate,
- secondary, monthNames, monthNamesShort) {
- var changeMonth = this._get(inst, 'changeMonth');
- var changeYear = this._get(inst, 'changeYear');
- var showMonthAfterYear = this._get(inst, 'showMonthAfterYear');
- var html = '<div class="ui-datepicker-title">';
- var monthHtml = '';
- // month selection
- if (secondary || !changeMonth)
- monthHtml += '<span class="ui-datepicker-month">' + monthNames[drawMonth] + '</span>';
- else {
- var inMinYear = (minDate && minDate.getFullYear() == drawYear);
- var inMaxYear = (maxDate && maxDate.getFullYear() == drawYear);
- monthHtml += '<select class="ui-datepicker-month" data-handler="selectMonth" data-event="change">';
- for (var month = 0; month < 12; month++) {
- if ((!inMinYear || month >= minDate.getMonth()) &&
- (!inMaxYear || month <= maxDate.getMonth()))
- monthHtml += '<option value="' + month + '"' +
- (month == drawMonth ? ' selected="selected"' : '') +
- '>' + monthNamesShort[month] + '</option>';
- }
- monthHtml += '</select>';
- }
- if (!showMonthAfterYear)
- html += monthHtml + (secondary || !(changeMonth && changeYear) ? ' ' : '');
- // year selection
- if ( !inst.yearshtml ) {
- inst.yearshtml = '';
- if (secondary || !changeYear)
- html += '<span class="ui-datepicker-year">' + drawYear + '</span>';
- else {
- // determine range of years to display
- var years = this._get(inst, 'yearRange').split(':');
- var thisYear = new Date().getFullYear();
- var determineYear = function(value) {
- var year = (value.match(/c[+-].*/) ? drawYear + parseInt(value.substring(1), 10) :
- (value.match(/[+-].*/) ? thisYear + parseInt(value, 10) :
- parseInt(value, 10)));
- return (isNaN(year) ? thisYear : year);
- };
- var year = determineYear(years[0]);
- var endYear = Math.max(year, determineYear(years[1] || ''));
- year = (minDate ? Math.max(year, minDate.getFullYear()) : year);
- endYear = (maxDate ? Math.min(endYear, maxDate.getFullYear()) : endYear);
- inst.yearshtml += '<select class="ui-datepicker-year" data-handler="selectYear" data-event="change">';
- for (; year <= endYear; year++) {
- inst.yearshtml += '<option value="' + year + '"' +
- (year == drawYear ? ' selected="selected"' : '') +
- '>' + year + '</option>';
- }
- inst.yearshtml += '</select>';
-
- html += inst.yearshtml;
- inst.yearshtml = null;
- }
- }
- html += this._get(inst, 'yearSuffix');
- if (showMonthAfterYear)
- html += (secondary || !(changeMonth && changeYear) ? ' ' : '') + monthHtml;
- html += '</div>'; // Close datepicker_header
- return html;
- },
-
- /* Adjust one of the date sub-fields. */
- _adjustInstDate: function(inst, offset, period) {
- var year = inst.drawYear + (period == 'Y' ? offset : 0);
- var month = inst.drawMonth + (period == 'M' ? offset : 0);
- var day = Math.min(inst.selectedDay, this._getDaysInMonth(year, month)) +
- (period == 'D' ? offset : 0);
- var date = this._restrictMinMax(inst,
- this._daylightSavingAdjust(new Date(year, month, day)));
- inst.selectedDay = date.getDate();
- inst.drawMonth = inst.selectedMonth = date.getMonth();
- inst.drawYear = inst.selectedYear = date.getFullYear();
- if (period == 'M' || period == 'Y')
- this._notifyChange(inst);
- },
-
- /* Ensure a date is within any min/max bounds. */
- _restrictMinMax: function(inst, date) {
- var minDate = this._getMinMaxDate(inst, 'min');
- var maxDate = this._getMinMaxDate(inst, 'max');
- var newDate = (minDate && date < minDate ? minDate : date);
- newDate = (maxDate && newDate > maxDate ? maxDate : newDate);
- return newDate;
- },
-
- /* Notify change of month/year. */
- _notifyChange: function(inst) {
- var onChange = this._get(inst, 'onChangeMonthYear');
- if (onChange)
- onChange.apply((inst.input ? inst.input[0] : null),
- [inst.selectedYear, inst.selectedMonth + 1, inst]);
- },
-
- /* Determine the number of months to show. */
- _getNumberOfMonths: function(inst) {
- var numMonths = this._get(inst, 'numberOfMonths');
- return (numMonths == null ? [1, 1] : (typeof numMonths == 'number' ? [1, numMonths] : numMonths));
- },
-
- /* Determine the current maximum date - ensure no time components are set. */
- _getMinMaxDate: function(inst, minMax) {
- return this._determineDate(inst, this._get(inst, minMax + 'Date'), null);
- },
-
- /* Find the number of days in a given month. */
- _getDaysInMonth: function(year, month) {
- return 32 - this._daylightSavingAdjust(new Date(year, month, 32)).getDate();
- },
-
- /* Find the day of the week of the first of a month. */
- _getFirstDayOfMonth: function(year, month) {
- return new Date(year, month, 1).getDay();
- },
-
- /* Determines if we should allow a "next/prev" month display change. */
- _canAdjustMonth: function(inst, offset, curYear, curMonth) {
- var numMonths = this._getNumberOfMonths(inst);
- var date = this._daylightSavingAdjust(new Date(curYear,
- curMonth + (offset < 0 ? offset : numMonths[0] * numMonths[1]), 1));
- if (offset < 0)
- date.setDate(this._getDaysInMonth(date.getFullYear(), date.getMonth()));
- return this._isInRange(inst, date);
- },
-
- /* Is the given date in the accepted range? */
- _isInRange: function(inst, date) {
- var minDate = this._getMinMaxDate(inst, 'min');
- var maxDate = this._getMinMaxDate(inst, 'max');
- return ((!minDate || date.getTime() >= minDate.getTime()) &&
- (!maxDate || date.getTime() <= maxDate.getTime()));
- },
-
- /* Provide the configuration settings for formatting/parsing. */
- _getFormatConfig: function(inst) {
- var shortYearCutoff = this._get(inst, 'shortYearCutoff');
- shortYearCutoff = (typeof shortYearCutoff != 'string' ? shortYearCutoff :
- new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10));
- return {shortYearCutoff: shortYearCutoff,
- dayNamesShort: this._get(inst, 'dayNamesShort'), dayNames: this._get(inst, 'dayNames'),
- monthNamesShort: this._get(inst, 'monthNamesShort'), monthNames: this._get(inst, 'monthNames')};
- },
-
- /* Format the given date for display. */
- _formatDate: function(inst, day, month, year) {
- if (!day) {
- inst.currentDay = inst.selectedDay;
- inst.currentMonth = inst.selectedMonth;
- inst.currentYear = inst.selectedYear;
- }
- var date = (day ? (typeof day == 'object' ? day :
- this._daylightSavingAdjust(new Date(year, month, day))) :
- this._daylightSavingAdjust(new Date(inst.currentYear, inst.currentMonth, inst.currentDay)));
- return this.formatDate(this._get(inst, 'dateFormat'), date, this._getFormatConfig(inst));
- }
-});
-
-/*
- * Bind hover events for datepicker elements.
- * Done via delegate so the binding only occurs once in the lifetime of the parent div.
- * Global instActive, set by _updateDatepicker allows the handlers to find their way back to the active picker.
- */
-function bindHover(dpDiv) {
- var selector = 'button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a';
- return dpDiv.bind('mouseout', function(event) {
- var elem = $( event.target ).closest( selector );
- if ( !elem.length ) {
- return;
- }
- elem.removeClass( "ui-state-hover ui-datepicker-prev-hover ui-datepicker-next-hover" );
- })
- .bind('mouseover', function(event) {
- var elem = $( event.target ).closest( selector );
- if ($.datepicker._isDisabledDatepicker( instActive.inline ? dpDiv.parent()[0] : instActive.input[0]) ||
- !elem.length ) {
- return;
- }
- elem.parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover');
- elem.addClass('ui-state-hover');
- if (elem.hasClass('ui-datepicker-prev')) elem.addClass('ui-datepicker-prev-hover');
- if (elem.hasClass('ui-datepicker-next')) elem.addClass('ui-datepicker-next-hover');
- });
-}
-
-/* jQuery extend now ignores nulls! */
-function extendRemove(target, props) {
- $.extend(target, props);
- for (var name in props)
- if (props[name] == null || props[name] == undefined)
- target[name] = props[name];
- return target;
-};
-
-/* Determine whether an object is an array. */
-function isArray(a) {
- return (a && (($.browser.safari && typeof a == 'object' && a.length) ||
- (a.constructor && a.constructor.toString().match(/\Array\(\)/))));
-};
-
-/* Invoke the datepicker functionality.
- @param options string - a command, optionally followed by additional parameters or
- Object - settings for attaching new datepicker functionality
- @return jQuery object */
-$.fn.datepicker = function(options){
-
- /* Verify an empty collection wasn't passed - Fixes #6976 */
- if ( !this.length ) {
- return this;
- }
-
- /* Initialise the date picker. */
- if (!$.datepicker.initialized) {
- $(document).mousedown($.datepicker._checkExternalClick).
- find('body').append($.datepicker.dpDiv);
- $.datepicker.initialized = true;
- }
-
- var otherArgs = Array.prototype.slice.call(arguments, 1);
- if (typeof options == 'string' && (options == 'isDisabled' || options == 'getDate' || options == 'widget'))
- return $.datepicker['_' + options + 'Datepicker'].
- apply($.datepicker, [this[0]].concat(otherArgs));
- if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string')
- return $.datepicker['_' + options + 'Datepicker'].
- apply($.datepicker, [this[0]].concat(otherArgs));
- return this.each(function() {
- typeof options == 'string' ?
- $.datepicker['_' + options + 'Datepicker'].
- apply($.datepicker, [this].concat(otherArgs)) :
- $.datepicker._attachDatepicker(this, options);
- });
-};
-
-$.datepicker = new Datepicker(); // singleton instance
-$.datepicker.initialized = false;
-$.datepicker.uuid = new Date().getTime();
-$.datepicker.version = "@VERSION";
-
-// Workaround for #4055
-// Add another global to avoid noConflict issues with inline event handlers
-window['DP_jQuery_' + dpuuid] = $;
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Dialog @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Dialog
- *
- * Depends:
- * jquery.ui.core.js
- * jquery.ui.widget.js
- * jquery.ui.button.js
- * jquery.ui.draggable.js
- * jquery.ui.mouse.js
- * jquery.ui.position.js
- * jquery.ui.resizable.js
- */
-(function( $, undefined ) {
-
-var uiDialogClasses =
- 'ui-dialog ' +
- 'ui-widget ' +
- 'ui-widget-content ' +
- 'ui-corner-all ',
- sizeRelatedOptions = {
- buttons: true,
- height: true,
- maxHeight: true,
- maxWidth: true,
- minHeight: true,
- minWidth: true,
- width: true
- },
- resizableRelatedOptions = {
- maxHeight: true,
- maxWidth: true,
- minHeight: true,
- minWidth: true
- };
-
-$.widget("ui.dialog", {
- options: {
- autoOpen: true,
- buttons: {},
- closeOnEscape: true,
- closeText: 'close',
- dialogClass: '',
- draggable: true,
- hide: null,
- height: 'auto',
- maxHeight: false,
- maxWidth: false,
- minHeight: 150,
- minWidth: 150,
- modal: false,
- position: {
- my: 'center',
- at: 'center',
- collision: 'fit',
- // ensure that the titlebar is never outside the document
- using: function(pos) {
- var topOffset = $(this).css(pos).offset().top;
- if (topOffset < 0) {
- $(this).css('top', pos.top - topOffset);
- }
- }
- },
- resizable: true,
- show: null,
- stack: true,
- title: '',
- width: 300,
- zIndex: 1000
- },
-
- _create: function() {
- this.originalTitle = this.element.attr('title');
- // #5742 - .attr() might return a DOMElement
- if ( typeof this.originalTitle !== "string" ) {
- this.originalTitle = "";
- }
-
- this.options.title = this.options.title || this.originalTitle;
- var self = this,
- options = self.options,
-
- title = options.title || ' ',
- titleId = $.ui.dialog.getTitleId(self.element),
-
- uiDialog = (self.uiDialog = $('<div></div>'))
- .appendTo(document.body)
- .hide()
- .addClass(uiDialogClasses + options.dialogClass)
- .css({
- zIndex: options.zIndex
- })
- // setting tabIndex makes the div focusable
- // setting outline to 0 prevents a border on focus in Mozilla
- .attr('tabIndex', -1).css('outline', 0).keydown(function(event) {
- if (options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
- event.keyCode === $.ui.keyCode.ESCAPE) {
-
- self.close(event);
- event.preventDefault();
- }
- })
- .attr({
- role: 'dialog',
- 'aria-labelledby': titleId
- })
- .mousedown(function(event) {
- self.moveToTop(false, event);
- }),
-
- uiDialogContent = self.element
- .show()
- .removeAttr('title')
- .addClass(
- 'ui-dialog-content ' +
- 'ui-widget-content')
- .appendTo(uiDialog),
-
- uiDialogTitlebar = (self.uiDialogTitlebar = $('<div></div>'))
- .addClass(
- 'ui-dialog-titlebar ' +
- 'ui-widget-header ' +
- 'ui-corner-all ' +
- 'ui-helper-clearfix'
- )
- .prependTo(uiDialog),
-
- uiDialogTitlebarClose = $('<a href="#"></a>')
- .addClass(
- 'ui-dialog-titlebar-close ' +
- 'ui-corner-all'
- )
- .attr('role', 'button')
- .hover(
- function() {
- uiDialogTitlebarClose.addClass('ui-state-hover');
- },
- function() {
- uiDialogTitlebarClose.removeClass('ui-state-hover');
- }
- )
- .focus(function() {
- uiDialogTitlebarClose.addClass('ui-state-focus');
- })
- .blur(function() {
- uiDialogTitlebarClose.removeClass('ui-state-focus');
- })
- .click(function(event) {
- self.close(event);
- return false;
- })
- .appendTo(uiDialogTitlebar),
-
- uiDialogTitlebarCloseText = (self.uiDialogTitlebarCloseText = $('<span></span>'))
- .addClass(
- 'ui-icon ' +
- 'ui-icon-closethick'
- )
- .text(options.closeText)
- .appendTo(uiDialogTitlebarClose),
-
- uiDialogTitle = $('<span></span>')
- .addClass('ui-dialog-title')
- .attr('id', titleId)
- .html(title)
- .prependTo(uiDialogTitlebar);
-
- //handling of deprecated beforeclose (vs beforeClose) option
- //Ticket #4669 http://dev.jqueryui.com/ticket/4669
- //TODO: remove in 1.9pre
- if ($.isFunction(options.beforeclose) && !$.isFunction(options.beforeClose)) {
- options.beforeClose = options.beforeclose;
- }
-
- uiDialogTitlebar.find("*").add(uiDialogTitlebar).disableSelection();
-
- if (options.draggable && $.fn.draggable) {
- self._makeDraggable();
- }
- if (options.resizable && $.fn.resizable) {
- self._makeResizable();
- }
-
- self._createButtons(options.buttons);
- self._isOpen = false;
-
- if ($.fn.bgiframe) {
- uiDialog.bgiframe();
- }
- },
-
- _init: function() {
- if ( this.options.autoOpen ) {
- this.open();
- }
- },
-
- destroy: function() {
- var self = this;
-
- if (self.overlay) {
- self.overlay.destroy();
- }
- self.uiDialog.hide();
- self.element
- .unbind('.dialog')
- .removeData('dialog')
- .removeClass('ui-dialog-content ui-widget-content')
- .hide().appendTo('body');
- self.uiDialog.remove();
-
- if (self.originalTitle) {
- self.element.attr('title', self.originalTitle);
- }
-
- return self;
- },
-
- widget: function() {
- return this.uiDialog;
- },
-
- close: function(event) {
- var self = this,
- maxZ, thisZ;
-
- if (false === self._trigger('beforeClose', event)) {
- return;
- }
-
- if (self.overlay) {
- self.overlay.destroy();
- }
- self.uiDialog.unbind('keypress.ui-dialog');
-
- self._isOpen = false;
-
- if (self.options.hide) {
- self.uiDialog.hide(self.options.hide, function() {
- self._trigger('close', event);
- });
- } else {
- self.uiDialog.hide();
- self._trigger('close', event);
- }
-
- $.ui.dialog.overlay.resize();
-
- // adjust the maxZ to allow other modal dialogs to continue to work (see #4309)
- if (self.options.modal) {
- maxZ = 0;
- $('.ui-dialog').each(function() {
- if (this !== self.uiDialog[0]) {
- thisZ = $(this).css('z-index');
- if(!isNaN(thisZ)) {
- maxZ = Math.max(maxZ, thisZ);
- }
- }
- });
- $.ui.dialog.maxZ = maxZ;
- }
-
- return self;
- },
-
- isOpen: function() {
- return this._isOpen;
- },
-
- // the force parameter allows us to move modal dialogs to their correct
- // position on open
- moveToTop: function(force, event) {
- var self = this,
- options = self.options,
- saveScroll;
-
- if ((options.modal && !force) ||
- (!options.stack && !options.modal)) {
- return self._trigger('focus', event);
- }
-
- if (options.zIndex > $.ui.dialog.maxZ) {
- $.ui.dialog.maxZ = options.zIndex;
- }
- if (self.overlay) {
- $.ui.dialog.maxZ += 1;
- self.overlay.$el.css('z-index', $.ui.dialog.overlay.maxZ = $.ui.dialog.maxZ);
- }
-
- //Save and then restore scroll since Opera 9.5+ resets when parent z-Index is changed.
- // http://ui.jquery.com/bugs/ticket/3193
- saveScroll = { scrollTop: self.element.scrollTop(), scrollLeft: self.element.scrollLeft() };
- $.ui.dialog.maxZ += 1;
- self.uiDialog.css('z-index', $.ui.dialog.maxZ);
- self.element.attr(saveScroll);
- self._trigger('focus', event);
-
- return self;
- },
-
- open: function() {
- if (this._isOpen) { return; }
-
- var self = this,
- options = self.options,
- uiDialog = self.uiDialog;
-
- self.overlay = options.modal ? new $.ui.dialog.overlay(self) : null;
- self._size();
- self._position(options.position);
- uiDialog.show(options.show);
- self.moveToTop(true);
-
- // prevent tabbing out of modal dialogs
- if ( options.modal ) {
- uiDialog.bind( "keydown.ui-dialog", function( event ) {
- if ( event.keyCode !== $.ui.keyCode.TAB ) {
- return;
- }
-
- var tabbables = $(':tabbable', this),
- first = tabbables.filter(':first'),
- last = tabbables.filter(':last');
-
- if (event.target === last[0] && !event.shiftKey) {
- first.focus(1);
- return false;
- } else if (event.target === first[0] && event.shiftKey) {
- last.focus(1);
- return false;
- }
- });
- }
-
- // set focus to the first tabbable element in the content area or the first button
- // if there are no tabbable elements, set focus on the dialog itself
- $(self.element.find(':tabbable').get().concat(
- uiDialog.find('.ui-dialog-buttonpane :tabbable').get().concat(
- uiDialog.get()))).eq(0).focus();
-
- self._isOpen = true;
- self._trigger('open');
-
- return self;
- },
-
- _createButtons: function(buttons) {
- var self = this,
- hasButtons = false,
- uiDialogButtonPane = $('<div></div>')
- .addClass(
- 'ui-dialog-buttonpane ' +
- 'ui-widget-content ' +
- 'ui-helper-clearfix'
- ),
- uiButtonSet = $( "<div></div>" )
- .addClass( "ui-dialog-buttonset" )
- .appendTo( uiDialogButtonPane );
-
- // if we already have a button pane, remove it
- self.uiDialog.find('.ui-dialog-buttonpane').remove();
-
- if (typeof buttons === 'object' && buttons !== null) {
- $.each(buttons, function() {
- return !(hasButtons = true);
- });
- }
- if (hasButtons) {
- $.each(buttons, function(name, props) {
- props = $.isFunction( props ) ?
- { click: props, text: name } :
- props;
- var button = $('<button type="button"></button>')
- .click(function() {
- props.click.apply(self.element[0], arguments);
- })
- .appendTo(uiButtonSet);
- // can't use .attr( props, true ) with jQuery 1.3.2.
- $.each( props, function( key, value ) {
- if ( key === "click" ) {
- return;
- }
- if ( key in button ) {
- button[ key ]( value );
- } else {
- button.attr( key, value );
- }
- });
- if ($.fn.button) {
- button.button();
- }
- });
- uiDialogButtonPane.appendTo(self.uiDialog);
- }
- },
-
- _makeDraggable: function() {
- var self = this,
- options = self.options,
- doc = $(document),
- heightBeforeDrag;
-
- function filteredUi(ui) {
- return {
- position: ui.position,
- offset: ui.offset
- };
- }
-
- self.uiDialog.draggable({
- cancel: '.ui-dialog-content, .ui-dialog-titlebar-close',
- handle: '.ui-dialog-titlebar',
- containment: 'document',
- start: function(event, ui) {
- heightBeforeDrag = options.height === "auto" ? "auto" : $(this).height();
- $(this).height($(this).height()).addClass("ui-dialog-dragging");
- self._trigger('dragStart', event, filteredUi(ui));
- },
- drag: function(event, ui) {
- self._trigger('drag', event, filteredUi(ui));
- },
- stop: function(event, ui) {
- options.position = [ui.position.left - doc.scrollLeft(),
- ui.position.top - doc.scrollTop()];
- $(this).removeClass("ui-dialog-dragging").height(heightBeforeDrag);
- self._trigger('dragStop', event, filteredUi(ui));
- $.ui.dialog.overlay.resize();
- }
- });
- },
-
- _makeResizable: function(handles) {
- handles = (handles === undefined ? this.options.resizable : handles);
- var self = this,
- options = self.options,
- // .ui-resizable has position: relative defined in the stylesheet
- // but dialogs have to use absolute or fixed positioning
- position = self.uiDialog.css('position'),
- resizeHandles = (typeof handles === 'string' ?
- handles :
- 'n,e,s,w,se,sw,ne,nw'
- );
-
- function filteredUi(ui) {
- return {
- originalPosition: ui.originalPosition,
- originalSize: ui.originalSize,
- position: ui.position,
- size: ui.size
- };
- }
-
- self.uiDialog.resizable({
- cancel: '.ui-dialog-content',
- containment: 'document',
- alsoResize: self.element,
- maxWidth: options.maxWidth,
- maxHeight: options.maxHeight,
- minWidth: options.minWidth,
- minHeight: self._minHeight(),
- handles: resizeHandles,
- start: function(event, ui) {
- $(this).addClass("ui-dialog-resizing");
- self._trigger('resizeStart', event, filteredUi(ui));
- },
- resize: function(event, ui) {
- self._trigger('resize', event, filteredUi(ui));
- },
- stop: function(event, ui) {
- $(this).removeClass("ui-dialog-resizing");
- options.height = $(this).height();
- options.width = $(this).width();
- self._trigger('resizeStop', event, filteredUi(ui));
- $.ui.dialog.overlay.resize();
- }
- })
- .css('position', position)
- .find('.ui-resizable-se').addClass('ui-icon ui-icon-grip-diagonal-se');
- },
-
- _minHeight: function() {
- var options = this.options;
-
- if (options.height === 'auto') {
- return options.minHeight;
- } else {
- return Math.min(options.minHeight, options.height);
- }
- },
-
- _position: function(position) {
- var myAt = [],
- offset = [0, 0],
- isVisible;
-
- if (position) {
- // deep extending converts arrays to objects in jQuery <= 1.3.2 :-(
- // if (typeof position == 'string' || $.isArray(position)) {
- // myAt = $.isArray(position) ? position : position.split(' ');
-
- if (typeof position === 'string' || (typeof position === 'object' && '0' in position)) {
- myAt = position.split ? position.split(' ') : [position[0], position[1]];
- if (myAt.length === 1) {
- myAt[1] = myAt[0];
- }
-
- $.each(['left', 'top'], function(i, offsetPosition) {
- if (+myAt[i] === myAt[i]) {
- offset[i] = myAt[i];
- myAt[i] = offsetPosition;
- }
- });
-
- position = {
- my: myAt.join(" "),
- at: myAt.join(" "),
- offset: offset.join(" ")
- };
- }
-
- position = $.extend({}, $.ui.dialog.prototype.options.position, position);
- } else {
- position = $.ui.dialog.prototype.options.position;
- }
-
- // need to show the dialog to get the actual offset in the position plugin
- isVisible = this.uiDialog.is(':visible');
- if (!isVisible) {
- this.uiDialog.show();
- }
- this.uiDialog
- // workaround for jQuery bug #5781 http://dev.jquery.com/ticket/5781
- .css({ top: 0, left: 0 })
- .position($.extend({ of: window }, position));
- if (!isVisible) {
- this.uiDialog.hide();
- }
- },
-
- _setOptions: function( options ) {
- var self = this,
- resizableOptions = {},
- resize = false;
-
- $.each( options, function( key, value ) {
- self._setOption( key, value );
-
- if ( key in sizeRelatedOptions ) {
- resize = true;
- }
- if ( key in resizableRelatedOptions ) {
- resizableOptions[ key ] = value;
- }
- });
-
- if ( resize ) {
- this._size();
- }
- if ( this.uiDialog.is( ":data(resizable)" ) ) {
- this.uiDialog.resizable( "option", resizableOptions );
- }
- },
-
- _setOption: function(key, value){
- var self = this,
- uiDialog = self.uiDialog;
-
- switch (key) {
- //handling of deprecated beforeclose (vs beforeClose) option
- //Ticket #4669 http://dev.jqueryui.com/ticket/4669
- //TODO: remove in 1.9pre
- case "beforeclose":
- key = "beforeClose";
- break;
- case "buttons":
- self._createButtons(value);
- break;
- case "closeText":
- // ensure that we always pass a string
- self.uiDialogTitlebarCloseText.text("" + value);
- break;
- case "dialogClass":
- uiDialog
- .removeClass(self.options.dialogClass)
- .addClass(uiDialogClasses + value);
- break;
- case "disabled":
- if (value) {
- uiDialog.addClass('ui-dialog-disabled');
- } else {
- uiDialog.removeClass('ui-dialog-disabled');
- }
- break;
- case "draggable":
- var isDraggable = uiDialog.is( ":data(draggable)" );
- if ( isDraggable && !value ) {
- uiDialog.draggable( "destroy" );
- }
-
- if ( !isDraggable && value ) {
- self._makeDraggable();
- }
- break;
- case "position":
- self._position(value);
- break;
- case "resizable":
- // currently resizable, becoming non-resizable
- var isResizable = uiDialog.is( ":data(resizable)" );
- if (isResizable && !value) {
- uiDialog.resizable('destroy');
- }
-
- // currently resizable, changing handles
- if (isResizable && typeof value === 'string') {
- uiDialog.resizable('option', 'handles', value);
- }
-
- // currently non-resizable, becoming resizable
- if (!isResizable && value !== false) {
- self._makeResizable(value);
- }
- break;
- case "title":
- // convert whatever was passed in o a string, for html() to not throw up
- $(".ui-dialog-title", self.uiDialogTitlebar).html("" + (value || ' '));
- break;
- }
-
- $.Widget.prototype._setOption.apply(self, arguments);
- },
-
- _size: function() {
- /* If the user has resized the dialog, the .ui-dialog and .ui-dialog-content
- * divs will both have width and height set, so we need to reset them
- */
- var options = this.options,
- nonContentHeight,
- minContentHeight,
- isVisible = this.uiDialog.is( ":visible" );
-
- // reset content sizing
- this.element.show().css({
- width: 'auto',
- minHeight: 0,
- height: 0
- });
-
- if (options.minWidth > options.width) {
- options.width = options.minWidth;
- }
-
- // reset wrapper sizing
- // determine the height of all the non-content elements
- nonContentHeight = this.uiDialog.css({
- height: 'auto',
- width: options.width
- })
- .height();
- minContentHeight = Math.max( 0, options.minHeight - nonContentHeight );
-
- if ( options.height === "auto" ) {
- // only needed for IE6 support
- if ( $.support.minHeight ) {
- this.element.css({
- minHeight: minContentHeight,
- height: "auto"
- });
- } else {
- this.uiDialog.show();
- var autoHeight = this.element.css( "height", "auto" ).height();
- if ( !isVisible ) {
- this.uiDialog.hide();
- }
- this.element.height( Math.max( autoHeight, minContentHeight ) );
- }
- } else {
- this.element.height( Math.max( options.height - nonContentHeight, 0 ) );
- }
-
- if (this.uiDialog.is(':data(resizable)')) {
- this.uiDialog.resizable('option', 'minHeight', this._minHeight());
- }
- }
-});
-
-$.extend($.ui.dialog, {
- version: "@VERSION",
-
- uuid: 0,
- maxZ: 0,
-
- getTitleId: function($el) {
- var id = $el.attr('id');
- if (!id) {
- this.uuid += 1;
- id = this.uuid;
- }
- return 'ui-dialog-title-' + id;
- },
-
- overlay: function(dialog) {
- this.$el = $.ui.dialog.overlay.create(dialog);
- }
-});
-
-$.extend($.ui.dialog.overlay, {
- instances: [],
- // reuse old instances due to IE memory leak with alpha transparency (see #5185)
- oldInstances: [],
- maxZ: 0,
- events: $.map('focus,mousedown,mouseup,keydown,keypress,click'.split(','),
- function(event) { return event + '.dialog-overlay'; }).join(' '),
- create: function(dialog) {
- if (this.instances.length === 0) {
- // prevent use of anchors and inputs
- // we use a setTimeout in case the overlay is created from an
- // event that we're going to be cancelling (see #2804)
- setTimeout(function() {
- // handle $(el).dialog().dialog('close') (see #4065)
- if ($.ui.dialog.overlay.instances.length) {
- $(document).bind($.ui.dialog.overlay.events, function(event) {
- // stop events if the z-index of the target is < the z-index of the overlay
- // we cannot return true when we don't want to cancel the event (#3523)
- if ($(event.target).zIndex() < $.ui.dialog.overlay.maxZ) {
- return false;
- }
- });
- }
- }, 1);
-
- // allow closing by pressing the escape key
- $(document).bind('keydown.dialog-overlay', function(event) {
- if (dialog.options.closeOnEscape && !event.isDefaultPrevented() && event.keyCode &&
- event.keyCode === $.ui.keyCode.ESCAPE) {
-
- dialog.close(event);
- event.preventDefault();
- }
- });
-
- // handle window resize
- $(window).bind('resize.dialog-overlay', $.ui.dialog.overlay.resize);
- }
-
- var $el = (this.oldInstances.pop() || $('<div></div>').addClass('ui-widget-overlay'))
- .appendTo(document.body)
- .css({
- width: this.width(),
- height: this.height()
- });
-
- if ($.fn.bgiframe) {
- $el.bgiframe();
- }
-
- this.instances.push($el);
- return $el;
- },
-
- destroy: function($el) {
- var indexOf = $.inArray($el, this.instances);
- if (indexOf != -1){
- this.oldInstances.push(this.instances.splice(indexOf, 1)[0]);
- }
-
- if (this.instances.length === 0) {
- $([document, window]).unbind('.dialog-overlay');
- }
-
- $el.remove();
-
- // adjust the maxZ to allow other modal dialogs to continue to work (see #4309)
- var maxZ = 0;
- $.each(this.instances, function() {
- maxZ = Math.max(maxZ, this.css('z-index'));
- });
- this.maxZ = maxZ;
- },
-
- height: function() {
- var scrollHeight,
- offsetHeight;
- // handle IE 6
- if ($.browser.msie && $.browser.version < 7) {
- scrollHeight = Math.max(
- document.documentElement.scrollHeight,
- document.body.scrollHeight
- );
- offsetHeight = Math.max(
- document.documentElement.offsetHeight,
- document.body.offsetHeight
- );
-
- if (scrollHeight < offsetHeight) {
- return $(window).height() + 'px';
- } else {
- return scrollHeight + 'px';
- }
- // handle "good" browsers
- } else {
- return $(document).height() + 'px';
- }
- },
-
- width: function() {
- var scrollWidth,
- offsetWidth;
- // handle IE
- if ( $.browser.msie ) {
- scrollWidth = Math.max(
- document.documentElement.scrollWidth,
- document.body.scrollWidth
- );
- offsetWidth = Math.max(
- document.documentElement.offsetWidth,
- document.body.offsetWidth
- );
-
- if (scrollWidth < offsetWidth) {
- return $(window).width() + 'px';
- } else {
- return scrollWidth + 'px';
- }
- // handle "good" browsers
- } else {
- return $(document).width() + 'px';
- }
- },
-
- resize: function() {
- /* If the dialog is draggable and the user drags it past the
- * right edge of the window, the document becomes wider so we
- * need to stretch the overlay. If the user then drags the
- * dialog back to the left, the document will become narrower,
- * so we need to shrink the overlay to the appropriate size.
- * This is handled by shrinking the overlay before setting it
- * to the full document size.
- */
- var $overlays = $([]);
- $.each($.ui.dialog.overlay.instances, function() {
- $overlays = $overlays.add(this);
- });
-
- $overlays.css({
- width: 0,
- height: 0
- }).css({
- width: $.ui.dialog.overlay.width(),
- height: $.ui.dialog.overlay.height()
- });
- }
-});
-
-$.extend($.ui.dialog.overlay.prototype, {
- destroy: function() {
- $.ui.dialog.overlay.destroy(this.$el);
- }
-});
-
-}(jQuery));
+++ /dev/null
-/*!
- * jQuery UI Draggable @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Draggables
- *
- * Depends:
- * jquery.ui.core.js
- * jquery.ui.mouse.js
- * jquery.ui.widget.js
- */
-(function( $, undefined ) {
-
-$.widget("ui.draggable", $.ui.mouse, {
- widgetEventPrefix: "drag",
- options: {
- addClasses: true,
- appendTo: "parent",
- axis: false,
- connectToSortable: false,
- containment: false,
- cursor: "auto",
- cursorAt: false,
- grid: false,
- handle: false,
- helper: "original",
- iframeFix: false,
- opacity: false,
- refreshPositions: false,
- revert: false,
- revertDuration: 500,
- scope: "default",
- scroll: true,
- scrollSensitivity: 20,
- scrollSpeed: 20,
- snap: false,
- snapMode: "both",
- snapTolerance: 20,
- stack: false,
- zIndex: false
- },
- _create: function() {
-
- if (this.options.helper == 'original' && !(/^(?:r|a|f)/).test(this.element.css("position")))
- this.element[0].style.position = 'relative';
-
- (this.options.addClasses && this.element.addClass("ui-draggable"));
- (this.options.disabled && this.element.addClass("ui-draggable-disabled"));
-
- this._mouseInit();
-
- },
-
- destroy: function() {
- if(!this.element.data('draggable')) return;
- this.element
- .removeData("draggable")
- .unbind(".draggable")
- .removeClass("ui-draggable"
- + " ui-draggable-dragging"
- + " ui-draggable-disabled");
- this._mouseDestroy();
-
- return this;
- },
-
- _mouseCapture: function(event) {
-
- var o = this.options;
-
- // among others, prevent a drag on a resizable-handle
- if (this.helper || o.disabled || $(event.target).is('.ui-resizable-handle'))
- return false;
-
- //Quit if we're not on a valid handle
- this.handle = this._getHandle(event);
- if (!this.handle)
- return false;
-
- if ( o.iframeFix ) {
- $(o.iframeFix === true ? "iframe" : o.iframeFix).each(function() {
- $('<div class="ui-draggable-iframeFix" style="background: #fff;"></div>')
- .css({
- width: this.offsetWidth+"px", height: this.offsetHeight+"px",
- position: "absolute", opacity: "0.001", zIndex: 1000
- })
- .css($(this).offset())
- .appendTo("body");
- });
- }
-
- return true;
-
- },
-
- _mouseStart: function(event) {
-
- var o = this.options;
-
- //Create and append the visible helper
- this.helper = this._createHelper(event);
-
- this.helper.addClass("ui-draggable-dragging");
-
- //Cache the helper size
- this._cacheHelperProportions();
-
- //If ddmanager is used for droppables, set the global draggable
- if($.ui.ddmanager)
- $.ui.ddmanager.current = this;
-
- /*
- * - Position generation -
- * This block generates everything position related - it's the core of draggables.
- */
-
- //Cache the margins of the original element
- this._cacheMargins();
-
- //Store the helper's css position
- this.cssPosition = this.helper.css("position");
- this.scrollParent = this.helper.scrollParent();
-
- //The element's absolute position on the page minus margins
- this.offset = this.positionAbs = this.element.offset();
- this.offset = {
- top: this.offset.top - this.margins.top,
- left: this.offset.left - this.margins.left
- };
-
- $.extend(this.offset, {
- click: { //Where the click happened, relative to the element
- left: event.pageX - this.offset.left,
- top: event.pageY - this.offset.top
- },
- parent: this._getParentOffset(),
- relative: this._getRelativeOffset() //This is a relative to absolute position minus the actual position calculation - only used for relative positioned helper
- });
-
- //Generate the original position
- this.originalPosition = this.position = this._generatePosition(event);
- this.originalPageX = event.pageX;
- this.originalPageY = event.pageY;
-
- //Adjust the mouse offset relative to the helper if 'cursorAt' is supplied
- (o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt));
-
- //Set a containment if given in the options
- if(o.containment)
- this._setContainment();
-
- //Trigger event + callbacks
- if(this._trigger("start", event) === false) {
- this._clear();
- return false;
- }
-
- //Recache the helper size
- this._cacheHelperProportions();
-
- //Prepare the droppable offsets
- if ($.ui.ddmanager && !o.dropBehaviour)
- $.ui.ddmanager.prepareOffsets(this, event);
-
-
- this._mouseDrag(event, true); //Execute the drag once - this causes the helper not to be visible before getting its correct position
-
- //If the ddmanager is used for droppables, inform the manager that dragging has started (see #5003)
- if ( $.ui.ddmanager ) $.ui.ddmanager.dragStart(this, event);
-
- return true;
- },
-
- _mouseDrag: function(event, noPropagation) {
-
- //Compute the helpers position
- this.position = this._generatePosition(event);
- this.positionAbs = this._convertPositionTo("absolute");
-
- //Call plugins and callbacks and use the resulting position if something is returned
- if (!noPropagation) {
- var ui = this._uiHash();
- if(this._trigger('drag', event, ui) === false) {
- this._mouseUp({});
- return false;
- }
- this.position = ui.position;
- }
-
- if(!this.options.axis || this.options.axis != "y") this.helper[0].style.left = this.position.left+'px';
- if(!this.options.axis || this.options.axis != "x") this.helper[0].style.top = this.position.top+'px';
- if($.ui.ddmanager) $.ui.ddmanager.drag(this, event);
-
- return false;
- },
-
- _mouseStop: function(event) {
-
- //If we are using droppables, inform the manager about the drop
- var dropped = false;
- if ($.ui.ddmanager && !this.options.dropBehaviour)
- dropped = $.ui.ddmanager.drop(this, event);
-
- //if a drop comes from outside (a sortable)
- if(this.dropped) {
- dropped = this.dropped;
- this.dropped = false;
- }
-
- //if the original element is no longer in the DOM don't bother to continue (see #8269)
- var element = this.element[0], elementInDom = false;
- while ( element && (element = element.parentNode) ) {
- if (element == document ) {
- elementInDom = true;
- }
- }
- if ( !elementInDom && this.options.helper === "original" )
- return false;
-
- if((this.options.revert == "invalid" && !dropped) || (this.options.revert == "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) {
- var self = this;
- $(this.helper).animate(this.originalPosition, parseInt(this.options.revertDuration, 10), function() {
- if(self._trigger("stop", event) !== false) {
- self._clear();
- }
- });
- } else {
- if(this._trigger("stop", event) !== false) {
- this._clear();
- }
- }
-
- return false;
- },
-
- _mouseUp: function(event) {
- //Remove frame helpers
- $("div.ui-draggable-iframeFix").each(function() {
- this.parentNode.removeChild(this);
- });
-
- //If the ddmanager is used for droppables, inform the manager that dragging has stopped (see #5003)
- if( $.ui.ddmanager ) $.ui.ddmanager.dragStop(this, event);
-
- return $.ui.mouse.prototype._mouseUp.call(this, event);
- },
-
- cancel: function() {
-
- if(this.helper.is(".ui-draggable-dragging")) {
- this._mouseUp({});
- } else {
- this._clear();
- }
-
- return this;
-
- },
-
- _getHandle: function(event) {
-
- var handle = !this.options.handle || !$(this.options.handle, this.element).length ? true : false;
- $(this.options.handle, this.element)
- .find("*")
- .andSelf()
- .each(function() {
- if(this == event.target) handle = true;
- });
-
- return handle;
-
- },
-
- _createHelper: function(event) {
-
- var o = this.options;
- var helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event])) : (o.helper == 'clone' ? this.element.clone().removeAttr('id') : this.element);
-
- if(!helper.parents('body').length)
- helper.appendTo((o.appendTo == 'parent' ? this.element[0].parentNode : o.appendTo));
-
- if(helper[0] != this.element[0] && !(/(fixed|absolute)/).test(helper.css("position")))
- helper.css("position", "absolute");
-
- return helper;
-
- },
-
- _adjustOffsetFromHelper: function(obj) {
- if (typeof obj == 'string') {
- obj = obj.split(' ');
- }
- if ($.isArray(obj)) {
- obj = {left: +obj[0], top: +obj[1] || 0};
- }
- if ('left' in obj) {
- this.offset.click.left = obj.left + this.margins.left;
- }
- if ('right' in obj) {
- this.offset.click.left = this.helperProportions.width - obj.right + this.margins.left;
- }
- if ('top' in obj) {
- this.offset.click.top = obj.top + this.margins.top;
- }
- if ('bottom' in obj) {
- this.offset.click.top = this.helperProportions.height - obj.bottom + this.margins.top;
- }
- },
-
- _getParentOffset: function() {
-
- //Get the offsetParent and cache its position
- this.offsetParent = this.helper.offsetParent();
- var po = this.offsetParent.offset();
-
- // This is a special case where we need to modify a offset calculated on start, since the following happened:
- // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent
- // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that
- // the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag
- if(this.cssPosition == 'absolute' && this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) {
- po.left += this.scrollParent.scrollLeft();
- po.top += this.scrollParent.scrollTop();
- }
-
- if((this.offsetParent[0] == document.body) //This needs to be actually done for all browsers, since pageX/pageY includes this information
- || (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() == 'html' && $.browser.msie)) //Ugly IE fix
- po = { top: 0, left: 0 };
-
- return {
- top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0),
- left: po.left + (parseInt(this.offsetParent.css("borderLeftWidth"),10) || 0)
- };
-
- },
-
- _getRelativeOffset: function() {
-
- if(this.cssPosition == "relative") {
- var p = this.element.position();
- return {
- top: p.top - (parseInt(this.helper.css("top"),10) || 0) + this.scrollParent.scrollTop(),
- left: p.left - (parseInt(this.helper.css("left"),10) || 0) + this.scrollParent.scrollLeft()
- };
- } else {
- return { top: 0, left: 0 };
- }
-
- },
-
- _cacheMargins: function() {
- this.margins = {
- left: (parseInt(this.element.css("marginLeft"),10) || 0),
- top: (parseInt(this.element.css("marginTop"),10) || 0),
- right: (parseInt(this.element.css("marginRight"),10) || 0),
- bottom: (parseInt(this.element.css("marginBottom"),10) || 0)
- };
- },
-
- _cacheHelperProportions: function() {
- this.helperProportions = {
- width: this.helper.outerWidth(),
- height: this.helper.outerHeight()
- };
- },
-
- _setContainment: function() {
-
- var o = this.options;
- if(o.containment == 'parent') o.containment = this.helper[0].parentNode;
- if(o.containment == 'document' || o.containment == 'window') this.containment = [
- o.containment == 'document' ? 0 : $(window).scrollLeft() - this.offset.relative.left - this.offset.parent.left,
- o.containment == 'document' ? 0 : $(window).scrollTop() - this.offset.relative.top - this.offset.parent.top,
- (o.containment == 'document' ? 0 : $(window).scrollLeft()) + $(o.containment == 'document' ? document : window).width() - this.helperProportions.width - this.margins.left,
- (o.containment == 'document' ? 0 : $(window).scrollTop()) + ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top
- ];
-
- if(!(/^(document|window|parent)$/).test(o.containment) && o.containment.constructor != Array) {
- var c = $(o.containment);
- var ce = c[0]; if(!ce) return;
- var co = c.offset();
- var over = ($(ce).css("overflow") != 'hidden');
-
- this.containment = [
- (parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0),
- (parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0),
- (over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderLeftWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left - this.margins.right,
- (over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderTopWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top - this.margins.bottom
- ];
- this.relative_container = c;
-
- } else if(o.containment.constructor == Array) {
- this.containment = o.containment;
- }
-
- },
-
- _convertPositionTo: function(d, pos) {
-
- if(!pos) pos = this.position;
- var mod = d == "absolute" ? 1 : -1;
- var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName);
-
- return {
- top: (
- pos.top // The absolute mouse position
- + this.offset.relative.top * mod // Only for relative positioned nodes: Relative offset from element to offset parent
- + this.offset.parent.top * mod // The offsetParent's offset without borders (offset + border)
- - ($.browser.safari && $.browser.version < 526 && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod)
- ),
- left: (
- pos.left // The absolute mouse position
- + this.offset.relative.left * mod // Only for relative positioned nodes: Relative offset from element to offset parent
- + this.offset.parent.left * mod // The offsetParent's offset without borders (offset + border)
- - ($.browser.safari && $.browser.version < 526 && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod)
- )
- };
-
- },
-
- _generatePosition: function(event) {
-
- var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName);
- var pageX = event.pageX;
- var pageY = event.pageY;
-
- /*
- * - Position constraining -
- * Constrain the position to a mix of grid, containment.
- */
-
- if(this.originalPosition) { //If we are not dragging yet, we won't check for options
- var containment;
- if(this.containment) {
- if (this.relative_container){
- var co = this.relative_container.offset();
- containment = [ this.containment[0] + co.left,
- this.containment[1] + co.top,
- this.containment[2] + co.left,
- this.containment[3] + co.top ];
- }
- else {
- containment = this.containment;
- }
-
- if(event.pageX - this.offset.click.left < containment[0]) pageX = containment[0] + this.offset.click.left;
- if(event.pageY - this.offset.click.top < containment[1]) pageY = containment[1] + this.offset.click.top;
- if(event.pageX - this.offset.click.left > containment[2]) pageX = containment[2] + this.offset.click.left;
- if(event.pageY - this.offset.click.top > containment[3]) pageY = containment[3] + this.offset.click.top;
- }
-
- if(o.grid) {
- //Check for grid elements set to 0 to prevent divide by 0 error causing invalid argument errors in IE (see ticket #6950)
- var top = o.grid[1] ? this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1] : this.originalPageY;
- pageY = containment ? (!(top - this.offset.click.top < containment[1] || top - this.offset.click.top > containment[3]) ? top : (!(top - this.offset.click.top < containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top;
-
- var left = o.grid[0] ? this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0] : this.originalPageX;
- pageX = containment ? (!(left - this.offset.click.left < containment[0] || left - this.offset.click.left > containment[2]) ? left : (!(left - this.offset.click.left < containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left;
- }
-
- }
-
- return {
- top: (
- pageY // The absolute mouse position
- - this.offset.click.top // Click offset (relative to the element)
- - this.offset.relative.top // Only for relative positioned nodes: Relative offset from element to offset parent
- - this.offset.parent.top // The offsetParent's offset without borders (offset + border)
- + ($.browser.safari && $.browser.version < 526 && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ))
- ),
- left: (
- pageX // The absolute mouse position
- - this.offset.click.left // Click offset (relative to the element)
- - this.offset.relative.left // Only for relative positioned nodes: Relative offset from element to offset parent
- - this.offset.parent.left // The offsetParent's offset without borders (offset + border)
- + ($.browser.safari && $.browser.version < 526 && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ))
- )
- };
-
- },
-
- _clear: function() {
- this.helper.removeClass("ui-draggable-dragging");
- if(this.helper[0] != this.element[0] && !this.cancelHelperRemoval) this.helper.remove();
- //if($.ui.ddmanager) $.ui.ddmanager.current = null;
- this.helper = null;
- this.cancelHelperRemoval = false;
- },
-
- // From now on bulk stuff - mainly helpers
-
- _trigger: function(type, event, ui) {
- ui = ui || this._uiHash();
- $.ui.plugin.call(this, type, [event, ui]);
- if(type == "drag") this.positionAbs = this._convertPositionTo("absolute"); //The absolute position has to be recalculated after plugins
- return $.Widget.prototype._trigger.call(this, type, event, ui);
- },
-
- plugins: {},
-
- _uiHash: function(event) {
- return {
- helper: this.helper,
- position: this.position,
- originalPosition: this.originalPosition,
- offset: this.positionAbs
- };
- }
-
-});
-
-$.extend($.ui.draggable, {
- version: "@VERSION"
-});
-
-$.ui.plugin.add("draggable", "connectToSortable", {
- start: function(event, ui) {
-
- var inst = $(this).data("draggable"), o = inst.options,
- uiSortable = $.extend({}, ui, { item: inst.element });
- inst.sortables = [];
- $(o.connectToSortable).each(function() {
- var sortable = $.data(this, 'sortable');
- if (sortable && !sortable.options.disabled) {
- inst.sortables.push({
- instance: sortable,
- shouldRevert: sortable.options.revert
- });
- sortable.refreshPositions(); // Call the sortable's refreshPositions at drag start to refresh the containerCache since the sortable container cache is used in drag and needs to be up to date (this will ensure it's initialised as well as being kept in step with any changes that might have happened on the page).
- sortable._trigger("activate", event, uiSortable);
- }
- });
-
- },
- stop: function(event, ui) {
-
- //If we are still over the sortable, we fake the stop event of the sortable, but also remove helper
- var inst = $(this).data("draggable"),
- uiSortable = $.extend({}, ui, { item: inst.element });
-
- $.each(inst.sortables, function() {
- if(this.instance.isOver) {
-
- this.instance.isOver = 0;
-
- inst.cancelHelperRemoval = true; //Don't remove the helper in the draggable instance
- this.instance.cancelHelperRemoval = false; //Remove it in the sortable instance (so sortable plugins like revert still work)
-
- //The sortable revert is supported, and we have to set a temporary dropped variable on the draggable to support revert: 'valid/invalid'
- if(this.shouldRevert) this.instance.options.revert = true;
-
- //Trigger the stop of the sortable
- this.instance._mouseStop(event);
-
- this.instance.options.helper = this.instance.options._helper;
-
- //If the helper has been the original item, restore properties in the sortable
- if(inst.options.helper == 'original')
- this.instance.currentItem.css({ top: 'auto', left: 'auto' });
-
- } else {
- this.instance.cancelHelperRemoval = false; //Remove the helper in the sortable instance
- this.instance._trigger("deactivate", event, uiSortable);
- }
-
- });
-
- },
- drag: function(event, ui) {
-
- var inst = $(this).data("draggable"), self = this;
-
- var checkPos = function(o) {
- var dyClick = this.offset.click.top, dxClick = this.offset.click.left;
- var helperTop = this.positionAbs.top, helperLeft = this.positionAbs.left;
- var itemHeight = o.height, itemWidth = o.width;
- var itemTop = o.top, itemLeft = o.left;
-
- return $.ui.isOver(helperTop + dyClick, helperLeft + dxClick, itemTop, itemLeft, itemHeight, itemWidth);
- };
-
- $.each(inst.sortables, function(i) {
-
- //Copy over some variables to allow calling the sortable's native _intersectsWith
- this.instance.positionAbs = inst.positionAbs;
- this.instance.helperProportions = inst.helperProportions;
- this.instance.offset.click = inst.offset.click;
-
- if(this.instance._intersectsWith(this.instance.containerCache)) {
-
- //If it intersects, we use a little isOver variable and set it once, so our move-in stuff gets fired only once
- if(!this.instance.isOver) {
-
- this.instance.isOver = 1;
- //Now we fake the start of dragging for the sortable instance,
- //by cloning the list group item, appending it to the sortable and using it as inst.currentItem
- //We can then fire the start event of the sortable with our passed browser event, and our own helper (so it doesn't create a new one)
- this.instance.currentItem = $(self).clone().removeAttr('id').appendTo(this.instance.element).data("sortable-item", true);
- this.instance.options._helper = this.instance.options.helper; //Store helper option to later restore it
- this.instance.options.helper = function() { return ui.helper[0]; };
-
- event.target = this.instance.currentItem[0];
- this.instance._mouseCapture(event, true);
- this.instance._mouseStart(event, true, true);
-
- //Because the browser event is way off the new appended portlet, we modify a couple of variables to reflect the changes
- this.instance.offset.click.top = inst.offset.click.top;
- this.instance.offset.click.left = inst.offset.click.left;
- this.instance.offset.parent.left -= inst.offset.parent.left - this.instance.offset.parent.left;
- this.instance.offset.parent.top -= inst.offset.parent.top - this.instance.offset.parent.top;
-
- inst._trigger("toSortable", event);
- inst.dropped = this.instance.element; //draggable revert needs that
- //hack so receive/update callbacks work (mostly)
- inst.currentItem = inst.element;
- this.instance.fromOutside = inst;
-
- }
-
- //Provided we did all the previous steps, we can fire the drag event of the sortable on every draggable drag, when it intersects with the sortable
- if(this.instance.currentItem) this.instance._mouseDrag(event);
-
- } else {
-
- //If it doesn't intersect with the sortable, and it intersected before,
- //we fake the drag stop of the sortable, but make sure it doesn't remove the helper by using cancelHelperRemoval
- if(this.instance.isOver) {
-
- this.instance.isOver = 0;
- this.instance.cancelHelperRemoval = true;
-
- //Prevent reverting on this forced stop
- this.instance.options.revert = false;
-
- // The out event needs to be triggered independently
- this.instance._trigger('out', event, this.instance._uiHash(this.instance));
-
- this.instance._mouseStop(event, true);
- this.instance.options.helper = this.instance.options._helper;
-
- //Now we remove our currentItem, the list group clone again, and the placeholder, and animate the helper back to it's original size
- this.instance.currentItem.remove();
- if(this.instance.placeholder) this.instance.placeholder.remove();
-
- inst._trigger("fromSortable", event);
- inst.dropped = false; //draggable revert needs that
- }
-
- };
-
- });
-
- }
-});
-
-$.ui.plugin.add("draggable", "cursor", {
- start: function(event, ui) {
- var t = $('body'), o = $(this).data('draggable').options;
- if (t.css("cursor")) o._cursor = t.css("cursor");
- t.css("cursor", o.cursor);
- },
- stop: function(event, ui) {
- var o = $(this).data('draggable').options;
- if (o._cursor) $('body').css("cursor", o._cursor);
- }
-});
-
-$.ui.plugin.add("draggable", "opacity", {
- start: function(event, ui) {
- var t = $(ui.helper), o = $(this).data('draggable').options;
- if(t.css("opacity")) o._opacity = t.css("opacity");
- t.css('opacity', o.opacity);
- },
- stop: function(event, ui) {
- var o = $(this).data('draggable').options;
- if(o._opacity) $(ui.helper).css('opacity', o._opacity);
- }
-});
-
-$.ui.plugin.add("draggable", "scroll", {
- start: function(event, ui) {
- var i = $(this).data("draggable");
- if(i.scrollParent[0] != document && i.scrollParent[0].tagName != 'HTML') i.overflowOffset = i.scrollParent.offset();
- },
- drag: function(event, ui) {
-
- var i = $(this).data("draggable"), o = i.options, scrolled = false;
-
- if(i.scrollParent[0] != document && i.scrollParent[0].tagName != 'HTML') {
-
- if(!o.axis || o.axis != 'x') {
- if((i.overflowOffset.top + i.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity)
- i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop + o.scrollSpeed;
- else if(event.pageY - i.overflowOffset.top < o.scrollSensitivity)
- i.scrollParent[0].scrollTop = scrolled = i.scrollParent[0].scrollTop - o.scrollSpeed;
- }
-
- if(!o.axis || o.axis != 'y') {
- if((i.overflowOffset.left + i.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity)
- i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft + o.scrollSpeed;
- else if(event.pageX - i.overflowOffset.left < o.scrollSensitivity)
- i.scrollParent[0].scrollLeft = scrolled = i.scrollParent[0].scrollLeft - o.scrollSpeed;
- }
-
- } else {
-
- if(!o.axis || o.axis != 'x') {
- if(event.pageY - $(document).scrollTop() < o.scrollSensitivity)
- scrolled = $(document).scrollTop($(document).scrollTop() - o.scrollSpeed);
- else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity)
- scrolled = $(document).scrollTop($(document).scrollTop() + o.scrollSpeed);
- }
-
- if(!o.axis || o.axis != 'y') {
- if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity)
- scrolled = $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed);
- else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity)
- scrolled = $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed);
- }
-
- }
-
- if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour)
- $.ui.ddmanager.prepareOffsets(i, event);
-
- }
-});
-
-$.ui.plugin.add("draggable", "snap", {
- start: function(event, ui) {
-
- var i = $(this).data("draggable"), o = i.options;
- i.snapElements = [];
-
- $(o.snap.constructor != String ? ( o.snap.items || ':data(draggable)' ) : o.snap).each(function() {
- var $t = $(this); var $o = $t.offset();
- if(this != i.element[0]) i.snapElements.push({
- item: this,
- width: $t.outerWidth(), height: $t.outerHeight(),
- top: $o.top, left: $o.left
- });
- });
-
- },
- drag: function(event, ui) {
-
- var inst = $(this).data("draggable"), o = inst.options;
- var d = o.snapTolerance;
-
- var x1 = ui.offset.left, x2 = x1 + inst.helperProportions.width,
- y1 = ui.offset.top, y2 = y1 + inst.helperProportions.height;
-
- for (var i = inst.snapElements.length - 1; i >= 0; i--){
-
- var l = inst.snapElements[i].left, r = l + inst.snapElements[i].width,
- t = inst.snapElements[i].top, b = t + inst.snapElements[i].height;
-
- //Yes, I know, this is insane ;)
- if(!((l-d < x1 && x1 < r+d && t-d < y1 && y1 < b+d) || (l-d < x1 && x1 < r+d && t-d < y2 && y2 < b+d) || (l-d < x2 && x2 < r+d && t-d < y1 && y1 < b+d) || (l-d < x2 && x2 < r+d && t-d < y2 && y2 < b+d))) {
- if(inst.snapElements[i].snapping) (inst.options.snap.release && inst.options.snap.release.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item })));
- inst.snapElements[i].snapping = false;
- continue;
- }
-
- if(o.snapMode != 'inner') {
- var ts = Math.abs(t - y2) <= d;
- var bs = Math.abs(b - y1) <= d;
- var ls = Math.abs(l - x2) <= d;
- var rs = Math.abs(r - x1) <= d;
- if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
- if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b, left: 0 }).top - inst.margins.top;
- if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l - inst.helperProportions.width }).left - inst.margins.left;
- if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r }).left - inst.margins.left;
- }
-
- var first = (ts || bs || ls || rs);
-
- if(o.snapMode != 'outer') {
- var ts = Math.abs(t - y1) <= d;
- var bs = Math.abs(b - y2) <= d;
- var ls = Math.abs(l - x1) <= d;
- var rs = Math.abs(r - x2) <= d;
- if(ts) ui.position.top = inst._convertPositionTo("relative", { top: t, left: 0 }).top - inst.margins.top;
- if(bs) ui.position.top = inst._convertPositionTo("relative", { top: b - inst.helperProportions.height, left: 0 }).top - inst.margins.top;
- if(ls) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: l }).left - inst.margins.left;
- if(rs) ui.position.left = inst._convertPositionTo("relative", { top: 0, left: r - inst.helperProportions.width }).left - inst.margins.left;
- }
-
- if(!inst.snapElements[i].snapping && (ts || bs || ls || rs || first))
- (inst.options.snap.snap && inst.options.snap.snap.call(inst.element, event, $.extend(inst._uiHash(), { snapItem: inst.snapElements[i].item })));
- inst.snapElements[i].snapping = (ts || bs || ls || rs || first);
-
- };
-
- }
-});
-
-$.ui.plugin.add("draggable", "stack", {
- start: function(event, ui) {
-
- var o = $(this).data("draggable").options;
-
- var group = $.makeArray($(o.stack)).sort(function(a,b) {
- return (parseInt($(a).css("zIndex"),10) || 0) - (parseInt($(b).css("zIndex"),10) || 0);
- });
- if (!group.length) { return; }
-
- var min = parseInt(group[0].style.zIndex) || 0;
- $(group).each(function(i) {
- this.style.zIndex = min + i;
- });
-
- this[0].style.zIndex = min + group.length;
-
- }
-});
-
-$.ui.plugin.add("draggable", "zIndex", {
- start: function(event, ui) {
- var t = $(ui.helper), o = $(this).data("draggable").options;
- if(t.css("zIndex")) o._zIndex = t.css("zIndex");
- t.css('zIndex', o.zIndex);
- },
- stop: function(event, ui) {
- var o = $(this).data("draggable").options;
- if(o._zIndex) $(ui.helper).css('zIndex', o._zIndex);
- }
-});
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Droppable @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Droppables
- *
- * Depends:
- * jquery.ui.core.js
- * jquery.ui.widget.js
- * jquery.ui.mouse.js
- * jquery.ui.draggable.js
- */
-(function( $, undefined ) {
-
-$.widget("ui.droppable", {
- widgetEventPrefix: "drop",
- options: {
- accept: '*',
- activeClass: false,
- addClasses: true,
- greedy: false,
- hoverClass: false,
- scope: 'default',
- tolerance: 'intersect'
- },
- _create: function() {
-
- var o = this.options, accept = o.accept;
- this.isover = 0; this.isout = 1;
-
- this.accept = $.isFunction(accept) ? accept : function(d) {
- return d.is(accept);
- };
-
- //Store the droppable's proportions
- this.proportions = { width: this.element[0].offsetWidth, height: this.element[0].offsetHeight };
-
- // Add the reference and positions to the manager
- $.ui.ddmanager.droppables[o.scope] = $.ui.ddmanager.droppables[o.scope] || [];
- $.ui.ddmanager.droppables[o.scope].push(this);
-
- (o.addClasses && this.element.addClass("ui-droppable"));
-
- },
-
- destroy: function() {
- var drop = $.ui.ddmanager.droppables[this.options.scope];
- for ( var i = 0; i < drop.length; i++ )
- if ( drop[i] == this )
- drop.splice(i, 1);
-
- this.element
- .removeClass("ui-droppable ui-droppable-disabled")
- .removeData("droppable")
- .unbind(".droppable");
-
- return this;
- },
-
- _setOption: function(key, value) {
-
- if(key == 'accept') {
- this.accept = $.isFunction(value) ? value : function(d) {
- return d.is(value);
- };
- }
- $.Widget.prototype._setOption.apply(this, arguments);
- },
-
- _activate: function(event) {
- var draggable = $.ui.ddmanager.current;
- if(this.options.activeClass) this.element.addClass(this.options.activeClass);
- (draggable && this._trigger('activate', event, this.ui(draggable)));
- },
-
- _deactivate: function(event) {
- var draggable = $.ui.ddmanager.current;
- if(this.options.activeClass) this.element.removeClass(this.options.activeClass);
- (draggable && this._trigger('deactivate', event, this.ui(draggable)));
- },
-
- _over: function(event) {
-
- var draggable = $.ui.ddmanager.current;
- if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return; // Bail if draggable and droppable are same element
-
- if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) {
- if(this.options.hoverClass) this.element.addClass(this.options.hoverClass);
- this._trigger('over', event, this.ui(draggable));
- }
-
- },
-
- _out: function(event) {
-
- var draggable = $.ui.ddmanager.current;
- if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return; // Bail if draggable and droppable are same element
-
- if (this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) {
- if(this.options.hoverClass) this.element.removeClass(this.options.hoverClass);
- this._trigger('out', event, this.ui(draggable));
- }
-
- },
-
- _drop: function(event,custom) {
-
- var draggable = custom || $.ui.ddmanager.current;
- if (!draggable || (draggable.currentItem || draggable.element)[0] == this.element[0]) return false; // Bail if draggable and droppable are same element
-
- var childrenIntersection = false;
- this.element.find(":data(droppable)").not(".ui-draggable-dragging").each(function() {
- var inst = $.data(this, 'droppable');
- if(
- inst.options.greedy
- && !inst.options.disabled
- && inst.options.scope == draggable.options.scope
- && inst.accept.call(inst.element[0], (draggable.currentItem || draggable.element))
- && $.ui.intersect(draggable, $.extend(inst, { offset: inst.element.offset() }), inst.options.tolerance)
- ) { childrenIntersection = true; return false; }
- });
- if(childrenIntersection) return false;
-
- if(this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) {
- if(this.options.activeClass) this.element.removeClass(this.options.activeClass);
- if(this.options.hoverClass) this.element.removeClass(this.options.hoverClass);
- this._trigger('drop', event, this.ui(draggable));
- return this.element;
- }
-
- return false;
-
- },
-
- ui: function(c) {
- return {
- draggable: (c.currentItem || c.element),
- helper: c.helper,
- position: c.position,
- offset: c.positionAbs
- };
- }
-
-});
-
-$.extend($.ui.droppable, {
- version: "@VERSION"
-});
-
-$.ui.intersect = function(draggable, droppable, toleranceMode) {
-
- if (!droppable.offset) return false;
-
- var x1 = (draggable.positionAbs || draggable.position.absolute).left, x2 = x1 + draggable.helperProportions.width,
- y1 = (draggable.positionAbs || draggable.position.absolute).top, y2 = y1 + draggable.helperProportions.height;
- var l = droppable.offset.left, r = l + droppable.proportions.width,
- t = droppable.offset.top, b = t + droppable.proportions.height;
-
- switch (toleranceMode) {
- case 'fit':
- return (l <= x1 && x2 <= r
- && t <= y1 && y2 <= b);
- break;
- case 'intersect':
- return (l < x1 + (draggable.helperProportions.width / 2) // Right Half
- && x2 - (draggable.helperProportions.width / 2) < r // Left Half
- && t < y1 + (draggable.helperProportions.height / 2) // Bottom Half
- && y2 - (draggable.helperProportions.height / 2) < b ); // Top Half
- break;
- case 'pointer':
- var draggableLeft = ((draggable.positionAbs || draggable.position.absolute).left + (draggable.clickOffset || draggable.offset.click).left),
- draggableTop = ((draggable.positionAbs || draggable.position.absolute).top + (draggable.clickOffset || draggable.offset.click).top),
- isOver = $.ui.isOver(draggableTop, draggableLeft, t, l, droppable.proportions.height, droppable.proportions.width);
- return isOver;
- break;
- case 'touch':
- return (
- (y1 >= t && y1 <= b) || // Top edge touching
- (y2 >= t && y2 <= b) || // Bottom edge touching
- (y1 < t && y2 > b) // Surrounded vertically
- ) && (
- (x1 >= l && x1 <= r) || // Left edge touching
- (x2 >= l && x2 <= r) || // Right edge touching
- (x1 < l && x2 > r) // Surrounded horizontally
- );
- break;
- default:
- return false;
- break;
- }
-
-};
-
-/*
- This manager tracks offsets of draggables and droppables
-*/
-$.ui.ddmanager = {
- current: null,
- droppables: { 'default': [] },
- prepareOffsets: function(t, event) {
-
- var m = $.ui.ddmanager.droppables[t.options.scope] || [];
- var type = event ? event.type : null; // workaround for #2317
- var list = (t.currentItem || t.element).find(":data(droppable)").andSelf();
-
- droppablesLoop: for (var i = 0; i < m.length; i++) {
-
- if(m[i].options.disabled || (t && !m[i].accept.call(m[i].element[0],(t.currentItem || t.element)))) continue; //No disabled and non-accepted
- for (var j=0; j < list.length; j++) { if(list[j] == m[i].element[0]) { m[i].proportions.height = 0; continue droppablesLoop; } }; //Filter out elements in the current dragged item
- m[i].visible = m[i].element.css("display") != "none"; if(!m[i].visible) continue; //If the element is not visible, continue
-
- if(type == "mousedown") m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables
-
- m[i].offset = m[i].element.offset();
- m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight };
-
- }
-
- },
- drop: function(draggable, event) {
-
- var dropped = false;
- $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() {
-
- if(!this.options) return;
- if (!this.options.disabled && this.visible && $.ui.intersect(draggable, this, this.options.tolerance))
- dropped = this._drop.call(this, event) || dropped;
-
- if (!this.options.disabled && this.visible && this.accept.call(this.element[0],(draggable.currentItem || draggable.element))) {
- this.isout = 1; this.isover = 0;
- this._deactivate.call(this, event);
- }
-
- });
- return dropped;
-
- },
- dragStart: function( draggable, event ) {
- //Listen for scrolling so that if the dragging causes scrolling the position of the droppables can be recalculated (see #5003)
- draggable.element.parents( ":not(body,html)" ).bind( "scroll.droppable", function() {
- if( !draggable.options.refreshPositions ) $.ui.ddmanager.prepareOffsets( draggable, event );
- });
- },
- drag: function(draggable, event) {
-
- //If you have a highly dynamic page, you might try this option. It renders positions every time you move the mouse.
- if(draggable.options.refreshPositions) $.ui.ddmanager.prepareOffsets(draggable, event);
-
- //Run through all droppables and check their positions based on specific tolerance options
- $.each($.ui.ddmanager.droppables[draggable.options.scope] || [], function() {
-
- if(this.options.disabled || this.greedyChild || !this.visible) return;
- var intersects = $.ui.intersect(draggable, this, this.options.tolerance);
-
- var c = !intersects && this.isover == 1 ? 'isout' : (intersects && this.isover == 0 ? 'isover' : null);
- if(!c) return;
-
- var parentInstance;
- if (this.options.greedy) {
- // find droppable parents with same scope
- var scope = this.options.scope;
- var parent = this.element.parents(':data(droppable)').filter(function () {
- return $.data(this, 'droppable').options.scope === scope;
- });
-
- if (parent.length) {
- parentInstance = $.data(parent[0], 'droppable');
- parentInstance.greedyChild = (c == 'isover' ? 1 : 0);
- }
- }
-
- // we just moved into a greedy child
- if (parentInstance && c == 'isover') {
- parentInstance['isover'] = 0;
- parentInstance['isout'] = 1;
- parentInstance._out.call(parentInstance, event);
- }
-
- this[c] = 1; this[c == 'isout' ? 'isover' : 'isout'] = 0;
- this[c == "isover" ? "_over" : "_out"].call(this, event);
-
- // we just moved out of a greedy child
- if (parentInstance && c == 'isout') {
- parentInstance['isout'] = 0;
- parentInstance['isover'] = 1;
- parentInstance._over.call(parentInstance, event);
- }
- });
-
- },
- dragStop: function( draggable, event ) {
- draggable.element.parents( ":not(body,html)" ).unbind( "scroll.droppable" );
- //Call prepareOffsets one final time since IE does not fire return scroll events when overflow was caused by drag (see #5003)
- if( !draggable.options.refreshPositions ) $.ui.ddmanager.prepareOffsets( draggable, event );
- }
-};
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Mouse @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Mouse
- *
- * Depends:
- * jquery.ui.widget.js
- */
-(function( $, undefined ) {
-
-var mouseHandled = false;
-$( document ).mouseup( function( e ) {
- mouseHandled = false;
-});
-
-$.widget("ui.mouse", {
- options: {
- cancel: ':input,option',
- distance: 1,
- delay: 0
- },
- _mouseInit: function() {
- var self = this;
-
- this.element
- .bind('mousedown.'+this.widgetName, function(event) {
- return self._mouseDown(event);
- })
- .bind('click.'+this.widgetName, function(event) {
- if (true === $.data(event.target, self.widgetName + '.preventClickEvent')) {
- $.removeData(event.target, self.widgetName + '.preventClickEvent');
- event.stopImmediatePropagation();
- return false;
- }
- });
-
- this.started = false;
- },
-
- // TODO: make sure destroying one instance of mouse doesn't mess with
- // other instances of mouse
- _mouseDestroy: function() {
- this.element.unbind('.'+this.widgetName);
- if ( this._mouseMoveDelegate ) {
- $(document)
- .unbind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
- .unbind('mouseup.'+this.widgetName, this._mouseUpDelegate);
- }
- },
-
- _mouseDown: function(event) {
- // don't let more than one widget handle mouseStart
- if( mouseHandled ) { return };
-
- // we may have missed mouseup (out of window)
- (this._mouseStarted && this._mouseUp(event));
-
- this._mouseDownEvent = event;
-
- var self = this,
- btnIsLeft = (event.which == 1),
- // event.target.nodeName works around a bug in IE 8 with
- // disabled inputs (#7620)
- elIsCancel = (typeof this.options.cancel == "string" && event.target.nodeName ? $(event.target).closest(this.options.cancel).length : false);
- if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) {
- return true;
- }
-
- this.mouseDelayMet = !this.options.delay;
- if (!this.mouseDelayMet) {
- this._mouseDelayTimer = setTimeout(function() {
- self.mouseDelayMet = true;
- }, this.options.delay);
- }
-
- if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
- this._mouseStarted = (this._mouseStart(event) !== false);
- if (!this._mouseStarted) {
- event.preventDefault();
- return true;
- }
- }
-
- // Click event may never have fired (Gecko & Opera)
- if (true === $.data(event.target, this.widgetName + '.preventClickEvent')) {
- $.removeData(event.target, this.widgetName + '.preventClickEvent');
- }
-
- // these delegates are required to keep context
- this._mouseMoveDelegate = function(event) {
- return self._mouseMove(event);
- };
- this._mouseUpDelegate = function(event) {
- return self._mouseUp(event);
- };
- $(document)
- .bind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
- .bind('mouseup.'+this.widgetName, this._mouseUpDelegate);
-
- event.preventDefault();
-
- mouseHandled = true;
- return true;
- },
-
- _mouseMove: function(event) {
- // IE mouseup check - mouseup happened when mouse was out of window
- if ($.browser.msie && !(document.documentMode >= 9) && !event.button) {
- return this._mouseUp(event);
- }
-
- if (this._mouseStarted) {
- this._mouseDrag(event);
- return event.preventDefault();
- }
-
- if (this._mouseDistanceMet(event) && this._mouseDelayMet(event)) {
- this._mouseStarted =
- (this._mouseStart(this._mouseDownEvent, event) !== false);
- (this._mouseStarted ? this._mouseDrag(event) : this._mouseUp(event));
- }
-
- return !this._mouseStarted;
- },
-
- _mouseUp: function(event) {
- $(document)
- .unbind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
- .unbind('mouseup.'+this.widgetName, this._mouseUpDelegate);
-
- if (this._mouseStarted) {
- this._mouseStarted = false;
-
- if (event.target == this._mouseDownEvent.target) {
- $.data(event.target, this.widgetName + '.preventClickEvent', true);
- }
-
- this._mouseStop(event);
- }
-
- return false;
- },
-
- _mouseDistanceMet: function(event) {
- return (Math.max(
- Math.abs(this._mouseDownEvent.pageX - event.pageX),
- Math.abs(this._mouseDownEvent.pageY - event.pageY)
- ) >= this.options.distance
- );
- },
-
- _mouseDelayMet: function(event) {
- return this.mouseDelayMet;
- },
-
- // These are placeholder methods, to be overriden by extending plugin
- _mouseStart: function(event) {},
- _mouseDrag: function(event) {},
- _mouseStop: function(event) {},
- _mouseCapture: function(event) { return true; }
-});
-
-})(jQuery);
+++ /dev/null
-/*!
- * jQuery UI Sortable @VERSION
- *
- * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
- * Dual licensed under the MIT or GPL Version 2 licenses.
- * http://jquery.org/license
- *
- * http://docs.jquery.com/UI/Sortables
- *
- * Depends:
- * jquery.ui.core.js
- * jquery.ui.mouse.js
- * jquery.ui.widget.js
- */
-(function( $, undefined ) {
-
-$.widget("ui.sortable", $.ui.mouse, {
- widgetEventPrefix: "sort",
- ready: false,
- options: {
- appendTo: "parent",
- axis: false,
- connectWith: false,
- containment: false,
- cursor: 'auto',
- cursorAt: false,
- dropOnEmpty: true,
- forcePlaceholderSize: false,
- forceHelperSize: false,
- grid: false,
- handle: false,
- helper: "original",
- items: '> *',
- opacity: false,
- placeholder: false,
- revert: false,
- scroll: true,
- scrollSensitivity: 20,
- scrollSpeed: 20,
- scope: "default",
- tolerance: "intersect",
- zIndex: 1000
- },
- _create: function() {
-
- var o = this.options;
- this.containerCache = {};
- this.element.addClass("ui-sortable");
-
- //Get the items
- this.refresh();
-
- //Let's determine if the items are being displayed horizontally
- this.floating = this.items.length ? o.axis === 'x' || (/left|right/).test(this.items[0].item.css('float')) || (/inline|table-cell/).test(this.items[0].item.css('display')) : false;
-
- //Let's determine the parent's offset
- this.offset = this.element.offset();
-
- //Initialize mouse events for interaction
- this._mouseInit();
-
- //We're ready to go
- this.ready = true
-
- },
-
- destroy: function() {
- $.Widget.prototype.destroy.call( this );
- this.element
- .removeClass("ui-sortable ui-sortable-disabled");
- this._mouseDestroy();
-
- for ( var i = this.items.length - 1; i >= 0; i-- )
- this.items[i].item.removeData(this.widgetName + "-item");
-
- return this;
- },
-
- _setOption: function(key, value){
- if ( key === "disabled" ) {
- this.options[ key ] = value;
-
- this.widget()
- [ value ? "addClass" : "removeClass"]( "ui-sortable-disabled" );
- } else {
- // Don't call widget base _setOption for disable as it adds ui-state-disabled class
- $.Widget.prototype._setOption.apply(this, arguments);
- }
- },
-
- _mouseCapture: function(event, overrideHandle) {
- var that = this;
-
- if (this.reverting) {
- return false;
- }
-
- if(this.options.disabled || this.options.type == 'static') return false;
-
- //We have to refresh the items data once first
- this._refreshItems(event);
-
- //Find out if the clicked node (or one of its parents) is a actual item in this.items
- var currentItem = null, self = this, nodes = $(event.target).parents().each(function() {
- if($.data(this, that.widgetName + '-item') == self) {
- currentItem = $(this);
- return false;
- }
- });
- if($.data(event.target, that.widgetName + '-item') == self) currentItem = $(event.target);
-
- if(!currentItem) return false;
- if(this.options.handle && !overrideHandle) {
- var validHandle = false;
-
- $(this.options.handle, currentItem).find("*").andSelf().each(function() { if(this == event.target) validHandle = true; });
- if(!validHandle) return false;
- }
-
- this.currentItem = currentItem;
- this._removeCurrentsFromItems();
- return true;
-
- },
-
- _mouseStart: function(event, overrideHandle, noActivation) {
-
- var o = this.options, self = this;
- this.currentContainer = this;
-
- //We only need to call refreshPositions, because the refreshItems call has been moved to mouseCapture
- this.refreshPositions();
-
- //Create and append the visible helper
- this.helper = this._createHelper(event);
-
- //Cache the helper size
- this._cacheHelperProportions();
-
- /*
- * - Position generation -
- * This block generates everything position related - it's the core of draggables.
- */
-
- //Cache the margins of the original element
- this._cacheMargins();
-
- //Get the next scrolling parent
- this.scrollParent = this.helper.scrollParent();
-
- //The element's absolute position on the page minus margins
- this.offset = this.currentItem.offset();
- this.offset = {
- top: this.offset.top - this.margins.top,
- left: this.offset.left - this.margins.left
- };
-
- $.extend(this.offset, {
- click: { //Where the click happened, relative to the element
- left: event.pageX - this.offset.left,
- top: event.pageY - this.offset.top
- },
- parent: this._getParentOffset(),
- relative: this._getRelativeOffset() //This is a relative to absolute position minus the actual position calculation - only used for relative positioned helper
- });
-
- // Only after we got the offset, we can change the helper's position to absolute
- // TODO: Still need to figure out a way to make relative sorting possible
- this.helper.css("position", "absolute");
- this.cssPosition = this.helper.css("position");
-
- //Generate the original position
- this.originalPosition = this._generatePosition(event);
- this.originalPageX = event.pageX;
- this.originalPageY = event.pageY;
-
- //Adjust the mouse offset relative to the helper if 'cursorAt' is supplied
- (o.cursorAt && this._adjustOffsetFromHelper(o.cursorAt));
-
- //Cache the former DOM position
- this.domPosition = { prev: this.currentItem.prev()[0], parent: this.currentItem.parent()[0] };
-
- //If the helper is not the original, hide the original so it's not playing any role during the drag, won't cause anything bad this way
- if(this.helper[0] != this.currentItem[0]) {
- this.currentItem.hide();
- }
-
- //Create the placeholder
- this._createPlaceholder();
-
- //Set a containment if given in the options
- if(o.containment)
- this._setContainment();
-
- if(o.cursor) { // cursor option
- if ($('body').css("cursor")) this._storedCursor = $('body').css("cursor");
- $('body').css("cursor", o.cursor);
- }
-
- if(o.opacity) { // opacity option
- if (this.helper.css("opacity")) this._storedOpacity = this.helper.css("opacity");
- this.helper.css("opacity", o.opacity);
- }
-
- if(o.zIndex) { // zIndex option
- if (this.helper.css("zIndex")) this._storedZIndex = this.helper.css("zIndex");
- this.helper.css("zIndex", o.zIndex);
- }
-
- //Prepare scrolling
- if(this.scrollParent[0] != document && this.scrollParent[0].tagName != 'HTML')
- this.overflowOffset = this.scrollParent.offset();
-
- //Call callbacks
- this._trigger("start", event, this._uiHash());
-
- //Recache the helper size
- if(!this._preserveHelperProportions)
- this._cacheHelperProportions();
-
-
- //Post 'activate' events to possible containers
- if(!noActivation) {
- for (var i = this.containers.length - 1; i >= 0; i--) { this.containers[i]._trigger("activate", event, self._uiHash(this)); }
- }
-
- //Prepare possible droppables
- if($.ui.ddmanager)
- $.ui.ddmanager.current = this;
-
- if ($.ui.ddmanager && !o.dropBehaviour)
- $.ui.ddmanager.prepareOffsets(this, event);
-
- this.dragging = true;
-
- this.helper.addClass("ui-sortable-helper");
- this._mouseDrag(event); //Execute the drag once - this causes the helper not to be visible before getting its correct position
- return true;
-
- },
-
- _mouseDrag: function(event) {
-
- //Compute the helpers position
- this.position = this._generatePosition(event);
- this.positionAbs = this._convertPositionTo("absolute");
-
- if (!this.lastPositionAbs) {
- this.lastPositionAbs = this.positionAbs;
- }
-
- //Do scrolling
- if(this.options.scroll) {
- var o = this.options, scrolled = false;
- if(this.scrollParent[0] != document && this.scrollParent[0].tagName != 'HTML') {
-
- if((this.overflowOffset.top + this.scrollParent[0].offsetHeight) - event.pageY < o.scrollSensitivity)
- this.scrollParent[0].scrollTop = scrolled = this.scrollParent[0].scrollTop + o.scrollSpeed;
- else if(event.pageY - this.overflowOffset.top < o.scrollSensitivity)
- this.scrollParent[0].scrollTop = scrolled = this.scrollParent[0].scrollTop - o.scrollSpeed;
-
- if((this.overflowOffset.left + this.scrollParent[0].offsetWidth) - event.pageX < o.scrollSensitivity)
- this.scrollParent[0].scrollLeft = scrolled = this.scrollParent[0].scrollLeft + o.scrollSpeed;
- else if(event.pageX - this.overflowOffset.left < o.scrollSensitivity)
- this.scrollParent[0].scrollLeft = scrolled = this.scrollParent[0].scrollLeft - o.scrollSpeed;
-
- } else {
-
- if(event.pageY - $(document).scrollTop() < o.scrollSensitivity)
- scrolled = $(document).scrollTop($(document).scrollTop() - o.scrollSpeed);
- else if($(window).height() - (event.pageY - $(document).scrollTop()) < o.scrollSensitivity)
- scrolled = $(document).scrollTop($(document).scrollTop() + o.scrollSpeed);
-
- if(event.pageX - $(document).scrollLeft() < o.scrollSensitivity)
- scrolled = $(document).scrollLeft($(document).scrollLeft() - o.scrollSpeed);
- else if($(window).width() - (event.pageX - $(document).scrollLeft()) < o.scrollSensitivity)
- scrolled = $(document).scrollLeft($(document).scrollLeft() + o.scrollSpeed);
-
- }
-
- if(scrolled !== false && $.ui.ddmanager && !o.dropBehaviour)
- $.ui.ddmanager.prepareOffsets(this, event);
- }
-
- //Regenerate the absolute position used for position checks
- this.positionAbs = this._convertPositionTo("absolute");
-
- //Set the helper position
- if(!this.options.axis || this.options.axis != "y") this.helper[0].style.left = this.position.left+'px';
- if(!this.options.axis || this.options.axis != "x") this.helper[0].style.top = this.position.top+'px';
-
- //Rearrange
- for (var i = this.items.length - 1; i >= 0; i--) {
-
- //Cache variables and intersection, continue if no intersection
- var item = this.items[i], itemElement = item.item[0], intersection = this._intersectsWithPointer(item);
- if (!intersection) continue;
-
- // Only put the placeholder inside the current Container, skip all
- // items form other containers. This works because when moving
- // an item from one container to another the
- // currentContainer is switched before the placeholder is moved.
- //
- // Without this moving items in "sub-sortables" can cause the placeholder to jitter
- // beetween the outer and inner container.
- if (item.instance !== this.currentContainer) continue;
-
- if (itemElement != this.currentItem[0] //cannot intersect with itself
- && this.placeholder[intersection == 1 ? "next" : "prev"]()[0] != itemElement //no useless actions that have been done before
- && !$.ui.contains(this.placeholder[0], itemElement) //no action if the item moved is the parent of the item checked
- && (this.options.type == 'semi-dynamic' ? !$.ui.contains(this.element[0], itemElement) : true)
- //&& itemElement.parentNode == this.placeholder[0].parentNode // only rearrange items within the same container
- ) {
-
- this.direction = intersection == 1 ? "down" : "up";
-
- if (this.options.tolerance == "pointer" || this._intersectsWithSides(item)) {
- this._rearrange(event, item);
- } else {
- break;
- }
-
- this._trigger("change", event, this._uiHash());
- break;
- }
- }
-
- //Post events to containers
- this._contactContainers(event);
-
- //Interconnect with droppables
- if($.ui.ddmanager) $.ui.ddmanager.drag(this, event);
-
- //Call callbacks
- this._trigger('sort', event, this._uiHash());
-
- this.lastPositionAbs = this.positionAbs;
- return false;
-
- },
-
- _mouseStop: function(event, noPropagation) {
-
- if(!event) return;
-
- //If we are using droppables, inform the manager about the drop
- if ($.ui.ddmanager && !this.options.dropBehaviour)
- $.ui.ddmanager.drop(this, event);
-
- if(this.options.revert) {
- var self = this;
- var cur = self.placeholder.offset();
-
- self.reverting = true;
-
- $(this.helper).animate({
- left: cur.left - this.offset.parent.left - self.margins.left + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollLeft),
- top: cur.top - this.offset.parent.top - self.margins.top + (this.offsetParent[0] == document.body ? 0 : this.offsetParent[0].scrollTop)
- }, parseInt(this.options.revert, 10) || 500, function() {
- self._clear(event);
- });
- } else {
- this._clear(event, noPropagation);
- }
-
- return false;
-
- },
-
- cancel: function() {
-
- var self = this;
-
- if(this.dragging) {
-
- this._mouseUp({ target: null });
-
- if(this.options.helper == "original")
- this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper");
- else
- this.currentItem.show();
-
- //Post deactivating events to containers
- for (var i = this.containers.length - 1; i >= 0; i--){
- this.containers[i]._trigger("deactivate", null, self._uiHash(this));
- if(this.containers[i].containerCache.over) {
- this.containers[i]._trigger("out", null, self._uiHash(this));
- this.containers[i].containerCache.over = 0;
- }
- }
-
- }
-
- if (this.placeholder) {
- //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node!
- if(this.placeholder[0].parentNode) this.placeholder[0].parentNode.removeChild(this.placeholder[0]);
- if(this.options.helper != "original" && this.helper && this.helper[0].parentNode) this.helper.remove();
-
- $.extend(this, {
- helper: null,
- dragging: false,
- reverting: false,
- _noFinalSort: null
- });
-
- if(this.domPosition.prev) {
- $(this.domPosition.prev).after(this.currentItem);
- } else {
- $(this.domPosition.parent).prepend(this.currentItem);
- }
- }
-
- return this;
-
- },
-
- serialize: function(o) {
-
- var items = this._getItemsAsjQuery(o && o.connected);
- var str = []; o = o || {};
-
- $(items).each(function() {
- var res = ($(o.item || this).attr(o.attribute || 'id') || '').match(o.expression || (/(.+)[-=_](.+)/));
- if(res) str.push((o.key || res[1]+'[]')+'='+(o.key && o.expression ? res[1] : res[2]));
- });
-
- if(!str.length && o.key) {
- str.push(o.key + '=');
- }
-
- return str.join('&');
-
- },
-
- toArray: function(o) {
-
- var items = this._getItemsAsjQuery(o && o.connected);
- var ret = []; o = o || {};
-
- items.each(function() { ret.push($(o.item || this).attr(o.attribute || 'id') || ''); });
- return ret;
-
- },
-
- /* Be careful with the following core functions */
- _intersectsWith: function(item) {
-
- var x1 = this.positionAbs.left,
- x2 = x1 + this.helperProportions.width,
- y1 = this.positionAbs.top,
- y2 = y1 + this.helperProportions.height;
-
- var l = item.left,
- r = l + item.width,
- t = item.top,
- b = t + item.height;
-
- var dyClick = this.offset.click.top,
- dxClick = this.offset.click.left;
-
- var isOverElement = (y1 + dyClick) > t && (y1 + dyClick) < b && (x1 + dxClick) > l && (x1 + dxClick) < r;
-
- if( this.options.tolerance == "pointer"
- || this.options.forcePointerForContainers
- || (this.options.tolerance != "pointer" && this.helperProportions[this.floating ? 'width' : 'height'] > item[this.floating ? 'width' : 'height'])
- ) {
- return isOverElement;
- } else {
-
- return (l < x1 + (this.helperProportions.width / 2) // Right Half
- && x2 - (this.helperProportions.width / 2) < r // Left Half
- && t < y1 + (this.helperProportions.height / 2) // Bottom Half
- && y2 - (this.helperProportions.height / 2) < b ); // Top Half
-
- }
- },
-
- _intersectsWithPointer: function(item) {
-
- var isOverElementHeight = (this.options.axis === 'x') || $.ui.isOverAxis(this.positionAbs.top + this.offset.click.top, item.top, item.height),
- isOverElementWidth = (this.options.axis === 'y') || $.ui.isOverAxis(this.positionAbs.left + this.offset.click.left, item.left, item.width),
- isOverElement = isOverElementHeight && isOverElementWidth,
- verticalDirection = this._getDragVerticalDirection(),
- horizontalDirection = this._getDragHorizontalDirection();
-
- if (!isOverElement)
- return false;
-
- return this.floating ?
- ( ((horizontalDirection && horizontalDirection == "right") || verticalDirection == "down") ? 2 : 1 )
- : ( verticalDirection && (verticalDirection == "down" ? 2 : 1) );
-
- },
-
- _intersectsWithSides: function(item) {
-
- var isOverBottomHalf = $.ui.isOverAxis(this.positionAbs.top + this.offset.click.top, item.top + (item.height/2), item.height),
- isOverRightHalf = $.ui.isOverAxis(this.positionAbs.left + this.offset.click.left, item.left + (item.width/2), item.width),
- verticalDirection = this._getDragVerticalDirection(),
- horizontalDirection = this._getDragHorizontalDirection();
-
- if (this.floating && horizontalDirection) {
- return ((horizontalDirection == "right" && isOverRightHalf) || (horizontalDirection == "left" && !isOverRightHalf));
- } else {
- return verticalDirection && ((verticalDirection == "down" && isOverBottomHalf) || (verticalDirection == "up" && !isOverBottomHalf));
- }
-
- },
-
- _getDragVerticalDirection: function() {
- var delta = this.positionAbs.top - this.lastPositionAbs.top;
- return delta != 0 && (delta > 0 ? "down" : "up");
- },
-
- _getDragHorizontalDirection: function() {
- var delta = this.positionAbs.left - this.lastPositionAbs.left;
- return delta != 0 && (delta > 0 ? "right" : "left");
- },
-
- refresh: function(event) {
- this._refreshItems(event);
- this.refreshPositions();
- return this;
- },
-
- _connectWith: function() {
- var options = this.options;
- return options.connectWith.constructor == String
- ? [options.connectWith]
- : options.connectWith;
- },
-
- _getItemsAsjQuery: function(connected) {
-
- var self = this;
- var items = [];
- var queries = [];
- var connectWith = this._connectWith();
-
- if(connectWith && connected) {
- for (var i = connectWith.length - 1; i >= 0; i--){
- var cur = $(connectWith[i]);
- for (var j = cur.length - 1; j >= 0; j--){
- var inst = $.data(cur[j], this.widgetName);
- if(inst && inst != this && !inst.options.disabled) {
- queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element) : $(inst.options.items, inst.element).not(".ui-sortable-helper").not('.ui-sortable-placeholder'), inst]);
- }
- };
- };
- }
-
- queries.push([$.isFunction(this.options.items) ? this.options.items.call(this.element, null, { options: this.options, item: this.currentItem }) : $(this.options.items, this.element).not(".ui-sortable-helper").not('.ui-sortable-placeholder'), this]);
-
- for (var i = queries.length - 1; i >= 0; i--){
- queries[i][0].each(function() {
- items.push(this);
- });
- };
-
- return $(items);
-
- },
-
- _removeCurrentsFromItems: function() {
-
- var list = this.currentItem.find(":data(" + this.widgetName + "-item)");
-
- for (var i=0; i < this.items.length; i++) {
-
- for (var j=0; j < list.length; j++) {
- if(list[j] == this.items[i].item[0])
- this.items.splice(i,1);
- };
-
- };
-
- },
-
- _refreshItems: function(event) {
-
- this.items = [];
- this.containers = [this];
- var items = this.items;
- var self = this;
- var queries = [[$.isFunction(this.options.items) ? this.options.items.call(this.element[0], event, { item: this.currentItem }) : $(this.options.items, this.element), this]];
- var connectWith = this._connectWith();
-
- if(connectWith && this.ready) { //Shouldn't be run the first time through due to massive slow-down
- for (var i = connectWith.length - 1; i >= 0; i--){
- var cur = $(connectWith[i]);
- for (var j = cur.length - 1; j >= 0; j--){
- var inst = $.data(cur[j], this.widgetName);
- if(inst && inst != this && !inst.options.disabled) {
- queries.push([$.isFunction(inst.options.items) ? inst.options.items.call(inst.element[0], event, { item: this.currentItem }) : $(inst.options.items, inst.element), inst]);
- this.containers.push(inst);
- }
- };
- };
- }
-
- for (var i = queries.length - 1; i >= 0; i--) {
- var targetData = queries[i][1];
- var _queries = queries[i][0];
-
- for (var j=0, queriesLength = _queries.length; j < queriesLength; j++) {
- var item = $(_queries[j]);
-
- item.data(this.widgetName + '-item', targetData); // Data for target checking (mouse manager)
-
- items.push({
- item: item,
- instance: targetData,
- width: 0, height: 0,
- left: 0, top: 0
- });
- };
- };
-
- },
-
- refreshPositions: function(fast) {
-
- //This has to be redone because due to the item being moved out/into the offsetParent, the offsetParent's position will change
- if(this.offsetParent && this.helper) {
- this.offset.parent = this._getParentOffset();
- }
-
- for (var i = this.items.length - 1; i >= 0; i--){
- var item = this.items[i];
-
- //We ignore calculating positions of all connected containers when we're not over them
- if(item.instance != this.currentContainer && this.currentContainer && item.item[0] != this.currentItem[0])
- continue;
-
- var t = this.options.toleranceElement ? $(this.options.toleranceElement, item.item) : item.item;
-
- if (!fast) {
- item.width = t.outerWidth();
- item.height = t.outerHeight();
- }
-
- var p = t.offset();
- item.left = p.left;
- item.top = p.top;
- };
-
- if(this.options.custom && this.options.custom.refreshContainers) {
- this.options.custom.refreshContainers.call(this);
- } else {
- for (var i = this.containers.length - 1; i >= 0; i--){
- var p = this.containers[i].element.offset();
- this.containers[i].containerCache.left = p.left;
- this.containers[i].containerCache.top = p.top;
- this.containers[i].containerCache.width = this.containers[i].element.outerWidth();
- this.containers[i].containerCache.height = this.containers[i].element.outerHeight();
- };
- }
-
- return this;
- },
-
- _createPlaceholder: function(that) {
-
- var self = that || this, o = self.options;
-
- if(!o.placeholder || o.placeholder.constructor == String) {
- var className = o.placeholder;
- o.placeholder = {
- element: function() {
-
- var el = $(document.createElement(self.currentItem[0].nodeName))
- .addClass(className || self.currentItem[0].className+" ui-sortable-placeholder")
- .removeClass("ui-sortable-helper")[0];
-
- if(!className)
- el.style.visibility = "hidden";
-
- return el;
- },
- update: function(container, p) {
-
- // 1. If a className is set as 'placeholder option, we don't force sizes - the class is responsible for that
- // 2. The option 'forcePlaceholderSize can be enabled to force it even if a class name is specified
- if(className && !o.forcePlaceholderSize) return;
-
- //If the element doesn't have a actual height by itself (without styles coming from a stylesheet), it receives the inline height from the dragged item
- if(!p.height()) { p.height(self.currentItem.innerHeight() - parseInt(self.currentItem.css('paddingTop')||0, 10) - parseInt(self.currentItem.css('paddingBottom')||0, 10)); };
- if(!p.width()) { p.width(self.currentItem.innerWidth() - parseInt(self.currentItem.css('paddingLeft')||0, 10) - parseInt(self.currentItem.css('paddingRight')||0, 10)); };
- }
- };
- }
-
- //Create the placeholder
- self.placeholder = $(o.placeholder.element.call(self.element, self.currentItem));
-
- //Append it after the actual current item
- self.currentItem.after(self.placeholder);
-
- //Update the size of the placeholder (TODO: Logic to fuzzy, see line 316/317)
- o.placeholder.update(self, self.placeholder);
-
- },
-
- _contactContainers: function(event) {
-
- // get innermost container that intersects with item
- var innermostContainer = null, innermostIndex = null;
-
-
- for (var i = this.containers.length - 1; i >= 0; i--){
-
- // never consider a container that's located within the item itself
- if($.ui.contains(this.currentItem[0], this.containers[i].element[0]))
- continue;
-
- if(this._intersectsWith(this.containers[i].containerCache)) {
-
- // if we've already found a container and it's more "inner" than this, then continue
- if(innermostContainer && $.ui.contains(this.containers[i].element[0], innermostContainer.element[0]))
- continue;
-
- innermostContainer = this.containers[i];
- innermostIndex = i;
-
- } else {
- // container doesn't intersect. trigger "out" event if necessary
- if(this.containers[i].containerCache.over) {
- this.containers[i]._trigger("out", event, this._uiHash(this));
- this.containers[i].containerCache.over = 0;
- }
- }
-
- }
-
- // if no intersecting containers found, return
- if(!innermostContainer) return;
-
- // move the item into the container if it's not there already
- if(this.containers.length === 1) {
- this.containers[innermostIndex]._trigger("over", event, this._uiHash(this));
- this.containers[innermostIndex].containerCache.over = 1;
- } else if(this.currentContainer != this.containers[innermostIndex]) {
-
- //When entering a new container, we will find the item with the least distance and append our item near it
- var dist = 10000; var itemWithLeastDistance = null; var base = this.positionAbs[this.containers[innermostIndex].floating ? 'left' : 'top'];
- for (var j = this.items.length - 1; j >= 0; j--) {
- if(!$.ui.contains(this.containers[innermostIndex].element[0], this.items[j].item[0])) continue;
- var cur = this.containers[innermostIndex].floating ? this.items[j].item.offset().left : this.items[j].item.offset().top;
- if(Math.abs(cur - base) < dist) {
- dist = Math.abs(cur - base); itemWithLeastDistance = this.items[j];
- this.direction = (cur - base > 0) ? 'down' : 'up';
- }
- }
-
- if(!itemWithLeastDistance && !this.options.dropOnEmpty) //Check if dropOnEmpty is enabled
- return;
-
- this.currentContainer = this.containers[innermostIndex];
- itemWithLeastDistance ? this._rearrange(event, itemWithLeastDistance, null, true) : this._rearrange(event, null, this.containers[innermostIndex].element, true);
- this._trigger("change", event, this._uiHash());
- this.containers[innermostIndex]._trigger("change", event, this._uiHash(this));
-
- //Update the placeholder
- this.options.placeholder.update(this.currentContainer, this.placeholder);
-
- this.containers[innermostIndex]._trigger("over", event, this._uiHash(this));
- this.containers[innermostIndex].containerCache.over = 1;
- }
-
-
- },
-
- _createHelper: function(event) {
-
- var o = this.options;
- var helper = $.isFunction(o.helper) ? $(o.helper.apply(this.element[0], [event, this.currentItem])) : (o.helper == 'clone' ? this.currentItem.clone() : this.currentItem);
-
- if(!helper.parents('body').length) //Add the helper to the DOM if that didn't happen already
- $(o.appendTo != 'parent' ? o.appendTo : this.currentItem[0].parentNode)[0].appendChild(helper[0]);
-
- if(helper[0] == this.currentItem[0])
- this._storedCSS = { width: this.currentItem[0].style.width, height: this.currentItem[0].style.height, position: this.currentItem.css("position"), top: this.currentItem.css("top"), left: this.currentItem.css("left") };
-
- if(helper[0].style.width == '' || o.forceHelperSize) helper.width(this.currentItem.width());
- if(helper[0].style.height == '' || o.forceHelperSize) helper.height(this.currentItem.height());
-
- return helper;
-
- },
-
- _adjustOffsetFromHelper: function(obj) {
- if (typeof obj == 'string') {
- obj = obj.split(' ');
- }
- if ($.isArray(obj)) {
- obj = {left: +obj[0], top: +obj[1] || 0};
- }
- if ('left' in obj) {
- this.offset.click.left = obj.left + this.margins.left;
- }
- if ('right' in obj) {
- this.offset.click.left = this.helperProportions.width - obj.right + this.margins.left;
- }
- if ('top' in obj) {
- this.offset.click.top = obj.top + this.margins.top;
- }
- if ('bottom' in obj) {
- this.offset.click.top = this.helperProportions.height - obj.bottom + this.margins.top;
- }
- },
-
- _getParentOffset: function() {
-
-
- //Get the offsetParent and cache its position
- this.offsetParent = this.helper.offsetParent();
- var po = this.offsetParent.offset();
-
- // This is a special case where we need to modify a offset calculated on start, since the following happened:
- // 1. The position of the helper is absolute, so it's position is calculated based on the next positioned parent
- // 2. The actual offset parent is a child of the scroll parent, and the scroll parent isn't the document, which means that
- // the scroll is included in the initial calculation of the offset of the parent, and never recalculated upon drag
- if(this.cssPosition == 'absolute' && this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) {
- po.left += this.scrollParent.scrollLeft();
- po.top += this.scrollParent.scrollTop();
- }
-
- if((this.offsetParent[0] == document.body) //This needs to be actually done for all browsers, since pageX/pageY includes this information
- || (this.offsetParent[0].tagName && this.offsetParent[0].tagName.toLowerCase() == 'html' && $.browser.msie)) //Ugly IE fix
- po = { top: 0, left: 0 };
-
- return {
- top: po.top + (parseInt(this.offsetParent.css("borderTopWidth"),10) || 0),
- left: po.left + (parseInt(this.offsetParent.css("borderLeftWidth"),10) || 0)
- };
-
- },
-
- _getRelativeOffset: function() {
-
- if(this.cssPosition == "relative") {
- var p = this.currentItem.position();
- return {
- top: p.top - (parseInt(this.helper.css("top"),10) || 0) + this.scrollParent.scrollTop(),
- left: p.left - (parseInt(this.helper.css("left"),10) || 0) + this.scrollParent.scrollLeft()
- };
- } else {
- return { top: 0, left: 0 };
- }
-
- },
-
- _cacheMargins: function() {
- this.margins = {
- left: (parseInt(this.currentItem.css("marginLeft"),10) || 0),
- top: (parseInt(this.currentItem.css("marginTop"),10) || 0)
- };
- },
-
- _cacheHelperProportions: function() {
- this.helperProportions = {
- width: this.helper.outerWidth(),
- height: this.helper.outerHeight()
- };
- },
-
- _setContainment: function() {
-
- var o = this.options;
- if(o.containment == 'parent') o.containment = this.helper[0].parentNode;
- if(o.containment == 'document' || o.containment == 'window') this.containment = [
- 0 - this.offset.relative.left - this.offset.parent.left,
- 0 - this.offset.relative.top - this.offset.parent.top,
- $(o.containment == 'document' ? document : window).width() - this.helperProportions.width - this.margins.left,
- ($(o.containment == 'document' ? document : window).height() || document.body.parentNode.scrollHeight) - this.helperProportions.height - this.margins.top
- ];
-
- if(!(/^(document|window|parent)$/).test(o.containment)) {
- var ce = $(o.containment)[0];
- var co = $(o.containment).offset();
- var over = ($(ce).css("overflow") != 'hidden');
-
- this.containment = [
- co.left + (parseInt($(ce).css("borderLeftWidth"),10) || 0) + (parseInt($(ce).css("paddingLeft"),10) || 0) - this.margins.left,
- co.top + (parseInt($(ce).css("borderTopWidth"),10) || 0) + (parseInt($(ce).css("paddingTop"),10) || 0) - this.margins.top,
- co.left+(over ? Math.max(ce.scrollWidth,ce.offsetWidth) : ce.offsetWidth) - (parseInt($(ce).css("borderLeftWidth"),10) || 0) - (parseInt($(ce).css("paddingRight"),10) || 0) - this.helperProportions.width - this.margins.left,
- co.top+(over ? Math.max(ce.scrollHeight,ce.offsetHeight) : ce.offsetHeight) - (parseInt($(ce).css("borderTopWidth"),10) || 0) - (parseInt($(ce).css("paddingBottom"),10) || 0) - this.helperProportions.height - this.margins.top
- ];
- }
-
- },
-
- _convertPositionTo: function(d, pos) {
-
- if(!pos) pos = this.position;
- var mod = d == "absolute" ? 1 : -1;
- var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName);
-
- return {
- top: (
- pos.top // The absolute mouse position
- + this.offset.relative.top * mod // Only for relative positioned nodes: Relative offset from element to offset parent
- + this.offset.parent.top * mod // The offsetParent's offset without borders (offset + border)
- - ($.browser.safari && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ) * mod)
- ),
- left: (
- pos.left // The absolute mouse position
- + this.offset.relative.left * mod // Only for relative positioned nodes: Relative offset from element to offset parent
- + this.offset.parent.left * mod // The offsetParent's offset without borders (offset + border)
- - ($.browser.safari && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ) * mod)
- )
- };
-
- },
-
- _generatePosition: function(event) {
-
- var o = this.options, scroll = this.cssPosition == 'absolute' && !(this.scrollParent[0] != document && $.ui.contains(this.scrollParent[0], this.offsetParent[0])) ? this.offsetParent : this.scrollParent, scrollIsRootNode = (/(html|body)/i).test(scroll[0].tagName);
-
- // This is another very weird special case that only happens for relative elements:
- // 1. If the css position is relative
- // 2. and the scroll parent is the document or similar to the offset parent
- // we have to refresh the relative offset during the scroll so there are no jumps
- if(this.cssPosition == 'relative' && !(this.scrollParent[0] != document && this.scrollParent[0] != this.offsetParent[0])) {
- this.offset.relative = this._getRelativeOffset();
- }
-
- var pageX = event.pageX;
- var pageY = event.pageY;
-
- /*
- * - Position constraining -
- * Constrain the position to a mix of grid, containment.
- */
-
- if(this.originalPosition) { //If we are not dragging yet, we won't check for options
-
- if(this.containment) {
- if(event.pageX - this.offset.click.left < this.containment[0]) pageX = this.containment[0] + this.offset.click.left;
- if(event.pageY - this.offset.click.top < this.containment[1]) pageY = this.containment[1] + this.offset.click.top;
- if(event.pageX - this.offset.click.left > this.containment[2]) pageX = this.containment[2] + this.offset.click.left;
- if(event.pageY - this.offset.click.top > this.containment[3]) pageY = this.containment[3] + this.offset.click.top;
- }
-
- if(o.grid) {
- var top = this.originalPageY + Math.round((pageY - this.originalPageY) / o.grid[1]) * o.grid[1];
- pageY = this.containment ? (!(top - this.offset.click.top < this.containment[1] || top - this.offset.click.top > this.containment[3]) ? top : (!(top - this.offset.click.top < this.containment[1]) ? top - o.grid[1] : top + o.grid[1])) : top;
-
- var left = this.originalPageX + Math.round((pageX - this.originalPageX) / o.grid[0]) * o.grid[0];
- pageX = this.containment ? (!(left - this.offset.click.left < this.containment[0] || left - this.offset.click.left > this.containment[2]) ? left : (!(left - this.offset.click.left < this.containment[0]) ? left - o.grid[0] : left + o.grid[0])) : left;
- }
-
- }
-
- return {
- top: (
- pageY // The absolute mouse position
- - this.offset.click.top // Click offset (relative to the element)
- - this.offset.relative.top // Only for relative positioned nodes: Relative offset from element to offset parent
- - this.offset.parent.top // The offsetParent's offset without borders (offset + border)
- + ($.browser.safari && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollTop() : ( scrollIsRootNode ? 0 : scroll.scrollTop() ) ))
- ),
- left: (
- pageX // The absolute mouse position
- - this.offset.click.left // Click offset (relative to the element)
- - this.offset.relative.left // Only for relative positioned nodes: Relative offset from element to offset parent
- - this.offset.parent.left // The offsetParent's offset without borders (offset + border)
- + ($.browser.safari && this.cssPosition == 'fixed' ? 0 : ( this.cssPosition == 'fixed' ? -this.scrollParent.scrollLeft() : scrollIsRootNode ? 0 : scroll.scrollLeft() ))
- )
- };
-
- },
-
- _rearrange: function(event, i, a, hardRefresh) {
-
- a ? a[0].appendChild(this.placeholder[0]) : i.item[0].parentNode.insertBefore(this.placeholder[0], (this.direction == 'down' ? i.item[0] : i.item[0].nextSibling));
-
- //Various things done here to improve the performance:
- // 1. we create a setTimeout, that calls refreshPositions
- // 2. on the instance, we have a counter variable, that get's higher after every append
- // 3. on the local scope, we copy the counter variable, and check in the timeout, if it's still the same
- // 4. this lets only the last addition to the timeout stack through
- this.counter = this.counter ? ++this.counter : 1;
- var self = this, counter = this.counter;
-
- window.setTimeout(function() {
- if(counter == self.counter) self.refreshPositions(!hardRefresh); //Precompute after each DOM insertion, NOT on mousemove
- },0);
-
- },
-
- _clear: function(event, noPropagation) {
-
- this.reverting = false;
- // We delay all events that have to be triggered to after the point where the placeholder has been removed and
- // everything else normalized again
- var delayedTriggers = [], self = this;
-
- // We first have to update the dom position of the actual currentItem
- // Note: don't do it if the current item is already removed (by a user), or it gets reappended (see #4088)
- if(!this._noFinalSort && this.currentItem.parent().length) this.placeholder.before(this.currentItem);
- this._noFinalSort = null;
-
- if(this.helper[0] == this.currentItem[0]) {
- for(var i in this._storedCSS) {
- if(this._storedCSS[i] == 'auto' || this._storedCSS[i] == 'static') this._storedCSS[i] = '';
- }
- this.currentItem.css(this._storedCSS).removeClass("ui-sortable-helper");
- } else {
- this.currentItem.show();
- }
-
- if(this.fromOutside && !noPropagation) delayedTriggers.push(function(event) { this._trigger("receive", event, this._uiHash(this.fromOutside)); });
- if((this.fromOutside || this.domPosition.prev != this.currentItem.prev().not(".ui-sortable-helper")[0] || this.domPosition.parent != this.currentItem.parent()[0]) && !noPropagation) delayedTriggers.push(function(event) { this._trigger("update", event, this._uiHash()); }); //Trigger update callback if the DOM position has changed
-
- // Check if the items Container has Changed and trigger appropriate
- // events.
- if (this !== this.currentContainer) {
- if(!noPropagation) {
- delayedTriggers.push(function(event) { this._trigger("remove", event, this._uiHash()); });
- delayedTriggers.push((function(c) { return function(event) { c._trigger("receive", event, this._uiHash(this)); }; }).call(this, this.currentContainer));
- delayedTriggers.push((function(c) { return function(event) { c._trigger("update", event, this._uiHash(this)); }; }).call(this, this.currentContainer));
- }
- }
-
- //Post events to containers
- for (var i = this.containers.length - 1; i >= 0; i--){
- if(!noPropagation) delayedTriggers.push((function(c) { return function(event) { c._trigger("deactivate", event, this._uiHash(this)); }; }).call(this, this.containers[i]));
- if(this.containers[i].containerCache.over) {
- delayedTriggers.push((function(c) { return function(event) { c._trigger("out", event, this._uiHash(this)); }; }).call(this, this.containers[i]));
- this.containers[i].containerCache.over = 0;
- }
- }
-
- //Do what was originally in plugins
- if(this._storedCursor) $('body').css("cursor", this._storedCursor); //Reset cursor
- if(this._storedOpacity) this.helper.css("opacity", this._storedOpacity); //Reset opacity
- if(this._storedZIndex) this.helper.css("zIndex", this._storedZIndex == 'auto' ? '' : this._storedZIndex); //Reset z-index
-
- this.dragging = false;
- if(this.cancelHelperRemoval) {
- if(!noPropagation) {
- this._trigger("beforeStop", event, this._uiHash());
- for (var i=0; i < delayedTriggers.length; i++) { delayedTriggers[i].call(this, event); }; //Trigger all delayed events
- this._trigger("stop", event, this._uiHash());
- }
-
- this.fromOutside = false;
- return false;
- }
-
- if(!noPropagation) this._trigger("beforeStop", event, this._uiHash());
-
- //$(this.placeholder[0]).remove(); would have been the jQuery way - unfortunately, it unbinds ALL events from the original node!
- this.placeholder[0].parentNode.removeChild(this.placeholder[0]);
-
- if(this.helper[0] != this.currentItem[0]) this.helper.remove(); this.helper = null;
-
- if(!noPropagation) {
- for (var i=0; i < delayedTriggers.length; i++) { delayedTriggers[i].call(this, event); }; //Trigger all delayed events
- this._trigger("stop", event, this._uiHash());
- }
-
- this.fromOutside = false;
- return true;
-
- },
-
- _trigger: function() {
- if ($.Widget.prototype._trigger.apply(this, arguments) === false) {
- this.cancel();
- }
- },
-
- _uiHash: function(inst) {
- var self = inst || this;
- return {
- helper: self.helper,
- placeholder: self.placeholder || $([]),
- position: self.position,
- originalPosition: self.originalPosition,
- offset: self.positionAbs,
- item: self.currentItem,
- sender: inst ? inst.element : null
- };
- }
-
-});
-
-$.extend($.ui.sortable, {
- version: "@VERSION"
-});
-
-})(jQuery);