diff --git a/README.md b/README.md index 5fad1ef..924d095 100644 --- a/README.md +++ b/README.md @@ -76,6 +76,19 @@ Render data grid in ``.example`` container. grid.render(); ``` +## Bundled editors + +By default Sensei Grid is bundled with several grid editors that can be registered for a data grid. + +List of available editors: + +- BasicEditor - simple text field to edit basic data +- BooleanEditor - checkbox editor for boolean values (true/false) +- TextareaEditor - large text field for editing large text +- SelectEditor - dropdown select box to choose a value from a list +- DateEditor - datetime editor to choose a specific date from a calendar, provided by pickadate.js +- DisabledEditor - sample editor that can't be edited + ## Blog posts * [Work and open source #2: Sensei Grid](http://lauris.github.io/datazenit/2014/08/29/open-source-work-2-sensei-grid/) diff --git a/bower.json b/bower.json index 187e43a..c416331 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "sensei-grid", - "version": "0.3.10", + "version": "0.3.11", "homepage": "https://github.com/datazenit/sensei-grid", "authors": [ "Lauris " diff --git a/dist/sensei-grid.css b/dist/sensei-grid.css index bc3910c..b7261d5 100644 --- a/dist/sensei-grid.css +++ b/dist/sensei-grid.css @@ -1,5 +1,5 @@ /** - * sensei-grid v0.3.10 + * sensei-grid v0.3.11 * Copyright (c) 2015 Lauris Dzilums * Licensed under MIT */ diff --git a/dist/sensei-grid.js b/dist/sensei-grid.js index b71237c..7f67d5a 100644 --- a/dist/sensei-grid.js +++ b/dist/sensei-grid.js @@ -1,5 +1,5 @@ /** - * sensei-grid v0.3.10 + * sensei-grid v0.3.11 * Copyright (c) 2015 Lauris Dzilums * Licensed under MIT */ @@ -17,7 +17,7 @@ var plugin = this, defaults = { emptyRow: false, - sortable: true, + sortable: false, tableClass: "table table-bordered table-condensed", disableKeys: [], moveOnRowRemove: true, diff --git a/dist/sensei-grid.min.js b/dist/sensei-grid.min.js index 7643bed..22040ec 100644 --- a/dist/sensei-grid.min.js +++ b/dist/sensei-grid.min.js @@ -1,6 +1,6 @@ /** - * sensei-grid v0.3.10 + * sensei-grid v0.3.11 * Copyright (c) 2015 Lauris Dzilums * Licensed under MIT */ -!function(a){a.fn.grid=function(b,c,d,e){var f=this,g={emptyRow:!1,sortable:!0,tableClass:"table table-bordered table-condensed",disableKeys:[],moveOnRowRemove:!0,readonly:!1,emptyGridMessage:null,skipOnDuplicate:null};f.name=null,f.isEditing=!1,f.$prevRow=null,f.editorProps={},f.preventEnter=!1,a.fn.isOnScreen=function(){var b=a(window),c={top:b.scrollTop(),left:b.scrollLeft()};c.right=c.left+b.width(),c.bottom=c.top+b.height();var d=this.offset();return d.right=d.left+this.outerWidth(),d.bottom=d.top+this.outerHeight(),!(c.rightd.right||c.bottomd.bottom)};var h=function(a){var b=a.get(0),c=b.style.display;b.style.display="none",b.offsetHeight,b.style.display=c},i=function(a){return a.replace(/\r\n/g,"\n")};return f.setActiveCell=function(b){f.config.readonly||(f.$prevRow=a(".sensei-grid-tbody>tr>.activeCell",f.$el).parent("tr"),f.$prevRow.removeClass("activeRow"),a(".sensei-grid-tbody>tr>.activeCell",f.$el).removeClass("activeCell"),b.addClass("activeCell"),b.parent("tr").addClass("activeRow"),h(b.parent("tr")),f.events.trigger("cell:select",b),f.$prevRow.index()!==b.parent("tr").index()&&(f.events.trigger("row:select",b.parent("tr")),f.$prevRow.hasClass("sensei-grid-dirty-row")&&f.isEditing&&(f.saveEditor(!0),f.events.trigger("row:save",f.getRowData(f.$prevRow),f.$prevRow,"row:select"))))},a.fn.cellPosition=function(){var b=a(this).position();return f.isSillyFirefox()&&(b.left-=1,b.top-=1),b},f.events={_events:{}},f.events.on=function(a,b,c){_.has(this._events,a)||(this._events[a]=[]),this._events[a].push({callback:b,context:c})},f.events.trigger=function(a){var b=Array.prototype.slice.call(arguments,1);if(_.has(this._events,a)){var c=this._events[a];_.each(c,function(a){var c=_.bind(a.callback,a.context);c.apply(this,b)})}},f.events.off=function(a){_.has(this._events,a)&&delete this._events[a]},f.isSillyFirefox=function(){if(!f.$el.find("td:first").position())return!1;var a=f.$el.position().left,b=f.$el.find("td:first").position().left;return b!==a},f.registerEditor=function(a){var b=new a(f);f.editors[b.name]=b},f.registerRowAction=function(a){var b=new a(f);f.rowActions[b.name]=b},f.render=function(){f.rowElements={},_.each(f.rowActions,function(a){a.initialize();var b="
"+a.rowElement()+"
";f.rowElements[a.name]=b}),f.renderBaseTable(),f.renderColumns(),f.renderData(),_.each(f.editors,function(a){a.initialize(),a.render(),a.getElement().hide()}),f.bindEvents()},f.destroy=function(){f.unbindEvents(),f.$el.remove()},f.addEdit=function(a){f.editPointer===f.edits.length-1?(f.editPointer+=1,f.edits.push(a)):(f.editPointer+=1,f.edits.splice(f.editPointer),f.edits.push(a))},f.redo=function(){return f.editPointer+1>=f.edits.length?[]:(f.editPointer+=1,f.edits[f.editPointer])},f.undo=function(){if(f.editPointer<0)return[];var a=f.edits[f.editPointer];return f.editPointer-=1,a},f.bindEvents=function(){f.unbindEvents(),f.$el.find(".sensei-grid-tbody>tr>td").on("click.grid."+f.name,f.clickCell),f.$el.find(".sensei-grid-tbody>tr>td").on("dblclick.grid",f.dblClickCell),f.$el.on("blur.grid",f.blur),f.$el.on("keydown.grid",f.keydown),f.$el.find(".sensei-grid-thead .sensei-grid-sortable").on("click.grid",f.sort),a(document).on("click.grid",f.editorBlur)},f.unbindEvents=function(){f.$el.off(".grid"),a(document).off(".grid")},f.sort=function(){var b=a(this).data("name"),c="asc";f.$el.find("th.sensei-grid-sortable .glyphicon").remove(),a(this).data("order")&&"asc"===a(this).data("order")?(c="desc",a(this).append(a("").addClass("glyphicon glyphicon-chevron-up"))):a(this).append(a("").addClass("glyphicon glyphicon-chevron-down")),a(this).data("order",c),f.events.trigger("column:sort",b,c,a(this))},f.editorBlur=function(b){f.getActiveCell().length>0&&0===f.$el.has(a(b.target)).length&&(f.exitEditor(),f.deactivateCell())},f.hideEditors=function(){a(".sensei-grid-editor",f.$el).hide()},f.blur=function(){if(f.getActiveCell().length>0&&!f.isEditing){var a=f.getActiveCell();f.exitEditor(),f.isEditing=!1,f.deactivateCell(),h(a.parent("tr"))}},f.parsers={},f.parsers.string=function(a){return a.toString()},f.parsers["int"]=function(a){return parseInt(a)},f.parsers["float"]=function(a){return parseFloat(a)},f.getCellData=function(a){var b=a.text(),c=f.getCellType(a);return _.has(f.parsers,c)&&(b=f.parsers[c](b)),b},f.getCellColumn=function(a){return a.data("column")},f.getCellType=function(a){return a.data("type")},f.getCellStatus=function(a){return!!a.data("saved")},f.getCellDataByIndex=function(a,b){var c=f.getRowByIndex(a),d=f.getCellFromRowByIndex(c,b);return f.getCellData(d)},f.getCellDataByKey=function(a,b){var c=f.getRowByIndex(a),d=f.getCellFromRowByKey(c,b);return f.getCellData(d)},f.getCellFromRowByIndex=function(a,b){var c=a.find("td").eq(b);if(0===c.length)throw new Error("Cell does not exist");return c},f.getCellFromRowByKey=function(b,c){var d=b.find("td").filter(function(){return a(this).data("column")===c});if(0===d.length)throw new Error("Cell does not exist");return d},f.getCellRow=function(a){return a.parent("tr")},f.getRowCellsByIndex=function(a){return f.getRowByIndex(a).find("td")},f.getRowCells=function(a){return a.find("td")},f.getRowByIndex=function(a){var b=f.$el.find(".sensei-grid-tbody>tr").eq(a);if(0===b.length)throw new Error("Row does not exist");return b},f.getRowDataByIndex=function(a){var b=f.getRowByIndex(a);return f.getRowData(b)},f.getRowData=function(b){var c=f.getRowCells(b),d={};return c.each(function(){d[f.getCellColumn(a(this))]=f.getCellData(a(this))}),d},f.getRows=function(){return f.$el.find(".sensei-grid-tbody>tr")},f.getGridData=function(){var b=f.getRows();return b.map(function(){return f.getRowData(a(this))}).get()},f.getActiveCell=function(){return f.isEditing&&f.activeEditor&&f.activeEditor.activeCell?f.activeEditor.activeCell:a("td.activeCell",f.$el)},f.setRowSaved=function(a){a.removeClass("sensei-grid-dirty-row").removeClass("sensei-grid-empty-row"),a.find(">td").data("saved",!0)},f.setRowDirty=function(a){a.addClass("sensei-grid-dirty-row").removeClass("sensei-grid-empty-row"),a.find(">td").data("saved",!1)},f.deactivateCell=function(){var a=f.getActiveCell();a.removeClass("activeCell"),a.parent("tr").removeClass("activeRow"),f.events.trigger("cell:deactivate",a)},f.clearActiveCell=function(){var b=f.getActiveCell(),c=f.getCellData(b);a(">div",b).empty(),f.events.trigger("cell:clear",c,b)},f.removeRow=function(a){var b=a.index();if(a.hasClass("sensei-grid-empty-row"))return!1;f.config.moveOnRowRemove&&f.moveDown();var c=f.getRowData(a);f.events.trigger("row:remove",c,b,a),a.remove()},f.removeActiveRow=function(){var a=f.getActiveCell();if(!a)return!1;var b=f.getCellRow(a);return f.removeRow(b),!0},f.duplicateActiveRow=function(){var b=f.getActiveCell();if(!b)return!1;var c=f.getCellRow(b);if(c.hasClass("sensei-grid-empty-row"))return!1;var d=f.getRowData(c);_.isEmpty(f.config.skipOnDuplicate)||(d=_.omit(d,f.config.skipOnDuplicate));var e=a(f.renderRow(d,!1,!0));return e.insertAfter(c),f.moveDown(),f.events.trigger("row:duplicate",e),!0},f.moveRight=function(){var b=f.getActiveCell();if(b.next().length>0)f.setActiveCell(b.next());else{var c=b.parent("tr").next();c.length>0&&f.setActiveCell(a("td:first",c))}},f.moveUp=function(){var b=f.getActiveCell(),c=b.parent("tr").prev();if(c.length>0){var d=b.index(),e=a("td",c).eq(d);f.setActiveCell(e.length>0?e:a("td:last",c))}},f.moveLeft=function(){var b=f.getActiveCell();if(b.prev().length>0)f.setActiveCell(b.prev());else{var c=b.parent("tr").prev();c.length>0&&f.setActiveCell(a("td:last",c))}},f.moveDown=function(){var b=f.getActiveCell(),c=b.parent("tr").next();if(c.length>0){var d=b.index(),e=a("td",c).eq(d);f.setActiveCell(e.length>0?e:a("td:first",c))}},f.move=function(a){var b="move"+a.charAt(0).toUpperCase()+a.substr(1);_.has(f,b)?(f[b](),f.isEditing&&f.saveEditor(),f.isEditing&&f.editCell(),f.getActiveCell().find(">div").isOnScreen()||f.getActiveCell().get(0).scrollIntoView(_.contains(["up","left"],a)?!0:!1)):console.warn("move method not found",b)},f.editCell=function(){f.config.readonly||f.showEditor()},f.getEditor=function(){return f.activeEditor},f.getEditorInstance=function(){var a=f.getActiveCell(),b=a.data("editor");if(b&&_.has(f.editors,b)){var c=f.getCellColumn(a);return _.has(f.editorProps,c)&&(f.editors[b].props=f.editorProps[c]),f.editors[b]}return console.info("Editor not found, skipping cell: "+b),!1},f.saveEditor=function(b){if(f.isEditing&&f.activeEditor){var c=f.getActiveCell(),d=f.activeEditor.getValue();if(i(d)!==i(c.text())){var e={previousState:f.getCellData(c),currentState:d,row:f.getRowData(f.getCellRow(c)).id,column:c.index()},g=c.data("allowHTML");f.addEdit(e),c.html(g?a("
").html(d):a("
").text(d));var h={};h[c.data("column")]=d,f.events.trigger("editor:save",h,c);var j=c.parent("tr");j.hasClass("sensei-grid-empty-row")&&(j.removeClass("sensei-grid-empty-row").addClass("sensei-grid-dirty-row"),f.assureEmptyRow())}}!b&&f.activeEditor&&f.getEditor().hide()},f.assureEmptyRow=function(){if(f.config.emptyRow&&0===f.$el.find(".sensei-grid-tbody>tr.sensei-grid-empty-row").length){var a=f.$el.find(".sensei-grid-tbody"),b=f.renderRow(null,!1);a.append(b)}},f.exitEditor=function(a){var b=f.getActiveCell();if(f.isEditing&&f.activeEditor)if(a)f.getEditor().hide();else{f.saveEditor();var c=b.parent("tr");c.hasClass("sensei-grid-dirty-row")&&f.isEditing&&f.events.trigger("row:save",f.getRowData(c),c,"editor:close")}f.isEditing&&(f.setActiveCell(b),f.$el.focus()),f.isEditing=!1},f.moveEditor=function(){f.isEditing&&(f.showEditor(),f.editCell())},f.showEditor=function(){if(!f.getEditorInstance())return f.exitEditor(),void(f.isEditing=!0);f.activeEditor=f.getEditorInstance();var a=f.activeEditor.getElement(),b=f.getActiveCell();f.activeEditor.activeCell=b,f.isEditing=!0,f.activeEditor.show(),a.css(b.cellPosition()),f.activeEditor.setDimensions(b);var c=b.data("column"),d=b.data("allowHTML"),e=d?b.find(">div").html():b.text();f.activeEditor.setValue(e);var g={};return g[c]=e,f.events.trigger("editor:load",g,b),a},f.keydown=function(b){var c=!0,d=[8,9,13,27,37,38,39,40,90,89,68],e=[8,37,38,39,40,68,90,89];if((0!==f.getActiveCell().length||f.isEditing)&&_.contains(d,b.which)){if(!f.isEditing&&_.contains(f.config.disableKeys,b.which))return void b.preventDefault();if(!(f.isEditing&&f.getEditor()&&_.contains(e,b.which))){switch(b.preventDefault(),b.which){case 37:f.move("left");break;case 38:f.move("up");break;case 39:f.move("right");break;case 40:f.move("down");break;case 13:var g=!1,h=f.getActiveCell();if(h&&h.data("action")){var i=h.data("action-name");f.rowActions[i]&&f.rowActions[i].trigger({data:{$activeCell:h}}),g=!0}f.isEditing?b.ctrlKey&&b.shiftKey?f.move("up"):b.ctrlKey&&!b.shiftKey?f.move("down"):f.preventEnter||g||f.exitEditor():g||f.editCell();break;case 27:f.isEditing?f.exitEditor(!0):f.$el.blur();break;case 9:f.move(b.shiftKey?"left":"right");break;case 8:b.ctrlKey||b.metaKey?f.removeActiveRow():f.clearActiveCell();break;case 90:if(b.ctrlKey||b.metaKey){var j=f.undo();if("row"in j&&"column"in j){var k=f.getRowByIndex(j.row-1),l=f.getCellFromRowByIndex(k,j.column);l.html(a("
").text(j.previousState));var m={};m[l.data("column")]=j.previousState,f.events.trigger("editor:save",m,l)}}break;case 89:if(b.ctrlKey||b.metaKey){var n=f.redo();if("row"in n&&"column"in n){var o=f.getRowByIndex(n.row-1),p=f.getCellFromRowByIndex(o,n.column);p.html(a("
").text(n.currentState));var q={};q[p.data("column")]=n.currentState,f.events.trigger("editor:save",q,p)}}break;case 68:(b.ctrlKey||b.shiftKey)&&f.duplicateActiveRow()}c&&b.preventDefault()}}},f.clickCell=function(b){b.preventDefault(),f.isEditing&&f.exitEditor(),f.setActiveCell(a(this))},f.dblClickCell=function(b){b.preventDefault(),f.setActiveCell(a(this)),f.editCell()},f.renderColumns=function(){var b=a("thead",f.$el),c=document.createElement("tr");_.each(f.columns,function(b){var d=document.createElement("th"),e=document.createElement("div");f.config.sortable&&(d.className="sensei-grid-sortable"),a(e).text(b.display?b.display:b.name),d.appendChild(e),a(d).data("name",b.name),a(d).data("type",b.type||"string"),a(d).data("editor",b.editor||"BasicEditor"),b.editorProps&&(f.editorProps[b.name]=b.editorProps),c.appendChild(d)}),b.append(c)},f.renderData=function(b){var c=a(".sensei-grid-tbody",f.$el);if(b&&(f.data=b),c.html(null),_.each(f.data,function(a){var b=f.renderRow(a,!0);c.append(b)}),f.config.emptyRow){var d=f.renderRow(null,!1);c.append(d)}if(_.isEmpty(f.data)&&f.config.emptyGridMessage){var e=a("").text(f.config.emptyGridMessage),g=a("").append(e);c.html(g)}},f.renderRow=function(b,c,d){var e=document.createElement("tr");return c||(e.className="sensei-grid-empty-row"),d&&(e.className="sensei-grid-dirty-row"),_.each(f.columns,function(d){var f=document.createElement("td"),g=document.createElement("div");_.has(b,d.name)&&(d.allowHTML&&d.allowHTML===!0?a(g).html(b[d.name]):a(g).text(b[d.name])),d.wrap===!0&&a(f).css("white-space","normal"),a(f).data("allowHTML",d.allowHTML),a(f).data("column",d.name),a(f).data("type",d.type||"string"),a(f).data("editor",d.editor||"BasicEditor"),a(f).data("saved",c),f.appendChild(g),e.appendChild(f)}),_.isEmpty(f.rowElements)||_.each(f.rowElements,function(b,c){var d=document.createElement("td");d.innerHTML=b,a(d).data("action",!0),a(d).data("action-name",c),a(d).addClass("row-action");var g=f.rowActions[c];g.triggerEvent&&g.triggerEvent.event&&g.triggerEvent.selector&&a(d).on(g.triggerEvent.event,g.triggerEvent.selector,{$activeCell:a(d)},g.trigger),e.appendChild(d)}),e},f.renderBaseTable=function(){var a=document.createElement("table"),b=document.createElement("thead"),c=document.createElement("tbody");c.className="sensei-grid-tbody",b.className="sensei-grid-thead",a.className=f.config.tableClass,a.appendChild(b),a.appendChild(c),f.$el.html(a),f.$el.attr("tabindex",-1)},f.init=function(b,c,d,e){return f.config=a.extend({},g,d),f.data=b,f.columns=c,f.name=e,f.$el=a(this),f.editors={},f.rowActions={},f.edits=[],f.editPointer=-1,f},f.init(b,c,d,e)}}(jQuery),function(a){var b=this,c=function(a){this.grid=a};c.extend=function(a){var b,c=this;b=function(){return c.apply(this,arguments)};var d=function(){this.constructor=b};return d.prototype=c.prototype,b.prototype=new d,a&&_.extend(b.prototype,a),b.__super__=c.prototype,b},c.prototype.getElement=function(){return a(this.editor)},c.prototype.initialize=function(){},c.prototype.render=function(){},c.prototype.show=function(){this.getElement().show()},c.prototype.hide=function(){this.getElement().hide(),this.grid.activeEditor.activeCell=null,this.grid.activeEditor=null},c.prototype.setDimensions=function(a){this.getElement().css({width:a.outerWidth()+1,height:a.outerHeight()+1})},c.prototype.getValue=function(){throw Error("Editor.getValue not implemented")},c.prototype.setValue=function(){throw Error("Editor.setValue not implemented")},b.Editor=c,b.BasicEditor=c.extend({types:[],name:"BasicEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-basic-editor";var a=document.createElement("input");a.setAttribute("type","text"),this.editor.appendChild(a),this.grid.$el.append(this.editor)}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.TextareaEditor=c.extend({types:[],name:"TextareaEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-textarea-editor";var a=document.createElement("textarea");this.editor.appendChild(a),this.grid.$el.append(this.editor)}},setDimensions:function(a){this.getElement().find("textarea").css({width:a.outerWidth()+50,height:a.outerHeight()+50})},getValue:function(){return a("textarea",this.editor).val()},setValue:function(b){a("textarea",this.editor).val(b).focus()}}),b.BooleanEditor=c.extend({types:[],name:"BooleanEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-boolean-editor";var b=a("
",{"class":"sensei-grid-checkbox-wrapper"});b.append(a("",{type:"checkbox"})),a(this.editor).append(b),this.grid.$el.append(this.editor)}},setDimensions:function(a){var b={width:a.outerWidth()-3,height:a.outerHeight()-3,background:"white"};this.getElement().find(".sensei-grid-checkbox-wrapper").css(b)},getValue:function(){return a("input",this.editor).is(":checked")?"true":"false"},setValue:function(b){"true"===b.toLowerCase()?a("input",this.editor).prop("checked",!0):a("input",this.editor).prop("checked",!1),a("input",this.editor).focus()}}),b.SelectEditor=c.extend({types:[],name:"SelectEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-custom-editor";var a=document.createElement("select");this.editor.appendChild(a),this.grid.$el.append(this.editor)}},renderValues:function(){if(_.has(this.props,"values")){var a=this.getElement().find("select");a.html(null),_.each(this.props.values,function(b){var c=document.createElement("option");c.value=b,c.innerHTML=b,a.append(c)})}},show:function(){this.renderValues(),this.getElement().show()},getValue:function(){return a("select",this.editor).val()},setValue:function(b){a("select>option",this.editor).filter(function(){return a(this).val()===b}).attr("selected","selected"),a("select").focus()}}),b.DateEditor=c.extend({types:[],name:"DateEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-date-editor";var b=a("
",{"class":"sensei-grid-date-wrapper"});b.append(a("",{type:"text","class":"datepicker"})),a(this.editor).append(b),this.grid.$el.append(this.editor);var c=this.grid;a(".datepicker").pickadate({format:"ddd mmm dd yyyy",editable:!0,today:!1,clear:!1,close:!1,onClose:function(){c.preventEnter=!1},onOpen:function(){c.preventEnter=!0}})}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.DisabledEditor=c.extend({types:[],name:"DisabledEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-disabled-editor";var b=a("",{type:"text",readOnly:!0});a(this.editor).append(b),this.grid.$el.append(this.editor)}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.RichEditor=c.extend({types:[],name:"RichEditor",render:function(){if(!this.editor){this.editor=a("
",{"class":"sensei-grid-editor sensei-grid-rich-editor"});var b=a("
",{"class":"summertime-wrapper"});this.editor.append(b),this.grid.$el.append(this.editor)}},setDimensions:function(a){this.getElement().css({width:a.outerWidth()+50})},getValue:function(){return a(".summertime-wrapper",this.editor).code()},setValue:function(b){a(".summertime-wrapper",this.editor).destroy(),a(".summertime-wrapper",this.editor).html(b);var c=this.grid;a(".summertime-wrapper",this.editor).summernote({focus:!0,toolbar:[["style",["bold","italic","underline","clear"]],["font",["strikethrough"]],["fontsize",["fontsize"]]],onfocus:function(){c.preventEnter=!0},onblur:function(){c.preventEnter=!1},onkeydown:function(a){9===a.keyCode&&a.stopImmediatePropagation()}}),a(".summertime-wrapper",this.editor).code(b)}})}(jQuery); \ No newline at end of file +!function(a){a.fn.grid=function(b,c,d,e){var f=this,g={emptyRow:!1,sortable:!1,tableClass:"table table-bordered table-condensed",disableKeys:[],moveOnRowRemove:!0,readonly:!1,emptyGridMessage:null,skipOnDuplicate:null};f.name=null,f.isEditing=!1,f.$prevRow=null,f.editorProps={},f.preventEnter=!1,a.fn.isOnScreen=function(){var b=a(window),c={top:b.scrollTop(),left:b.scrollLeft()};c.right=c.left+b.width(),c.bottom=c.top+b.height();var d=this.offset();return d.right=d.left+this.outerWidth(),d.bottom=d.top+this.outerHeight(),!(c.rightd.right||c.bottomd.bottom)};var h=function(a){var b=a.get(0),c=b.style.display;b.style.display="none",b.offsetHeight,b.style.display=c},i=function(a){return a.replace(/\r\n/g,"\n")};return f.setActiveCell=function(b){f.config.readonly||(f.$prevRow=a(".sensei-grid-tbody>tr>.activeCell",f.$el).parent("tr"),f.$prevRow.removeClass("activeRow"),a(".sensei-grid-tbody>tr>.activeCell",f.$el).removeClass("activeCell"),b.addClass("activeCell"),b.parent("tr").addClass("activeRow"),h(b.parent("tr")),f.events.trigger("cell:select",b),f.$prevRow.index()!==b.parent("tr").index()&&(f.events.trigger("row:select",b.parent("tr")),f.$prevRow.hasClass("sensei-grid-dirty-row")&&f.isEditing&&(f.saveEditor(!0),f.events.trigger("row:save",f.getRowData(f.$prevRow),f.$prevRow,"row:select"))))},a.fn.cellPosition=function(){var b=a(this).position();return f.isSillyFirefox()&&(b.left-=1,b.top-=1),b},f.events={_events:{}},f.events.on=function(a,b,c){_.has(this._events,a)||(this._events[a]=[]),this._events[a].push({callback:b,context:c})},f.events.trigger=function(a){var b=Array.prototype.slice.call(arguments,1);if(_.has(this._events,a)){var c=this._events[a];_.each(c,function(a){var c=_.bind(a.callback,a.context);c.apply(this,b)})}},f.events.off=function(a){_.has(this._events,a)&&delete this._events[a]},f.isSillyFirefox=function(){if(!f.$el.find("td:first").position())return!1;var a=f.$el.position().left,b=f.$el.find("td:first").position().left;return b!==a},f.registerEditor=function(a){var b=new a(f);f.editors[b.name]=b},f.registerRowAction=function(a){var b=new a(f);f.rowActions[b.name]=b},f.render=function(){f.rowElements={},_.each(f.rowActions,function(a){a.initialize();var b="
"+a.rowElement()+"
";f.rowElements[a.name]=b}),f.renderBaseTable(),f.renderColumns(),f.renderData(),_.each(f.editors,function(a){a.initialize(),a.render(),a.getElement().hide()}),f.bindEvents()},f.destroy=function(){f.unbindEvents(),f.$el.remove()},f.addEdit=function(a){f.editPointer===f.edits.length-1?(f.editPointer+=1,f.edits.push(a)):(f.editPointer+=1,f.edits.splice(f.editPointer),f.edits.push(a))},f.redo=function(){return f.editPointer+1>=f.edits.length?[]:(f.editPointer+=1,f.edits[f.editPointer])},f.undo=function(){if(f.editPointer<0)return[];var a=f.edits[f.editPointer];return f.editPointer-=1,a},f.bindEvents=function(){f.unbindEvents(),f.$el.find(".sensei-grid-tbody>tr>td").on("click.grid."+f.name,f.clickCell),f.$el.find(".sensei-grid-tbody>tr>td").on("dblclick.grid",f.dblClickCell),f.$el.on("blur.grid",f.blur),f.$el.on("keydown.grid",f.keydown),f.$el.find(".sensei-grid-thead .sensei-grid-sortable").on("click.grid",f.sort),a(document).on("click.grid",f.editorBlur)},f.unbindEvents=function(){f.$el.off(".grid"),a(document).off(".grid")},f.sort=function(){var b=a(this).data("name"),c="asc";f.$el.find("th.sensei-grid-sortable .glyphicon").remove(),a(this).data("order")&&"asc"===a(this).data("order")?(c="desc",a(this).append(a("").addClass("glyphicon glyphicon-chevron-up"))):a(this).append(a("").addClass("glyphicon glyphicon-chevron-down")),a(this).data("order",c),f.events.trigger("column:sort",b,c,a(this))},f.editorBlur=function(b){f.getActiveCell().length>0&&0===f.$el.has(a(b.target)).length&&(f.exitEditor(),f.deactivateCell())},f.hideEditors=function(){a(".sensei-grid-editor",f.$el).hide()},f.blur=function(){if(f.getActiveCell().length>0&&!f.isEditing){var a=f.getActiveCell();f.exitEditor(),f.isEditing=!1,f.deactivateCell(),h(a.parent("tr"))}},f.parsers={},f.parsers.string=function(a){return a.toString()},f.parsers["int"]=function(a){return parseInt(a)},f.parsers["float"]=function(a){return parseFloat(a)},f.getCellData=function(a){var b=a.text(),c=f.getCellType(a);return _.has(f.parsers,c)&&(b=f.parsers[c](b)),b},f.getCellColumn=function(a){return a.data("column")},f.getCellType=function(a){return a.data("type")},f.getCellStatus=function(a){return!!a.data("saved")},f.getCellDataByIndex=function(a,b){var c=f.getRowByIndex(a),d=f.getCellFromRowByIndex(c,b);return f.getCellData(d)},f.getCellDataByKey=function(a,b){var c=f.getRowByIndex(a),d=f.getCellFromRowByKey(c,b);return f.getCellData(d)},f.getCellFromRowByIndex=function(a,b){var c=a.find("td").eq(b);if(0===c.length)throw new Error("Cell does not exist");return c},f.getCellFromRowByKey=function(b,c){var d=b.find("td").filter(function(){return a(this).data("column")===c});if(0===d.length)throw new Error("Cell does not exist");return d},f.getCellRow=function(a){return a.parent("tr")},f.getRowCellsByIndex=function(a){return f.getRowByIndex(a).find("td")},f.getRowCells=function(a){return a.find("td")},f.getRowByIndex=function(a){var b=f.$el.find(".sensei-grid-tbody>tr").eq(a);if(0===b.length)throw new Error("Row does not exist");return b},f.getRowDataByIndex=function(a){var b=f.getRowByIndex(a);return f.getRowData(b)},f.getRowData=function(b){var c=f.getRowCells(b),d={};return c.each(function(){d[f.getCellColumn(a(this))]=f.getCellData(a(this))}),d},f.getRows=function(){return f.$el.find(".sensei-grid-tbody>tr")},f.getGridData=function(){var b=f.getRows();return b.map(function(){return f.getRowData(a(this))}).get()},f.getActiveCell=function(){return f.isEditing&&f.activeEditor&&f.activeEditor.activeCell?f.activeEditor.activeCell:a("td.activeCell",f.$el)},f.setRowSaved=function(a){a.removeClass("sensei-grid-dirty-row").removeClass("sensei-grid-empty-row"),a.find(">td").data("saved",!0)},f.setRowDirty=function(a){a.addClass("sensei-grid-dirty-row").removeClass("sensei-grid-empty-row"),a.find(">td").data("saved",!1)},f.deactivateCell=function(){var a=f.getActiveCell();a.removeClass("activeCell"),a.parent("tr").removeClass("activeRow"),f.events.trigger("cell:deactivate",a)},f.clearActiveCell=function(){var b=f.getActiveCell(),c=f.getCellData(b);a(">div",b).empty(),f.events.trigger("cell:clear",c,b)},f.removeRow=function(a){var b=a.index();if(a.hasClass("sensei-grid-empty-row"))return!1;f.config.moveOnRowRemove&&f.moveDown();var c=f.getRowData(a);f.events.trigger("row:remove",c,b,a),a.remove()},f.removeActiveRow=function(){var a=f.getActiveCell();if(!a)return!1;var b=f.getCellRow(a);return f.removeRow(b),!0},f.duplicateActiveRow=function(){var b=f.getActiveCell();if(!b)return!1;var c=f.getCellRow(b);if(c.hasClass("sensei-grid-empty-row"))return!1;var d=f.getRowData(c);_.isEmpty(f.config.skipOnDuplicate)||(d=_.omit(d,f.config.skipOnDuplicate));var e=a(f.renderRow(d,!1,!0));return e.insertAfter(c),f.moveDown(),f.events.trigger("row:duplicate",e),!0},f.moveRight=function(){var b=f.getActiveCell();if(b.next().length>0)f.setActiveCell(b.next());else{var c=b.parent("tr").next();c.length>0&&f.setActiveCell(a("td:first",c))}},f.moveUp=function(){var b=f.getActiveCell(),c=b.parent("tr").prev();if(c.length>0){var d=b.index(),e=a("td",c).eq(d);f.setActiveCell(e.length>0?e:a("td:last",c))}},f.moveLeft=function(){var b=f.getActiveCell();if(b.prev().length>0)f.setActiveCell(b.prev());else{var c=b.parent("tr").prev();c.length>0&&f.setActiveCell(a("td:last",c))}},f.moveDown=function(){var b=f.getActiveCell(),c=b.parent("tr").next();if(c.length>0){var d=b.index(),e=a("td",c).eq(d);f.setActiveCell(e.length>0?e:a("td:first",c))}},f.move=function(a){var b="move"+a.charAt(0).toUpperCase()+a.substr(1);_.has(f,b)?(f[b](),f.isEditing&&f.saveEditor(),f.isEditing&&f.editCell(),f.getActiveCell().find(">div").isOnScreen()||f.getActiveCell().get(0).scrollIntoView(_.contains(["up","left"],a)?!0:!1)):console.warn("move method not found",b)},f.editCell=function(){f.config.readonly||f.showEditor()},f.getEditor=function(){return f.activeEditor},f.getEditorInstance=function(){var a=f.getActiveCell(),b=a.data("editor");if(b&&_.has(f.editors,b)){var c=f.getCellColumn(a);return _.has(f.editorProps,c)&&(f.editors[b].props=f.editorProps[c]),f.editors[b]}return console.info("Editor not found, skipping cell: "+b),!1},f.saveEditor=function(b){if(f.isEditing&&f.activeEditor){var c=f.getActiveCell(),d=f.activeEditor.getValue();if(i(d)!==i(c.text())){var e={previousState:f.getCellData(c),currentState:d,row:f.getRowData(f.getCellRow(c)).id,column:c.index()},g=c.data("allowHTML");f.addEdit(e),c.html(g?a("
").html(d):a("
").text(d));var h={};h[c.data("column")]=d,f.events.trigger("editor:save",h,c);var j=c.parent("tr");j.hasClass("sensei-grid-empty-row")&&(j.removeClass("sensei-grid-empty-row").addClass("sensei-grid-dirty-row"),f.assureEmptyRow())}}!b&&f.activeEditor&&f.getEditor().hide()},f.assureEmptyRow=function(){if(f.config.emptyRow&&0===f.$el.find(".sensei-grid-tbody>tr.sensei-grid-empty-row").length){var a=f.$el.find(".sensei-grid-tbody"),b=f.renderRow(null,!1);a.append(b)}},f.exitEditor=function(a){var b=f.getActiveCell();if(f.isEditing&&f.activeEditor)if(a)f.getEditor().hide();else{f.saveEditor();var c=b.parent("tr");c.hasClass("sensei-grid-dirty-row")&&f.isEditing&&f.events.trigger("row:save",f.getRowData(c),c,"editor:close")}f.isEditing&&(f.setActiveCell(b),f.$el.focus()),f.isEditing=!1},f.moveEditor=function(){f.isEditing&&(f.showEditor(),f.editCell())},f.showEditor=function(){if(!f.getEditorInstance())return f.exitEditor(),void(f.isEditing=!0);f.activeEditor=f.getEditorInstance();var a=f.activeEditor.getElement(),b=f.getActiveCell();f.activeEditor.activeCell=b,f.isEditing=!0,f.activeEditor.show(),a.css(b.cellPosition()),f.activeEditor.setDimensions(b);var c=b.data("column"),d=b.data("allowHTML"),e=d?b.find(">div").html():b.text();f.activeEditor.setValue(e);var g={};return g[c]=e,f.events.trigger("editor:load",g,b),a},f.keydown=function(b){var c=!0,d=[8,9,13,27,37,38,39,40,90,89,68],e=[8,37,38,39,40,68,90,89];if((0!==f.getActiveCell().length||f.isEditing)&&_.contains(d,b.which)){if(!f.isEditing&&_.contains(f.config.disableKeys,b.which))return void b.preventDefault();if(!(f.isEditing&&f.getEditor()&&_.contains(e,b.which))){switch(b.preventDefault(),b.which){case 37:f.move("left");break;case 38:f.move("up");break;case 39:f.move("right");break;case 40:f.move("down");break;case 13:var g=!1,h=f.getActiveCell();if(h&&h.data("action")){var i=h.data("action-name");f.rowActions[i]&&f.rowActions[i].trigger({data:{$activeCell:h}}),g=!0}f.isEditing?b.ctrlKey&&b.shiftKey?f.move("up"):b.ctrlKey&&!b.shiftKey?f.move("down"):f.preventEnter||g||f.exitEditor():g||f.editCell();break;case 27:f.isEditing?f.exitEditor(!0):f.$el.blur();break;case 9:f.move(b.shiftKey?"left":"right");break;case 8:b.ctrlKey||b.metaKey?f.removeActiveRow():f.clearActiveCell();break;case 90:if(b.ctrlKey||b.metaKey){var j=f.undo();if("row"in j&&"column"in j){var k=f.getRowByIndex(j.row-1),l=f.getCellFromRowByIndex(k,j.column);l.html(a("
").text(j.previousState));var m={};m[l.data("column")]=j.previousState,f.events.trigger("editor:save",m,l)}}break;case 89:if(b.ctrlKey||b.metaKey){var n=f.redo();if("row"in n&&"column"in n){var o=f.getRowByIndex(n.row-1),p=f.getCellFromRowByIndex(o,n.column);p.html(a("
").text(n.currentState));var q={};q[p.data("column")]=n.currentState,f.events.trigger("editor:save",q,p)}}break;case 68:(b.ctrlKey||b.shiftKey)&&f.duplicateActiveRow()}c&&b.preventDefault()}}},f.clickCell=function(b){b.preventDefault(),f.isEditing&&f.exitEditor(),f.setActiveCell(a(this))},f.dblClickCell=function(b){b.preventDefault(),f.setActiveCell(a(this)),f.editCell()},f.renderColumns=function(){var b=a("thead",f.$el),c=document.createElement("tr");_.each(f.columns,function(b){var d=document.createElement("th"),e=document.createElement("div");f.config.sortable&&(d.className="sensei-grid-sortable"),a(e).text(b.display?b.display:b.name),d.appendChild(e),a(d).data("name",b.name),a(d).data("type",b.type||"string"),a(d).data("editor",b.editor||"BasicEditor"),b.editorProps&&(f.editorProps[b.name]=b.editorProps),c.appendChild(d)}),b.append(c)},f.renderData=function(b){var c=a(".sensei-grid-tbody",f.$el);if(b&&(f.data=b),c.html(null),_.each(f.data,function(a){var b=f.renderRow(a,!0);c.append(b)}),f.config.emptyRow){var d=f.renderRow(null,!1);c.append(d)}if(_.isEmpty(f.data)&&f.config.emptyGridMessage){var e=a("").text(f.config.emptyGridMessage),g=a("").append(e);c.html(g)}},f.renderRow=function(b,c,d){var e=document.createElement("tr");return c||(e.className="sensei-grid-empty-row"),d&&(e.className="sensei-grid-dirty-row"),_.each(f.columns,function(d){var f=document.createElement("td"),g=document.createElement("div");_.has(b,d.name)&&(d.allowHTML&&d.allowHTML===!0?a(g).html(b[d.name]):a(g).text(b[d.name])),d.wrap===!0&&a(f).css("white-space","normal"),a(f).data("allowHTML",d.allowHTML),a(f).data("column",d.name),a(f).data("type",d.type||"string"),a(f).data("editor",d.editor||"BasicEditor"),a(f).data("saved",c),f.appendChild(g),e.appendChild(f)}),_.isEmpty(f.rowElements)||_.each(f.rowElements,function(b,c){var d=document.createElement("td");d.innerHTML=b,a(d).data("action",!0),a(d).data("action-name",c),a(d).addClass("row-action");var g=f.rowActions[c];g.triggerEvent&&g.triggerEvent.event&&g.triggerEvent.selector&&a(d).on(g.triggerEvent.event,g.triggerEvent.selector,{$activeCell:a(d)},g.trigger),e.appendChild(d)}),e},f.renderBaseTable=function(){var a=document.createElement("table"),b=document.createElement("thead"),c=document.createElement("tbody");c.className="sensei-grid-tbody",b.className="sensei-grid-thead",a.className=f.config.tableClass,a.appendChild(b),a.appendChild(c),f.$el.html(a),f.$el.attr("tabindex",-1)},f.init=function(b,c,d,e){return f.config=a.extend({},g,d),f.data=b,f.columns=c,f.name=e,f.$el=a(this),f.editors={},f.rowActions={},f.edits=[],f.editPointer=-1,f},f.init(b,c,d,e)}}(jQuery),function(a){var b=this,c=function(a){this.grid=a};c.extend=function(a){var b,c=this;b=function(){return c.apply(this,arguments)};var d=function(){this.constructor=b};return d.prototype=c.prototype,b.prototype=new d,a&&_.extend(b.prototype,a),b.__super__=c.prototype,b},c.prototype.getElement=function(){return a(this.editor)},c.prototype.initialize=function(){},c.prototype.render=function(){},c.prototype.show=function(){this.getElement().show()},c.prototype.hide=function(){this.getElement().hide(),this.grid.activeEditor.activeCell=null,this.grid.activeEditor=null},c.prototype.setDimensions=function(a){this.getElement().css({width:a.outerWidth()+1,height:a.outerHeight()+1})},c.prototype.getValue=function(){throw Error("Editor.getValue not implemented")},c.prototype.setValue=function(){throw Error("Editor.setValue not implemented")},b.Editor=c,b.BasicEditor=c.extend({types:[],name:"BasicEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-basic-editor";var a=document.createElement("input");a.setAttribute("type","text"),this.editor.appendChild(a),this.grid.$el.append(this.editor)}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.TextareaEditor=c.extend({types:[],name:"TextareaEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-textarea-editor";var a=document.createElement("textarea");this.editor.appendChild(a),this.grid.$el.append(this.editor)}},setDimensions:function(a){this.getElement().find("textarea").css({width:a.outerWidth()+50,height:a.outerHeight()+50})},getValue:function(){return a("textarea",this.editor).val()},setValue:function(b){a("textarea",this.editor).val(b).focus()}}),b.BooleanEditor=c.extend({types:[],name:"BooleanEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-boolean-editor";var b=a("
",{"class":"sensei-grid-checkbox-wrapper"});b.append(a("",{type:"checkbox"})),a(this.editor).append(b),this.grid.$el.append(this.editor)}},setDimensions:function(a){var b={width:a.outerWidth()-3,height:a.outerHeight()-3,background:"white"};this.getElement().find(".sensei-grid-checkbox-wrapper").css(b)},getValue:function(){return a("input",this.editor).is(":checked")?"true":"false"},setValue:function(b){"true"===b.toLowerCase()?a("input",this.editor).prop("checked",!0):a("input",this.editor).prop("checked",!1),a("input",this.editor).focus()}}),b.SelectEditor=c.extend({types:[],name:"SelectEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-custom-editor";var a=document.createElement("select");this.editor.appendChild(a),this.grid.$el.append(this.editor)}},renderValues:function(){if(_.has(this.props,"values")){var a=this.getElement().find("select");a.html(null),_.each(this.props.values,function(b){var c=document.createElement("option");c.value=b,c.innerHTML=b,a.append(c)})}},show:function(){this.renderValues(),this.getElement().show()},getValue:function(){return a("select",this.editor).val()},setValue:function(b){a("select>option",this.editor).filter(function(){return a(this).val()===b}).attr("selected","selected"),a("select").focus()}}),b.DateEditor=c.extend({types:[],name:"DateEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-date-editor";var b=a("
",{"class":"sensei-grid-date-wrapper"});b.append(a("",{type:"text","class":"datepicker"})),a(this.editor).append(b),this.grid.$el.append(this.editor);var c=this.grid;a(".datepicker").pickadate({format:"ddd mmm dd yyyy",editable:!0,today:!1,clear:!1,close:!1,onClose:function(){c.preventEnter=!1},onOpen:function(){c.preventEnter=!0}})}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.DisabledEditor=c.extend({types:[],name:"DisabledEditor",render:function(){if(!this.editor){this.editor=document.createElement("div"),this.editor.className="sensei-grid-editor sensei-grid-disabled-editor";var b=a("",{type:"text",readOnly:!0});a(this.editor).append(b),this.grid.$el.append(this.editor)}},getValue:function(){return a("input",this.editor).val()},setValue:function(b){a("input",this.editor).val(b).focus()}}),b.RichEditor=c.extend({types:[],name:"RichEditor",render:function(){if(!this.editor){this.editor=a("
",{"class":"sensei-grid-editor sensei-grid-rich-editor"});var b=a("
",{"class":"summertime-wrapper"});this.editor.append(b),this.grid.$el.append(this.editor)}},setDimensions:function(a){this.getElement().css({width:a.outerWidth()+50})},getValue:function(){return a(".summertime-wrapper",this.editor).code()},setValue:function(b){a(".summertime-wrapper",this.editor).destroy(),a(".summertime-wrapper",this.editor).html(b);var c=this.grid;a(".summertime-wrapper",this.editor).summernote({focus:!0,toolbar:[["style",["bold","italic","underline","clear"]],["font",["strikethrough"]],["fontsize",["fontsize"]]],onfocus:function(){c.preventEnter=!0},onblur:function(){c.preventEnter=!1},onkeydown:function(a){9===a.keyCode&&a.stopImmediatePropagation()}}),a(".summertime-wrapper",this.editor).code(b)}})}(jQuery); \ No newline at end of file diff --git a/examples/index.html b/examples/index.html index 8e297f8..540cdc9 100644 --- a/examples/index.html +++ b/examples/index.html @@ -14,7 +14,7 @@ - + @@ -25,10 +25,10 @@ - - - - + + + +