From efb20459432bee0e011f6a53404b9f287c219b29 Mon Sep 17 00:00:00 2001 From: steve wirts Date: Mon, 16 Mar 2015 12:13:59 -0400 Subject: [PATCH] properties changes --- fin-hypergrid.min.html | 480 ++++++++++++------ index.html | 1 - .../fin-hypergrid-behavior-default.css | 9 + .../behaviors/fin-hypergrid-behavior-gol.css | 9 + .../fin-hypergrid-behavior-in-memory.css | 9 + .../behaviors/fin-hypergrid-behavior-json.css | 9 + .../behaviors/fin-hypergrid-behavior-q.css | 9 + .../fin-hypergrid-behavior-qtree.css | 9 + .../fin-hypergrid-cell-editor-base.css | 9 + .../fin-hypergrid-cell-editor-choice.css | 9 + .../fin-hypergrid-cell-editor-color.css | 9 + .../fin-hypergrid-cell-editor-date.css | 9 + .../fin-hypergrid-cell-editor-simple.css | 9 + .../fin-hypergrid-cell-editor-slider.css | 9 + .../fin-hypergrid-cell-editor-spinner.css | 9 + .../fin-hypergrid-cell-editor-textfield.css | 9 + .../features/fin-hypergrid-feature-base.css | 9 + .../fin-hypergrid-feature-cell-editing.css | 9 + .../fin-hypergrid-feature-cell-selection.css | 9 + .../fin-hypergrid-feature-column-moving.css | 9 + .../fin-hypergrid-feature-column-resizing.css | 9 + .../fin-hypergrid-feature-column-sorting.css | 9 + .../fin-hypergrid-feature-overlay.css | 9 + .../fin-hypergrid-feature-row-resizing.css | 9 + ...hypergrid-feature-thumbwheel-scrolling.css | 9 + polymer/css/fin-hypergrid-cell-provider.css | 9 + polymer/css/fin-hypergrid-constants.css | 31 -- polymer/css/fin-hypergrid-excel.css | 9 + polymer/css/fin-hypergrid-renderer.css | 9 + polymer/css/fin-hypergrid-selection-model.css | 9 + polymer/css/fin-hypergrid.css | 9 + .../fin-hypergrid-behavior-default.html | 1 - polymer/html/fin-hypergrid-cell-provider.html | 1 - polymer/html/fin-hypergrid-constants.html | 12 - polymer/html/fin-hypergrid.html | 1 - .../fin-hypergrid-behavior-default.js | 18 +- .../behaviors/fin-hypergrid-behavior-qtree.js | 2 +- polymer/js/fin-hypergrid-cell-provider.js | 13 +- polymer/js/fin-hypergrid-constants.js | 36 -- polymer/js/fin-hypergrid-renderer.js | 4 - polymer/js/fin-hypergrid.js | 114 ++--- presentations/talk-outline.txt | 5 - presentations/talk-study.txt | 5 - test/fin-hypergrid-constants.js | 16 - test/index.html | 1 - 45 files changed, 645 insertions(+), 348 deletions(-) delete mode 100644 polymer/css/fin-hypergrid-constants.css delete mode 100644 polymer/html/fin-hypergrid-constants.html delete mode 100644 polymer/js/fin-hypergrid-constants.js delete mode 100644 test/fin-hypergrid-constants.js diff --git a/fin-hypergrid.min.html b/fin-hypergrid.min.html index 564e8ef63..39773e404 100644 --- a/fin-hypergrid.min.html +++ b/fin-hypergrid.min.html @@ -18310,9 +18310,6 @@ - - - @@ -21045,79 +21042,6 @@ - - - - - \ No newline at end of file diff --git a/polymer/html/fin-hypergrid.html b/polymer/html/fin-hypergrid.html index ed1d5bc05..b55991a42 100644 --- a/polymer/html/fin-hypergrid.html +++ b/polymer/html/fin-hypergrid.html @@ -20,7 +20,6 @@ - diff --git a/polymer/js/behaviors/fin-hypergrid-behavior-default.js b/polymer/js/behaviors/fin-hypergrid-behavior-default.js index 9a6075007..e762ac850 100644 --- a/polymer/js/behaviors/fin-hypergrid-behavior-default.js +++ b/polymer/js/behaviors/fin-hypergrid-behavior-default.js @@ -12,7 +12,6 @@ }, tableState: {}, - columnProperties: {}, grid: null, editorTypes: ['choice', 'textfield', 'color', 'slider', 'spinner', 'date'], @@ -27,7 +26,6 @@ }, readyInit: function() { - this.constants = document.createElement('fin-hypergrid-constants').values; this.cellProvider = this.createCellProvider(); this.scrollPositionX = 0; this.scrollPositionY = 0; @@ -48,7 +46,9 @@ this.values = {}; //for overriding with edit values; this.initColumnIndexes(); }, - + resolveProperty: function(key) { + return this.grid.resolveProperty(key); + }, getState: function() { return this.tableState; }, @@ -209,7 +209,7 @@ if (override) { return override; } - return this.constants.rowHeight; + return this.resolveProperty('defaultFixedRowHeight'); }, setFixedRowHeight: function(rowNum, height) { @@ -225,7 +225,7 @@ if (override) { return override; } - return this.constants.rowHeight; + return this.resolveProperty('defaultRowHeight'); }, setRowHeight: function(rowNum, height) { @@ -268,7 +268,7 @@ if (override) { return override; } - return this.constants.columnWidth; + return this.resolveProperty('columnWidth'); }, //can be dynamic if we wish to allow users to resize @@ -281,7 +281,7 @@ if (override) { return override; } - return this.constants.columnWidth; + return this.resolveProperty('columnWidth'); }, setColumnWidth: function(colNumber, width) { @@ -332,14 +332,14 @@ //answers the default col alignment for the fixed column data area of the grid //
TODO:provide uniform mechanism for the fixed areas like this getFixedColumnAlignment: function( /* x */ ) { - return this.constants.fixedColumnAlign; + return this.resolveProperty('fixedColumnAlign'); }, //answers the default row alignment for the fixed row data area of the grid //
TODO:provide uniform mechanism for the fixed areas like this getFixedRowAlignment: function( /* x, y */ ) { - return this.constants.fixedRowAlign; + return this.resolveProperty('fixedRowAlign'); }, //this is called by OFGrid when top left area is clicked //
see DefaultGridBehavior.delegateClick() below diff --git a/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js b/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js index 2eb2995ee..dc20c48de 100644 --- a/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js +++ b/polymer/js/behaviors/fin-hypergrid-behavior-qtree.js @@ -377,7 +377,7 @@ if (y > 0) { return this.getColumnAlignment(x); } - return this.constants.fixedRowAlign; + return this.resolve('fixedRowAlign'); }, //delegate column alignment through the map at the top based on the column type getColumnAlignment: function(x) { diff --git a/polymer/js/fin-hypergrid-cell-provider.js b/polymer/js/fin-hypergrid-cell-provider.js index 38a4749ae..cf3f964a8 100644 --- a/polymer/js/fin-hypergrid-cell-provider.js +++ b/polymer/js/fin-hypergrid-cell-provider.js @@ -4,9 +4,6 @@ var noop = function() {}; (function() { - //global variable for all instances to share, initialized by the first instances' ready call - var constants; - //DefaultCellProvider is the cache for cell renderers. A CellRenderer is an object with a single function 'paint'. //There should only be a single reused CellRenderer object created for each type of CellRenderer. @@ -45,10 +42,8 @@ var noop = function() {}; Polymer({ /* jslint ignore:line */ + created: function() { - if (!constants) { - constants = document.createElement('fin-hypergrid-constants').values; - } this.cellCache = {}; this.initializeCells(); }, @@ -85,8 +80,8 @@ var noop = function() {}; defaultCellPaint: function(gc, x, y, width, height) { - var colHEdgeOffset = constants.cellPadding, - halignOffset = this.config.hoffset, + var colHEdgeOffset = this.config.properties.cellPadding, + halignOffset = 0, valignOffset = this.config.voffset, halign = this.config.halign, size, @@ -99,7 +94,7 @@ var noop = function() {}; if (gc.textAlign !== 'left') { gc.textAlign = 'left'; } - if (gc.textBasline !== 'middle') { + if (gc.textBaseline !== 'middle') { gc.textBaseline = 'middle'; } diff --git a/polymer/js/fin-hypergrid-constants.js b/polymer/js/fin-hypergrid-constants.js deleted file mode 100644 index aa8d37836..000000000 --- a/polymer/js/fin-hypergrid-constants.js +++ /dev/null @@ -1,36 +0,0 @@ -'use strict'; - -(function() { - - var values = { - defaultFont: '13px Tahoma, Geneva, sans-serif', - foregroundColor: '#010126', - backgroundColor: '#FFFFFF', - foregroundSelColor: '#010126', - backgroundSelColor: '#B7DBFF', - fixedRowBackgroundColor: '#DFE3E8', - fixedColumnBackgroundColor: '#DFE3E8', - topLeftBackgroundColor: '#DFE3E8', - fixedColFGSelColor: '#010126', - fixedRowFGSelColor: '#010126', - fixedColBGSelColor: '#FFDC61', - fixedRowBGSelColor: '#FFDC61', - fixedRowAlign: 'center', - fixedColAlign: 'center', - cellPadding: 5, - rowHeight: 20, - columnWidth: 100, - repaintIntervalRate: 15, - lineColor: '#C7C7C7', - gridLinesH: true, - gridLinesV: true, - scrollerSize: 15, - voffset: '0px', - hoffset: '0px' - }; - - Polymer({ /* jshint ignore:line */ - values: values - }); - -})(); /* jshint ignore:line */ diff --git a/polymer/js/fin-hypergrid-renderer.js b/polymer/js/fin-hypergrid-renderer.js index 12e7b2ce6..6d3a439ff 100644 --- a/polymer/js/fin-hypergrid-renderer.js +++ b/polymer/js/fin-hypergrid-renderer.js @@ -656,10 +656,6 @@ var config = {}; return this.getGrid().getBehavior(); }, - getConstants: function() { - return this.getGrid().constants; - }, - getFixedRowHeight: function(rowIndex) { var height = this.getBehavior().getFixedRowHeight(rowIndex); return height; diff --git a/polymer/js/fin-hypergrid.js b/polymer/js/fin-hypergrid.js index 2c78595aa..ae6771fc9 100644 --- a/polymer/js/fin-hypergrid.js +++ b/polymer/js/fin-hypergrid.js @@ -6,6 +6,7 @@ var rectangles; var globalCellEditors = {}; + var propertiesInitialized = false; var noop = function() {}; @@ -24,40 +25,50 @@ globalCellEditors[cellEditor.alias] = cellEditor; }; - var defaultProperties = function(proto) { - var theme = Object.create(proto); - - theme.font = '13px Tahoma, Geneva, sans-serif'; - theme.color = 'rgb(25, 25, 25)'; - theme.backgroundColor = 'rgb(241, 241, 241)'; - theme.foregroundSelColor = 'rgb(25, 25, 25)'; - theme.backgroundSelColor = 'rgb(183, 219, 255)'; - - theme.topLeftFont = '14px Tahoma, Geneva, sans-serif'; - theme.topLeftColor = 'rgb(25, 25, 25)'; - theme.topLeftBackgroundColor = 'rgb(223, 227, 232)'; - theme.topLeftFGSelColor = 'rgb(25, 25, 25)'; - theme.topLeftBGSelColor = 'rgb(255, 220, 97)'; - - theme.fixedColumnFont = '14px Tahoma, Geneva, sans-serif'; - theme.fixedColumnColor = 'rgb(25, 25, 25)'; - theme.fixedColumnBackgroundColor = 'rgb(223, 227, 232)'; - theme.fixedColumnFGSelColor = 'rgb(25, 25, 25)'; - theme.fixedColumnBGSelColor = 'rgb(255, 220, 97)'; - - theme.fixedRowFont = '14px Tahoma, Geneva, sans-serif'; - theme.fixedRowColor = 'rgb(25, 25, 25)'; - theme.fixedRowBackgroundColor = 'rgb(223, 227, 232)'; - theme.fixedRowFGSelColor = 'rgb(25, 25, 25)'; - theme.fixedRowBGSelColor = 'rgb(255, 220, 97)'; - - theme.backgroundColor2 = 'rgb(201, 201, 201)'; - theme.lineColor = 'rgb(199, 199, 199)'; - theme.hoffset = 0; - theme.voffset = 0; - theme.scrollbarHover = 'visible'; - - return theme; + var defaultProperties = function() { + var properties = { + //these are for the theme + font: '13px Tahoma, Geneva, sans-serif', + color: 'rgb(25, 25, 25)', + backgroundColor: 'rgb(241, 241, 241)', + foregroundSelColor: 'rgb(25, 25, 25)', + backgroundSelColor: 'rgb(183, 219, 255)', + + topLeftFont: '14px Tahoma, Geneva, sans-serif', + topLeftColor: 'rgb(25, 25, 25)', + topLeftBackgroundColor: 'rgb(223, 227, 232)', + topLeftFGSelColor: 'rgb(25, 25, 25)', + topLeftBGSelColor: 'rgb(255, 220, 97)', + + fixedColumnFont: '14px Tahoma, Geneva, sans-serif', + fixedColumnColor: 'rgb(25, 25, 25)', + fixedColumnBackgroundColor: 'rgb(223, 227, 232)', + fixedColumnFGSelColor: 'rgb(25, 25, 25)', + fixedColumnBGSelColor: 'rgb(255, 220, 97)', + + fixedRowFont: '14px Tahoma, Geneva, sans-serif', + fixedRowColor: 'rgb(25, 25, 25)', + fixedRowBackgroundColor: 'rgb(223, 227, 232)', + fixedRowFGSelColor: 'rgb(25, 25, 25)', + fixedRowBGSelColor: 'rgb(255, 220, 97)', + + backgroundColor2: 'rgb(201, 201, 201)', + lineColor: 'rgb(199, 199, 199)', + voffset: 0, + scrollbarHover: 'visible', + + //these used to be in the constants element + fixedRowAlign: 'center', + fixedColAlign: 'center', + cellPadding: 5, + columnWidth: 100, + repaintIntervalRate: 15, + gridLinesH: true, + gridLinesV: true, + defaultRowHeight: 20, + defaultFixedRowHeight: 20 + }; + return properties; }; var buildPolymerTheme = function() { @@ -78,7 +89,6 @@ var hb = window.getComputedStyle(document.querySelector('html, body')); var s = window.getComputedStyle(section); - polymerTheme.fixedRowBackgroundColor = p.color; polymerTheme.fixedColumnBackgroundColor = p.color; polymerTheme.topLeftBackgroundColor = p.color; @@ -111,7 +121,7 @@ polymerTheme.fixedColumnFGSelColor = p.color; polymerTheme.fixedColumnBGSelColor = p.backgroundColor; - //check if there is actuall a theme loaded if not, clear out all bogus values + //check if there is actually a theme loaded if not, clear out all bogus values //from my cache if (polymerTheme.fixedRowBGSelColor === 'rgba(0, 0, 0, 0)') { clearObjectProperties(polymerTheme); @@ -129,17 +139,13 @@ } }; - var constants, defaults, polymerTheme, globalProperties; + var defaults, polymerTheme, globalProperties; - var initializeGlobals = function() { - constants = document.createElement('fin-hypergrid-constants').values; - defaults = defaultProperties(constants); + (function() { + defaults = defaultProperties(); polymerTheme = Object.create(defaults); globalProperties = Object.create(polymerTheme); - - buildPolymerTheme(); - initializeBasicCellEditors(); - }; + })(); Polymer({ /* jslint ignore:line */ @@ -211,14 +217,6 @@ */ rectangles: null, - /** - * constants holds a [fin-constants](index.html#fin-hypergrid-constants) polymer-element singleton of constant values - * - * @property constants - * @type fin-hypergrid-constants - */ - constants: null, - /** * selectionModel is a [fin-hypergrid-selection-model](index.html#fin-hypergrid-selection-model) instance * @@ -332,16 +330,16 @@ domReady: function() { - if (!constants) { - initializeGlobals(); + if (!propertiesInitialized) { + propertiesInitialized = true; + buildPolymerTheme(); + initializeBasicCellEditors(); } var self = this; rectangles = rectangles || document.createElement('fin-rectangle'); - constants = constants || document.createElement('fin-hypergrid-constants').values; this.rectangles = rectangles; - this.constants = constants; this.lnfProperties = Object.create(globalProperties); @@ -859,9 +857,9 @@ initCanvas: function() { var self = this; + var interval = this.resolveProperty('repaintIntervalRate'); this.canvas = this.shadowRoot.querySelector('fin-canvas'); - - this.canvas.setAttribute('fps', constants.repaintIntervalRate || 15); + this.canvas.setAttribute('fps', interval || 15); //this.shadowRoot.appendChild(domCanvas); diff --git a/presentations/talk-outline.txt b/presentations/talk-outline.txt index 59656a29c..1acadab89 100644 --- a/presentations/talk-outline.txt +++ b/presentations/talk-outline.txt @@ -317,11 +317,6 @@ quick hypergrid design allows for arbitrary large rectangular selections -renderes extremely fast - fin-hypergrid-constants - constant values for the grid - -cannonical place to put various values - default fg/bg color/font/widths/heights etc - plugins installOn(hypergrid) function must be implemented by plugin nest tags inside fin-hypergrid diff --git a/presentations/talk-study.txt b/presentations/talk-study.txt index 610b806cb..1bac537c8 100644 --- a/presentations/talk-study.txt +++ b/presentations/talk-study.txt @@ -114,11 +114,6 @@ quick hypergrid design -rectangle based selection management -allows for arbitrary large rectangular selections - -* fin-hypergrid-constants --constant values for the grid --default fg/bg color/font/widths/heights etc - * fin-vampire-bar -only 33million pixes to scroll with native scrollbars diff --git a/test/fin-hypergrid-constants.js b/test/fin-hypergrid-constants.js deleted file mode 100644 index 1d8ad3d7c..000000000 --- a/test/fin-hypergrid-constants.js +++ /dev/null @@ -1,16 +0,0 @@ -/* globals describe, it, assert */ - -'use strict'; - -var customElement = document.querySelector('fin-hypergrid-constants'); - -describe('', function() { - - describe('fin-hypergrid-constants.js', function() { - it('should have real tests filled out', function() { - assert.equal(customElement, customElement); - }); - - }); - -}); diff --git a/test/index.html b/test/index.html index 5a2cbde19..1688cbdf9 100644 --- a/test/index.html +++ b/test/index.html @@ -37,7 +37,6 @@ 'features/fin-hypergrid-feature-thumbwheel-scrolling.js', 'fin-hypergrid.js', 'fin-hypergrid-cell-provider.js', - 'fin-hypergrid-constants.js', 'fin-hypergrid-excel.js', 'fin-hypergrid-renderer.js', 'fin-hypergrid-selection-model.js',