v0.4.0.beta.3

gerard2perez · Apr 23, 2015 · e332138 · e332138
1 parent 6436327
commit e332138
Show file tree

Hide file tree

Showing 12 changed files with 281 additions and 40 deletions.
diff --git a/README.md b/README.md
@@ -56,6 +56,18 @@ ember install:addon ember-cli-crudtable@beta
 ##Changelog
 Maybe you want one of the older relases.
 
+### v0.4.0-beta.3
+1. Fixed a bug that prevent pulling from stopping.
+2. Improved the map initialization.
+3. Support for ReadOnly Fields.
+4. Added the edit-cell-image template.
+5. Added email datatype.
+
+### v0.4.0-beta.2
+1. Added support for data poolling every n milisecods.
+2. Create button can now be hidden.
+3. The export commands can now be hidden.
+
 ### v0.4.0-beta.1
 1. **fields** variable of the component now is and **object** an should be defined through the controller.
 1. Added support to export results to CSV, TSV, JSON.
@@ -80,8 +92,9 @@ The field definition is this:
 field_name:{
 	Label:'label_to_show_on_table_header',
 	Display:'field_which_contain_data_to_show',
-	Type: 'text' || 'googlemap' || 'image',
+	Type: 'any_of_the_supported_datatypes,
 	Zoom:'zoom_value_for_google_map_type'
+	ReadOnly: true || false
 }
 ```
 ** *If not clear please check the example at the end* **.
@@ -102,34 +115,48 @@ These variables are completed optional, if you're using the integrated mixin for
 1. stripped: [ true| **false** ]	-	Makes the table to render stripped.
 1. hover: [ true | **false** ]		-	Allows to hover the table.
 
-###Custom Templates
+##Datatypes
+
+Datatypes allow to make a custom predifined render of the data in the table, currente supported datatypes are:
+
+1. **text**: It just render the informatión without any decoration, in edition mode it renders a input text.
+2. **image**: It assumes that information if an url so it renders the image. In edition mode it render a input text.
+3. **email**: Displays the email along with a button to mail the receiver, in edition mode it renders a input email.
+4. **googlemap**: Render a link that shows a modal windown with the location it is important to notice this Type of field is by default ReadOnly.
+
+
+
+##Custom Templates
 The table which is generated depends on templates so you can choose whatever you like to be the render style of every cell in the table or the model window to update a field.
 
 You must put your templetes under */templates/**ember-cli-crudtable**/template_name*
 
 These are the current aviable templates to overwrite:
 
-####Handlebars templates for data Read
+###Handlebars templates for data Read
 
 a. table-cell-googlemap
 a. table-cell-text
+a. table-cell-image
 
 You can access the data in handeblar using the next object
 
 ```
 recod = {
 	Field:'field_name',
 	Value:'field_value',
-	Display:'mask_field_value'
+	Display:'mask_field_value',
+	ReadOnly: true || false
 }
 ```
 
 ---
 
-####Handlebars templates for data creation/update
+###Handlebars templates for data creation/update
 
 a. edit-cell-googlemap
 a. edit-cell-text
+a. edit-cell-image
 
 You can access the data in handeblar using the next object
 
@@ -138,12 +165,13 @@ recod = {
 	Field:'field_name',
 	Value:'field_value',
 	Display:'mask_field_value'
+	ReadOnly: true || false
 }
 ```
 
 ---
 
-####Other handlebars templates
+###Other handlebars templates
 **modal-googlemap**
 
 Contains the definition for waht will be shown in the modal window when, a googlemap field is defined.
@@ -169,7 +197,26 @@ The templace uses de **crud-cell** helper to determine which templete is goin to
 
 This template is render inside the modal window and calls every tamplate labeled edit-cell-*datatype* this template also calls the **crud-edit-cell** helper in order to determine which template is goin to be rendered.
 
+##Hidding Edit,Delete,Create, Exports
+All these commands can be hidden if you need just by setting to null their corresponding action in the handlebars herlper.
+
+```
+{{crud-table
+	createRecord=null
+	deleteRecord=null
+	updateRecord=null
+	exports=false
+	
+	fields=fieldDefinition	
+}}
+```
+
+##Data Pulling
+
+ember-cli-crudtable has the hability to indicate and interval of time for reloading all data from the server.
 
+You can do this by setting the pulling var in the template to the time you like to pull in milliseconds.
+The default value if false (no pulling).
 
 ##Controller Configuration
 You can use this very same code when creating your controller and the only thing you have to worry about is to indicate the model.

diff --git a/addon/components/crud-cell.js b/addon/components/crud-cell.js
@@ -7,7 +7,10 @@ export default Ember.Component.extend({
     parent:null,
     actions: {
         show_map: function () {
-            this.sendAction('renderMap',this.get('parent'));
+            this.sendAction( 'renderMap', this.get('parent'), this.get('record.Type') );
+        },
+        mailto:function(){
+            document.location.href = "mailto:"+this.get('record.Value');
         }
     }
 });
