crud views fulfill these tasks; list, add, show

edit is to be fixed
grunt dev will not start server (for dev reasons)

Gruntfile.js

@@ -62,6 +62,10 @@ module.exports = function (grunt) {
             prod_branch: {
                 src: ['app/components/**/*.html'],
                 dest: 'dist/<%= grunt.branchname %>/templates.js'
+            },
+            dev: {
+                src: ['app/components/**/*.html', 'app/shared/templates/**/*.html'],
+                dest: 'tmp/templates.js'
             }
         },
         copy: {
@@ -175,7 +179,7 @@ module.exports = function (grunt) {
         watch: {
             dev: {
                 files: ['app/**/*.js', 'app/components/**/*.html', 'index.html'],
-                tasks: ['env:dev', 'preprocess:dev', 'karma:unit'],
+                tasks: ['env:dev', 'preprocess:dev', 'html2js:dev'],
                 options: {
                     atBegin: false
                 }
@@ -275,7 +279,8 @@ module.exports = function (grunt) {
     grunt.loadNpmTasks('grunt-preprocess');
     grunt.loadNpmTasks('grunt-env');
 
-    grunt.registerTask('dev', ['env:dev', 'preprocess:dev', 'connect:server', 'watch:dev']);
+    //grunt.registerTask('dev', ['env:dev', 'preprocess:dev', 'html2js:dev', 'connect:server', 'watch:dev']);
+    grunt.registerTask('dev', ['env:dev', 'preprocess:dev', 'html2js:dev', 'watch:dev']);
     grunt.registerTask('test', ['bower', 'karma:continuous']);
     grunt.registerTask('i18n', ['nggettext_extract', 'nggettext_compile']);
     grunt.registerTask('default', [

app/app.js

@@ -20,9 +20,11 @@ var app = angular.module(
         'ulakbus.auth',
         'ulakbus.staff',
         'ulakbus.student',
+        'ulakbus.crud',
+        //'ulakbus.version',
         'schemaForm',
         'gettext',
-        'templates-prod'
+        //'templates-prod'
     ]).
 /**
  * RESTURL is the url of rest api to talk

app/app_routes.js

@@ -10,21 +10,21 @@ app.config(['$routeProvider', function ($routeProvider) {
             templateUrl: 'components/dashboard/dashboard.html',
             controller: 'DashCtrl'
         })
-        .when('/student/add', {
-            templateUrl: 'components/student/student_add_template.html',
-            controller: 'StudentAddEditCtrl'
+        .when('/crud/:model/add', {
+            templateUrl: 'components/crud/templates/add.html',
+            controller: 'CRUDAddEditCtrl'
         })
-        .when('/student/edit/:id', {
-            templateUrl: 'components/student/student_add_template.html',
-            controller: 'StudentAddEditCtrl'
+        .when('/crud/:model/edit/:id', {
+            templateUrl: 'components/crud/templates/edit.html',
+            controller: 'CRUDAddEditCtrl'
         })
-        .when('/students', {
-            templateUrl: 'components/student/student_list_template.html',
-            controller: 'StudentListCtrl'
+        .when('/crud/:model', {
+            templateUrl: 'components/crud/templates/list.html',
+            controller: 'CRUDListCtrl'
         })
-        .when('/student/:id', {
-            templateUrl: 'components/student/student_list_template.html',
-            controller: 'StudentShowCtrl'
+        .when('/crud/:model/:id', {
+            templateUrl: 'components/crud/templates/show.html',
+            controller: 'CRUDShowCtrl'
         })
         .when('/staff/add', {
             templateUrl: 'components/staff/templates/add.html',

app/components/crud/crud_controller.js

+/**
+ * Copyright (C) 2015 ZetaOps Inc.
+ *
+ * This file is licensed under the GNU General Public License v3
+ * (GPLv3).  See LICENSE.txt for details.
+ */
+
+'use strict';
+
+
+var crud = angular.module('ulakbus.crud', ['ngRoute', 'schemaForm', 'formService', 'ui.bootstrap']);
+
+
+/**
+ * CRUDAddEditCtrl is a controller
+ * which provide a form with form generator.
+ */
+
+crud.controller('CRUDAddEditCtrl', function ($scope, $rootScope, $location, $http, $log, $modal, Generator, $routeParams) {
+    $scope.url = 'crud';
+    $scope.form_params = {'model': $routeParams.model};
+    if ($routeParams.id) {
+        $scope.form_params['object_id'] = $routeParams.id;
+        $scope.form_params['cmd'] = 'edit';
+    }
+    else {
+        $scope.form_params['cmd'] = 'add';
+    }
+    // to start in certain part of the workflow use clear_wf=1
+    //$scope.form_params['clear_wf'] = 1;
+
+    // get form with generator
+    Generator.get_form($scope);
+
+    $scope.onSubmit = function (form) {
+        $scope.$broadcast('schemaFormValidate');
+        if (form.$valid) {
+            Generator.submit($scope)
+                .success(function(data){
+                    $location.path("/crud");
+                })
+                .error(function(data){
+                    $scope.message = data.title;
+                });
+        }
+    };
+});
+
+// todo: for single point of failure code a "get item" service and use it to
+// retrieve list and single item
+
+/**
+ * CRUD List Controller
+ */
+
+crud.controller('CRUDListCtrl', function ($scope, $rootScope, Generator, $routeParams) {
+    $scope.url = 'crud';
+    $scope.form_params = {"model": $routeParams.model};
+    // call generator's get_list func
+    Generator.get_list($scope)
+        .then(function (res) {
+            debugger;
+            var data =  res.data.objects;
+            for (var item in data){
+                delete data[item].data['deleted'];
+                delete data[item].data['timestamp'];
+            }
+            $scope.objects = data;
+            $scope.model = $routeParams.model;
+        });
+});
+
+/**
+ * CRUD Show Controller
+ */
+crud.controller('CRUDShowCtrl', function ($scope, $rootScope, Generator, $routeParams) {
+    $scope.url = 'crud';
+    $scope.form_params = {"object_id": $routeParams.id, "cmd": "show", "model": $routeParams.model};
+    // call generator's get_single_itemfunc
+    Generator.get_single_item($scope).then(function (res) {
+        $scope.object = res.data.object;
+    })
+});
\ No newline at end of file

app/components/crud/crud_controller_test.js

+/**
+ * Copyright (C) 2015 ZetaOps Inc.
+ *
+ * This file is licensed under the GNU General Public License v3
+ * (GPLv3).  See LICENSE.txt for details.
+ */
+
+'use strict';
+
+describe('crud controller module', function () {
+
+    beforeEach(module('ulakbus'));
+    beforeEach(module('ulakbus.crud'));
+
+    var $controller;
+
+    beforeEach(inject(function (_$controller_) {
+        $controller = _$controller_;
+    }));
+
+    describe('crud add controller', function() {
+        it('should get form', function() {
+            var $scope = {};
+            var controller = $controller('CRUDAddEditCtrl', { $scope: $scope });
+            expect($scope).not.toEqual(null);
+        });
+    });
+
+    describe('crud add controller', function () {
+
+        it('should have CRUDAddEditCtrl', inject(function ($controller) {
+            expect($controller).toBeDefined();
+        }));
+    });
+});
\ No newline at end of file

app/components/crud/templates/add.html

+<div ng-app="ulakbus.crud">
+    <ng-include src="'shared/templates/add.html'"></ng-include>
+</div>
\ No newline at end of file

app/components/crud/templates/edit.html

+<div ng-app="ulakbus.crud">
+    <div class="col-md-6">
+        <h1>{{ schema.title }}</h1>
+        <form name="formgenerated" sf-schema="schema" sf-form="form" sf-model="model" ng-submit="onSubmit(formgenerated)"></form>
+    </div>
+</div>
\ No newline at end of file

app/components/crud/templates/list.html

+<table class="table table-bordered table-responsive">
+    <thead>
+    <tr>
+        <!--<th>{{ objects[0].key }}</th>-->
+        <th ng-repeat="(key,value) in objects[0].data">{{ key }}</th>
+        <th>action</th>
+    </tr>
+    </thead>
+    <tbody>
+    <tr ng-repeat="object in objects">
+        <!--<td><a ng-href="#/object/{{object.id}}">{{object.name}}</a></td>-->
+        <td ng-repeat="(key,value) in object.data">{{value}}</td>
+        <td>
+            <a ng-href="#/crud/{{model}}/edit/{{object.key}}">Edit</a><br>
+            <a ng-href="#/crud/{{model}}/{{object.key}}">Show</a>
+        </td>
+    </tr>
+    </tbody>
+</table>
\ No newline at end of file

app/components/crud/templates/show.html

+<p ng-repeat="(key, value) in object"><span class="col-md-3">{{ key }}:</span>{{value}}</p>
\ No newline at end of file

app/components/version/version.js

@@ -5,4 +5,4 @@ angular.module('ulakbus.version', [
   'ulakbus.version.version-directive'
 ])
 
-.value('version', '0.1');
+.value('version', '0.3');

app/index.html

@@ -97,8 +97,10 @@
 <script src="components/auth/auth_controller.js"></script>
 <script src="components/auth/auth_service.js"></script>
 <script src="components/dashboard/dashboard_controller.js"></script>
+<script src="components/crud/crud_controller.js"></script>
 <script src="components/staff/staff_controller.js"></script>
 <script src="components/student/student_controller.js"></script>
+<script src="components/version/version.js"></script>
 <!--<script src="bower_components/quantumui/dist/js/quantumui-nojq.js"></script>-->
 
 </body>

app/shared/directives.js

@@ -20,7 +20,14 @@ app.directive('sidebar',['$location',function() {
         replace: true,
         scope: {
         },
-        controller:function($scope){
+        controller:function($scope, $http, RESTURL){
+            $http.post(RESTURL.url+'crud/').success(function(data){
+                //debugger;
+                $scope.menuItems = data.models;
+            });
+
+            $scope.menuItems = 'dsadkal';
+
             $scope.selectedMenu = 'dashboard';
             $scope.collapseVar = 0;
             $scope.multiCollapseVar = 0;

app/shared/templates/directives/sidebar.html

@@ -5,44 +5,24 @@
             <li ui-sref-active="active">
                 <a ui-sref="dashboard.home"><i class="fa fa-dashboard fa-fw"></i> Dashboard</a>
             </li>
-            <li ui-sref-active="active"><a href="#/staffs" translate>Staffs</a></li>
-            <li ui-sref-active="active"><a href="#/staff/add" translate>New Staff</a></li>
-            <!--<li ui-sref-active="active">-->
+            <!--<li ui-sref-active="active"><a href="#/staffs" translate>Staffs</a></li>-->
+            <!--<li ui-sref-active="active"><a href="#/staff/add" translate>New Staff</a></li>-->
+            <!--<li ui-sref-active="active"-->
+                <!--ng-repeat="item in menuItems"><a href="#">{{ item }}</a></li>-->
 
-                <!--<a ui-sref="dashboard.chart"><i class="fa fa-bar-chart-o fa-fw"></i> Charts<span></span></a>-->
-
-            <!--</li>-->
-            <!--<li ui-sref-active="active">-->
-                <!--<a ui-sref="dashboard.table"><i class="fa fa-table fa-fw"></i> Tables</a>-->
-            <!--</li>-->
-            <!--<li ui-sref-active="active">-->
-                <!--<a ui-sref="dashboard.form"><i class="fa fa-edit fa-fw"></i> Forms</a>-->
-            <!--</li>-->
-            <!--<li ng-class="{active: collapseVar==1}">{{dropDown}}-->
-                <!--<a href="" ng-click="check(1)"><i class="fa fa-wrench fa-fw"></i> UI Elements<span-->
-                        <!--class="fa arrow"></span></a>-->
-                <!--<ul class="nav nav-second-level" collapse="collapseVar!=1">-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.panels-wells">Panels and Wells</a>-->
-                    <!--</li>-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.buttons">Buttons</a>-->
-                    <!--</li>-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.notifications">Notifications</a>-->
-                    <!--</li>-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.typography">Typography</a>-->
-                    <!--</li>-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.icons"> Icons</a>-->
-                    <!--</li>-->
-                    <!--<li ui-sref-active="active">-->
-                        <!--<a ui-sref="dashboard.grid">Grid</a>-->
-                    <!--</li>-->
-                <!--</ul>-->
-                <!--&lt;!&ndash; /.nav-second-level &ndash;&gt;-->
-            <!--</li>-->
+            <li ng-repeat="(key, item) in menuItems" ng-class="{active: collapseVar == key}">{{dropDown}}
+                <a href="" ng-click="check(key)"><i class="fa fa-wrench fa-fw"></i> {{ item }}<span
+                        class="fa arrow"></span></a>
+                <ul class="nav nav-second-level" collapse="collapseVar!={{key}}">
+                    <li ui-sref-active="active">
+                        <a href="#/crud/{{item}}">List</a>
+                    </li>
+                    <li ui-sref-active="active">
+                        <a href="#/crud/{{item}}/add">Add</a>
+                    </li>
+                </ul>
+                <!-- /.nav-second-level -->
+            </li>
             <!--<li ng-class="{active: collapseVar==2}">-->
                 <!--<a href="" ng-click="check(2)"><i class="fa fa-sitemap fa-fw"></i> Multi-Level Dropdown<span-->
                         <!--class="fa arrow"></span></a>-->
@@ -91,7 +71,4 @@
         </ul>
     </div>
     <!-- /.sidebar-collapse -->
-</div> 
-
-
-
+</div>

app/zetalib/forms/form_service.js

@@ -13,10 +13,10 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
         return RESTURL.url + url;
     };
     generator.generate = function (scope, forms) {
+        if (!forms){return scope;}
         for (var key in forms)
             scope[key] = forms[key];
         scope.initialModel = angular.copy(scope.model);
-        //debugger;
         scope.form.push(
             {
                 type: "submit",
@@ -25,6 +25,11 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
         );
         // if fieldset in form, make it collapsable with template
         scope.listnodeform = {};
+        angular.forEach(scope.schema.properties, function(k, v){
+            // check if type date and if type date found change it to string
+            // and give it 'format':'date' property
+            if (k.type == 'date') {k.type='string'; k.format='date'}
+        });
         if ((scope.listnode && scope.listnodes[0]) || (scope.nodes && scope.nodes[0])) {
             angular.forEach(scope.form, function (key, val) {
                 if (typeof key == "object" && key.type == "fieldset") {
@@ -51,7 +56,6 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
                         scope.listnodeform[key.title]["form"] = [angular.copy(key)];
                         scope.listnodeform[key.title]["model"] = {};
                         key.type = "list";
-                        debugger;
                         delete key.templateUrl;
                         delete key.items;
                     }
@@ -80,7 +84,6 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
             modalInstance.result.then(function (childmodel, key) {
 
                 angular.forEach(childmodel, function(v, k){
-                    debugger;
                     if (scope.model[k]){
                         scope.model[k][v.idx] = v;
                     } else {
@@ -89,7 +92,6 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
                     }
                     scope.$broadcast('schemaFormRedraw');
                 });
-                debugger;
             });
         };
         return generator.group(scope);
@@ -139,19 +141,16 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
         }
     };
     generator.submit = function ($scope) {
+        data = {"form": $scope.model, "cmd": $scope.form_params.cmd, "subcmd": "do_list", "model": $scope.form_params.model};
         if ($scope.object_id) {
             var get_diff = FormDiff.get_diff($scope.model, $scope.initialModel);
             var data = {
                 "object_id": $scope.object_id,
-                "form": get_diff,
-                "cmd": "do"
+                "form": get_diff
             };
         }
-        else {
-            data = {"form": $scope.model, "cmd": "do"};
-        }
         return $http
-            .post(generator.makeUrl($scope.url), data)
+            .post(generator.makeUrl($scope.url), data);
         //.then(function (res) {
         //    // todo: for now fake rest api returns 'ok' no data to
         //    // manipulate on ui. therefor used just a log

index.html

@@ -103,8 +103,10 @@
 <script src="components/auth/auth_controller.js"></script>
 <script src="components/auth/auth_service.js"></script>
 <script src="components/dashboard/dashboard_controller.js"></script>
+<script src="components/crud/crud_controller.js"></script>
 <script src="components/staff/staff_controller.js"></script>
 <script src="components/student/student_controller.js"></script>
+<script src="components/version/version.js"></script>
 <!--<script src="bower_components/quantumui/dist/js/quantumui-nojq.js"></script>-->
 <!-- @endif -->