sync
authorAlan Knowles <alan@roojs.com>
Fri, 13 Nov 2020 08:13:23 +0000 (16:13 +0800)
committerAlan Knowles <alan@roojs.com>
Fri, 13 Nov 2020 08:13:23 +0000 (16:13 +0800)
12 files changed:
Roo/bootstrap/DropTarget.js
buildSDK/dependancy_bootstrap.txt
css-bootstrap4/bootstrap.css.map
css-bootstrap4/bootstrap.min.css.map
css-bootstrap4/roojs-bootstrap-debug.css.map
css-bootstrap4/roojs-bootstrap.css.map
docs/json/roodata.json
docs/src/Roo_bootstrap_Card.js.html
docs/symbols/Roo.bootstrap.Card.json
docs/tree.json
examples/bootstrap/dashboard4.bjs
examples/bootstrap/dashboard4.js

index 7a085f9..5d85006 100644 (file)
@@ -46,35 +46,44 @@ Roo.extend(Roo.bootstrap.DropTarget, Roo.bootstrap.Element,  {
         this.dropZone = new Roo.dd.DropTarget(this.getEl(), {
             ddGroup: this.name,
             listeners : {
-                drop : this.onDrop,
-                enter : this.onEnter,
-                out : this.onOut,
-                over : this.onOver
+                drop : this.dragDrop.createDelegate(this),
+                enter : this.dragEnter.createDelegate(this),
+                out : this.dragOut.createDelegate(this),
+                over : this.dragOver.createDelegate(this)
             }
+            
         });
-         
+        this.dropZone.DDM.useCache = false // so data gets refreshed when we resize stuff
     },
     
-    onDrop : function(source,e,data)
+    dragDrop : function(source,e,data)
     {
         // user has to decide how to impliment this.
-        this.fireEvent('drop', this, source, e ,data);
+        Roo.log('drop');
+        Roo.log(this);
+        //this.fireEvent('drop', this, source, e ,data);
         return false;
     },
     
-    onEnter : function(source)
+    dragEnter : function(n, dd, e, data)
     {
         // probably want to resize the element to match the dropped element..
         Roo.log("enter");
+        this.originalSize = this.el.getSize();
+        this.el.setSize( n.el.getSize());
+        this.dropZone.DDM.refreshCache(this.name);
+        Roo.log([n, dd, e, data]);
     },
     
-    onOut : function(value)
+    dragOut : function(value)
     {
         // resize back to normal
         Roo.log("out");
+        this.el.setSize(this.originalSize);
+        this.dropZone.resetConstraints();
     },
     
-    onOver : function()
+    dragOver : function()
     {
         // ??? do nothing?
     }
index b0c25d5..e123b46 100644 (file)
@@ -1,6 +1,10 @@
 
+
+
 Roo.bootstrap.version
 
+Roo.Shadow
+
 Roo.bootstrap.Component
 Roo.bootstrap.Element
 Roo.bootstrap.DropTarget
index bb4e9b7..2a0a0c2 100644 (file)
@@ -2,7 +2,7 @@
        "version": 3,
        "file": "bootstrap.css",
        "sources": [
-               "../../../../../tmp/scssWfRzkD",
+               "../../../../../tmp/scssLuSgMl",
                "../scss/bootstrap/_functions.scss",
                "../scss/bootstrap/_variables.scss",
                "../scss/bootstrap/bootstrap.scss",
index f498e29..3548b1b 100644 (file)
@@ -2,7 +2,7 @@
        "version": 3,
        "file": "bootstrap.min.css",
        "sources": [
-               "../../../../../tmp/scssWfRzkD",
+               "../../../../../tmp/scssLuSgMl",
                "../scss/bootstrap/_functions.scss",
                "../scss/bootstrap/_variables.scss",
                "../scss/bootstrap/bootstrap.scss",
index d3d07d0..ddcee09 100644 (file)
@@ -2,7 +2,7 @@
        "version": 3,
        "file": "roojs-bootstrap-debug.css",
        "sources": [
-               "../../../../../tmp/scssrewIJB",
+               "../../../../../tmp/scssFRiEBj",
                "../scss/bootstrap/_functions.scss",
                "../scss/bootstrap/_variables.scss",
                "../scss/roojs-bootstrap/roojs-bootstrap.scss",
index 267145b..bb28d29 100644 (file)
@@ -2,7 +2,7 @@
        "version": 3,
        "file": "roojs-bootstrap.css",
        "sources": [
-               "../../../../../tmp/scssrewIJB",
+               "../../../../../tmp/scssFRiEBj",
                "../scss/bootstrap/_functions.scss",
                "../scss/bootstrap/_variables.scss",
                "../scss/roojs-bootstrap/roojs-bootstrap.scss",
index c1c972f..08947b1 100644 (file)
         "static" : false,
         "memberOf" : "Roo.bootstrap.Component"
       },
+      {
+        "name" : "getDropPoint",
+        "type" : "function",
+        "desc" : "Decide whether to drop above or below a View node.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : ""
+      },
       {
         "name" : "getEl",
         "type" : "function",
         "static" : false,
         "memberOf" : "Roo.Component"
       },
+      {
+        "name" : "getTargetFromEvent",
+        "type" : "function",
+        "desc" : "Part of the Roo.dd.DropZone interface. If no target node is found, the\n\twhole Element becomes the target, and this causes the drop gesture to append.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : ""
+      },
       {
         "name" : "getVisibilityEl",
         "type" : "function",
       }
     ]
   },
+  "Roo.bootstrap.DropTarget" : {
+    "props" : [
+      {
+        "name" : "actionMode",
+        "type" : "String",
+        "desc" : "which property holds the element that used for  hide() / show() / disable() / enable()\ndefault is 'el' for forms you probably want to set this to fieldEl",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "allowDomMove",
+        "type" : "Boolean",
+        "desc" : "Whether the component can move the Dom node when rendering (defaults to true).",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "can_build_overlaid",
+        "type" : "Boolean",
+        "desc" : "True if element can be rebuild from a HTML page",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "clickable",
+        "type" : "Boolean",
+        "desc" : "e) default false",
+        "memberOf" : "Roo.bootstrap.Element",
+        "optvals" : [
+          "true",
+          "false"
+        ]
+      },
+      {
+        "name" : "cls",
+        "type" : "String",
+        "desc" : "class of the element",
+        "memberOf" : "Roo.bootstrap.Element"
+      },
+      {
+        "name" : "container_method",
+        "type" : "string",
+        "desc" : "method to fetch parents container element (used by NavHeaderbar -  getHeaderChildContainer)",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "dataId",
+        "type" : "string",
+        "desc" : "cutomer id",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "disableClass",
+        "type" : "String",
+        "desc" : "CSS class added to the component when it is disabled (defaults to \"x-item-disabled\").",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "hideMode",
+        "type" : "String",
+        "desc" : "y)\nHow this component should hidden. Supported values are\n\"visibility\" (css visibility), \"offsets\" (negative offset position) and\n\"display\" (css display) - defaults to \"display\".",
+        "memberOf" : "Roo.Component",
+        "optvals" : [
+          "display",
+          "visibility"
+        ]
+      },
+      {
+        "name" : "html",
+        "type" : "String",
+        "desc" : "contents of the element",
+        "memberOf" : "Roo.bootstrap.Element"
+      },
+      {
+        "name" : "listeners",
+        "type" : "Object",
+        "desc" : "list of events and functions to call for this object, \nFor example :\n<pre><code>\n    listeners :  { \n       'click' : function(e) {\n           ..... \n        } ,\n        .... \n    } \n  </code></pre>",
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "name",
+        "type" : "string",
+        "desc" : "dropable name",
+        "memberOf" : ""
+      },
+      {
+        "name" : "preventDefault",
+        "type" : "Boolean",
+        "desc" : "e) default false",
+        "memberOf" : "Roo.bootstrap.Element",
+        "optvals" : [
+          "true",
+          "false"
+        ]
+      },
+      {
+        "name" : "style",
+        "type" : "String",
+        "desc" : "any extra css",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "tag",
+        "type" : "String",
+        "desc" : "tag of the element",
+        "memberOf" : "Roo.bootstrap.Element"
+      },
+      {
+        "name" : "tooltip",
+        "type" : "string",
+        "desc" : "Text for the tooltip",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "visibilityEl",
+        "type" : "string|object",
+        "desc" : "t) What element to use for visibility (@see getVisibilityEl())",
+        "memberOf" : "Roo.bootstrap.Component",
+        "optvals" : [
+          "el",
+          "parent"
+        ]
+      },
+      {
+        "name" : "xattr",
+        "type" : "Object",
+        "desc" : "extra attributes to add to 'element' (used by builder to store stuff.)",
+        "memberOf" : "Roo.bootstrap.Component"
+      }
+    ],
+    "events" : [
+      {
+        "name" : "beforedestroy",
+        "type" : "function",
+        "desc" : "Fires before the component is destroyed. Return false to stop the destroy.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "beforehide",
+        "type" : "function",
+        "desc" : "Fires before the component is hidden. Return false to stop the hide.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "beforerender",
+        "type" : "function",
+        "desc" : "Fires before the component is rendered. Return false to stop the render.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "beforeshow",
+        "type" : "function",
+        "desc" : "Fires before the component is shown.  Return false to stop the show.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "childrenrendered",
+        "type" : "function",
+        "desc" : "Fires when the children have been rendered..",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "click",
+        "type" : "function",
+        "desc" : "When a element is chick",
+        "sig" : "function (_self, e)\n{\n\n}",
+        "memberOf" : ""
+      },
+      {
+        "name" : "destroy",
+        "type" : "function",
+        "desc" : "Fires after the component is destroyed.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "disable",
+        "type" : "function",
+        "desc" : "Fires after the component is disabled.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "enable",
+        "type" : "function",
+        "desc" : "Fires after the component is enabled.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "hide",
+        "type" : "function",
+        "desc" : "Fires after the component is hidden.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "render",
+        "type" : "function",
+        "desc" : "Fires after the component is rendered.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "show",
+        "type" : "function",
+        "desc" : "Fires after the component is shown.",
+        "sig" : "function (_self)\n{\n\n}",
+        "memberOf" : "Roo.Component"
+      }
+    ],
+    "methods" : [
+      {
+        "name" : "addEvents",
+        "type" : "function",
+        "desc" : "Used to define events on this Observable",
+        "sig" : "(object)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "addListener",
+        "type" : "function",
+        "desc" : "Appends an event handler to this component",
+        "sig" : "(eventName, handler, scope, options)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "capture",
+        "type" : "function",
+        "desc" : "Starts capture on the specified Observable. All events will be passed\nto the supplied function with the event name + standard signature of the event\n<b>before</b> the event is fired. If the supplied function returns false,\nthe event will not fire.",
+        "sig" : "(o, fn, scope)",
+        "static" : true,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "destroy",
+        "type" : "function",
+        "desc" : "Destroys this component by purging any event listeners, removing the component's element from the DOM,\nremoving the component from its {@link Roo.Container} (if applicable) and unregistering it from {@link Roo.ComponentMgr}.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "disable",
+        "type" : "function",
+        "desc" : "Disable this component.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "enable",
+        "type" : "function",
+        "desc" : "Enable this component.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "fireEvent",
+        "type" : "function",
+        "desc" : "Fires the specified event with the passed parameters (minus the event name).",
+        "sig" : "(eventName, args)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "focus",
+        "type" : "function",
+        "desc" : "Try to focus this component.",
+        "sig" : "(selectText)",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "getChildContainer",
+        "type" : "function",
+        "desc" : "Fetch the element to add children to",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "getEl",
+        "type" : "function",
+        "desc" : "Returns the underlying {@link Roo.Element}.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "getId",
+        "type" : "function",
+        "desc" : "Returns the id of this component.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "getVisibilityEl",
+        "type" : "function",
+        "desc" : "Get the element that will be used to show or hide",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "hasListener",
+        "type" : "function",
+        "desc" : "Checks to see if this object has any listeners for a specified event",
+        "sig" : "(eventName)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "hide",
+        "type" : "function",
+        "desc" : "Hide a component - adds 'hidden' class",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "initEvents",
+        "type" : "function",
+        "desc" : "Initialize Events for the element",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "isVisible",
+        "type" : "function",
+        "desc" : "Returns true if this component is visible.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "on",
+        "type" : "function",
+        "desc" : "Appends an event handler to this element (shorthand for addListener)",
+        "sig" : "(eventName, handler, scope, options)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "purgeListeners",
+        "type" : "function",
+        "desc" : "Removes all listeners for this object",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "releaseCapture",
+        "type" : "function",
+        "desc" : "Removes <b>all</b> added captures from the Observable.",
+        "sig" : "(o)",
+        "static" : true,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "removeListener",
+        "type" : "function",
+        "desc" : "Removes a listener",
+        "sig" : "(eventName, handler, scope)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      },
+      {
+        "name" : "render",
+        "type" : "function",
+        "desc" : "If this is a lazy rendering component, render it to its container element.",
+        "sig" : "(container)",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "setDisabled",
+        "type" : "function",
+        "desc" : "Convenience function for setting disabled/enabled by boolean.",
+        "sig" : "(disabled)",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "setVisibilityEl",
+        "type" : "function",
+        "desc" : "Set the element that will be used to show or hide",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "setVisible",
+        "type" : "function",
+        "desc" : "Convenience function to hide or show this component by boolean.",
+        "sig" : "(visible)",
+        "static" : false,
+        "memberOf" : "Roo.Component"
+      },
+      {
+        "name" : "show",
+        "type" : "function",
+        "desc" : "Show a component - removes 'hidden' class",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "tooltipEl",
+        "type" : "function",
+        "desc" : "Fetch the element to display the tooltip on.",
+        "sig" : "()\n{\n\n}",
+        "static" : false,
+        "memberOf" : "Roo.bootstrap.Component"
+      },
+      {
+        "name" : "un",
+        "type" : "function",
+        "desc" : "Removes a listener (shorthand for removeListener)",
+        "sig" : "(eventName, handler, scope)",
+        "static" : false,
+        "memberOf" : "Roo.util.Observable"
+      }
+    ]
+  },
   "Roo.bootstrap.Element" : {
     "props" : [
       {
index f0b093e..c95594e 100644 (file)
@@ -45,7 +45,9 @@
  * @cfg {String} display_xl (none|inline|inline-block|block|table|table-cell|table-row|flex|inline-flex)
  
  * @config {Boolean} dragable  if this card can be dragged.
- * @config {Boolean} drag_group  group for drag
+ * @config {String} drag_group  group for drag
+ * @config {Boolean} dropable  if this card can recieve other cards being dropped onto it..
+ * @config {String} drop_group  group for drag
  * 
  
  * @constructor
 
     </span><span class="jsdoc-var">dragable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
     </span><span class="jsdoc-var">drag_group </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
-
+    </span><span class="jsdoc-var">dropable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
+    </span><span class="jsdoc-var">drop_group </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
     </span><span class="jsdoc-var">childContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 
     </span><span class="jsdoc-var">layoutCls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 
     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
     {
-        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dragable</span><span class="jsdoc-syntax">){
-             </span><span class="jsdoc-var">this.dragZone </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DragZone</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">(), {
+
+       </span><span class="jsdoc-var">this.bodyEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getChildContainer</span><span class="jsdoc-syntax">();
+       </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dragable</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.dragZone </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DragZone</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getEl</span><span class="jsdoc-syntax">(), {
                     </span><span class="jsdoc-var">containerScroll</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
                     </span><span class="jsdoc-var">ddGroup</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.drag_group </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'default_card_drag_group'
             </span><span class="jsdoc-syntax">});
             </span><span class="jsdoc-var">this.dragZone.getDragData </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getDragData.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
         }
-
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dropable</span><span class="jsdoc-syntax">) {
+           </span><span class="jsdoc-var">this.dropZone </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DropZone</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getChildContainer</span><span class="jsdoc-syntax">(), {
+                   </span><span class="jsdoc-var">containerScroll</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
+                   </span><span class="jsdoc-var">ddGroup</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.drop_group </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'default_card_drag_group'
+           </span><span class="jsdoc-syntax">});
+           </span><span class="jsdoc-var">this.dropZone.getTargetFromEvent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getTargetFromEvent.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+           </span><span class="jsdoc-var">this.dropZone.onNodeEnter </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.onNodeEnter.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+           </span><span class="jsdoc-var">this.dropZone.onNodeOver </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.onNodeOver.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+           </span><span class="jsdoc-var">this.dropZone.onNodeOut </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.onNodeOut.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+           </span><span class="jsdoc-var">this.dropZone.onNodeDrop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.onNodeDrop.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+       }
 
 
     },
             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dragData</span><span class="jsdoc-syntax">;
         }
         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
-    }
+    },
+    </span><span class="jsdoc-comment">/**
+ *     Part of the Roo.dd.DropZone interface. If no target node is found, the
+ *     whole Element becomes the target, and this causes the drop gesture to append.
+ */
+    </span><span class="jsdoc-var">getTargetFromEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
+    {
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">target </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">();
+       </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">target </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">) &amp;&amp; (</span><span class="jsdoc-var">target.parentNode </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.bodyEl.dom</span><span class="jsdoc-syntax">)) {
+           </span><span class="jsdoc-var">target </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">target.parentNode</span><span class="jsdoc-syntax">;
+       }
+       </span><span class="jsdoc-comment">// see if target is one of the 'cards'...
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ctarget </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cards </span><span class="jsdoc-syntax">= [];
+       </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.items.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.xtype </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'Card'</span><span class="jsdoc-syntax">) {
+               </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
+           }
+           </span><span class="jsdoc-var">cards.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.el.dom</span><span class="jsdoc-syntax">)
+           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.el.dom</span><span class="jsdoc-syntax">) {
+               </span><span class="jsdoc-var">ctarget </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">;
+           }
+       }
+
+       </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">ctarget</span><span class="jsdoc-syntax">) {
+           </span><span class="jsdoc-var">ctarget </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cards</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">cards.length</span><span class="jsdoc-syntax">-1] || </span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">;
+       }
+
+
+       </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'getTargetFromEvent'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ctarget</span><span class="jsdoc-syntax">]);
+       </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ctarget</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">onNodeEnter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">){
+       </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
+    },
+    </span><span class="jsdoc-var">onNodeOver </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">)
+    {
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getDropPoint</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">);
+       </span><span class="jsdoc-comment">// set the insert point style on the target node
+       //var dragElClass = this.dropNotAllowed;
+       </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pt</span><span class="jsdoc-syntax">) {
+           </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pt</span><span class="jsdoc-syntax">);
+       }
+       </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">//dragElClass;
+    </span><span class="jsdoc-syntax">},
+    </span><span class="jsdoc-var">onNodeOut </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">){
+       </span><span class="jsdoc-comment">//this.removeDropIndicators(n);
+    </span><span class="jsdoc-syntax">},
+    </span><span class="jsdoc-var">onNodeDrop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">)
+    {
+       </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
+
+       </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;drop&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">data</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
+               </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
+       }
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getDropPoint</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">);
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">insertAt </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">this.bodyEl.dom</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.items.length </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">n.nodeIndex</span><span class="jsdoc-syntax">;
+       </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pt </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;below&quot;</span><span class="jsdoc-syntax">) {
+           </span><span class="jsdoc-var">insertAt</span><span class="jsdoc-syntax">++;
+       }
+       </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.items.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+           </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
+           </span><span class="jsdoc-comment">//var dup = this.store.getById(r.id);
+           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dup </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">dd </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.dragZone</span><span class="jsdoc-syntax">)) {
+                   </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.store.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dup</span><span class="jsdoc-syntax">)))</span><span class="jsdoc-var">.frame</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;red&quot;</span><span class="jsdoc-syntax">, 1);
+           } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
+               </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">data.copy</span><span class="jsdoc-syntax">) {
+                   </span><span class="jsdoc-var">this.store.insert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">insertAt</span><span class="jsdoc-syntax">++, </span><span class="jsdoc-var">r.copy</span><span class="jsdoc-syntax">());
+               } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
+                   </span><span class="jsdoc-var">data.source.isDirtyFlag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+                   </span><span class="jsdoc-var">r.store.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">);
+                   </span><span class="jsdoc-var">this.store.insert</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">insertAt</span><span class="jsdoc-syntax">++, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">);
+               }
+               </span><span class="jsdoc-var">this.isDirtyFlag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+           }
+       }
+       </span><span class="jsdoc-var">this.dragZone.cachedTarget </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
+       </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**     Decide whether to drop above or below a View node. */
+    </span><span class="jsdoc-var">getDropPoint </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">)
+    {
+       </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">this.bodyEl.dom</span><span class="jsdoc-syntax">) {
+               </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">&quot;above&quot;</span><span class="jsdoc-syntax">;
+       }
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom.getY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">n.offsetHeight</span><span class="jsdoc-syntax">;
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">) / 2;
+       </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Event.getPageY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
+       </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&lt;= </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">) {
+               </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">&quot;above&quot;</span><span class="jsdoc-syntax">;
+       }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+               </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">&quot;below&quot;</span><span class="jsdoc-syntax">;
+       }
+    },
+
 
 });
 
