From c2a5db111afe60f3bd5b60466b6b83e0968e7ddd Mon Sep 17 00:00:00 2001
From: Alan Knowles <alan@roojs.com>
Date: Thu, 11 Feb 2021 12:40:23 +0800
Subject: [PATCH] sync

---
 examples/bootstrap/modal-layout.js    | 168 ++++++++++++++++++++++++++
 examples/bootstrap4/modal-layout.html |  38 ++++++
 2 files changed, 206 insertions(+)
 create mode 100644 examples/bootstrap/modal-layout.js
 create mode 100644 examples/bootstrap4/modal-layout.html

diff --git a/examples/bootstrap/modal-layout.js b/examples/bootstrap/modal-layout.js
new file mode 100644
index 0000000000..628250b5d8
--- /dev/null
+++ b/examples/bootstrap/modal-layout.js
@@ -0,0 +1,168 @@
+//<script type="text/javascript">
+
+// Auto generated file - created by app.Builder.js- do not edit directly (at present!)
+
+Roo.namespace('Pman.Dialog');
+
+Pman.Dialog.FileView= function() {}
+Roo.apply(Pman.Dialog.FileView.prototype, {
+
+ _strings : {
+  'd7778d0c64b6ba21494c97f77a66885a' :"Filter",
+  '689202409e48743b914713f96d93947c' :"Value",
+  '5b31f5026bb07829f7a815555dbf91ae' :"File Preview XXX.pdf"
+ },
+
+ dialog : false,
+ callback:  false,
+
+ show : function(data, cb)
+ {
+  if (!this.dialog) {
+   this.create();
+  }
+
+  this.callback = cb;
+  this.data = data;
+  this.dialog.show(this.data._el);
+  if (this.form) {
+   this.form.reset();
+   this.form.setValues(data);
+   this.form.fireEvent('actioncomplete', this.form,  { type: 'setdata', data: data });
+  }
+
+ },
+
+ create : function()
+ {
+  var _this = this;
+  this.dialog = Roo.factory({
+    xtype : 'Modal',
+    fitwindow : true,
+    title : _this._strings['5b31f5026bb07829f7a815555dbf91ae'] /* File Preview XXX.pdf */,
+    listeners : {
+     show : function (_self)
+      {
+          _this.dialog.items[0].getRegion('center').showPanel(0);
+      }
+    },
+    xns : Roo.bootstrap,
+    '|xns' : 'Roo.bootstrap',
+    items  : [
+     {
+      xtype : 'Border',
+      xns : Roo.bootstrap.layout,
+      '|xns' : 'Roo.bootstrap.layout',
+      center : {
+       xtype : 'Region',
+       xns : Roo.bootstrap.layout,
+       '|xns' : 'Roo.bootstrap.layout'
+      },
+      west : {
+       xtype : 'Region',
+       split : true,
+       width : 250,
+       xns : Roo.bootstrap.layout,
+       '|xns' : 'Roo.bootstrap.layout'
+      },
+      items  : [
+       {
+        xtype : 'Grid',
+        fitContainer : true,
+        fitToFrame : true,
+        region : 'west',
+        listeners : {
+         activate : function (_self)
+          {
+            
+          }
+        },
+        xns : Roo.bootstrap.panel,
+        '|xns' : 'Roo.bootstrap.panel',
+        grid : {
+         xtype : 'Table',
+         rowSelection : true,
+         striped : true,
+         listeners : {
+          render : function (_self)
+           {
+               _this.grid = this;
+           }
+         },
+         xns : Roo.bootstrap,
+         '|xns' : 'Roo.bootstrap',
+         store : {
+          xtype : 'SimpleStore',
+          data : [
+              [ 'Project:', '' ],
+              [ 'ER No.:', '' ],
+              [ 'School Code:', '' ],
+              [ 'District:', '' ] 
+          ],
+          fields : [ 'filter' , 'value' ],
+          isLocal : true,
+          xns : Roo.data,
+          '|xns' : 'Roo.data'
+         },
+         sm : {
+          xtype : 'RowSelectionModel',
+          singleSelect : true,
+          listeners : {
+           selectionchange : function (_self)
+            {
+                _this.addBtn.hide();
+                _this.removeBtn.hide();
+            
+                var s = this.getSelected();
+                if (!s) { return; }
+            
+                _this.preview.setUrl( baseURL + '/Preview/' + s.data.id + '.html'); 
+                
+                if (s.data.is_approved) { 
+                    _this.removeBtn.show();
+                } else {
+                    _this.addBtn.show();
+                }
+                
+            }
+          },
+          xns : Roo.bootstrap.Table,
+          '|xns' : 'Roo.bootstrap.Table'
+         },
+         cm : [
+          {
+           xtype : 'ColumnModel',
+           dataIndex : 'fname',
+           header : _this._strings['d7778d0c64b6ba21494c97f77a66885a'] /* Filter */,
+           sm : 6,
+           xns : Roo.grid,
+           '|xns' : 'Roo.grid'
+          },
+          {
+           xtype : 'ColumnModel',
+           dataIndex : 'is_approved',
+           header : _this._strings['689202409e48743b914713f96d93947c'] /* Value */,
+           renderer : function(v,x,r) {
+               
+               return v;
+           },
+           sm : 6,
+           xns : Roo.grid,
+           '|xns' : 'Roo.grid'
+          }
+         ]
+        }
+       },
+       {
+        xtype : 'Content',
+        region : 'center',
+        xns : Roo.bootstrap.panel,
+        '|xns' : 'Roo.bootstrap.panel'
+       }
+      ]
+     }
+    ]
+   }  );
+ }
+});
+Roo.apply(Pman.Dialog.FileView, Pman.Dialog.FileView.prototype);
diff --git a/examples/bootstrap4/modal-layout.html b/examples/bootstrap4/modal-layout.html
new file mode 100644
index 0000000000..1898e7b972
--- /dev/null
+++ b/examples/bootstrap4/modal-layout.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Bootstrap Modal Dialog test</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    
+    <!-- Bootstrap -->
+    <link rel="stylesheet" href="../../css-bootstrap4/sb-admin-2.min.css">
+    <link rel="stylesheet" href="../../css-bootstrap4/roojs-bootstrap.css">
+     <link rel="stylesheet" href="../../fonts/font-awesome.css"> 
+         
+        
+         
+        
+        
+    <script type="text/javascript" src="../../roojs-core-debug.js"></script>
+    <script type="text/javascript" src="../../roojs-bootstrap-debug.js"></script>
+    <script type="text/javascript" src="../../Roo/bootstrap/Modal.js"></script>
+
+         <script type="text/javascript">
+            rootURL = '/';
+         </script>
+    <!-- test code -->
+    <script type="text/javascript" src="../bootstrap/modal-layout.js"></script>
+  </head>
+  
+  <body id="body">
+  
+  </body>
+    <script type="text/javascript">
+       Roo.onReady(function() {
+       
+          Pman.Dialog.FileView.show({   });
+          
+      });
+
+    </script>
+</html>
\ No newline at end of file
-- 
2.39.2