examples/organizer/organizer.html

   1 <html>\r
   2 <head>\r
   3 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">\r
   4 <title>Organizing Images into Albums</title>\r
   5 <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />\r
   6 \r
   7     <!-- GC -->\r
   8         <!-- LIBS -->\r
   9         <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>\r
  10         <!-- ENDLIBS -->\r
  11 \r
  12     <script type="text/javascript" src="../../ext-all.js"></script>\r
  13 \r
  14      <script type="text/javascript" src="../view/data-view-plugins.js"></script>\r
  15 <script type="text/javascript" src="organizer.js"></script>\r
  16 \r
  17 <!-- Common Styles for the examples -->\r
  18 <link rel="stylesheet" type="text/css" href="../shared/examples.css" />\r
  19 \r
  20 <link rel="stylesheet" type="text/css" href="organizer.css" />\r
  21 </head>\r
  22 <body>\r
  23 <script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->\r
  24 <h1>Organizing Images into Albums</h1>\r
  25 <p>This example shows demonstrates how you can drop anything into the tree.</p>\r
  26 <p>This example also shows how a customized DragZone can be \r
  27 applied to a JsonView to get automatic lightweight drag and drop of asynchronously loaded data.</p>\r
  28 <p>The js is not minified so it is readable. See <a href="organizer.js">organizer.js</a>. The multi image drag drop added a little complexity to the code, but hopefully it is still easy to follow.\r
  29 <p>For simplicity, there is no validation on the names you enter in the tree node editor and you can drag the same picture \r
  30 into an album as many times as you want.</p>   \r
  31 <p>Hold shift/control to select multiple images in the main images view. You can drag those images into the tree.</b>\r
  32 \r
  33 <div id="layout"></div>\r
  34 <br /><br /><br /><br /><br />\r
  35 </body>\r
  36 </html>\r