added hyperlinks

abc91199 · Mar 26, 2015 · 7aa0f0f · 7aa0f0f
1 parent c1b2088
commit 7aa0f0f
Show file tree

Hide file tree

Showing 46 changed files with 32,243 additions and 31,609 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -36,15 +36,15 @@ module.exports = function(grunt) {
         watch: {
             polymerjs: {
                 files: files.polymerjs,
-                tasks: ['jshint', 'polymer-component-sync', 'jsbeautifier', 'wct-test', 'vulcanize:default'],
+                tasks: ['jshint', 'polymer-component-sync', 'jsbeautifier', 'wct-test', 'vulcanize-both'],
             },
             polymercss: {
                 files: files.polymercss,
-                tasks: ['csslint:default', 'cssbeautifier', 'vulcanize:default'],
+                tasks: ['csslint:default', 'cssbeautifier', 'vulcanize-both'],
             },
             polymerhtml: {
                 files: files.polymerhtml,
-                tasks: ['htmllint', 'prettify', 'vulcanize:default'],
+                tasks: ['htmllint', 'prettify', 'vulcanize-both'],
             },
             livereloadflag: {
                 files: ['abc.html'],
@@ -58,7 +58,17 @@ module.exports = function(grunt) {
             },
         },
         vulcanize: {
-            default: {
+            min: {
+                options: {
+                    inline: true,
+                    strip: true,
+                    abspath: '../../'
+                },
+                files: {
+                    //see below as this key value pair is set programmatically
+                }
+            },
+            dev: {
                 options: {
                     inline: true,
                     strip: false,
@@ -181,18 +191,18 @@ module.exports = function(grunt) {
             }
 
         },
-
     };
 
     //we need to dynamicaly set the name of this property
-    myConfig.vulcanize.default.files[elementName + '.min.html'] = myConfig['polymer-component-sync'].default.html + delimeter + elementName + '.html';
+    myConfig.vulcanize.min.files[elementName + '.min.html'] = myConfig['polymer-component-sync'].default.html + delimeter + elementName + '.html';
+    myConfig.vulcanize.dev.files[elementName + '.dev.html'] = myConfig['polymer-component-sync'].default.html + delimeter + elementName + '.html';
 
     grunt.initConfig(myConfig);
 
     grunt.loadNpmTasks('web-component-tester');
     grunt.registerTask('test', ['build', 'wct-test']);
+    grunt.registerTask('vulcanize-both', ['vulcanize:min', 'vulcanize:dev']);
     grunt.registerTask('default', ['build']);
-
     grunt.registerTask('build', [
                 'polymer-component-sync',
                 'jshint',
@@ -202,9 +212,8 @@ module.exports = function(grunt) {
                 'htmllint',
                 'prettify',
                 'wct-test',
-                'vulcanize:default'
+                'vulcanize-both'
     ]);
-
     grunt.registerTask('serve', function() {
         return grunt.task.run([
             'express',
@@ -213,8 +222,6 @@ module.exports = function(grunt) {
             'watch'
         ]);
     });
-
-
     //these functions need to be moved into a yeoman subgenerator
     function createIndexHtml(files) {
         var strVar='<!doctype html>\n';
@@ -421,7 +428,6 @@ module.exports = function(grunt) {
         console.log('creating test/index.html');
         grunt.file.write('test/index.html', testhtml);
     });
-
     grunt.registerTask('polymer','create a new polymer component', function() {
         var elName = this.args[0];
         var shortName = elName.split(delimeter).reverse()[0];
@@ -431,5 +437,4 @@ module.exports = function(grunt) {
         grunt.task.run('polymer-component-sync');
         console.log('created boilerplate ' + jsDir + delimeter + elName + '.js file and accompanying pre/post/css files');
     });
-
 };
diff --git a/README.md b/README.md
@@ -292,6 +292,46 @@ Hypergrid has a column picker that allows you to drag and drop columns for confi
 press alt/option to open the column picker, you can press alt/option or esc to close it
 <img src="images/gridshot07.png" alt="screenshot">
 
+Cells as Links
+======================
+Hypergrid supports clickable link cells, to achieve this you need to...
+
+1. register a listener to the table for 'fin-cell-click'
+```
+jsonGrid.addFinEventListener('fin-cell-click', function(e){
+    var cell = e.detail.cell;
+    if (cell.x !== 0) {
+        return;
+    }
+    alert('fin-cell-click at (' + cell.x + ', ' + cell.y + ')');
+});
+```
+2. override the getCursorAt method on behavior to be a function that returns the string of the name of the cursor for the column with the links
+```
+jsonModel.getCursorAt = function(x,y) {
+    if (x === 0) {
+        return 'pointer'
+    } else {
+        return null;
+    }
+};
+```
+3. override the cell-provider to return the linkRenderer for the desired link columns
+```
+cellProvider.getCell = function(config) {
+    var renderer = cellProvider.cellCache.simpleCellRenderer;
+    config.halign = 'left';
+    var x = config.x;
+    if (x === 0) {
+        renderer = cellProvider.cellCache.linkCellRenderer;
+    } else if (x === 2) {
+    ...
+    ...
+    ...
+```
+
+see the 'Last Name' column of the JSON tab in the main example;
+
 <a name="hypergrid-excel-integration"></a>
 Hypergrid Excel Integration
 ======================

diff --git a/demo.html b/demo.html
@@ -472,7 +472,9 @@ <h3>fin-hypergrid-behavior-gol</h3> This element is another custom Polymer web c
                 var renderer = cellProvider.cellCache.simpleCellRenderer;
                 config.halign = 'left';
                 var x = config.x;
-                if (x === 2) {
+                if (x === 0) {
+                    renderer = cellProvider.cellCache.linkCellRenderer;
+                } else if (x === 2) {
                     config.halign = 'center';
                 } else if (x === 3) {
                     config.halign = 'center';
@@ -512,11 +514,26 @@ <h3>fin-hypergrid-behavior-gol</h3> This element is another custom Polymer web c
                 return cellEditor;
             };
 
+            jsonModel.getCursorAt = function(x,y) {
+                if (x === 0) {
+                    return 'pointer'
+                } else {
+                    return null;
+                }
+            };
+
+            jsonGrid.addFinEventListener('fin-cell-click', function(e){
+                var cell = e.detail.cell;
+                if (cell.x !== 0) {
+                    return;
+                }
+                alert('fin-cell-click at (' + cell.x + ', ' + cell.y + ')');
+            });
             jsonGrid.addFinEventListener('fin-scroll-x', function(e){
-                console.log('x', e);
+                console.log('fin-scroll-x', e);
             });
             jsonGrid.addFinEventListener('fin-scroll-y', function(e){
-                console.log('y', e);
+                console.log('fin-scroll-y', e);
             });
         });
     })();