git.roojs.org Git - roojs1/blob - examples/dialog/test-2.js

   1 var uploadCropbox = {
   2     dialog : false,
   3     callback : false,
   4
   5     show : function(data, cb)
   6     {
   7         if (!this.dialog) {
   8             this.create();
   9         }
  10
  11         this.callback = cb;
  12         this.data = data;
  13         this.dialog.show();
  14     },
  15
  16     create : function()
  17     {
  18         var _this = this;
  19         this.dialog = Roo.factory({
  20             xns : Roo,
  21             xtype : 'LayoutDialog',
  22             width : 800,
  23             height : 600,
  24             center : {
  25                 xns : Roo,
  26                 xtype : 'LayoutRegion'
  27             },
  28             items : [
  29                 {
  30                     xtype: 'ContentPanel',
  31                     xns: Roo,
  32                     region : "center",
  33                     items : [
  34                         {
  35                             xtype : 'UploadCropbox',
  36                             xns : Roo.dialog,
  37                             minWidth : 720,
  38                             minHeight: 480,
  39                             buttons: [],
  40                             listeners : {
  41                                 render : function (_self)
  42                                 {
  43                                     _this.cropbox = _self;
  44                                 },
  45                                 loadcanvas : function (_self, imageEl)
  46                                 {
  47                                     // if(imageEl.OriginWidth < 720) {
  48                                     //     Roo.Msg.show({
  49                                     //         title: 'Error',
  50                                     //         msg: "Image width should be at least 720",
  51                                     //         buttons: {ok : true},
  52                                     //         fn: function(res) {
  53                                     //             _this.cropbox.selectorEl.dom.click();
  54                                     //         }
  55                                     //     });
  56                                     //     return false;
  57                                     // }
  58                                 }
  59                             }
  60                         }
  61                     ]
  62                 }
  63             ],
  64             buttons : [
  65                 {
  66                     xtype : 'Button',
  67                     xns : Roo,
  68                     text : 'Save',
  69                     listeners : {
  70                         click : function () {
  71                         }
  72                     }
  73                 },
  74                 {
  75                     xtype : 'Button',
  76                     xns : Roo,
  77                     text : 'Cancel',
  78                     listeners : {
  79                         click : function () {
  80                             _this.dialog.hide()
  81                         }
  82                     }
  83                 }
  84             ]
  85         });
  86     }
  87 }
  88
  89 var test = {
  90
  91     dialog : false,
  92     callback : false,
  93
  94     show : function(data, cb)
  95     {
  96         if (!this.dialog) {
  97             this.create();
  98         }
  99
 100         this.callback = cb;
 101         this.data = data;
 102         this.dialog.show();
 103     },
 104
 105     create : function()
 106     {
 107         var _this = this;
 108         this.dialog = Roo.factory({
 109             xns : Roo,
 110             xtype : 'LayoutDialog',
 111             width : 600,
 112             height : 450,
 113             center : {
 114                 xns : Roo,
 115                 xtype : 'LayoutRegion'
 116             },
 117             items : [
 118                 {
 119                     xns : Roo,
 120                     xtype: 'GridPanel',
 121                     region : "center",
 122                     grid : {
 123                         xns : Roo.grid,
 124                         xtype : 'Grid',
 125                         cm : [
 126                             {
 127                                 xns : Roo.grid,
 128                                 xtype : 'ColumnModel',
 129                                 header : 'test'
 130                             }
 131                         ],
 132                         ds : {
 133                             xns: Roo.data,
 134                             xtype: 'Store'
 135                         },
 136                         toolbar : {
 137                             xns: Roo,
 138                             xtype: 'Toolbar',
 139                             items : [
 140                                 {
 141                                     xtype : 'Button',
 142                                     text : 'Add',
 143                                     listeners : {
 144                                         click : function () {
 145                                             uploadCropbox.show();
 146                                             document.body.onfocus = function(e) {
 147                                                 document.body.onfocus = null;
 148                                                 if(!uploadCropbox.cropbox.selectorEl.dom.files.length) {
 149                                                     uploadCropbox.dialog.hide();
 150                                                 }
 151                                             }
 152                                             uploadCropbox.cropbox.selectorEl.dom.click();
 153                                         }
 154                                     }
 155                                 }
 156                             ]
 157                         }
 158                     }
 159                 }
 160             ],
 161         });
 162     }
 163 }
 164
 165 Roo.onReady(function() {
 166
 167     Roo.get('show-dialog-btn').on('click',function () {
 168         test.show({});
 169         console.log(test);
 170     });
 171 });