index 8695b20..f160760 100644 (file)
     }
   ],
   "methods" : [
+    {
+      "name" : "getDropPoint",
+      "desc" : "Decide whether to drop above or below a View node.",
+      "isStatic" : false,
+      "isConstructor" : false,
+      "isPrivate" : false,
+      "memberOf" : "Roo.bootstrap.Card",
+      "example" : "",
+      "deprecated" : "",
+      "since" : "",
+      "see" : "",
+      "params" : [],
+      "returns" : []
+    },
+    {
+      "name" : "getTargetFromEvent",
+      "desc" : "Part of the Roo.dd.DropZone interface. If no target node is found, the\n\twhole Element becomes the target, and this causes the drop gesture to append.",
+      "isStatic" : false,
+      "isConstructor" : false,
+      "isPrivate" : false,
+      "memberOf" : "Roo.bootstrap.Card",
+      "example" : "",
+      "deprecated" : "",
+      "since" : "",
+      "see" : "",
+      "params" : [],
+      "returns" : []
+    },
     {
       "name" : "tooltipEl",
       "desc" : "Fetch the element to display the tooltip on.",
index 4fce9b8..048a168 100644 (file)
             "cn" : [],
             "is_class" : true
           },
+          {
+            "name" : "Roo.bootstrap.DropTarget",
+            "cn" : [],
+            "is_class" : true
+          },
           {
             "name" : "Roo.bootstrap.Element",
             "cn" : [],
index 494b55b..32a1479 100644 (file)
        "$ xns" : "Roo.bootstrap",
        "items" : [
         {
-         "Number md" : 3,
-         "xtype" : "Column",
+         "String header" : "example 1",
+         "String footer" : "a footer",
+         "String cls" : "col-xs-12 column col-12",
+         "String weight" : "danger",
+         "xtype" : "Card",
          "$ xns" : "Roo.bootstrap",
+         "String style" : "max-width:300px;margin: 0 12px;",
+         "bool dropable" : true,
+         "string drop_group" : "cards",
          "items" : [
           {
-           "String header" : "example 1",
-           "String footer" : "a footer",
-           "String weight" : "danger",
+           "String header" : "ticket 1",
+           "string drag_group" : "cards",
+           "String weight" : "light",
+           "String margin_bottom" : 3,
            "xtype" : "Card",
            "$ xns" : "Roo.bootstrap",
-           "String style" : " ",
-           "bool dropable" : true,
-           "string drop_group" : "cards",
-           "items" : [
-            {
-             "String header" : "ticket 1",
-             "string drag_group" : "cards",
-             "String weight" : "light",
-             "String margin_bottom" : 3,
-             "xtype" : "Card",
-             "$ xns" : "Roo.bootstrap",
-             "String html" : "body goes here",
-             "bool dragable" : true
-            },
-            {
-             "String header" : "ticket 1",
-             "string drag_group" : "cards",
-             "String weight" : "light",
-             "String margin_bottom" : 3,
-             "xtype" : "Card",
-             "$ xns" : "Roo.bootstrap",
-             "String html" : "body goes here",
-             "bool dragable" : true
-            },
-            {
-             "String weight" : "primary",
-             "xtype" : "Button",
-             "$ xns" : "Roo.bootstrap",
-             "String html" : "Add Issue"
-            }
-           ]
+           "String html" : "body goes here",
+           "bool dragable" : true
+          },
+          {
+           "String header" : "ticket 1",
+           "string drag_group" : "cards",
+           "String weight" : "light",
+           "String margin_bottom" : 3,
+           "xtype" : "Card",
+           "$ xns" : "Roo.bootstrap",
+           "String html" : "body goes here",
+           "bool dragable" : true
+          },
+          {
+           "String weight" : "primary",
+           "xtype" : "Button",
+           "$ xns" : "Roo.bootstrap",
+           "String html" : "Add Issue"
           }
          ]
         },
         {
-         "Number md" : 3,
-         "xtype" : "Column",
+         "String header" : "example 1",
+         "String footer" : "a footer",
+         "String cls" : "column col-xs-12 col-12",
+         "String weight" : "danger",
+         "xtype" : "Card",
          "$ xns" : "Roo.bootstrap",
+         "String style" : "max-width:300px;margin: 0 12px;",
          "items" : [
           {
-           "String header" : "example 1",
-           "String footer" : "a footer",
-           "String weight" : "danger",
+           "String header" : "ticket 1",
+           "string drag_group" : "cards",
+           "String weight" : "light",
+           "String margin_bottom" : 3,
            "xtype" : "Card",
            "$ xns" : "Roo.bootstrap",
-           "String style" : " ",
-           "items" : [
-            {
-             "String header" : "ticket 1",
-             "string drag_group" : "cards",
-             "String weight" : "light",
-             "String margin_bottom" : 3,
-             "xtype" : "Card",
-             "$ xns" : "Roo.bootstrap",
-             "String html" : "body goes here",
-             "bool dragable" : true
-            },
-            {
-             "String weight" : "primary",
-             "xtype" : "Button",
-             "$ xns" : "Roo.bootstrap",
-             "String html" : "Add Issue"
-            }
-           ]
+           "String html" : "body goes here",
+           "bool dragable" : true
+          },
+          {
+           "String weight" : "primary",
+           "xtype" : "Button",
+           "$ xns" : "Roo.bootstrap",
+           "String html" : "Add Issue"
           }
          ]
         }
index 968e180..8d55f6f 100644 (file)
@@ -41,89 +41,75 @@ dashboard4 = new Roo.XComponent({
        '|xns' : 'Roo.bootstrap',
        items  : [
         {
-         xtype : 'Column',
-         md : 3,
+         xtype : 'Card',
+         cls : 'col-xs-12 column col-12',
+         dropable : true,
+         drop_group : 'cards',
+         footer : 'a footer',
+         header : _this._strings['e93b3fa481be3932aa08bd68c3deee70'] /* example 1 */,
+         style : 'max-width:300px;margin: 0 12px;',
+         weight : 'danger',
          xns : Roo.bootstrap,
          '|xns' : 'Roo.bootstrap',
          items  : [
           {
            xtype : 'Card',
-           dropable : true,
-           drop_group : 'cards',
-           footer : 'a footer',
-           header : _this._strings['e93b3fa481be3932aa08bd68c3deee70'] /* example 1 */,
-           style : ' ',
-           weight : 'danger',
+           dragable : true,
+           drag_group : 'cards',
+           header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
+           html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
+           margin_bottom : 3,
+           weight : 'light',
            xns : Roo.bootstrap,
-           '|xns' : 'Roo.bootstrap',
-           items  : [
-            {
-             xtype : 'Card',
-             dragable : true,
-             drag_group : 'cards',
-             header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
-             html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
-             margin_bottom : 3,
-             weight : 'light',
-             xns : Roo.bootstrap,
-             '|xns' : 'Roo.bootstrap'
-            },
-            {
-             xtype : 'Card',
-             dragable : true,
-             drag_group : 'cards',
-             header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
-             html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
-             margin_bottom : 3,
-             weight : 'light',
-             xns : Roo.bootstrap,
-             '|xns' : 'Roo.bootstrap'
-            },
-            {
-             xtype : 'Button',
-             html : _this._strings['9cf863d802aca813531ca28b319ead90'] /* Add Issue */,
-             weight : 'primary',
-             xns : Roo.bootstrap,
-             '|xns' : 'Roo.bootstrap'
-            }
-           ]
+           '|xns' : 'Roo.bootstrap'
+          },
+          {
+           xtype : 'Card',
+           dragable : true,
+           drag_group : 'cards',
+           header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
+           html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
+           margin_bottom : 3,
+           weight : 'light',
+           xns : Roo.bootstrap,
+           '|xns' : 'Roo.bootstrap'
+          },
+          {
+           xtype : 'Button',
+           html : _this._strings['9cf863d802aca813531ca28b319ead90'] /* Add Issue */,
+           weight : 'primary',
+           xns : Roo.bootstrap,
+           '|xns' : 'Roo.bootstrap'
           }
          ]
         },
         {
-         xtype : 'Column',
-         md : 3,
+         xtype : 'Card',
+         cls : 'column col-xs-12 col-12',
+         footer : 'a footer',
+         header : _this._strings['e93b3fa481be3932aa08bd68c3deee70'] /* example 1 */,
+         style : 'max-width:300px;margin: 0 12px;',
+         weight : 'danger',
          xns : Roo.bootstrap,
          '|xns' : 'Roo.bootstrap',
          items  : [
           {
            xtype : 'Card',
-           footer : 'a footer',
-           header : _this._strings['e93b3fa481be3932aa08bd68c3deee70'] /* example 1 */,
-           style : ' ',
-           weight : 'danger',
+           dragable : true,
+           drag_group : 'cards',
+           header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
+           html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
+           margin_bottom : 3,
+           weight : 'light',
+           xns : Roo.bootstrap,
+           '|xns' : 'Roo.bootstrap'
+          },
+          {
+           xtype : 'Button',
+           html : _this._strings['9cf863d802aca813531ca28b319ead90'] /* Add Issue */,
+           weight : 'primary',
            xns : Roo.bootstrap,
-           '|xns' : 'Roo.bootstrap',
-           items  : [
-            {
-             xtype : 'Card',
-             dragable : true,
-             drag_group : 'cards',
-             header : _this._strings['d9fb0367346d21079a1c52d72da61c9f'] /* ticket 1 */,
-             html : _this._strings['60ee66eb2cd31823032664c2e9a79fd5'] /* body goes here */,
-             margin_bottom : 3,
-             weight : 'light',
-             xns : Roo.bootstrap,
-             '|xns' : 'Roo.bootstrap'
-            },
-            {
-             xtype : 'Button',
-             html : _this._strings['9cf863d802aca813531ca28b319ead90'] /* Add Issue */,
-             weight : 'primary',
-             xns : Roo.bootstrap,
-             '|xns' : 'Roo.bootstrap'
-            }
-           ]
+           '|xns' : 'Roo.bootstrap'
           }
          ]
         }