Form.view.ViewportModel #4082

Author: tobiu

apps/form/store/SideNav.mjs

@@ -12,18 +12,10 @@ class SideNav extends Store {
          * @protected
          */
         className: 'Form.store.SideNav',
-        /**
-         * @member {Boolean} autoLoad=true
-         */
-        autoLoad: true,
         /**
          * @member {Neo.data.Model} model=SideNavModel
          */
-        model: SideNavModel,
-        /**
-         * @member {String} url='../../resources/examples/data/formSideNav.json'
-         */
-        url: '../../resources/examples/data/formSideNav.json'
+        model: SideNavModel
     }
 }
 

apps/form/view/SideNavList.mjs

@@ -1,5 +1,4 @@
-import List         from '../../../src/list/Base.mjs';
-import SideNavStore from '../store/SideNav.mjs'
+import List from '../../../src/list/Base.mjs';
 
 /**
  * @class Form.view.SideNavList
@@ -12,10 +11,6 @@ class SideNavList extends List {
          * @protected
          */
         className: 'Form.view.SideNavList',
-        /**
-         * @member {Neo.data.Store} store=SideNavStore
-         */
-        store: SideNavStore,
         /**
          * @member {Boolean} useHeaders=true
          */

apps/form/view/Viewport.mjs

@@ -1,5 +1,6 @@
-import BaseViewport from '../../../src/container/Viewport.mjs';
-import SideNavList  from './SideNavList.mjs';
+import BaseViewport  from '../../../src/container/Viewport.mjs';
+import SideNavList   from './SideNavList.mjs';
+import ViewportModel from './ViewportModel.mjs';
 
 /**
  * @class Form.view.Viewport
@@ -23,7 +24,8 @@ class Viewport extends BaseViewport {
                 flex: 'none',
                 vdom: {tag: 'h1', innerHTML: 'My Form Header'}
             }, {
-                module: SideNavList
+                module: SideNavList,
+                bind  : {store: 'stores.sideNav'}
             }]
         }, {
             ntype: 'container',
@@ -33,6 +35,10 @@ class Viewport extends BaseViewport {
          * @member {Object} layout={ntype:'hbox',align:'stretch'}
          */
         layout: {ntype: 'hbox', align: 'stretch'},
+        /**
+         * @member {Neo.model.Component} model=ViewportModel
+         */
+        model: ViewportModel,
         /**
          * @member {Object} style={padding:'20px'}
          */

apps/form/view/ViewportModel.mjs

@@ -0,0 +1,50 @@
+import Component    from '../../../src/model/Component.mjs';
+import SideNavStore from '../store/SideNav.mjs'
+
+/**
+ * @class Form.view.ViewportModel
+ * @extends Neo.model.Component
+ */
+class ViewportModel extends Component {
+    static config = {
+        /**
+         * @member {String} className='Form.view.ViewportModel'
+         * @protected
+         */
+        className: 'Form.view.ViewportModel',
+        /**
+         * @member {Object} data
+         */
+        data: {
+            /**
+             * The currently selected list item inside the SideNavList
+             * @member {Number} data.activeIndex
+             */
+            activeIndex: 0,
+            /**
+             * The name of the currently selected list item record
+             * @member {String} data.activeTitle
+             */
+            activeTitle: '',
+            /**
+             * The amount of non-header SideNavList items
+             * @member {Number} data.maxIndex
+             */
+            maxIndex: 0
+        },
+        /**
+         * @member {Object} stores
+         */
+        stores: {
+            sideNav: {
+                module  : SideNavStore,
+                autoLoad: true,
+                url     : '../../resources/examples/data/formSideNav.json'
+            }
+        }
+    }
+}
+
+Neo.applyClassConfig(ViewportModel);
+
+export default ViewportModel;