From af15f2c4a192dea02aab9e519defc68c71763ec4 Mon Sep 17 00:00:00 2001 From: yvesf Date: Mon, 22 Nov 2010 14:34:55 +0100 Subject: jquery ui --- .../demos/droppable/accepted-elements.html | 60 +++++++ .../demos/droppable/default.html | 53 ++++++ .../demos/droppable/images/high_tatras.jpg | Bin 0 -> 23627 bytes .../demos/droppable/images/high_tatras2.jpg | Bin 0 -> 26332 bytes .../demos/droppable/images/high_tatras2_min.jpg | Bin 0 -> 2164 bytes .../demos/droppable/images/high_tatras3.jpg | Bin 0 -> 25219 bytes .../demos/droppable/images/high_tatras3_min.jpg | Bin 0 -> 1901 bytes .../demos/droppable/images/high_tatras4.jpg | Bin 0 -> 25656 bytes .../demos/droppable/images/high_tatras4_min.jpg | Bin 0 -> 2541 bytes .../demos/droppable/images/high_tatras_min.jpg | Bin 0 -> 2147 bytes .../development-bundle/demos/droppable/index.html | 24 +++ .../demos/droppable/photo-manager.html | 184 +++++++++++++++++++++ .../demos/droppable/propagation.html | 80 +++++++++ .../development-bundle/demos/droppable/revert.html | 61 +++++++ .../demos/droppable/shopping-cart.html | 101 +++++++++++ .../demos/droppable/visual-feedback.html | 78 +++++++++ 16 files changed, 641 insertions(+) create mode 100644 static/development-bundle/demos/droppable/accepted-elements.html create mode 100644 static/development-bundle/demos/droppable/default.html create mode 100644 static/development-bundle/demos/droppable/images/high_tatras.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras2.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras2_min.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras3.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras3_min.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras4.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras4_min.jpg create mode 100644 static/development-bundle/demos/droppable/images/high_tatras_min.jpg create mode 100644 static/development-bundle/demos/droppable/index.html create mode 100644 static/development-bundle/demos/droppable/photo-manager.html create mode 100644 static/development-bundle/demos/droppable/propagation.html create mode 100644 static/development-bundle/demos/droppable/revert.html create mode 100644 static/development-bundle/demos/droppable/shopping-cart.html create mode 100644 static/development-bundle/demos/droppable/visual-feedback.html (limited to 'static/development-bundle/demos/droppable') diff --git a/static/development-bundle/demos/droppable/accepted-elements.html b/static/development-bundle/demos/droppable/accepted-elements.html new file mode 100644 index 0000000..19928e6 --- /dev/null +++ b/static/development-bundle/demos/droppable/accepted-elements.html @@ -0,0 +1,60 @@ + + + + + jQuery UI Droppable - Accept + + + + + + + + + + + + + +
+ +
+

I'm draggable but can't be dropped

+
+ +
+

Drag me to my target

+
+ +
+

accept: '#draggable'

+
+ +
+ + + +
+

Specify using the accept option which element (or group of elements) is accepted by the target droppable.

+
+ + + diff --git a/static/development-bundle/demos/droppable/default.html b/static/development-bundle/demos/droppable/default.html new file mode 100644 index 0000000..d7f686f --- /dev/null +++ b/static/development-bundle/demos/droppable/default.html @@ -0,0 +1,53 @@ + + + + + jQuery UI Droppable - Default functionality + + + + + + + + + + + + + +
+ +
+

Drag me to my target

+
+ +
+

Drop here

+
+ +
+ + + +
+

Enable any DOM element to be droppable, a target for draggable elements.

+
+ + + diff --git a/static/development-bundle/demos/droppable/images/high_tatras.jpg b/static/development-bundle/demos/droppable/images/high_tatras.jpg new file mode 100644 index 0000000..e2365c2 Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras2.jpg b/static/development-bundle/demos/droppable/images/high_tatras2.jpg new file mode 100644 index 0000000..909024a Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras2.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras2_min.jpg b/static/development-bundle/demos/droppable/images/high_tatras2_min.jpg new file mode 100644 index 0000000..493e082 Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras2_min.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras3.jpg b/static/development-bundle/demos/droppable/images/high_tatras3.jpg new file mode 100644 index 0000000..05a4395 Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras3.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras3_min.jpg b/static/development-bundle/demos/droppable/images/high_tatras3_min.jpg new file mode 100644 index 0000000..4aa96b0 Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras3_min.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras4.jpg b/static/development-bundle/demos/droppable/images/high_tatras4.jpg new file mode 100644 index 0000000..ed753d1 Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras4.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras4_min.jpg b/static/development-bundle/demos/droppable/images/high_tatras4_min.jpg new file mode 100644 index 0000000..794dbdf Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras4_min.jpg differ diff --git a/static/development-bundle/demos/droppable/images/high_tatras_min.jpg b/static/development-bundle/demos/droppable/images/high_tatras_min.jpg new file mode 100644 index 0000000..51e0cde Binary files /dev/null and b/static/development-bundle/demos/droppable/images/high_tatras_min.jpg differ diff --git a/static/development-bundle/demos/droppable/index.html b/static/development-bundle/demos/droppable/index.html new file mode 100644 index 0000000..13ae985 --- /dev/null +++ b/static/development-bundle/demos/droppable/index.html @@ -0,0 +1,24 @@ + + + + + jQuery UI Droppable Demos + + + + +
+

