evolutility - npm Package Compare versions

Comparing version 0.3.6 to 0.4.0

bower.json

 {
   "name": "evolutility",
-  "version": "0.3.6",
+  "version": "0.3.3",
   "dependencies": {
@@ -8,3 +8,3 @@ "jquery": "2.1.1",
     "backbone.localStorage": "v1.1.16",
-    "underscore": "1.7.0",
+    "underscore": "1.8.2",
     "bootstrap": "v3.3.2",
@@ -11,0 +11,0 @@ "bootstrap-datepicker": "1.3.1",

Gruntfile.js

@@ -24,2 +24,6 @@ module.exports = function (grunt) {
                 src: [
+
+                    // D3.js
+                    //'bower_components/d3/d3.js',
+
                     // jQuery & jQuery UI
@@ -38,5 +42,6 @@ 'bower_components/jquery/dist/jquery.js',
                     'bower_components/bootstrap/js/modal.js',
-                    //'bower_components/bootstrap/js/tooltip.js',
                     'bower_components/bootstrap/js/button.js',
                     'bower_components/bootstrap/js/dropdown.js',
+                    //'bower_components/bootstrap/js/tooltip.js',
+                    //'bower_components/bootstrap/js/popover.js',
                     //'bower_components/bootstrap/js/carousel.js',
@@ -84,11 +89,13 @@
                 src: [
-                    "demo/demo.js",
-                    "js/ui-models/apps/todo.js",
+                    //"demo/demo.js",
+                    //"js/ui-models/apps/todo.js",
                     "js/ui-models/apps/todo.data.js",
-                    "js/ui-models/apps/contacts.js",
+                    //"js/ui-models/apps/contacts.js",
                     "js/ui-models/apps/contacts.data.js",
-                    "js/ui-models/apps/winecellar.js",
-                    "js/ui-models/apps/winecellar.data.js"
+                    //"js/ui-models/apps/winecellar.js",
+                    "js/ui-models/apps/winecellar.data.js",
+                    //"js/ui-models/apps/comics.js",
+                    "js/ui-models/apps/comics.data.js"
                 ],
-                dest: 'demo/demo-ui.js'
+                dest: 'demo/demo-data.js'
             }
@@ -160,4 +167,4 @@ },
                     {
-                        src: 'demo/demo-ui.js',
-                        dest: 'demo/demo-ui.min.js'
+                        src: 'demo/demo-data.js',
+                        dest: 'demo/demo-data.min.js'
                     }
@@ -211,3 +218,2 @@ ]
     // *************************************************************************************
-    grunt.loadNpmTasks('grunt-bower-task');
     grunt.loadNpmTasks('grunt-contrib-copy');
@@ -214,0 +220,0 @@ grunt.loadNpmTasks('grunt-contrib-concat');

js/action-export.js

@@ -28,17 +28,13 @@ /*! ***************************************************************************
         optsXML: function(entity){
-            return [
-                this.html_more2(i18nXpt.options),
-                this.optEntityName('elementName', i18nXpt.XMLroot, entity),
-                '</div>'
-            ].join('');
+            return this.html_more2(i18nXpt.options)+
+                this.optEntityName('elementName', i18nXpt.XMLroot, entity)+
+                '</div>';
         },
 
         optsSQL: function(entity){
-            return [
-                this.html_more2(i18nXpt.options),
-                this.optEntityName('table', i18nXpt.SQLTable, entity),
-                '<div>', uiInput.checkbox('insertId', '0'), eUI.fieldLabelSpan('insertId', i18nXpt.SQLIdInsert), '</div>',
-                '<div>', uiInput.checkbox('transaction', '0'), eUI.fieldLabelSpan('transaction', i18nXpt.SQLTrans), '</div>',
-                '</div>'
-            ].join('');
+            return this.html_more2(i18nXpt.options)+
+                this.optEntityName('table', i18nXpt.SQLTable, entity)+
+                '<div>'+uiInput.checkbox('insertId', '0')+eUI.fieldLabelSpan('insertId', i18nXpt.SQLIdInsert)+'</div>'+
+                '<div>'+uiInput.checkbox('transaction', '0')+eUI.fieldLabelSpan('transaction', i18nXpt.SQLTrans)+'</div>'+
+                '</div>';
         },
@@ -77,3 +73,3 @@
         sampleMaxSize: 20,
-        formats: ['CSV', 'TAB', 'HTML', 'XML', 'SQL', 'JSON']
+        formats: ['CSV', 'TAB', 'HTML', 'JSON', 'XML', 'SQL']
     },
@@ -205,15 +201,8 @@
     _preview: function (format) {
-        var h=[],
-            $e = this.$('.evol-xpt-val');
-
-        this._exportContent(h, format);
-        if(this.many && format==='JSON'){
-            $e.html('['+h.join(',\n')+']');
-        }else{
-            $e.html(h.join(''));
-        }
+        this.$('.evol-xpt-val').html(this.exportContent(format));
     },
 
-    _exportContent: function(h, format){
-        var maxItem = this.sampleMaxSize-1;
+    exportContent: function(format){
+        var h=[],
+            maxItem = this.sampleMaxSize-1;
 
@@ -226,7 +215,4 @@ if(this.model && this.model.collection){
                 useHeader = this.$('#xptFLH').prop('checked'),
-                showID=this.$('#showID').prop('checked');
+                showID = this.$('#showID').prop('checked');
 
-            //if(showID){
-            //    flds.unshift({id: 'id', type: 'text', label: 'Id'});
-            //}
             _.each(fldsDom, function(f){
@@ -299,7 +285,7 @@ fldsDomHash[f.id.substring(3)]='';
                         });
-                        h.push('</tr>\n');
+                        h.push('\n</tr>\n');
                     }
                     // -- data
                     _.every(data, function(m, idx){
-                        h.push('<tr>');
+                        h.push('<tr>\n');
                         if(showID){
@@ -316,6 +302,6 @@ h.push('<td>', m.id, '</td>');
                         });
-                        h.push('</tr>\n');
+                        h.push('\n</tr>\n');
                         return idx<maxItem;
                     });
-                    h.push('</table>');
+                    h.push('</table>\n');
                     break;
@@ -430,3 +416,3 @@ case 'JSON':
                                 fv=m.get(f.id);
-                                if(!_.isUndefined(fv)){
+                                if(!_.isArray(fv) && !_.isUndefined(fv)){
                                     h.push(fv.replace(/"/g, '\\"'));
@@ -448,12 +434,6 @@ }
         }
-    },
-
-    exportContent: function(format){
-        var h=[];
-        this._exportContent(h, format);
-        if(this.many && format==='JSON'){
+        if(format==='JSON' && this.many){
             return '['+h.join(',\n')+']';
-        }else{
-            return h.join('');
         }
+        return h.join('');
     },
@@ -460,0 +440,0 @@

js/action-filter.js

@@ -39,3 +39,4 @@ /*! ***************************************************************************
         'click .evo-bSubmit':'click_submit',
-        'click .evo-zfilters>a>button':'click_remove'
+        'click .evo-zfilters>a>button':'click_remove',
+        'click .close': 'click_close'
     },
@@ -79,3 +80,3 @@
 
-        h.push('<div class="evo-zfilters"></div>',
+        h.push(Evol.UI.html.buttonClose+'<div class="evo-zfilters"></div>',
             '<a class="evo-bNew btn btn-primary" href="javascript:void(0)">',evoLang.bNewCond,'</a>');
@@ -655,2 +656,6 @@ if(this.submitButton){
         this.$el.trigger('submit.filter');
+    },
+
+    click_close: function(e){
+        this.$el.trigger('close.filter');
     }
@@ -657,0 +662,0 @@

js/dico.js

@@ -14,2 +14,3 @@ /*! ***************************************************************************
 
+// not a "virtual DOM" but an "abstract DOM"
 Evol.Dico = function(){
@@ -19,10 +20,36 @@
         uiInput = eUI.input,
-        i18n = Evol.i18n;
+        i18n = Evol.i18n,
+        fts={
+            text: 'text',
+            textml: 'textmultiline',
+            bool: 'boolean',
+            int: 'integer',
+            dec: 'decimal',
+            money: 'money',
+            date: 'date',
+            datetime: 'datetime',
+            time: 'time',
+            lov: 'lov',
+            list: 'list', // many values for one field (behave like tags - return an array of strings)
+            //html:'html',
+            formula:'formula',
+            email: 'email',
+            pix: 'image',
+            doc:'document',
+            url: 'url',
+            color: 'color',
+            hidden: 'hidden'
+            //json: 'json',
+            //rating: 'rating',
+            //widget: 'widget'
+        };
 
 return {
 
-    // enum of supported field types
     fieldTypes: fts,
 
     fieldOneEdit: {// h, f, fid, fv, iconsPath
+        field: function (h, f, fType, fid, fv) {
+            h.push(uiInput[fType](fid, fv, f, null));
+        },
         text: function (h, f, fid, fv) {
@@ -100,3 +127,3 @@ h.push(uiInput.text(fid, fv, f, null));
         formula: function(h, f, fid, fv){
-            h.push(uiInput.text(fid, fv, f, null));
+            h.push('<div class="evol-truncate">'+uiInput.text(fid, fv, f, null)+'</div>');
         }
@@ -134,3 +161,6 @@ },
         'ct': function(fv, cv){
-            return fv.toLocaleLowerCase().indexOf(cv)>-1;
+            if(fv){
+                return fv.toLocaleLowerCase().indexOf(cv)>-1;
+            }
+            return false;
         },
@@ -169,2 +199,14 @@ // -- finish w/
 
+    viewIsOne: function(viewName){
+        return viewName==='new' || viewName==='edit' || viewName==='view' || viewName==='json';
+    },
+    viewIsMany: function(viewName){
+        return viewName==='list' || viewName==='cards' || viewName==='charts' || viewName==='bubbles';
+    },
+
+    fieldInCharts: function (f) {
+        return (_.isUndefined(f.viewcharts) || f.viewcharts) && 
+            (f.type===fts.lov || f.type===fts.bool || f.type===fts.int || f.type===fts.money);
+    },
+
     isNumberType: function(fType){
@@ -282,4 +324,3 @@ return fType===fts.int || fType===fts.dec || fType===fts.money;
     },
-
-    /*
+/*
      showDesigner: function(id, type, $el, context){
@@ -332,4 +373,4 @@ var css='evodico-'+type,
          return this;
-     },*/
-
+     },
+*/
     filterModels: function(models, filters){
@@ -438,3 +479,4 @@ if(filters.length){
                 case fts.formula:
-                    h.push('<div id="',fid, '" class="form-control">',fld.formula(),'</div>');
+                    // TODO: in one.js or here?
+                    h.push('<div id="',fid, '" class="form-control evol-truncate">',fld.formula(),'</div>');
                     break;
@@ -509,2 +551,15 @@ case fts.color: // TODO is the color switch necessary?
 
+    sortingText: function(fid){
+            //return (modelA.get(fid)||'').localeCompare(modelB.get(fid)||'');
+        return function(modelA, modelB) {
+            if(modelA[fid]<modelB[fid]){
+                return 1;
+            }
+            if(modelB[fid]<modelA[fid]){
+                return -1;
+            }
+            return 0;
+        };
+    },
+
     getRoute: function(){
@@ -511,0 +566,0 @@ var cURL=window.location.href,

js/i18n/EN.js

@@ -30,3 +30,5 @@ //   Evolutility Localization Library ENGLISH
     View:'View',
+    bView:'View',
     bEdit:'Edit',
+    bMini: 'Mini', // 'Quick Edit'
     // Login:'Login',
@@ -47,3 +49,7 @@ bNew:'New',
     bAll:'All',
+    bList:'List',
     bFilter: 'Filter',
+    //bBubbles: 'Bubbles',
+    bCards: 'Cards',
+    bJSON: 'JSON',
     //bRefresh: 'Refresh',
@@ -50,0 +56,0 @@ //bPrint:'Print',

js/many-charts.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View many charts
+ * View "many charts" to display a collection as a set of charts.
  *
@@ -15,2 +15,3 @@ * https://github.com/evoluteur/evolutility
 // must be re-written to use D3.js or other cool stuff
+
 Evol.ViewMany.Charts = Evol.ViewMany.extend({
@@ -23,11 +24,14 @@
         style: 'panel-info',
+        fieldsetFilter: Evol.Dico.fieldInCharts,
         autoUpdate: false
     },
-/*
+
     events: {
-        'click .evol-field-label .glyphicon-wrench': 'click_customize'
+        'click .evo-chart-config': 'changeChartType'
+        //'click .evol-field-label .glyphicon-wrench': 'click_customize'
     },
-*/
+
     render: function () {
         var h = [];
+        this.entityName=Evol.UI.capitalize(this.uiModel.entities);
         if(this.collection && this.collection.length>0){
@@ -52,42 +56,72 @@ h.push('<div class="evol-many-', this.viewName, '">');
             iconsPath = this.iconsPath || '',
-            chartFields = EvoDico.getFields(uiModel, function(f){
-                return (_.isUndefined(f.viewcharts) || f.viewcharts) && (f.type===fTypes.lov || f.type===fTypes.bool || f.type===fTypes.int || f.type===fTypes.money);
-            });
+            chartFields = this.getFields(),
+            chartType,
+            cData={},
+            entityName=this.entityName;
 
         if(chartFields && chartFields.length){
+            var groups,
+                lb;
             _.each(chartFields, function(f){
-                var groups = _.countBy(models, function(m) {
-                        return m.get(f.id);
-                    }),
-                    data=[],
-                    lb,
+                var data=[],
                     labels=[],
-                    entityName=EvoUI.capitalize(uiModel.entities);
+                    nb, dataSetName,
+                    isList=f.type===fTypes.lov || f.type===fTypes.list;
 
-                for(var dataSetName in groups) {
-                    var nb=groups[dataSetName];
-                    if(_.isUndefined(dataSetName)){
-                        lb = i18n.na;
-                    }else if(dataSetName==='' || dataSetName==='null'){
-                        lb = i18n.none;
-                    }else if(f.type===fTypes.lov || f.type===fTypes.list){
-                        if(f.list && f.list.length && f.list[0].icon){
-                            lb = EvoDico.lovTextNoPix(f, dataSetName);
+                if(f.type===fTypes.bool){
+                    groups = _.countBy(models, function(m) {
+                        return m.get(f.id)===true;
+                    });
+                    for(dataSetName in groups) {
+                        nb=groups[dataSetName];
+                        if(dataSetName==='true'){
+                            lb = f.labeltrue || i18n.yes;
                         }else{
-                            lb = EvoDico.lovText(f, dataSetName, Evol.hashLov, iconsPath);
+                            lb = f.labelfalse || i18n.no;
                         }
-                    }else if(f.type===fTypes.bool){
-                        lb = (dataSetName==='true')?i18n.yes:i18n.no;
-                    }else{
-                        lb = dataSetName;
+                        data.push(nb);
+                        labels.push(lb+' ('+nb+')');
                     }
-                    data.push(nb);
-                    labels.push(lb+' ('+nb+')');
+                }else{
+                    groups = _.countBy(models, function(m) {
+                        return m.get(f.id);
+                    });
+                    for(dataSetName in groups) {
+                        nb=groups[dataSetName];
+                        if(dataSetName==='undefined'){
+                            lb = i18n.na;
+                        }else if(dataSetName==='' || dataSetName==='null'){
+                            lb = i18n.none;
+                        }else if(isList){
+                            if(f.list && f.list.length && f.list[0].icon){
+                                lb = EvoDico.lovTextNoPix(f, dataSetName);
+                            }else{
+                                lb = EvoDico.lovText(f, dataSetName, Evol.hashLov, iconsPath);
+                            }
+                        }else{
+                            lb = dataSetName;
+                        }
+                        data.push(nb);
+                        labels.push(lb+' ('+nb+')');
+                    }
                 }
-                if(f.type===fTypes.lov){
+                chartType = f.typechart || (f.type===fTypes.lov ? 'pie':'bars');
+                h.push('<div class="evol-chart-holder panel '+style+'">');
+                h.push('<div class="glyphicon glyphicon-cog evo-chart-config pull-right" data-id="'+f.id+'" data-ctype="'+chartType+'"></div>');
+                h.push('<div class="chart-holder">');
+                cData[f.id] = {
+                    field: f,
+                    data: data,
+                    labels: labels,
+                    style: style,
+                    sizes: sizes
+                };
+                if(chartType==='pie'){
                     h.push(EvoUI.Charts.Pie(f.labelcharts?f.labelcharts:i18n.getLabel('charts.aByB', entityName, f.label), data, labels, style, sizes));
-                }else{
+                }else if(chartType==='bars'){
                     h.push(EvoUI.Charts.Bars(f.labelcharts?f.labelcharts:i18n.getLabel('charts.aB', entityName, f.label), data, labels, style, sizes));
                 }
+                h.push('</div><br></div>');
             });
+            this._cData=cData;
         }else{
@@ -102,4 +136,22 @@ h.push(EvoUI.HTMLMsg(i18n.nochart, i18n.badchart));
         // b/c it can be invoked for all view Many
+    },
+
+    changeChartType: function(evt){
+        var i18n = Evol.i18n,
+            el=$(evt.currentTarget),
+            id=el.data('id'),
+            ctype=el.data('ctype'),
+            chart=Evol.UI.Charts,
+            oldData=this._cData[id],
+            f=oldData.field,
+            holder=el.parent().find('.chart-holder');
+        if(ctype==='pie'){
+            holder.html(chart.Bars(f.labelcharts?f.labelcharts:i18n.getLabel('charts.aB', this.entityName, f.label), oldData.data, oldData.labels, oldData.style, oldData.sizes));
+            el.data('ctype', 'bars');
+        }else{
+            holder.html(chart.Pie(f.labelcharts?f.labelcharts:i18n.getLabel('charts.aByB', this.entityName, f.label), oldData.data, oldData.labels, oldData.style, oldData.sizes));
+            el.data('ctype', 'pie');
+        }
     }
 
 });

js/many-list.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View many list
+ * View "many list" to display a collection as a list (table w/ sorting and paging).
  *
@@ -16,2 +16,6 @@ * https://github.com/evoluteur/evolutility
     viewName: 'list',
+    
+    fieldsetFilter: function (f) {
+        return f.viewmany || f.viewlist;
+    },
 
@@ -49,3 +53,3 @@ _render: function (models) {
             v,
-            bf = that.uiModel.badgefield,
+            bf = that.uiModel.badge,
             link = (this.links!==false),
@@ -52,0 +56,0 @@ ft = Evol.Dico.fieldTypes;

js/many.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View many
+ * View "many" for other ViewMany views to inherit from.
  *
@@ -23,2 +23,3 @@ * https://github.com/evoluteur/evolutility
 
+    viewName: 'Many',
     viewType: 'many',
@@ -38,3 +39,6 @@ editable: false,
         noDataString: i18n.nodata, //'No data to display.',
-        iconsPath: 'pix/'
+        iconsPath: 'pix/',
+        fieldsetFilter: function (f) {
+            return f.viewmany;
+        }
     },
@@ -135,3 +139,3 @@
         this.collection = collection;
-        return this;//.render();
+        return this.render();
     },
@@ -163,5 +167,3 @@
         if (!this._fields) {
-            this._fields = eDico.getFields(this.uiModel, function (f) {
-                return f.viewmany;
-            });
+            this._fields = eDico.getFields(this.uiModel, this.fieldsetFilter);
             this._fieldHash = {};
@@ -280,3 +282,2 @@ var fh = this._fieldHash;
                 };
-
             h.push('<li data-id="prev"',
@@ -283,0 +284,0 @@ (pId===1)?' class="disabled"':'',

js/one-edit.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one edit
+ * View "one edit" to edit one backbone model.
  *
@@ -8,0 +8,0 @@ * https://github.com/evoluteur/evolutility

js/one-json.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one json
+ * View "one json" to edit one backbone model in JSON.
  *
@@ -29,3 +29,3 @@ * https://github.com/evoluteur/evolutility
                 eUI.label('uimjson', 'JSON'),
-                eUI.input.textMJSON('uimjson', jsonStr, 10));
+                eUI.input.textMJSON('uimjson', jsonStr, 16));
             this._renderButtons(h, 'json');
@@ -32,0 +32,0 @@ }else{

js/one-mini.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one mini
+ * View "one mini" to "quick edit" one backbone model (only showing important or required fields).
  *
@@ -26,3 +26,3 @@ * https://github.com/evoluteur/evolutility
 
-    getFieldsCondition: function(m){
+    fieldsetFilter: function(m){
         return m.required || m.viewmany || m.viewmini;
@@ -34,8 +34,9 @@ },
         var miniUIModel= {
-                type: 'panel',
-                class:'evol-mini-holder',
-                label: Evol.UI.capitalize(this.uiModel.entity),
-                width: 100,
-                elements: this.getFields()
-            };
+            type: 'panel',
+            class:'evol-mini-holder',
+            label: Evol.UI.capitalize(this.uiModel.entity),
+            width: 100,
+            elements: this.getFields()
+        };
+        
         this._renderPanel(h, miniUIModel, mode);
@@ -42,0 +43,0 @@ this._renderButtons(h, mode);

js/one-view.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one view (readonly)
+ * View "one view" to browse one model in readonly mode.
  *
@@ -112,3 +112,3 @@ * https://github.com/evoluteur/evolutility
         h.push(Evol.UI.html.clearer,
-            '<div class="evol-buttons">',
+            '<div class="evol-buttons panel panel-info">',
             Evol.UI.button('cancel', Evol.i18n.bCancel, 'btn-default'),
@@ -115,0 +115,0 @@ Evol.UI.button('edit', Evol.i18n.bEdit, 'btn-primary'),

js/one-wizard.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one wizard
+ * View "one wizard" to edit one backbone model using a wizard (one step for each panel in the ui-model).
  *
@@ -8,0 +8,0 @@ * https://github.com/evoluteur/evolutility

js/one.js

@@ -5,3 +5,3 @@ /*! ***************************************************************************
  *
- * View one
+ * View "one" for other ViewOne views to inherit from.
  *
@@ -25,2 +25,3 @@ * https://github.com/evoluteur/evolutility
 
+    viewName: 'One',
     viewType:'one',
@@ -78,3 +79,3 @@ cardinality: '1',
         if(!this._fields){
-            this._fields=eDico.getFields(this.uiModel, this.getFieldsCondition);
+            this._fields=eDico.getFields(this.uiModel, this.fieldsetFilter);
             this._fieldHash={};
@@ -498,3 +499,3 @@ var that=this;
         h.push(eUI.html.clearer,
-            '<div class="evol-buttons">',
+            '<div class="evol-buttons panel panel-info">',
             eUI.button('cancel', i18n.bCancel, 'btn-default'),
@@ -722,3 +723,5 @@ eUI.button('save', i18n.bSave, 'btn-primary'));
         if(f.type==='formula'){
-            h.push(f.formula(this.model));
+            h.push('<div id="',this.fieldViewId(f.id), '" class="disabled evo-rdonly evol-truncate">', 
+                (this.model?f.formula(this.model):''), 
+                '</div>');
         }else{
@@ -725,0 +728,0 @@ h.push(eDico.HTMLField4One(f, this.fieldViewId(f.id), fv, mode, iconsPath));

js/shell.js

@@ -5,2 +5,4 @@ /*! ***************************************************************************
  *
+ * View "shell" to hold the single page app for all objects/ui-models.
+ *
  * https://github.com/evoluteur/evolutility
@@ -7,0 +9,0 @@ * Copyright (c) 2015, Olivier Giulieri

js/toolbar.js

@@ -5,2 +5,4 @@ /*! ***************************************************************************
  *
+ * View "toolbar" (one toolbar instance manages all views for a UI model).
+ *
  * https://github.com/evoluteur/evolutility
@@ -19,3 +21,4 @@ * Copyright (c) 2015, Olivier Giulieri
     'list': Evol.ViewMany.List,
-    'badges': Evol.ViewMany.Badges,
+    'cards': Evol.ViewMany.Cards,
+    //'bubbles': Evol.ViewMany.Bubbles,
     'charts': Evol.ViewMany.Charts,
@@ -46,2 +49,3 @@ // --- Action ---
         'change.filter >div': 'change_filter',
+        'close.filter >div': 'hideFilter',
         'click .alert-dismissable>button': 'clearMessage',
@@ -58,23 +62,36 @@ 'message >div':'showMessage'
         titleSelector: '#title',
+        pageSize:20,
         buttons: {
-            // --- views for one ---
-            view: true,
-            edit: true,
-            mini: true,
-            //wiz: false,
-            json: true,
-            // --- views for many ---
-            list: true,
-            badges: true,
-            charts: true,
-            // --- actions ---
-            'new': true,
-            'save':true,
-            del: true,
-            filter: true,
-            'export': true
-            //group: false,
-            //customize: false
-        },
-        pageSize:20
+            always:[
+                {id: 'list', label: i18n.bList, icon:'th-list', n:'x'},
+                {id: 'new', label: i18n.bNew, icon:'plus', n:'x'}
+            ],
+                //linkOpt2h('selections','','star');
+            actions:[
+                {id:'edit', label: i18n.bEdit, icon:'edit', n:'1'},
+                {id:'save', label: i18n.bSave, icon:'floppy-disk', n:'1'},
+                {id:'del', label: i18n.bDelete, icon:'trash', n:'1'},
+                {id:'filter', label: i18n.bFilter, icon:'filter',n:'n'},
+                //{id:'group',label: i18n.bGroup, icon:'resize-horizontal',n:'n'},
+                {id:'export', label: i18n.bExport, icon:'cloud-download',n:'n'}
+                //{id:'cog',label: i18n.bSettings, icon:'cog',n:'n'}
+            ],
+            prevNext:[
+                {id:'prev', label: '', icon:'chevron-left', n:'x'},
+                {id:'next', label: '', icon:'chevron-right', n:'x'}
+            ],
+            views: [
+                // -- views ONE ---
+                {id:'view', label: i18n.bView, icon:'file',n:'1'},// // ReadOnly
+                {id:'edit', label: i18n.bEdit, icon:'th',n:'1'},// // All Fields
+                {id:'mini', label: i18n.bMini, icon:'th-large',n:'1'},// // Important Fields only
+                //{id:'wiz',label: i18n.bWizard, icon:'arrow-right',n:'1'},
+                {id:'json', label: i18n.bJSON, icon:'barcode',n:'1'},
+                // -- views MANY ---
+                {id:'list', label: i18n.bList, icon:'th-list',n:'n'},
+                {id:'cards', label: i18n.bCards, icon:'th-large',n:'n'},
+                //{id:'bubbles', label: i18n.bBubbles, icon:'adjust',n:'n'},
+                {id:'charts', label: i18n.bCharts, icon:'stats',n:'n'}
+            ]
+        }
     },
@@ -101,2 +118,3 @@
             eUIm=eUI.menu,
+            tb=this.buttons,
             endMenu='</ul></li>',
@@ -106,39 +124,24 @@ menuDevider='<li class="divider" data-cardi="1"></li>',
 
-        function linkOpt2h (id, label, icon, cardi){
-            if(that.buttons[id]){
-                h+=eUIm.hItem(id, label, icon, cardi);
-            }
+        function menuItem (m){
+            h+=eUIm.hItem(m.id, m.label, m.icon, m.n);
         }
+        function menuItems (ms){
+            _.forEach(ms, function(m){
+                menuItem(m);
+            });
+        }
 
         h+='<div class="evo-toolbar"><ul class="nav nav-pills pull-left" data-id="main">';
-        linkOpt2h('list','','th-list','x'); // linkOpt2h('list',i18n.bAll,'th-list');
-        linkOpt2h('new','','plus'); // linkOpt2h('new',i18n.bNew,'plus');
+        menuItems(tb.always);
         h+=menuDeviderH;
-        linkOpt2h('edit',i18n.bEdit,'pencil','1');
-        linkOpt2h('save',i18n.bSave,'floppy-disk','1');
-        linkOpt2h('del',i18n.bDelete,'trash','1');
-        linkOpt2h('filter',i18n.bFilter,'filter','n');
-        //linkOpt2h('group','Group','resize-horizontal','n');
-        linkOpt2h('charts',i18n.bCharts,'stats','n');
-        linkOpt2h('export',i18n.bExport,'cloud-download','n');
-        //linkOpt2h('selections','','star');
+        menuItems(tb.actions);
         if(this.toolbar){
             h+='</ul><ul class="nav nav-pills pull-right" data-id="views">'+
-                '<li class="evo-tb-status" data-cardi="n"></li>'+
-                eUIm.hItem('prev','','chevron-left','x')+
-                eUIm.hItem('next','','chevron-right','x');
-
-            h+=eUIm.hBegin('views','li','eye-open');
-            linkOpt2h('view','View','file','1');
-            linkOpt2h('edit','Edit','th','1'); // All Fields
-            linkOpt2h('mini','Mini','th-large','1'); // Important Fields only
-            linkOpt2h('wiz','Wizard','arrow-right','1');
-            linkOpt2h('json','JSON','barcode','1');
-            h+=menuDevider;
-            linkOpt2h('list','List','th-list','x');
-            linkOpt2h('badges','Badges','th-large','x');
-            linkOpt2h('charts','Charts','stats','x');
-            h+=eUIm.hEnd('li');
-
-            //linkOpt2h('customize','','wrench', '1', 'Customize');
+                '<li class="evo-tb-status" data-cardi="n"></li>';
+            //h+=eUIm.hBegin('views','li','eye-open');
+            menuItems(tb.prevNext);
+            h+=menuDeviderH;
+            menuItems(tb.views);
+            //h+=menuDeviderH;
+            //h+=eUIm.hItem('customize','','wrench', 'x', 'Customize');
             /*
@@ -197,4 +200,3 @@ if(this.buttons.customize){
                 if(vw.setCollection){
-                    vw.setCollection(collec)
-                        .render();
+                    vw.setCollection(collec);
                 }
@@ -248,36 +250,34 @@ if(this.model && !this.model.isNew()){
                     .filter('[data-id="'+viewName+'"]').addClass('evo-sel');
-                switch(viewName){
-                    // --- many ---
-                    case 'charts':
-                    case 'badges':
-                    case 'list':
-                        vw = new Evol.viewClasses[viewName](config)
-                            .render();
-                        this._prevViewMany=viewName;
-                        vw.setTitle();
-                        if(viewName!='charts' && this.pageIndex > 0){
-                            //var pIdx=this.curView.getPage();
-                            vw.setPage(this.pageIndex || 0);
-                        }
-                        //this.$el.trigger('status', this.pageSummary(pageIdx, pSize, this.collection.length));
-                        break;
-                    // --- actions ---
-                    case 'export':
-                        config.sampleMaxSize = config.pageSize;
-                        vw = new Evol.ViewAction.Export(config).render();
-                        $v.addClass('panel panel-info')
-                            .slideDown();
-                        break;
-                    // --- one --- view, edit, mini, json, wiz
-                    default :
-                        var vwPrev = null,
-                            cData;
-                        if(vw && vw.editable){
-                            vwPrev = vw;
-                            cData=vw.getData();
-                        }
-                        vw = new Evol.viewClasses[viewName](config).render();
-                        this._prevViewOne=viewName;
-                        this._keepTab(viewName);
-                        break;
+                if(Evol.Dico.viewIsMany(viewName)){
+                    //fieldsetFilter
+                    vw = new Evol.viewClasses[viewName](config)
+                        .render();
+                    this._prevViewMany=viewName;
+                    vw.setTitle();
+                    if(viewName!='charts' && viewName!='bubbles' && this.pageIndex > 0){
+                        //var pIdx=this.curView.getPage();
+                        vw.setPage(this.pageIndex || 0);
+                    }
+                }else{
+                    switch(viewName){
+                        // --- actions ---
+                        case 'export':
+                            config.sampleMaxSize = config.pageSize;
+                            vw = new Evol.ViewAction.Export(config).render();
+                            $v.addClass('panel panel-info')
+                                .slideDown();
+                            break;
+                        // --- one --- view, edit, mini, json, wiz
+                        default :
+                            var vwPrev = null,
+                                cData;
+                            if(vw && vw.editable){
+                                vwPrev = vw;
+                                cData=vw.getData();
+                            }
+                            vw = new Evol.viewClasses[viewName](config).render();
+                            this._prevViewOne=viewName;
+                            this._keepTab(viewName);
+                            break;
+                    }
                 }
@@ -398,3 +398,3 @@ if(_.isUndefined(vw)){
                 prevNext: this.$('.evo-toolbar [data-id="prev"],.evo-toolbar [data-id="next"]'),
-                //customize: this.$('.evo-toolbar a[data-id="customize"]').parent(),
+                customize: this.$('.evo-toolbar a[data-id="customize"]').parent(),
                 views: vw,
@@ -424,3 +424,3 @@ viewsIcon: this.$('.glyphicon-eye-open,.glyphicon-eye-close'),
             tbBs.del.hide();
-            var cssOpen='glyphicon-eye-open',
+            /*var cssOpen='glyphicon-eye-open',
                 cssClose='glyphicon-eye-close';
@@ -431,7 +431,7 @@ if(mode==='mini' || mode==='json'){
                 tbBs.viewsIcon.removeClass(cssClose).addClass(cssOpen);
-            }
-            if(mode==='badges' || mode==='list' || mode==='charts'){
+            }*/
+            if(Evol.Dico.viewIsMany(mode)){
                 this._prevViewMany=mode;
                 oneMany(mode, false, true);
-                if(mode==='charts'){
+                if(mode==='charts' || mode==='bubbles'){
                     this.setStatus('');
@@ -468,3 +468,3 @@ }else{
             }
-            setVisible(tbBs.manys.filter('[data-id="group"]'), mode==='badges');
+            setVisible(tbBs.manys.filter('[data-id="group"]'), mode==='cards');
         }
@@ -484,8 +484,7 @@ },
                 $ff.on('change.filter', function(){
-                    that.curView.setFilter(that._filters.val())
-                        .render();
+                    that.curView.setFilter(that._filters.val());
+                    if(that.curView.viewName!=='bubbles'){
+                        that.curView.render();
+                    }
                 });
-                this._filterOn=true;
-            }else{
-                return this;
             }
@@ -495,10 +494,11 @@ }else{
         }
+        this._filterOn=true;
         return this;
     },
 
-    hideFilter: function(){
+    hideFilter: function(evt){
         if(this._filters){
             this._filters.$el.hide(); //.fadeOut(300);
-            this._filterOn=false;
         }
+        this._filterOn=false;
         return this;
@@ -512,4 +512,4 @@ },
     toggleFilter: function(){
-        this._filtersOn=!this._filtersOn;
-        return this._filtersOn?this.showFilter(true):this.hideFilter();
+        this._filterOn=!this._filterOn;
+        return this._filterOn?this.showFilter(true):this.hideFilter();
     },
@@ -896,3 +896,3 @@
                  break;*/
-            default:// 'edit', 'mini', 'list', 'badges', 'export', 'json', 'new'
+            default:// 'edit', 'mini', 'list', 'cards', 'export', 'json', 'new'
                 if(toolId && toolId!==''){
@@ -943,4 +943,3 @@ this.setView(toolId, true);
         this.pageIndex=0;
-        this.curView.setCollection(collec)
-            .render();
+        this.curView.setCollection(collec);
         this.updateNav();
@@ -947,0 +946,0 @@ this._trigger('filter.change');

js/ui-charts.js

@@ -12,9 +12,14 @@ /*! ***************************************************************************
 
+    // same as d3.scale.category10() 
+    colors:['1f77b4','ff7f0e','2ca02c','d62728','9467bd','8c564b','e377c2','7f7f7f','bcbd22','17becf'],
+
+    _colorsList: function(nbColors){
+        return this.colors.slice(0, nbColors).join(',');
+    },
+
     URL: 'http://chart.apis.google.com/chart',
 
     _HTML: function(title, urlPix, style){
-        return [ //class="panel ', this.style, '
-            '<div class="evol-chart-holder panel ',style,'"><label class="evol-chart-title">',
-            title,'</label><img src="',urlPix,'"><br></div>'
-        ].join('');
+        return '<label class="evol-chart-title">'+
+            title+'</label><img src="'+urlPix+'">';
     },
@@ -24,7 +29,6 @@
         var size=sizes?sizes:'390x200';
-        var urlGoogleChart = [this.URL,'?chd=t:',
-            data.join(','),
-            '&amp;chl=',
-            labels.join('|'),
-            '&amp;cht=p&amp;chds=0,20&amp;chs=',size].join('');
+        var urlGoogleChart = this.URL+'?chd=t:'+data.join(',')+
+        '&chco='+this._colorsList(data.length)+
+            '&amp;chl='+labels.join('|')+
+            '&amp;cht=p&amp;chs='+size;
         return this._HTML(label, urlGoogleChart, style || 'panel-default');
@@ -36,9 +40,5 @@ },
         var maxCount = _.max(data),
-            urlGoogleChart = [this.URL,'?chbh=a&amp;chs=',size,'&cht=bvg&chco=3a87ad,d9edf7&chds=0,',
-                maxCount,
-                '&amp;chd=t:',
-                data.join('|'),
-                '&amp;chp=0.05&amp;chts=676767,10.5&amp;chdl=',
-                labels.join('|')
-            ].join('');
+            urlGoogleChart = this.URL+'?chbh=a&amp;chs='+size+'&cht=bvg&chco='+this._colorsList(data.length)+'&chds=0,'+maxCount+
+                '&amp;chd=t:'+data.join('|')+
+                '&amp;chp=0.05&amp;chts=676767,10.5&amp;chdl='+labels.join('|');
         return this._HTML(label, urlGoogleChart, style);
@@ -45,0 +45,0 @@ }

js/ui-models/apps/contacts.data.js

@@ -0,1 +1,2 @@
+var uiModels = uiModels || {};
 uiModels.contact_data = [{
@@ -2,0 +3,0 @@ id: '1',

js/ui-models/apps/todo.data.js

@@ -0,1 +1,2 @@
+var uiModels = uiModels || {};
 uiModels.todo_data = [
@@ -2,0 +3,0 @@ {id: '1', title: 'Add routing to Evolutility', priority: '2', category: 'others', complete: false, notes: 'Use Backbone router.'},

js/ui-models/apps/todo.js

@@ -31,3 +31,4 @@ var uiModels = uiModels || {};
                         {id: 'misc', text: 'Misc.'}
-                    ]
+                    ],
+                    typechart:'bars'
                 }
@@ -52,3 +53,5 @@ ]
                     id: 'complete', attribute: 'complete', type: 'boolean', width: 100, viewmany: true,
-                    label: 'Complete', labelcharts:'Tasks completion'
+                    label: 'Complete', 
+                    labelcharts:'Tasks completion', labeltrue: 'Complete', labelfalse:'Incomplete',
+                    typechart:'pie'
                 }
@@ -55,0 +58,0 @@ ]

js/ui-models/apps/winecellar.data.js

@@ -0,1 +1,2 @@
+var uiModels = uiModels || {};
 uiModels.winecellar_data = [
@@ -2,0 +3,0 @@ {

js/ui-models/apps/winecellar.js

@@ -146,3 +146,3 @@ var winecellar_lovs = {
     },
-    badgefield:function(model){
+    badge:function(model){
         return model.get('remaining') || 0;
@@ -149,0 +149,0 @@ },

js/ui.js

@@ -14,27 +14,2 @@ /*! ***************************************************************************
 
-var fts = {
-    text: 'text',
-    textml: 'textmultiline',
-    bool: 'boolean',
-    int: 'integer',
-    dec: 'decimal',
-    money: 'money',
-    date: 'date',
-    datetime: 'datetime',
-    time: 'time',
-    lov: 'lov',
-    list: 'list', // many values for one field (behave like tags - return an array of strings)
-    //html:'html',
-    formula:'formula',
-    email: 'email',
-    pix: 'image',
-    doc:'document',
-    url: 'url',
-    color: 'color',
-    hidden: 'hidden'
-    //json: 'json',
-    //rating: 'rating',
-    //widget: 'widget'
-};
-
 Evol.UI = {
@@ -47,3 +22,3 @@
         clearer: '<div class="clearfix"></div>',
-        emptyOption: '<option value=""></option>',
+        emptyOption: '<option value=""> - </option>',
         glyphicon: 'glyphicon glyphicon-',
@@ -164,3 +139,3 @@ required: '<span class="evol-required">*</span>', // TODO replace by div w/ ":after" css for icon
             _.each(fLOV, function (f) {
-                h+=this.option(f.id, f.text);
+                h+=this.option(f.id, f.text);//, f.id===value);
             });
@@ -185,9 +160,9 @@ h+='</select>';
 
-        option: function (id, text) {
-            return '<option value="'+id+'">'+text+'</option>';
+        option: function (id, text, selected) {
+            return '<option value="'+id+(selected?'" selected':'"')+'>'+text+'</option>';
         },
-        options: function (fields, value) {
+        options: function (lovList, value) {
             var fnOpt = Evol.UI.input.option,
                 opts='';
-            _.each(fields,function(f){
+            _.each(lovList,function(f){
                 if(f.id===value){
@@ -194,0 +169,0 @@ opts+='<option value="'+f.id+'" selected="selected">'+f.text+'</option>';

package.json

 {
   "name": "evolutility",
-  "version": "0.3.6",
+  "version": "0.4.0",
   "copyright": "(c) 2015 Olivier Giulieri",
@@ -18,9 +18,8 @@ "license": "AGPL-3.0",
   "devDependencies": {
-    "grunt": "0.4.1",
+    "grunt": "~0.4.5",
     "grunt-contrib-concat": "~0.3.0",
-    "grunt-contrib-uglify": "~0.3.2",
-    "grunt-contrib-less": "~0.10.0",
+    "grunt-contrib-uglify": "~0.7.0",
+    "grunt-contrib-less": "~1.0.0",
     "grunt-contrib-copy": "~0.7.0",
-    "grunt-contrib-jshint": "~0.8.0",
-    "grunt-bower-task": "~0.3.4"
+    "grunt-contrib-jshint": "~0.11.0"
   },
@@ -27,0 +26,0 @@ "keywords": [

README.md

@@ -10,3 +10,4 @@ # Evolutility.js
 [AddressBook](http://evoluteur.github.io/evolutility/demo/index.html#contact/list),
-[Wine Cellar](http://evoluteur.github.io/evolutility/demo/index.html#winecellar/list).
+[Wine Cellar](http://evoluteur.github.io/evolutility/demo/index.html#winecellar/list),
+[Graphic Novels](http://evoluteur.github.io/evolutility/demo/index.html#comics/cards).
 
@@ -33,3 +34,3 @@ ## Installation
 * Views for a model: View, Edit, Mini (quick edit), JSON.
-* Views for a collection: List, Badges, Charts.
+* Views for a collection: List, Cards, Charts.
 * Views for actions on a model or collection: Export, Filter.
@@ -74,7 +75,7 @@
 ```
-### Badges
-Shows records side by side as badges.
-![screenshot 1](https://raw.githubusercontent.com/evoluteur/evolutility/master/doc/screenshots/many-badges.png)
+### Cards
+Shows records side by side as cards.
+![screenshot 1](https://raw.githubusercontent.com/evoluteur/evolutility/master/doc/screenshots/many-cards.png)
 ```javascript
-var vw = new Evol.ViewMany.Badges(myConfig);
+var vw = new Evol.ViewMany.Cards(myConfig);
 ```
@@ -196,2 +197,4 @@ ### Charts
 
+Note: For convenience, all dependencies are minified together in a single file "vendors.min.js". The dependencies list is specified in "Gruntfile.js".
+
 ## Documentation
@@ -198,0 +201,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2613757

increased by21.77%

Dev dependency count

6

decreased by-14.29%

Number of package files

130

increased by25%

Lines of code

16424

increased by3.93%

Number of lines in readme file

211

increased by1.44%

No dependency changes