diff --git a/addon/components/crud-edit-cell.js b/addon/components/crud-edit-cell.js
@@ -7,7 +7,9 @@ export default Ember.Component.extend({
         return this.get('record.Value');
     }.property('record'),
     layoutName: function () {
-        console.log(this.get('record'));
+        if(this.get('record.ReadOnly')){
+            return null;
+        }
         return 'ember-cli-crudtable/edit-cell-' + this.get('record.Type');
     }.property('record'),
     parent:null,
@@ -18,4 +20,4 @@ export default Ember.Component.extend({
             this.sendAction('renderMap',this.get('parent'));
         }
     }
-});
+});
diff --git a/addon/components/crud-table.js b/addon/components/crud-table.js
@@ -8,6 +8,7 @@ var CustomField = Ember.Object.extend({
     Type: null,
     Display: null,
     DisplayField: null,
+    ReadOnly:null,
     listener: function () {}.observes('Value'),
     googlefield: function () {}.observes('Display'),
 });
@@ -73,6 +74,7 @@ var regenerateView = function (cmp) {
                             Field: field,
                             Value: data,
                             Display: data,
+                            ReadOnly: cmp.fields[field].ReadOnly || false,
                             Type: cmp.fields[field].Type || 'text',
                             listener: function () {
                                 row.set(this.get('Field'), this.get('Value'));
@@ -84,6 +86,7 @@ var regenerateView = function (cmp) {
                                 if (this.get('DisplayField')) {
                                     row.set(this.get('DisplayField'), this.get('Display'));
                                 }
+                                this.set('ReadOnly',cmp.fields[field].ReadOnly || true);
                             }.observes('Display')
                         });
                         switch (cfield.get('Type')) {
@@ -129,28 +132,32 @@ var hidemodal = function () {
     $("#CrudTableDeleteRecordModal").modal('hide');
 };
 var lastquery = {
-    page: null
+    page: 1
 };
 
 var PULLID = 0;
 var PULLFN = function(cmp,time){
     return setTimeout(function(){
         var deferred = Ember.RSVP.defer('crud-table#pulling');
-        //cmp.set('isLoading', true);
-        cmp.sendAction('searchRecord', {}, deferred);
+        cmp.sendAction('searchRecord', lastquery, deferred);
         deferred.promise.then(function (records) {
             cmp.set('page_size',records.get('content.length') );
             metadata(records, cmp);
             cmp.set('value', records);
             regenerateView(cmp);
-            //cmp.set('isLoading', false);
-            PULLFN(cmp,time);
+            PULLID = PULLFN(cmp,time);
         }, function (data) {
-            alert(data.message);
-            //cmp.set('isLoading', false);
+            console.log(data.message);
         });
     },time);
-}
+};
+var PULL = function(cmp){
+    clearTimeout(PULLID);
+    PULLID=0;
+    if( cmp.get('pulling') > 0){
+        PULLID = PULLFN(cmp,cmp.get('pulling'));
+    }
+};
 export default Ember.Component.extend({
     pulling:false,
     stripped: false,
@@ -160,6 +167,9 @@ export default Ember.Component.extend({
     deleteRecord: 'delete',
     cancelRecord: 'cancel',
     searchRecord: 'FetchData',
+    newRecord:  false,
+    isDeleting: false,
+    showMap:    false,
     currentRecord: null,
     getRecord: 'getRecord',
     isLoading: true,
@@ -349,8 +359,6 @@ export default Ember.Component.extend({
             deferred.promise.then(function () {
                 lastquery.page = that.get('pagination').current;
                 that.sendAction('searchRecord', lastquery, updateview);
-                //regenerateView(that);
-                //recalculatePagination(that,that.get('pagination'));
             }, function (data) {
                 alert(data.message);
                 that.set('isLoading', false);
@@ -367,24 +375,30 @@ export default Ember.Component.extend({
                 that.set('isLoading', false);
             });
         },
-        internal_map: function (record) {
+        internal_map: function (record,kind) {
+            if(google === undefined){
+
+            }
             var that = this;
             that.set('showMap', true);
-            this.set('currentRecord', record);
             showmodal();
             function mapit(id, latlng) {
+                if(document.getElementById(id)==null){
+                    return false;
+                }
                 var mapOptions = {
                     zoom: latlng.zoom,
                     center: new google.maps.LatLng(latlng.lat, latlng.lng),
                     mapTypeId: google.maps.MapTypeId.ROADMAP
                 };
                 var map = new google.maps.Map(document.getElementById(id), mapOptions);
                 record.set('map', map);
+                return true;
             }
 
             var cord = "";
             record.forEach(function (prop) {
-                if (prop.Type === 'googlemap') {
+                if (prop.Type === kind) {
                     cord = prop.Value.split(',');
                     cord = {
                         lat: cord[0],
@@ -393,10 +407,24 @@ export default Ember.Component.extend({
                     };
                 }
             });
-
-            setTimeout(function () {
-                mapit('google_map_canvas', cord);
-            }, 500);
+            var waitforgoogle = function(fn){
+                if(google === undefined){
+                    setTimeout(function () {
+                        fn(fn);
+                    }, 10);
+                    return false;
+                }
+                if( mapit('google_map_canvas', cord) ){
+                    setTimeout(function(){
+                        that.set('currentRecord', record);  
+                    },1);
+                }else{
+                    setTimeout(function () {
+                        fn(fn);
+                    }, 10);
+                }
+            };
+            waitforgoogle(waitforgoogle);
         },
         internal_create: function () {
             var that = this;
@@ -437,14 +465,8 @@ export default Ember.Component.extend({
         this.init = function () {
             that._super();
         }.on('willInsertElement');
-        this.addObserver('pulling',function(a,b){
-            if( PULLID > 0 && that.get('pulling')>0 ){
-                clearTimeout(PULLID);
-                PULLID=0;
-            }
-            if(this.get('pulling')>0){
-                 PULLID = PULLFN(that,that.get('pulling'));
-            }
+        this.addObserver('pulling',function(){
+            PULL(that);
         });
     }.on('willInsertElement'),
     setup: function () {
@@ -461,7 +483,7 @@ export default Ember.Component.extend({
             that.set('value', records);
             regenerateView(that);
             that.set('isLoading', false);
-            PULLID = PULLFN(that,that.get('pulling'));
+            PULL(that);
         }, function (data) {
             alert(data.message);
             that.set('isLoading', false);

diff --git a/app/templates/ember-cli-crudtable/edit-cell-email.hbs b/app/templates/ember-cli-crudtable/edit-cell-email.hbs
@@ -0,0 +1,6 @@
+<div class="form-group">
+    <label class="col-sm-2 control-label">{{record.Field}}</label>
+    <div class="col-sm-10">
+        {{input value=record.Value type="email" class="form-control"}}
+    </div>
+</div>
diff --git a/app/templates/ember-cli-crudtable/edit-cell-image.hbs b/app/templates/ember-cli-crudtable/edit-cell-image.hbs
@@ -0,0 +1,9 @@
+<div class="form-group">
+    <label class="col-sm-2 control-label">{{record.Field}}</label>
+    <div class="col-sm-8">
+        {{input value=record.Value type="text" class="form-control"}}
+    </div>
+    <div class="col-sm-2">
+    	<img {{bind-attr src=record.Value}} style="height:auto;width:100%"/>
+    </div>
+</div>
diff --git a/app/templates/ember-cli-crudtable/table-cell-email.hbs b/app/templates/ember-cli-crudtable/table-cell-email.hbs
@@ -0,0 +1,5 @@
+
+{{record.Value}} 
+<strong>
+<a {{action 'mailto' record}} class="label label-primary glyphicon glyphicon-envelope">mail</a>
+</strong>
diff --git a/app/templates/ember-cli-crudtable/table-cell-googlemap.hbs b/app/templates/ember-cli-crudtable/table-cell-googlemap.hbs
@@ -1 +1 @@
-<a {{action 'show_map' record}}>{{record.Display}}</a> {{record.Type}}
+<a {{action 'show_map' record}}>{{record.Display}}</a>
diff --git a/app/templates/ember-cli-crudtable/table-modal.hbs b/app/templates/ember-cli-crudtable/table-modal.hbs
@@ -22,7 +22,6 @@
                 </h4>
             </div>
             <div class="modal-body">
-            {{newRecord}}.{{isDeleting}}.{{showMap}}
                 {{#if newRecord}}
                     {{render 'ember-cli-crudtable/table-update' this.currentRecord}}
                 {{else}}

diff --git a/app/templates/ember-cli-crudtable/table-update.hbs b/app/templates/ember-cli-crudtable/table-update.hbs
@@ -1,6 +1,8 @@
 <form method="get" class="form-horizontal">
     {{#each record in this.model}}
-        {{crud-edit-cell record=record}}
-        <div class="hr-line-dashed"></div>
+    	{{#unless record.ReadOnly}}
+        	{{crud-edit-cell record=record}}
+        	<div class="hr-line-dashed"></div>
+        {{/unless}}
     {{/each}}
 </form>
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ember-cli-crudtable",
-  "version": "0.4.0-beta.2",
+  "version": "0.4.0-beta.3",
   "description": "This addon allows you to easly create a CRUD Table, it will take you only 5s!.",
   "directories": {
     "doc": "doc",
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<a {{action 'show_map' record}}>{{record.Display}}</a> {{record.Type}}
		<a {{action 'show_map' record}}>{{record.Display}}</a>