nscomponentsreact
Version:
React Wrapper Components for NSComponents
1,648 lines (1,550 loc) • 55.6 kB
JavaScript
var nsModuleExport = function(root,name,prototype)
{
if(typeof exports === 'object' && typeof module === 'object')
{
module.exports[name] = prototype;
}
else if (typeof define === "function" && define.amd)
{
define(name,[], function () {return prototype;});
}
else if(typeof exports === 'object')
{
exports[name] = prototype;
}
else
{
root[name] = prototype;
}
};var __nsGlobal = (function () {
if (typeof globalThis !== "undefined") return globalThis;
if (typeof self !== "undefined") return self;
if (typeof window !== "undefined") return window;
if (typeof global !== "undefined") return global;
return Function("return this")();
})();var nsIsWeb = function(root)
{
if(typeof exports === 'object' && typeof module === 'object')
{
return false;
}
else if (typeof define === "function" && define.amd)
{
return false;
}
else if(typeof exports === 'object')
{
return false;
}
else
{
return true;
}
};if(!nsIsWeb())
{
var nsutilRef = require('./nsUtil.min.js');
var NSUtil = nsutilRef.NSUtil;
}
var nsTextEditor = (function()
{
function nsTextEditor(setting,util)
{
var input;
var defaultValue;
var self = this;
var prevHtml = null;
this.init = function()
{
prevHtml = setting.container.innerHTML;
setting.container.innerHTML = "";
input = util.createElement("input",null,"nsTextEditor");
setting.container.appendChild(input);
util.addEvent(input,"keydown",this.handleKeyDown);
util.addEvent(input,"click",function(event){
event = util.getEvent(event);
self.setFocus();
event.stopPropagation();
event.stopImmediatePropagation();
event.preventDefault();
});
defaultValue = setting.defaultValue;
input.value = defaultValue;
input.focus();
input.select();
};
this.handleKeyDown = function(event)
{
event = util.getEvent(event);
var keyCode = util.KEYCODE;
if (event.keyCode == keyCode.LEFT && event.keyCode == keyCode.RIGHT)
{
event.stopImmediatePropagation();
}
if (event.keyCode == keyCode.ENTER)
{
self.save();
}
else if (event.keyCode == keyCode.TAB)
{
self.save();
event.preventDefault();
}
else if (event.keyCode == keyCode.ESC)
{
self.cancel();
event.preventDefault();
}
};
this.save = function()
{
setting.commitChanges(self.getValue());
};
this.cancel = function()
{
input.value = defaultValue;
setting.cancelChanges();
};
this.destroy = function()
{
if(input && input.parentNode)
{
input.parentNode.removeChild(input);
}
setting.container.innerHTML = prevHtml;
};
this.getValue = function()
{
return input.value;
};
this.setFocus = function()
{
input.focus();
//setTimeout(function(){input.selectionStart = input.selectionEnd = 10000; }, 0);
input.selectionEnd = input.selectionStart = input.value.length;
};
this.hasValueChanged = function()
{
return (!(input.value == "" && defaultValue == null)) && (input.value != defaultValue);
};
this.validate = function()
{
if(setting.validator)
{
return setting.validator(input.value);
}
return {isValid:true,message:null};
};
this.init();
};
return nsTextEditor;
})();
nsModuleExport(__nsGlobal,"nsTextEditor",nsTextEditor);
var nsTextAreaEditor = (function()
{
function nsTextAreaEditor(setting,util)
{
var input, wrapper;
var defaultValue;
var self = this;
this.init = function ()
{
var container = document.body;
wrapper = util.createDiv(null,"nsTextAreaEditor");
input = util.createElement("textarea",null,"nsTextArea");
input.setAttribute("hidefocus",true);
input.setAttribute("rows",5);
util.addEvent(input,"keydown",this.handleKeyDown);
wrapper.appendChild(input);
wrapper.appendChild(document.createElement("br"));
var buttonWrapper = util.createDiv(null);
buttonWrapper.style.textAlign = "right";
wrapper.appendChild(buttonWrapper);
var btnSave = util.createElement("button");
btnSave.appendChild(document.createTextNode("Save"));
util.addEvent(btnSave,"click",this.save);
buttonWrapper.appendChild(btnSave);
buttonWrapper.appendChild(document.createTextNode(" "));
var btnCancel = util.createElement("button");
btnCancel.appendChild(document.createTextNode("Cancel"));
buttonWrapper.appendChild(btnCancel);
util.addEvent(btnCancel,"click",this.cancel);
container.appendChild(wrapper);
self.position(setting.position);
defaultValue = setting.defaultValue;
input.value = defaultValue;
input.focus();
input.select();
};
this.handleKeyDown = function(event)
{
event = util.getEvent(event);
var keyCode = util.KEYCODE;
if (event.keyCode == keyCode.ENTER && event.ctrlKey)
{
self.save();
}
else if (event.keyCode == keyCode.ESC)
{
self.cancel();
event.preventDefault();
}
else if (event.keyCode == keyCode.TAB)
{
self.cancel();
event.preventDefault();
}
};
this.save = function ()
{
setting.commitChanges(self.getValue());
};
this.cancel = function ()
{
input.value = defaultValue;
setting.cancelChanges();
};
this.position = function(position)
{
wrapper.style.top = (position.top - 5) + "px";
wrapper.style.left = (position.left - 5) + "px";
};
this.destroy = function()
{
wrapper.parentNode.removeChild(wrapper);
};
this.getValue = function()
{
return input.value;
};
this.setFocus = function()
{
input.focus();
};
this.hasValueChanged = function()
{
return (!(input.value == "" && defaultValue == null)) && (input.value != defaultValue);
};
this.validate = function()
{
if(setting.validator)
{
return setting.validator(input.value);
}
return {isValid:true,message:null};
};
this.init();
}
return nsTextAreaEditor;
})();
nsModuleExport(__nsGlobal,"nsTextAreaEditor",nsTextAreaEditor);
var NSCellSelection = (function()
{
var NSCellSelection = function(table,setting)
{
this.__table = table;
this.__setting = setting;
this.util = new NSUtil();
this.__tblBody = null;
this.__scrollableElement = null;
this.__config = null;
this.__initDone = false;
this.__hasFocus = false;
this.__range = null;
this.__deltaX = 0;
this.__deltaY = 0;
this.__selectedCell = null;
this.__lastDirection = null;
this.__handle = null;
this.__lastEditor = null;
this.__isHandleDragged = false;
this.__tblMouseDownRef = null;
this.__tblMouseMoveRef = null;
this.__tblClickRef = null;
this.__tbldblClickRef = null;
this.__documentMouseDownRef = null;
this.__documentMouseUpRef = null;
this.__documentMouseMoveRef = null;
this.__documentKeyEventRef = null;
this.__documentCopyRef = null;
this.__documentPasteRef = null;
this.__initialize = function()
{
if(this.__table && this.__table.tBodies && this.__table.tBodies.length > 0 && this.__table.tBodies[0].rows.length > 0)
{
this.util.addStyleClass(this.__table,"nsSelectionTable");
this.__tblBody = this.__table.tBodies[0];
if(!this.__setting)
{
this.__setting = {};
}
var self = this;
this.__config = {
scrollableElement: this.__setting["scrollableElement"] || this.__table.parentNode,
enableFillHandle: Boolean.parse(this.__setting["enableFillHandle"]),
enableKeyboardNavigation: Boolean.parse(this.__setting["enableKeyboardNavigation"]),
enableCopy: Boolean.parse(this.__setting["enableCopy"]),
enablePaste: Boolean.parse(this.__setting["enablePaste"]),
cellClass: this.__setting["cellClass"] || "nsCell",
areaClass: this.__setting["areaClass"] || "nsArea",
editors: this.__setting["editors"] || []
};
this.__config["areaClassLeft"] = this.__setting["areaClassLeft"] || (this.__config.areaClass + "-left");
this.__config["areaClassRight"] = this.__setting["areaClassRight"] || (this.__config.areaClass + "-right");
this.__config["areaClassTop"] = this.__setting["areaClassTop"] || (this.__config.areaClass + "-top");
this.__config["areaClassBottom"] = this.__setting["areaClassBottom"] || (this.__config.areaClass + "-bottom");
var colLength = this.__tblBody.rows[0].cells.length;
var editors = this.__config.editors;
for(var count = 0;count < colLength;count++)
{
if(editors.length > count)
{
var editor = editors[count] || {};
if(!editor.type && !editor.customEditor)
{
editors.push({"type":NSCellSelection.EDITORS.TEXT});
}
}
else
{
editors.push({"type":NSCellSelection.EDITORS.TEXT});
}
}
this.__scrollableElement = this.__config.scrollableElement;
this.__range = {cursor:null,start:null,topLeft:null,bottomRight:null};
if(this.__config.enableFillHandle)
{
this.__createHandle();
}
if(!this.__tblMouseDownRef && !this.__config.enableFillHandle)
{
this.__tblMouseDownRef = this.__tblMouseDownHandler.bind(this);
this.util.addEvent(this.__table,"mousedown", this.__tblMouseDownRef);
}
if(!this.__tblClickRef)
{
this.__tblClickRef = this.__tblClickHandler.bind(this);
this.util.addEvent(this.__table,"click", this.__tblClickRef);
}
if(!this.__tbldblClickRef)
{
this.__tbldblClickRef = this.__tbldblClickHandler.bind(this);
this.util.addEvent(this.__table,"dblclick", this.__tbldblClickRef);
}
if(!this.__documentMouseDownRef)
{
this.__documentMouseDownRef = this.__documentMouseDownHandler.bind(this);
this.util.addEvent(document,"mousedown", this.__documentMouseDownRef);
}
if(!this.__documentKeyEventRef && this.__config.enableKeyboardNavigation)
{
this.__documentKeyEventRef = this.__documentKeyEventHandler.bind(this);
this.util.addEvent(document,"keypress", this.__documentKeyEventRef);
this.util.addEvent(document,"keyup", this.__documentKeyEventRef);
this.util.addEvent(document,"keydown", this.__documentKeyEventRef);
}
if(!this.__documentCopyRef && this.__config.enableCopy)
{
this.__documentCopyRef = this.__documentCopyHandler.bind(this);
this.util.addEvent(document,"copy", this.__documentCopyRef);
}
if(!this.__documentPasteRef && this.__config.enablePaste)
{
this.__documentPasteRef = this.__documentPasteHandler.bind(this);
this.util.addEvent(document,"paste", this.__documentPasteRef);
}
this.__initDone = true;
}
};
this.getSelectedRows = function()
{
var arrReturn = [];
if(this.__range.cursor)
{
var range = this.__range;
var arrRows = this.__tblBody.rows;
var length = range.bottomRight.row;
for(var count = range.topLeft.row;count <= length;count++)
{
if(arrRows[count])
{
arrReturn.push({rowIndex:count,row:arrRows[count]});
}
else
{
break;
}
}
}
return arrReturn;
};
this.getSelectedRowsCells = function()
{
var arrReturn = [];
if(this.__range.cursor)
{
var range = this.__range;
var arrRows = this.getSelectedRows();
var length = arrRows.length;
var arrCells = [];
var arrSelectedCells = [];
var cellLength = range.bottomRight.col;
var row = null;
for(var count = 0;count < length;count++)
{
row = arrRows[count].row;
arrCells = row.cells;
arrSelectedCells = [];
for(var innerCount = range.topLeft.col;innerCount <= cellLength;innerCount++)
{
arrSelectedCells.push({rowIndex:arrRows[count].rowIndex,row:row,cellIndex:innerCount,cell:arrCells[innerCount]});
}
arrReturn.push({rowIndex:arrRows[count].rowIndex,row:row,cellDetails:arrSelectedCells});
}
}
return arrReturn;
};
this.getSelectedCellValues = function()
{
var arrReturn = [];
var arrDetail = this.getSelectedRowsCells();
var arrValues = [];
for(var rowCount = 0;rowCount < arrDetail.length;rowCount++)
{
var arrCellDetails = arrDetail[rowCount].cellDetails;
var arrValues = [];
for(var cellCount = 0;cellCount < arrCellDetails.length;cellCount++)
{
arrValues.push(arrCellDetails[cellCount].cell.innerText);
}
arrReturn.push(arrValues);
}
return arrReturn;
};
this.setSelectedCellValues = function(arrValues)
{
if(arrValues)
{
if(!this.util.isArray(arrValues))
{
arrValues = [arrValues];
}
var arrDetail = this.getSelectedRowsCells();
for(var rowCount = 0;rowCount < arrDetail.length && (rowCount in arrValues);rowCount++)
{
var arrCellDetails = arrDetail[rowCount].cellDetails;
var value = arrValues[rowCount];
if(!this.util.isArray(value))
{
value = [value];
}
for(var cellCount = 0;cellCount < arrCellDetails.length && (cellCount in value);cellCount++)
{
this.setCellValue(arrCellDetails[cellCount].cell,value[cellCount]);
}
}
}
};
this.setCellValue = function(cell,data)
{
if(cell)
{
var row = this.util.findParent(cell,"tr");
this.util.dispatchEvent(this.__table,NSCellSelection.SET_CELL_VALUE,cell,{cellIndex:cell.cellIndex,rowIndex:row.rowIndex,cell:cell,row:row,dataToBeSet:data});
}
};
this.selectAll = function()
{
this.__selectCell({row:0,col:0},{row:-1,col:-1});
this.__refreshCells();
this.__refreshPosition();
};
this.deselectAll = function()
{
this.__deSelectCurrentRange();
this.__refreshCells();
this.__refreshPosition();
};
this.selectRange = function(fromRange,toTange)
{
if(fromRange && toTange)
{
this.__selectCell(fromRange,toTange);
this.__refreshCells();
this.__refreshPosition();
}
};
this.selectCell = function(cellRange)
{
if(cellRange)
{
this.__selectCell(cellRange);
this.__refreshCells();
this.__refreshPosition();
}
};
this.destroy = function()
{
if(this.__initDone)
{
this.deselectAll();
if(this.__tblMouseDownRef)
{
this.util.removeEvent(this.__table,"mousedown", this.__tblMouseDownRef);
this.__tblMouseDownRef = null;
}
if(this.__tblClickRef)
{
this.util.removeEvent(this.__table,"click", this.__tblClickRef);
this.__tblClickRef = null;
}
if(this.__tbldblClickRef)
{
this.util.removeEvent(this.__table,"dblclick", this.__tbldblClickRef);
this.__tbldblClickRef = null;
}
if(this.__tblMouseMoveRef)
{
this.util.removeEvent(this.__table,"mousemove", this.__tblMouseMoveRef);
this.__tblMouseMoveRef = null;
}
if(this.__documentMouseDownRef)
{
this.util.removeEvent(document,"mousedown", this.__documentMouseDownRef);
this.__documentMouseDownRef = null;
}
if(this.__documentMouseUpRef)
{
this.util.removeEvent(document,"mouseup", this.__documentMouseUpRef);
this.__documentMouseUpRef = null;
}
if(this.__documentMouseMoveRef)
{
this.util.removeEvent(document,"mousemove", this.__documentMouseMoveRef);
this.__documentMouseMoveRef = null;
}
if(this.__documentKeyEventRef)
{
this.util.removeEvent(document,"keypress", this.__documentKeyEventRef);
this.util.removeEvent(document,"keyup", this.__documentKeyEventRef);
this.util.removeEvent(document,"keydown", this.__documentKeyEventRef);
this.__documentKeyEventRef = null;
}
if(this.__documentCopyRef)
{
this.util.removeEvent(document,"copy", this.__documentCopyRef);
this.__documentCopyRef = null;
}
if(this.__documentPasteRef)
{
this.util.removeEvent(document,"paste", this.__documentPasteRef);
this.__documentPasteRef = null;
}
this.__initDone = false;
}
};
this.__tblMouseDownHandler = function(event)
{
if(!this.__lastEditor)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
//var cell = this.__closestCell(target);
var cell = this.util.findParent(target,"TD");
if(cell)
{
this.__fireSelectionStartEvent();
this.__selectedCell = cell;
var position = this.__getCellPosition(cell);
this.__selectCell(position,event.shiftKey);
event.preventDefault();
this.__refreshCells();
}
if(!this.__documentMouseUpRef)
{
this.__documentMouseUpRef = this.__documentMouseUpHandler.bind(this);
this.util.addEvent(document,"mouseup", this.__documentMouseUpRef);
}
if(!this.__documentMouseMoveRef)
{
this.__documentMouseMoveRef = this.__documentMouseMoveHandler.bind(this);
this.util.addEvent(document,"mousemove", this.__documentMouseMoveRef);
}
if(!this.__tblMouseMoveRef)
{
this.__tblMouseMoveRef = this.__tblMouseMoveHandler.bind(this);
this.util.addEvent(this.__table,"mousemove", this.__tblMouseMoveRef);
}
}
};
this.__tblMouseMoveHandler = function(event)
{
this.__movingHandler(event);
};
this.__tblClickHandler = function(event)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
var cell = this.util.findParent(target,"TD");
if (!cell || (this.__lastEditor && this.__lastEditor.__cell == cell))
{
if(this.__lastEditor)
{
this.__lastEditor.setFocus();
}
return;
}
if (this.__lastEditor && this.__lastEditor.__cell != cell)
{
this.__commitEditorChanges(this.__lastEditor);
}
if(this.__config.enableFillHandle && cell)
{
this.__fireSelectionStartEvent();
this.__selectedCell = cell;
var position = this.__getCellPosition(cell);
this.__selectCell(position,event.shiftKey);
event.preventDefault();
this.__refreshCells();
this.__repositionHandle(cell);
}
};
this.__tbldblClickHandler = function(event)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
var cell = this.util.findParent(target,"TD");
if(!this.__lastEditor || (this.__lastEditor && this.__lastEditor.__cell != cell))//if(this.__selectedCell != cell)
{
this.__selectedCell = cell;
this.__handleEditor(this.__selectedCell,event);
}
};
this.__documentMouseDownHandler = function(event)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
if(this.__setFocus(this.__table === target || (this.__table.compareDocumentPosition(target) & Node.DOCUMENT_POSITION_CONTAINED_BY)))
{
//scope.$apply();
}
};
this.__documentMouseMoveHandler = function(event)
{
this.__repositionScrolls(event,true,true);
};
this.__documentMouseUpHandler = function(event)
{
if(this.__documentMouseMoveRef)
{
this.util.removeEvent(document,"mousemove",this.__documentMouseMoveRef);
this.__documentMouseMoveRef = null;
}
if(this.__documentMouseUpRef)
{
this.util.removeEvent(document,"mouseup", this.__documentMouseUpRef);
this.__documentMouseUpRef = null;
}
if(this.__tblMouseMoveRef)
{
this.util.removeEvent(this.__table,"mousemove",this.__tblMouseMoveRef);
this.__tblMouseMoveRef = null;
}
/*if(this.__handleDragRef)
{
this.util.removeEvent(this.__table,"mousemove", this.__handleDragRef);
this.__handleDragRef = null;
}*/
this.__deltaX = 0;
this.__deltaY = 0;
this.__fireSelectionEndEvent();
};
this.__documentKeyEventHandler = function(event)
{
if(this.__hasFocus)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
if(!this.__isKeyStrokeValid(target,this.__table))
{
if(event.type == "keydown")
{
if(event.keyCode === this.util.KEYCODE.ENTER)
{
this.__handleEditor(this.__selectedCell,event);
}
else if(this.__KeyMoveHandler(event))
{
this.__fireSelectionStartEvent();
this.__refreshCells();
this.__refreshPosition(event);
event.stopImmediatePropagation();
event.preventDefault();
this.__fireSelectionEndEvent();
}
}
}
}
};
this.__documentCopyHandler = function(event)
{
if(this.__hasFocus)
{
event = this.util.getEvent(event);
var clipboardData = (event.clipboardData || event.originalEvent && event.originalEvent.clipboardData);
var arrData = this.getSelectedCellValues();
var data = this.__formatDataForCopy(arrData);
if(clipboardData)
{
clipboardData.setData("text/plain", data);
event.preventDefault();
}
else if(window.clipboardData)
{
window.clipboardData.setData("Text", data);
event.preventDefault();
}
}
};
this.__documentPasteHandler = function(event)
{
if(this.__hasFocus)
{
event = this.util.getEvent(event);
var clipboardData = (event.clipboardData || event.originalEvent && event.originalEvent.clipboardData);
var data = null;
if(clipboardData)
{
data = clipboardData.getData("text/plain");
}
else if(window.clipboardData)
{
data = window.clipboardData.getData("Text");
}
if(!this.util.isUndefined(data))
{
data = this.__formatDataForPaste(data);
this.setSelectedCellValues(data);
}
}
};
this.__createHandle = function()
{
if(!this.__handle)
{
this.__handle = this.util.createDiv(null,"handle-overlay");
this.__handle.setAttribute("draggable",true);
this.__table.parentNode.appendChild(this.__handle);
if(!this.__handleDragStartRef)
{
this.__handleDragStartRef = this.__handleDragStartHandler.bind(this);
//this.util.addEvent(this.__handle,"mousedown", this.__handleDragStartRef);
this.util.addEvent(this.__handle,"dragstart", this.__handleDragStartRef);
}
if(!this.__handleDragRef)
{
this.__handleDragRef = this.__handleDragHandler.bind(this);
this.util.addEvent(this.__handle,"drag", this.__handleDragRef);
}
if(!this.__handleDragEndRef)
{
this.__handleDragEndRef = this.__handleDragEndHandler.bind(this);
this.util.addEvent(this.__handle,"dragend", this.__handleDragEndRef);
}
}
};
this.__handleDragStartHandler = function(event)
{
if(!this.__lastEditor)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
var cell = this.__getCellFromDragPosition(event);
//var cell = this.__closestCell(target);
if(cell)
{
if(this.__isCellSelectionValid(cell))
{
this.__fireSelectionStartEvent();
this.__selectedCell = cell;
var position = this.__getCellPosition(cell);
this.__selectCell(position,event.shiftKey);
this.__refreshCells();
this.__repositionHandle(cell);
event.stopImmediatePropagation();
this.__isHandleDragged = true;
}
else
{
this.__isHandleDragged = false;
event.preventDefault();
}
}
}
};
this.__handleDragHandler = function(event)
{
if(this.__isHandleDragged)
{
this.__movingHandler(event);
this.__repositionScrolls(event,true,false);
}
};
this.__handleDragEndHandler = function(event)
{
if(this.__isHandleDragged)
{
this.__deltaX = 0;
this.__deltaY = 0;
this.__fireSelectionEndEvent();
}
this.__isHandleDragged = false;
};
this.__repositionHandle = function(cell)
{
if(cell && this.__handle)
{
var rect = cell.getBoundingClientRect();
var newOffset = this.util.getPosition(cell,true);
this.__handle.style.top = (newOffset.top + rect.height - 4) + "px";
this.__handle.style.left = ((newOffset.left + rect.width) - 4) + "px";
this.__handle.style.height = "1px";
this.__handle.style.width = "1px";
}
};
this.__handleEditor = function(cell,event)
{
if(cell)
{
var self = this;
var commitChanges = function(value)
{
self.__commitEditorChanges(editor);
};
var cancelChanges = function()
{
destroyEditor();
};
var destroyEditor = function()
{
editor.destroy();
self.__lastEditor = null;
};
var position = this.__getPosition(cell);
var editorSetting = this.__config.editors[cell.cellIndex];
var editorFunction = (editorSetting.type) ? editorSetting.type.editor : editorSetting.customEditor;
var editorType = (editorSetting.type) ? editorSetting.type.type : "outer";
var setting = {container:cell,position:position,defaultValue:cell.innerText,commitChanges:commitChanges,cancelChanges:cancelChanges,validator:editorSetting.validator};
var editor = new editorFunction(setting,this.util);
editor.__cell = cell;
editor.__type = editorType;
editor.__setting = editorSetting;
this.__lastEditor = editor;
event.preventDefault();
}
};
this.__commitEditorChanges = function(editor)
{
var self = this;
var destroyEditor = function()
{
editor.destroy();
editor = null;
self.__lastEditor = null;
};
var cell = editor.__cell;
var editorType = editor.__type;
var editorSetting = editor.__setting;
var value = editor.getValue();
var objValidate = editor.validate();
if(objValidate.isValid)
{
var hasValueChanged = editor.hasValueChanged();
destroyEditor();
if(hasValueChanged)
{
this.setCellValue(cell,value);
}
}
else
{
alert(objValidate.message);
}
};
this.__refreshPosition = function(event)
{
if(this.__scrollableElement && this.__selectedCell)
{
var cellRect = this.__selectedCell.getBoundingClientRect();
var newOffset = this.util.getPosition(this.__selectedCell,true);
//vertical scroll logic
var cellTop = newOffset.top;
var cellBottom = cellTop + cellRect.height;
var scrollerHeight = this.__scrollableElement.clientHeight;
var currentScrollTop = this.__scrollableElement.scrollTop;
// scroll up
if (cellTop < 0)
{
if(this.__selectedCell.parentNode.rowIndex < 2)
{
this.__scrollableElement.scrollTop = 0;
}
else
{
this.__scrollableElement.scrollTop = currentScrollTop + cellTop;
}
}
// scroll down
else if (cellBottom > scrollerHeight)
{
var scrollAmount = cellBottom - scrollerHeight;
this.__scrollableElement.scrollTop = currentScrollTop + scrollAmount;
}
//horizontal scroll logic
var cellLeft = newOffset.left;
var cellRight = cellLeft + cellRect.width;
var scrollerWidth = this.__scrollableElement.clientWidth;
var currentScrollLeft = this.__scrollableElement.scrollLeft;
// scroll Left
if (cellLeft < 0)
{
if(this.__selectedCell.cellIndex === 0)
{
this.__scrollableElement.scrollLeft = 0;
}
else
{
this.__scrollableElement.scrollLeft = currentScrollLeft + cellLeft;
}
}
// scroll Right
else if (cellRight > scrollerWidth)
{
var scrollAmount = cellRight - scrollerWidth;
this.__scrollableElement.scrollLeft = currentScrollLeft + scrollAmount;
}
}
};
this.__movingHandler = function(event)
{
event = this.util.getEvent(event);
var target = this.util.getTarget(event);
//var cell = this.__closestCell(target);
var cell = this.util.findParent(target,"TD");
if(!cell)
{
var cell = this.__getCellFromDragPosition(event);
}
if(cell)
{
this.__selectCell(this.__getCellPosition(cell),true);
this.__refreshCells();
this.__repositionHandle(cell);
}
};
this.__repositionScrolls = function(event,isVertical,isHorizontal)
{
event = this.util.getEvent(event);
var rect = this.__scrollableElement.getBoundingClientRect();
if(isHorizontal)
{
var width = rect.width;
var xPos = event.clientX - width / 2;
this.__deltaX = xPos * 0.1;
this.__scrollableElement.scrollLeft = this.__scrollableElement.scrollLeft + this.__deltaX;
}
if(isVertical)
{
var height = rect.height;
var yPos = event.clientY - height / 2;
this.__deltaY = yPos * 0.1;
this.__scrollableElement.scrollTop = this.__scrollableElement.scrollTop + this.__deltaY;
}
};
this.__focus = function()
{
if(this.__table.ownerDocument.activeElement)
{
this.__table.ownerDocument.activeElement.blur();
}
this.__hasFocus = true;
};
this.__blur = function()
{
this.__hasFocus = false;
};
this.__setFocus = function(enableFocus)
{
if(this.__hasFocus != enableFocus)
{
if(enableFocus)
{
this.__focus();
}
else
{
this.__blur();
}
return true;
}
};
this.__selectCell = function(position,isExpanding)
{
if(position)
{
this.__focus();
var size = this.__getTotalSize();
if(size && size.row && size.col)
{
if(isExpanding && typeof(isExpanding) == "object")
{
isExpanding = this.__getBoundCellPosition(isExpanding,size);
}
this.__setCurrentRange(this.__getBoundCellPosition(position,size),isExpanding);
}
}
};
this.__refreshCells = function()
{
this.__drawCellClass(this.__range.cursor);
var position = {topLeft:this.__range.topLeft,bottomRight:this.__range.bottomRight};
this.__drawAreaClass(position);
};
this.__drawAreaClass = function(position)
{
var self = this;
var cell = null;
var row = null;
var rowIndex = null;
var colIndex = null;
var processTable = function(arrElement,arrClass)
{
if(arrElement && arrElement.length > 0 && arrClass && arrClass.length > 0)
{
for(var count = 0;count < arrElement.length;count++)
{
for(var innerCount = 0;innerCount < arrClass.length;innerCount++)
{
self.util.removeStyleClass(arrElement[count],arrClass[innerCount]);
}
}
}
};
var addStyleClass = function(element,cssClass)
{
self.util.addStyleClass(element,cssClass);
};
var areaClass = this.__config.areaClass;
var areaClassLeft = this.__config.areaClassLeft;
var areaClassRight = this.__config.areaClassRight;
var areaClassTop = this.__config.areaClassTop;
var areaClassBottom = this.__config.areaClassBottom;
processTable(this.__table.querySelectorAll("tbody>tr>td." + areaClass),[areaClass,areaClassLeft,areaClassRight]);
processTable(this.__table.querySelectorAll("colgroup>col." + areaClass),[areaClass,areaClassLeft,areaClassRight]);
processTable(this.__table.querySelectorAll("tbody>tr." + areaClass),[areaClass,areaClassTop,areaClassBottom]);
if(position && position.topLeft)
{
for(rowIndex = position.topLeft.row,row = this.__tblBody.rows[rowIndex];rowIndex <= position.bottomRight.row && row;rowIndex++,row= this.__tblBody.rows[rowIndex])
{
addStyleClass(row,areaClass);
if(rowIndex == position.topLeft.row)
{
addStyleClass(row,areaClassTop);
}
if(rowIndex == position.bottomRight.row)
{
addStyleClass(row,areaClassBottom);
}
for(colIndex = position.topLeft.col,cell = row.cells[colIndex];colIndex <= position.bottomRight.col && cell;colIndex++,cell = row.cells[colIndex])
{
addStyleClass(cell,areaClass);
if(colIndex == position.topLeft.col)
{
addStyleClass(cell,areaClassLeft);
}
if(colIndex == position.bottomRight.col)
{
addStyleClass(cell,areaClassRight);
}
}
}
for(colIndex = position.topLeft.col;colIndex <= position.bottomRight.col;colIndex++)
{
cell = this.__getColGroup(colIndex);
addStyleClass(cell,areaClass);
if(colIndex == position.topLeft.col)
{
addStyleClass(cell,areaClassLeft);
}
if(colIndex == position.bottomRight.col)
{
addStyleClass(cell,areaClassRight);
}
}
}
};
this.__drawCellClass = function(position)
{
var cellClass = this.__config.cellClass;
var self = this;
var processTable = function(arrElement)
{
if(arrElement && arrElement.length > 0)
{
for(var count = 0;count < arrElement.length;count++)
{
self.util.removeStyleClass(arrElement[count],cellClass);
}
}
};
processTable(this.__table.querySelectorAll("tbody>tr>td." + cellClass));
processTable(this.__table.querySelectorAll("colgroup>col." + cellClass));
processTable(this.__table.querySelectorAll("tbody>tr." + cellClass));
if(position)
{
var cell = this.__getCell(position);
if(cell)
{
this.util.addStyleClass(cell,cellClass);
this.util.addStyleClass(cell.parentNode,cellClass);
this.__selectedCell = cell;
}
this.util.addStyleClass(this.__getColGroup(position.col),cellClass);
}
};
this.__KeyMoveHandler = function(event)
{
event = this.util.getEvent(event);
if(event.ctrlKey || event.metaKey || event.altKey)
{
return;
}
var shiftKey = event.shiftKey;
var keyCode = this.util.KEYCODE;
switch(event.keyCode)
{
case keyCode.UP:
this.__selectMove({row:-1,col:0},shiftKey);
return true;
case keyCode.DOWN:
this.__selectMove({row:+1,col:0},shiftKey);
return true;
case keyCode.LEFT:
this.__selectMove({row:0,col:-1},shiftKey);
return true;
case keyCode.RIGHT:
this.__selectMove({row:0,col:+1},shiftKey);
return true;
case keyCode.TAB:
this.__selectMove({row:0,col:shiftKey ? -1:+1});
return true;
case keyCode.ESC:
this.__deSelectCurrentRange();
return true;
}
};
this.__isKeyStrokeValid = function(target,validElement)
{
while(target)
{
if(target.tagName == "INPUT" || target.tagName == "TEXTAREA" || target.contentEditable == "true" || target.tagName == "SELECT")
{
return true;
}
if(target == validElement)
{
return false;
}
target = target.parentNode;
}
return false;
};
this.__selectMove = function(move,isExpanding)
{
var cursor = this.__range.cursor || {};
var size = this.__getTotalSize();
if(!size||!size.row||!size.col)
{
return;
}
var position = this.__getBoundCellPosition({row:cursor.row + (move.row || 0),col:cursor.col + (move.col||0)},size);
if(isExpanding && typeof(isExpanding) == "object")
{
isExpanding = this.__getBoundCellPosition(isExpanding,size);
}
this.__selectCell(position,isExpanding);
};
this.__getColGroup = function(colIndex)
{
if(!this.__colgroup)
{
this.__colgroup = this.__getElementsSnapshot(this.__table,"colgroup");
if(this.__colgroup && this.__colgroup.length > 0)
{
this.__colgroup = this.__colgroup[0];
}
if(!this.__colgroup || this.__colgroup.length === 0)
{
this.__colgroup = this.__table.ownerDocument.createElement("colgroup");
this.__table.appendChild(this.__colgroup);
}
}
while(!this.__colgroup.children[colIndex])
{
var col = this.__table.ownerDocument.createElement("col");
this.__colgroup.appendChild(col);
}
return this.__colgroup.children[colIndex];
};
this.__closestCell = function(target)
{
while(target.parentNode)
{
if(target.parentNode.parentNode == this.__tblBody)
{
return target;
}
target = target.parentNode;
}
return null;
};
this.__getCellPosition = function(cell)
{
return {row:cell.parentNode.sectionRowIndex,col:cell.cellIndex};
};
this.__getTotalSize = function()
{
if(this.__tblBody)
{
var rowLength = this.__tblBody.rows.length;
if(rowLength)
{
return {row:rowLength,col:this.__tblBody.rows[0].cells.length};
}
}
return null;
};
this.__getBoundCellPosition = function(cellPosition,totalSize)
{
return {
col: ((isNaN(cellPosition.col)|| cellPosition.col >= totalSize.col) ? 0 : ((cellPosition.col<0) ? totalSize.col - 1 : cellPosition.col)),
row: ((isNaN(cellPosition.row)|| cellPosition.row >= totalSize.row) ? 0 : ((cellPosition.row<0) ? totalSize.row-1 : cellPosition.row))
};
};
this.__getCell = function(position)
{
if(position && this.__tblBody)
{
var row = this.__tblBody.rows[position.row];
if(row && row.cells)
{
return row.cells[position.col];
}
}
return null;
};
//range selection methods
this.__setCurrentRange = function(position,isExpanding)
{
this.__range.cursor = this.__hasPositionChanged(this.__range.cursor,{row:position.row,col:position.col});
if(typeof(isExpanding) == "object")
{
this.__range.start = this.__hasPositionChanged(this.__range.start,{row:isExpanding.row,col:isExpanding.col});
}
if(!isExpanding || !this.__range.start)
{
this.__range.start = this.__range.topLeft = this.__range.bottomRight = this.__range.cursor;
}
else
{
var colToLeft = this.__config.enableFillHandle ? this.__range.start.col : Math.min(this.__range.start.col,this.__range.cursor.col);
var colBottomRight = this.__config.enableFillHandle ? this.__range.start.col : Math.max(this.__range.start.col,this.__range.cursor.col);
this.__range.topLeft = this.__hasPositionChanged(this.__range.topLeft,{row:Math.min(this.__range.start.row,this.__range.cursor.row),col:colToLeft});
this.__range.bottomRight = this.__hasPositionChanged(this.__range.bottomRight,{row:Math.max(this.__range.start.row,this.__range.cursor.row),col:colBottomRight});
}
};
this.__deSelectCurrentRange = function()
{
this.__range = {};
};
this.__hasPositionChanged = function(oldPosition,newPosition)
{
return (!oldPosition || oldPosition.row != newPosition.row || oldPosition.col != newPosition.col) ? newPosition : oldPosition;
};
this.__isValidRange = function(position)
{
return (this.__range.cursor && this.__range.topLeft.row <= position.row && position.row <= this.__range.bottomRight.row && this.__range.topLeft.col <= position.col && position.col <= this.__range.bottomRight.col);
};
//end of range selection methods
this.__getElementsSnapshot = function(element,type)
{
try
{
var xPathResult = element.ownerDocument.evaluate(type,element,null,XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,null);
var length = xPathResult.snapshotLength;
var arrReturn = new Array(length);
for(var count = 0;count < length; count++)
{
arrReturn[count] = xPathResult.snapshotItem(count);
}
return arrReturn;
}
catch(error)
{
}
};
this.__formatDataForCopy = function(arrData)
{
if(arrData && arrData.length)
{
var arrReturn = [];
for(var count = 0;count < arrData.length;count++)
{
var arrInner = arrData[count];
var arrStr = [];
for(var innerCount = 0;innerCount < arrInner.length;innerCount++)
{
var str = arrInner[innerCount];
if(this.util.isString(str))
{
if(str.indexOf("\n") > -1)
{
arrStr.push('"' + str.replace(/"/g, '""') + '"');
}
else
{
arrStr.push(str);
}
}
else
{
arrStr.push(this.util.isUndefinedOrNull(str) ? "" : str);
}
}
arrReturn.push(arrStr.join("\t"));
}
return arrReturn.join("\n");
}
return arrData;
};
this.__formatDataForPaste = function(data)
{
var quotes = function(strData)
{
return (strData.split('"').length - 1) & 1;
};
if (this.util.isString(data))
{
var arrReturn = [];
var arrRows = data.split("\n");
if (arrRows.length && arrRows[arrRows.length - 1] === "")
{
arrRows.pop();
}
var arrRowData = [];
var isMultiline = false;
for (var rowCount = 0;rowCount < arrRows.length;rowCount++)
{
if (!isMultiline)
{
arrRowData = [];
arrReturn.push(arrRowData);
}
var arrColumn = arrRows[rowCount].split("\t");
for (var colCount = 0;colCount < arrColumn.length;colCount++)
{
var strColumn = arrColumn[colCount];
if (isMultiline && colCount === 0)
{
if (quotes(strColumn))
{
isMultiline = false;
strColumn = strColumn.substring(0, strColumn.length - 1).replace(/""/g, '"');
}
arrRowData[arrRowData.length-1] += "\n" + strColumn;
}
else
{
if(colCount === arrColumn.length - 1 && strColumn.charAt(0)=='"' && quotes(strColumn))
{
strColumn = strColumn.substring(1);
isMultiline = true;
}
else
{
isMultiline = false;
}
arrRowData.push(strColumn.replace(/""/g, '"'));
}
}
}
return arrReturn;
}
return data;
};
this.__getPosition = function(element)
{
var position = {
top: element.offsetTop,
left: element.offsetLeft,
bottom: 0,
right: 0,
width: this.util.getOuterWidth(element),
height: this.util.getOuterHeight(element),
visible: true};
position.bottom = position.top + position.height;
position.right = position.left + position.width;
// walk up the tree
var offsetParent = element.offsetParent;
while ((element = element.parentNode) != document.body)
{
if (position.visible && element.scrollHeight != element.offsetHeight && this.util.getStyleValue(element,"overflowY",false) != "visible")
{
position.visible = position.bottom > element.scrollTop && position.top < element.scrollTop + element.clientHeight;
}
if (position.visible && element.scrollWidth != element.offsetWidth && this.util.getStyleValue(element,"overflowX",false) != "visible")
{
position.visible = position.right > element.scrollLeft && position.left < element.scrollLeft + element.clientWidth;
}
position.left -= element.scrollLeft;
position.top -= element.scrollTop;
if (element === offsetParent)
{
position.left += element.offsetLeft;
position.top += element.offsetTop;
offsetParent = element.offsetParent;
}
position.bottom = position.top + position.height;
position.right = position.left + position.width;
}
return position;
};
this.__isCellSelectionValid = function(cell)
{
var row = this.util.findParent(cell,"tr");
var cancelled = this.util.dispatchEvent(this.__table,NSCellSelection.CELL_SELECTABLE,cell,{cellIndex:cell.cellIndex,rowIndex:row.rowIndex,cell:cell,row:row},true,true);
return !cancelled;
};
this.__getCellFromDragPosition = function(event)
{
var offSet = this.util.getOffSet(this.__scrollableElement);
var arrElements = getElementsUnderPoint(event.pageX - offSet.left,event.pageY - offSet.top);
if(arrElements && arrElements.length > 0)
{
for(var count = 0;count < arrElements.length;count++)
{
if(arrElements[count] && arrElements[count].nodeName == "TD")
{
return arrElements[count];
}
}
}
return null;
};
this.__getElementsUnderPoint = function(xPos,yPos)
{
var stack = [];
var elementMouseIsOver = document.elementFromPoint(xPos,yPos);
stack.push(elementMouseIsOver);
while (elementMouseIsOver && elementMouseIsOver.tagName !== 'HTML')
{
elementMouseIsOver.classList.add('pointerEventsNone');
elementMouseIsOver = document.elementFromPoint(xPos,yPos);
stack.push(elementMouseIsOver);
}
for(count = 0;count < stack.length; count++)
{
if(stack[count])
{
stack[count].classList.remove('pointerEventsNone');
}
}
return stack;
};
this.__fireSelectionStartEvent = function()
{
this.util.dispatchEvent(this.__table,NSCellSelection.SELECTION_START,null,null);
};
this.__fireSelectionEndEvent = function()
{
var arrCells = this.getSelectedRowsCells();
if(arrCells && arrCells.length > 0)
{
this.util.dispatchEvent(this.__table,NSCellSelection.SELECTION_END,arrCells,{selectedCells:arrCells});
}
};
this.__initialize();
};
NSCellSelection.SELECTION_START = "selectionStart";
NSCellSelection.SELECTION_END = "selectionEnd";
NSCellSelection.SET_CELL_VALUE = "setCellValue";
NSCellSelection.CELL_SELECTABLE = "cellSelectable";
NSCellSelection.EDITORS = {"TEXT":{editor:nsTextEditor,type:"inner"},"TEXTAREA":{editor:nsTextAreaEditor,type:"outer"}};
return NSCellSelection;
})();
nsModuleExport(__nsGlobal,"NSCellSelection",NSCellSelection);
var NSTableCellNavigator = (function()
{
var NSTableCellNavigator = function(table,setting)
{
this.__table = table;
this.__setting = setting;
this.__scrollableElement = null;
this.util = new NSUtil();
this.__tblBody = null;
this.__selectedCell = null;
this.__lastDirection = null;
this.__documentKeyEventRef = null;
this.setSelectedCell = function(cell)
{
this.__selectedCell = cell;
};
this.getSelectedCell = function()
{
return this.__selectedCell;
};
this.destroy = function()
{
if(this.__documentKeyEventRef)
{
this.util.removeEvent(document,"keydown", this.__documentKeyEventRef);
this.__documentKeyEventRef = null;
}
};
this.__initialize = function()
{
if(!this.__setting)
{
this.__setting = {scrollableElement: null};
}
this.__scrollableElement = this.__setting.scrollableElement;
if(this.__table.tBodies && this.__table.tBodies.length > 0)
{
this.__tblBody = this.__table.tBodies[0];
}
if(!this.__scrollableElement)
{
this.__scrollableElement = this.__table.parentNode;
}
var arrCell = this.__tblBody ? this.__tblBody.querySelectorAll("td") : this.__table.querySelectorAll("td");
if(arrCell && arrCell.length > 0)
{
var cell = null;
for(var count = 0;count < arrCell.length;count++)
{
cell = arrCell[count];
this.util.addEvent(cell,"click",this.__cellClickListener.bind(this));
}
}
if(!this.__documentKeyEventRef)
{
this.__documentKeyEventRef = this.__documentKeyEventHandler.bind(this);
this.util.addEvent(document,"keydown", this.__documentKeyEventRef);
}
};
this.__cellClickListener = function(event)
{
event = this.util.getEvent(event);
target = this.util.getTarget(event);
var selectedCell = this.util.findParent(target,"td");
if(selectedCell)
{