Examples

+ +
+ + + diff --git a/static/development-bundle/demos/droppable/photo-manager.html b/static/development-bundle/demos/droppable/photo-manager.html new file mode 100644 index 0000000..518d919 --- /dev/null +++ b/static/development-bundle/demos/droppable/photo-manager.html @@ -0,0 +1,184 @@ + + + + + jQuery UI Droppable - Simple photo manager + + + + + + + + + + + + + + + + +
+ + + +
+

Trash Trash

+
+ +
+ + +
+

You can delete an image either by dragging it to the Trash or by clicking the trash icon.

+

You can "recycle" an image by dragging it back to the gallery or by clicking the recycle icon.

+

You can view larger image by clicking the zoom icon. jQuery UI dialog widget is used for the modal window.

+
+ + + diff --git a/static/development-bundle/demos/droppable/propagation.html b/static/development-bundle/demos/droppable/propagation.html new file mode 100644 index 0000000..8e0db40 --- /dev/null +++ b/static/development-bundle/demos/droppable/propagation.html @@ -0,0 +1,80 @@ + + + + + jQuery UI Droppable - Prevent propagation + + + + + + + + + + + + + +
+ +
+

Drag me to my target

+
+ +
+

Outer droppable

+
+

Inner droppable (not greedy)

+
+
+ +
+

Outer droppable

+
+

Inner droppable (greedy)

+
+
+ +
+ + + +
+

When working with nested droppables — for example, you may have an editable directory structure displayed as a tree, with folder and document nodes — the greedy option set to true prevents event propagation when a draggable is dropped on a child node (droppable).

+
+ + + diff --git a/static/development-bundle/demos/droppable/revert.html b/static/development-bundle/demos/droppable/revert.html new file mode 100644 index 0000000..e65f78e --- /dev/null +++ b/static/development-bundle/demos/droppable/revert.html @@ -0,0 +1,61 @@ + + + + + jQuery UI Droppable - Revert draggable position + + + + + + + + + + + + + +
+ +
+

I revert when I'm dropped

+
+ +
+

I revert when I'm not dropped

+
+ +
+

Drop me here

+
+ +
+ + + +
+

Return the draggable (or it's helper) to its original location when dragging stops with the boolean revert option set on the draggable.

+
+ + + diff --git a/static/development-bundle/demos/droppable/shopping-cart.html b/static/development-bundle/demos/droppable/shopping-cart.html new file mode 100644 index 0000000..de7dfe2 --- /dev/null +++ b/static/development-bundle/demos/droppable/shopping-cart.html @@ -0,0 +1,101 @@ + + + + + jQuery UI Droppable - Shopping Cart Demo + + + + + + + + + + + + + + + +
+ +
+

Products

+
+

T-Shirts

+
+
    +
  • Lolcat Shirt
    • +
  • Cheezeburger Shirt
    • +
  • Buckit Shirt
    • +
+
+

Bags

+
+
    +
  • Zebra Striped
    • +
  • Black Leather
    • +
  • Alligator Leather
    • +
+
+

Gadgets

+
+
    +
  • iPhone
    • +
  • iPod
    • +
  • iPad
    • +
+
+
+
+ +
+

Shopping Cart

+
+
    +
  1. Add your items here
    2. +
+
+
+ +
+ + + +
+

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.

+
+ + + diff --git a/static/development-bundle/demos/droppable/visual-feedback.html b/static/development-bundle/demos/droppable/visual-feedback.html new file mode 100644 index 0000000..99efdd9 --- /dev/null +++ b/static/development-bundle/demos/droppable/visual-feedback.html @@ -0,0 +1,78 @@ + + + + + jQuery UI Droppable - Visual feedback + + + + + + + + + + + + + +
+ +

Feedback on hover:

+ +
+

Drag me to my target

+
+ +
+

Drop here

+
+ +

Feedback on activating draggable:

+ +
+

Drag me to my target

+
+ +
+

Drop here

+
+ +
+ + + +
+

Change the droppable's appearance on hover, or when the droppable is active (an acceptable draggable is dropped on it). Use the hoverClass or activeClass options to specify respective classes.

+
+ + + -- cgit v1.2.1