Investigating SystemJs

.jshintrc

@@ -8,6 +8,8 @@
   "-W041": true,
   // Wrap the /regexp/ literal in parens to disambiguate the slash operator
   "-W092": true,
+  // Reserved words
+  "-W024": true,
   "curly": true,
   //"indent": 4,
   //"eqeqeq": true,
@@ -16,6 +18,7 @@
 
   //"maxlen" : 80,
   "globals": {
+    "System": true,
     "module": true,
     "require": true,
     "define": true,

Gruntfile.js

@@ -44,7 +44,10 @@ module.exports = function (grunt) {
             'compile-main': {
                 options: {
                     baseUrl: '<%= source_folder %>',
-                    include: ['../libs/almond/almond', 'tablefilter'],
+                    include: [
+                        '../libs/almond/almond',
+                        '../libs/system'
+                    ],
                     // exclude: [
                     //     'extensions/sortabletable/sortabletable',
                     //     'extensions/sortabletable/adapterSortabletable'
@@ -63,6 +66,25 @@ module.exports = function (grunt) {
                     optimize: 'none'
                 }
             }
+            // ,
+            // 'compile-colsvisibility': {
+            //     options: {
+            //         baseUrl: '<%= source_folder %>extensions/colsVisibility',
+            //         include: [
+            //             '../../../libs/almond/almond'
+            //         ],
+            //         wrap: {
+            //             startFile: "<%= frags_folder %>start.colsvisibility.frag",
+            //             endFile: "<%= frags_folder %>end.colsvisibility.frag"
+            //         },
+            //         name: 'colsVisibility',
+            //         out: '<%= dist_folder %>extensions/colsVisibility/colsVisibility.js',
+            //         optimize: 'none',
+            //         findNestedDependencies: true,
+            //         removeCombined: true,
+            //         generateSourceMaps: false
+            //     }
+            // }
         },
 
         // requirejs: {
@@ -207,6 +229,7 @@ module.exports = function (grunt) {
             tablefilter: {
                 files: [
                     { src: 'libs/sortabletable.js', dest: '<%= source_folder %>extensions/sortabletable/sortabletable.js' },
+                    // { src: 'libs/es6-module-loader.js', dest: '<%= source_folder %>es6-module-loader.js' },
                     { src: 'src-es6/extensions/colsVisibility/colsVisibility.css', dest: '<%= source_folder %>extensions/colsVisibility/colsVisibility.css' },
                     // { src: 'libs/requirejs/require.js', dest: '<%= dist_folder %>require.js' },
                     // { src: ['**'], cwd: '<%= source_folder %>TF_Modules/', dest: '<%= dist_folder %>TF_Modules/', expand: true },
@@ -214,12 +237,28 @@ module.exports = function (grunt) {
                     // TODO: remove ezEditTable and other extensions
                     { src: ['**'], cwd: 'libs/ezEditTable/', dest: '<%= source_folder %>extensions/ezEditTable/', expand: true },
                     { src: ['**'], cwd: 'libs/ezEditTable/', dest: '<%= dist_folder %>extensions/ezEditTable/', expand: true },
+                    // { src: ['**'], cwd: '<%= source_folder %>extensions/colsVisibility/', dest: '<%= dist_folder %>extensions/colsVisibility/', expand: true },
+
                     //
+                    { src: 'libs/es6-module-loader.src.js', dest: '<%= dist_folder %>es6-module-loader.src.js' },
+                    { src: 'libs/es6-module-loader.js', dest: '<%= dist_folder %>es6-module-loader.js' },
+                    { src: 'libs/es6-module-loader.js.map', dest: '<%= dist_folder %>es6-module-loader.js.map' },
+                    { src: 'libs/system.js.map', dest: '<%= dist_folder %>system.js.map' },
                     { src: ['**'], cwd: '<%= source_folder %>TF_Themes/', dest: '<%= dist_folder %>TF_Themes/', expand: true }
                 ]
             }
         },
 
+        connect: {
+            server:{
+                options:{
+                    port: 9000,
+                    hostname: "*",
+                    keepalive: true
+                }
+            }
+        },
+
         babel: {
             'build-main': {
                 options: {
@@ -263,14 +302,16 @@ module.exports = function (grunt) {
     grunt.loadNpmTasks('grunt-contrib-watch');
     grunt.loadNpmTasks('grunt-contrib-qunit');
     grunt.loadNpmTasks('grunt-contrib-requirejs');
+    grunt.loadNpmTasks('grunt-contrib-connect');
     grunt.loadNpmTasks('grunt-babel');
 
     // This is the default task being executed if Grunt
     // is called without any further parameter.
-    grunt.registerTask('default', ['jshint', 'toes5', 'requirejs', 'concat', 'uglify', 'cssmin', 'copy', 'qunit']);
+    grunt.registerTask('default', ['jshint', 'toes5', 'build-requirejs', 'concat', 'uglify', 'cssmin', 'copy', 'qunit']);
-    grunt.registerTask('build', ['jshint', 'toes5', 'requirejs', 'concat', /*'uglify',*/ 'cssmin', 'copy']);
+    grunt.registerTask('build', ['jshint', 'toes5', 'build-requirejs', 'concat', /*'uglify',*/ 'cssmin', 'copy']);
     grunt.registerTask('dev', ['jshint', 'toes5', 'concat', 'cssmin', 'copy']);
-    grunt.registerTask('build-requirejs', ['requirejs:compile-main']);
+    grunt.registerTask('build-requirejs', ['requirejs:compile-main', 'requirejs:compile-colsvisibility']);
     grunt.registerTask('toes5', ['babel:build-main','babel:build-extensions']);
     grunt.registerTask('test', ['qunit']);
+    grunt.registerTask('server', ['connect']);
 };

bower.json

@@ -27,11 +27,11 @@
     "node_modules",
     "bower_components",
     "test",
-    "tests",
     "libs"
   ],
-  "dependencies": {
+  "dependencies": {},
-    "almond": "~0.3.0",
+  "devDependencies": {
-    "requirejs": null
+    "requirejs": "~2.1.17",
+    "almond": "~0.3.1"
   }
 }

dist/extensions/colsVisibility/colsVisibility.css

@@ -0,0 +1,47 @@
+/*====================================================
+	- HTML Table Filter Generator
+	- Columns Visibility Manager Extension
+	- do not hesitate to edit classes below to
+	change extension appearance
+=====================================================*/
+
+span.colVisSpan{ text-align:left; }
+
+span.colVisSpan a.colVis{
+	/* Link */
+	margin:0 5px 0 5px;
+}
+div.colVisCont{
+	/* Container div */
+	position:absolute;
+	display:none;
+	border:1px solid #ccc;
+	height:auto; width:250px;
+	background:#fff;
+	margin:18px 0 0 0; z-index:10000;
+	padding:10px 10px 10px 10px;
+	text-align:left; font-size:12px;
+	border-radius:4px;
+	-moz-border-radius:4px;
+	-webkit-border-radius:4px;
+	box-shadow:3px 3px 2px #888;
+	-moz-box-shadow:3px 3px 2px #888;
+	-webkit-box-shadow:3px 3px 2px #888;
+}
+div.colVisCont p{ margin:6px auto 6px auto; }
+
+ul.cols_checklist{ padding:0; margin:0; list-style: none; }
+li.cols_checklist_item{ /*check list item*/
+	padding:1px; margin:0; font-size:11px;
+	border-bottom:1px solid #ccc;
+}
+li.cols_checklist_item:hover{
+	background-color:#335EA8;
+	color:#fff;
+}
+.cols_checklist_slc_item{ /*selected check list item*/
+	background-color:#335EA8;
+	color:#fff;
+}
+ul.cols_checklist label{ display:block; }
+ul.cols_checklist input{ vertical-align:middle; margin:2px 5px 2px 1px; }

dist/filtergrid.css

@@ -1,6 +1,6 @@
 /*------------------------------------------------------------------------ 
 	- TableFilter stylesheet by Max Guglielmi 
-	- (build date: Fri Apr 24 2015 19:43:06) 
+	- (build date: Tue Apr 28 2015 00:09:30) 
 	- Edit below for your projects' needs  
 ------------------------------------------------------------------------*/ 
 

example/index.html

@@ -109,7 +109,44 @@
                 exclude_row: [totRowIndex],
                 decimal_precision: [0, 2],
                 tot_row_index: [totRowIndex, totRowIndex]
-            }
+            },
+            extensions: [{
+                /*** Columns Visibility Manager extension load ***/
+                name: 'ColsVisibility',
+                src: 'extensions/colsVisibility/colsVisibility.js',
+                description: 'Columns visibility manager',/*
+                initialize: function(o){o.SetColsVisibility();}*/
+                // manager: true,
+                tick_to_hide: true,
+                // headers_table: true,
+                // container_target_id: 'test_cont',
+                // headers_text: ['1','2','3','4','5','6'],
+                btn_target_id: 'test_cont',
+                // btn_text: 'Hola',
+                // btn_html: '<button>Columns</button>',
+                // btn_css_class: 'test',
+                // btn_close_text: 'jj',
+                // btn_close_html: '<button>close</button>',
+                // btn_close_css_class: 'test',
+                // stylesheet: 'hola.css',
+                // cont_css_class: 'test',
+                // checklist_item_css_class: 'test',
+                // at_start: [0,1,2,3,4],
+                // enable_hover: true,
+                enable_tick_all: true
+                // ,
+                // tick_all_text: 'Hola',
+                // text: 'tutu',
+                // on_loaded: function(){ console.log(arguments); },
+                // on_before_open: function(){ console.log('on_before_open', arguments); },
+                // on_after_open: function(){ console.log('on_after_open',arguments); },
+                // on_before_close: function(){ console.log('on_before_close',arguments); },
+                // on_after_close: function(){ console.log('on_after_close',arguments); },
+                // on_before_col_hidden: function(){ console.log('on_before_col_hidden',arguments); },
+                // on_after_col_hidden: function(){ console.log('on_after_col_hidden',arguments); },
+                // on_before_col_displayed: function(){ console.log('on_before_col_displayed',arguments); },
+                // on_after_col_displayed: function(){ console.log('on_after_col_displayed',arguments); }
+            }]
         });
 
         tf.init();

frags/end.colsvisibility.frag

@@ -0,0 +1,4 @@
+
+    return require('ColsVisibility');
+
+});

frags/start.colsvisibility.frag

@@ -0,0 +1,10 @@
+
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(factory);
+    } else if (typeof exports === 'object') {
+        module.exports = factory;
+    } else {
+        root.AdapterSortableTable = factory();
+    }
+})(this, function() {

frags/start.frag

@@ -5,6 +5,6 @@
     } else if (typeof exports === 'object') {
         module.exports = factory;
     } else {
-        root.TableFilter = factory();
+        root.ColsVisibility = factory();
     }
 })(this, function() {

libs/almond/.bower.json

@@ -1,20 +1,20 @@
 {
   "name": "almond",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "main": "almond.js",
   "ignore": [
     "tests",
     "shrinktest.sh"
   ],
   "homepage": "https://github.com/jrburke/almond",
-  "_release": "0.3.0",
+  "_release": "0.3.1",
   "_resolution": {
     "type": "version",
-    "tag": "0.3.0",
+    "tag": "0.3.1",
-    "commit": "5bc2e5f62569e9026159b6e6e37949e047035ca7"
+    "commit": "8336992b1a3fee8d10310822d4222fb82d24f097"
   },
   "_source": "git://github.com/jrburke/almond.git",
-  "_target": "~0.3.0",
+  "_target": "~0.3.1",
   "_originalSource": "almond",
   "_direct": true
 }

libs/almond/.travis.yml

@@ -1,5 +1,5 @@
 language: node_js
-node_js:  0.8
+node_js:  0.10
 
 before_script:
   - node tests/server.js &

libs/almond/README.md

@@ -173,13 +173,16 @@ After the build, then the built file should be structured like so:
 
 Explanations of common errors:
 
-### deps is undefined
+### incorrect module build, no module name
 
-Where this line is mentioned:
+In almond 3.0.0 and earlier, this would show up as "deps is undefined", where
+this line is mentioned:
 
     if (!deps.splice) {
 
-It usually means that there is a define()'d module, but it is missing a name,
+In 3.0.1+ the error is explicitly: "incorrect module build, no module name".
+
+This means that there is a define()'d module, but it is missing a name,
 something that looks like this:
 
     define(function () {});
@@ -197,6 +200,14 @@ when it should look like:
 This is usually a sign that the tool you used to combine all the modules
 together did not properly name an anonymous AMD module.
 
+Multiple modules built into a single file **must** have names in the define calls.
+Otherwise almond has no way to assign the module to a name key for use in the code.
+
+The fix is to use a build tool that understand AMD modules and inserts the module
+IDs in the build. The
+[requirejs optimizer](http://requirejs.org/docs/optimization.html) is a build tool
+that can do this correctly.
+
 ### x missing y
 
 It means that module 'x' asked for module 'y', but module 'y' was not available.

libs/almond/almond.js

@@ -1,5 +1,5 @@
 /**
- * @license almond 0.3.0 Copyright (c) 2011-2014, The Dojo Foundation All Rights Reserved.
+ * @license almond 0.3.1 Copyright (c) 2011-2014, The Dojo Foundation All Rights Reserved.
  * Available via the MIT or new BSD license.
  * see: http://github.com/jrburke/almond for details
  */
@@ -44,12 +44,6 @@ var requirejs, require, define;
             //otherwise, assume it is a top-level require that will
             //be relative to baseUrl in the end.
             if (baseName) {
-                //Convert baseName to array, and lop off the last part,
-                //so that . matches that "directory" and not name of the baseName's
-                //module. For instance, baseName of "one/two/three", maps to
-                //"one/two/three.js", but we want the directory, "one/two" for
-                //this normalization.
-                baseParts = baseParts.slice(0, baseParts.length - 1);
                 name = name.split('/');
                 lastIndex = name.length - 1;
 
@@ -58,7 +52,11 @@ var requirejs, require, define;
                     name[lastIndex] = name[lastIndex].replace(jsSuffixRegExp, '');
                 }
 
-                name = baseParts.concat(name);
+                //Lop off the last part of baseParts, so that . matches the
+                //"directory" and not name of the baseName's module. For instance,
+                //baseName of "one/two/three", maps to "one/two/three.js", but we
+                //want the directory, "one/two" for this normalization.
+                name = baseParts.slice(0, baseParts.length - 1).concat(name);
 
                 //start trimDots
                 for (i = 0; i < name.length; i += 1) {
@@ -408,6 +406,9 @@ var requirejs, require, define;
     requirejs._defined = defined;
 
     define = function (name, deps, callback) {
+        if (typeof name !== 'string') {
+            throw new Error('See almond README: incorrect module build, no module name');
+        }
 
         //This module may not have dependencies
         if (!deps.splice) {

libs/almond/bower.json

@@ -1,6 +1,6 @@
 {
   "name": "almond",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "main": "almond.js",
   "ignore": [
     "tests",

libs/almond/package.json

@@ -1,28 +1,29 @@
 {
-    "name": "almond",
+  "name": "almond",
-    "description": "A minimal AMD API implementation for use in optimized browser builds.",
+  "description": "A minimal AMD API implementation for use in optimized browser builds.",
-    "version": "0.3.0",
+  "version": "0.3.1",
-    "homepage": "http://github.com/jrburke/almond",
+  "homepage": "http://github.com/jrburke/almond",
-    "author": "James Burke <jrburke@gmail.com> (http://github.com/jrburke)",
+  "author": "James Burke <jrburke@gmail.com> (http://github.com/jrburke)",
-    "repository": {
+  "repository": {
-        "type": "git",
+    "type": "git",
-        "url": "git://github.com/jrburke/almond.git"
+    "url": "git://github.com/jrburke/almond.git"
+  },
+  "licenses": [
+    {
+      "type": "BSD",
+      "url": "https://github.com/jrburke/almond/blob/master/LICENSE"
     },
-    "licenses": [
+    {
-        {
+      "type": "MIT",
-            "type": "BSD",
+      "url": "https://github.com/jrburke/almond/blob/master/LICENSE"
-            "url": "https://github.com/jrburke/almond/blob/master/LICENSE"
-        },
-        {
-            "type": "MIT",
-            "url": "https://github.com/jrburke/almond/blob/master/LICENSE"
-        }
-    ],
-    "main": "almond.js",
-    "engines": {
-        "node": ">=0.4.0"
-    },
-    "devDependencies": {
-        "connect": "*"
     }
+  ],
+  "main": "almond.js",
+  "engines": {
+    "node": ">=0.4.0"
+  },
+  "devDependencies": {
+    "connect": "^3.3.4",
+    "serve-static": "^1.9.1"
+  }
 }

libs/requirejs/.bower.json

@@ -1,6 +1,6 @@
 {
   "name": "requirejs",
-  "version": "2.1.15",
+  "version": "2.1.17",
   "homepage": "http://requirejs.org",
   "authors": [
     "jrburke.com"
@@ -11,13 +11,14 @@
     "AMD"
   ],
   "license": "new BSD, and MIT",
-  "_release": "2.1.15",
+  "_release": "2.1.17",
   "_resolution": {
     "type": "version",
-    "tag": "2.1.15",
+    "tag": "2.1.17",
-    "commit": "23307a15361f53a19c31e7ce1856e32eeb13f9b7"
+    "commit": "72b4505d30d9fa342f6dc88ee25da2b2da6a1e58"
   },
   "_source": "git://github.com/jrburke/requirejs-bower.git",
-  "_target": "*",
+  "_target": "~2.1.17",
-  "_originalSource": "requirejs"
+  "_originalSource": "requirejs",
+  "_direct": true
 }

libs/requirejs/bower.json

@@ -1,6 +1,6 @@
 {
   "name": "requirejs",
-  "version": "2.1.15",
+  "version": "2.1.17",
   "homepage": "http://requirejs.org",
   "authors": [
     "jrburke.com"

libs/requirejs/require.js

@@ -1,5 +1,5 @@
 /** vim: et:ts=4:sw=4:sts=4
- * @license RequireJS 2.1.15 Copyright (c) 2010-2014, The Dojo Foundation All Rights Reserved.
+ * @license RequireJS 2.1.17 Copyright (c) 2010-2015, The Dojo Foundation All Rights Reserved.
  * Available via the MIT or new BSD license.
  * see: http://github.com/jrburke/requirejs for details
  */
@@ -12,7 +12,7 @@ var requirejs, require, define;
 (function (global) {
     var req, s, head, baseElement, dataMain, src,
         interactiveScript, currentlyAddingScript, mainScript, subPath,
-        version = '2.1.15',
+        version = '2.1.17',
         commentRegExp = /(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,
         cjsRequireRegExp = /[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g,
         jsSuffixRegExp = /\.js$/,
@@ -244,7 +244,7 @@ var requirejs, require, define;
                     // still work when converted to a path, even though
                     // as an ID it is less than ideal. In larger point
                     // releases, may be better to just kick out an error.
-                    if (i === 0 || (i == 1 && ary[2] === '..') || ary[i - 1] === '..') {
+                    if (i === 0 || (i === 1 && ary[2] === '..') || ary[i - 1] === '..') {
                         continue;
                     } else if (i > 0) {
                         ary.splice(i - 1, 2);
@@ -1123,6 +1123,13 @@ var requirejs, require, define;
 
                         if (this.errback) {
                             on(depMap, 'error', bind(this, this.errback));
+                        } else if (this.events.error) {
+                            // No direct errback on this module, but something
+                            // else is listening for errors, so be sure to
+                            // propagate the error correctly.
+                            on(depMap, 'error', bind(this, function(err) {
+                                this.emit('error', err);
+                            }));
                         }
                     }
 

package.json

@@ -4,7 +4,9 @@
   "devDependencies": {
     "grunt": "~0.4.0",
     "grunt-babel": "^4.0.0",
+    "grunt-connect": "^0.2.0",
     "grunt-contrib-concat": "~0.3.0",
+    "grunt-contrib-connect": "^0.10.1",
     "grunt-contrib-copy": "~0.4.1",
     "grunt-contrib-cssmin": "~0.6.1",
     "grunt-contrib-jshint": "~0.11.0",

src-es6/array.js

@@ -2,7 +2,7 @@
  * Array utilities
  */
 
-import {Str} from 'string';
+import {Str} from './string';
 
 var Arr = {
     has: function(arr, val, caseSensitive){

src-es6/helpers.js

@@ -2,7 +2,7 @@
  * Misc helpers
  */
 
-import {Str} from 'string';
+import {Str} from './string';
 
 var Helpers = {
     isIE(){

src-es6/tablefilter.js

@@ -40,7 +40,7 @@ import {ColOps} from 'modules/colOps';
 import 'extensions/sortabletable/sortabletable';
 import {AdapterSortableTable}
     from 'extensions/sortabletable/adapterSortabletable';
-import {ColsVisibility} from 'extensions/colsVisibility/colsVisibility';
+// import {ColsVisibility} from 'extensions/colsVisibility/colsVisibility';
 
 var global = window,
     isValidDate = dateHelper.isValid,
@@ -580,13 +580,11 @@ export default class TableFilter{
         };
 
         // Extensions registry
-        this.Extensions = {
+        this.ExtRegistry = {
             sort: null,
             ezEditTable: null
         };
 
-        this.Exts = [];
-
         /*** TF events ***/
         var o = this;
         this.Evt = {
@@ -602,7 +600,7 @@ export default class TableFilter{
                 resetpagelength: 'resetPageLength',
                 sort: 'Sort',
                 loadextensions: 'LoadExtensions',
-                loadthemes: 'LoadThemes'
+                loadthemes: 'loadThemes'
             },
 
             /*====================================================
@@ -811,7 +809,7 @@ export default class TableFilter{
         this.includeFile(this.stylesheetId, this.stylesheet, null, 'link');
 
         //loads theme
-        if(this.hasThemes){ this._LoadThemes(); }
+        if(this.hasThemes){ this._loadThemes(); }
 
         if(this.rememberGridValues || this.rememberPageNb ||
             this.rememberPageLen){
@@ -1152,7 +1150,7 @@ export default class TableFilter{
         if(this.hasExtensions){
             // this.loadExtensions();
             this.registerExtensions();
-            this.initExtensions();
+            // this.initExtensions();
         }
 
         if(this.onFiltersLoaded){
@@ -1223,7 +1221,7 @@ export default class TableFilter{
                     o._loadExtensions();
                 break;
                 case o.Evt.name.loadthemes:
-                    o._LoadThemes();
+                    o._loadThemes();
                 break;
                 default: //to be used by extensions events when needed
                     o['_'+evt].call(null,o,s);
@@ -1240,7 +1238,6 @@ export default class TableFilter{
         if(this.loader || this.statusBar) {
             try{
                 this.Cpt.loader.show('');
-                // this.StatusMsg(o['msg'+evt]);
                 this.Cpt.statusBar.message(this['msg'+evt]);
             } catch(e){}
             global.setTimeout(efx, this.execDelay);
@@ -1257,92 +1254,37 @@ export default class TableFilter{
 
         for(var i=0; i<exts.length; i++){
             var ext = exts[i];
-            if(this.Exts.indexOf(ext.name) === -1){
+            if(types.isUndef(this.ExtRegistry[ext.name])){
-                this.Exts.push(ext.name);
+                this.loadExtension(ext);
             }
         }
     }
 
-    initExtensions(){
+    loadExtension(ext){
-        var exts = this.extensions;
+        if(!ext || !ext.name || !ext.src){
-        if(exts.length === 0){
             return;
         }
+        var sys = global.System,
+            className = ext.name,
+            tf = this;
 
-        for(var i=0; i<exts.length; i++){
+        sys.config({
-            var tf = this;
+            baseURL: tf.basePath
-            var ext = exts[i];
+        });
-            var name = ext.name;
+
-            var inst = eval('new '+ name+'(tf, ext);');
+        sys.import(ext.src.replace('.js', '')).then((m)=> {
-            tf.Extensions[name] = inst;
+            this.ExtRegistry[className] = new m[className](this, ext);
-        }
+        });
     }
 
-    // ImportModule(module){
+    loadThemes(){
-    //     if(!module.path || !module.name){
-    //         return;
-    //     }
-    //     this.includeFile(module.name, module.path, module.init);
-    // }
-
-    // loadExtensions(){
-    //     if(!this.Ext){
-    //         /*** TF extensions ***/
-    //         var o = this;
-    //         this.Ext = {
-    //             list: {},
-    //             add: function(extName, extDesc, extPath, extCallBack){
-    //                 var file = extPath.split('/')[extPath.split('/').length-1],
-    //                     re = new RegExp(file),
-    //                     path = extPath.replace(re,'');
-    //                 o.Ext.list[extName] = {
-    //                     name: extName,
-    //                     description: extDesc,
-    //                     file: file,
-    //                     path: path,
-    //                     callback: extCallBack
-    //                 };
-    //             }
-    //         };
-    //     }
-    //     this.EvtManager(this.Evt.name.loadextensions);
-    // }
-
-    /*====================================================
-        - loads TF extensions
-    =====================================================*/
-    // _LoadExtensions(){
-    //     if(!this.hasExtensions || !types.isArray(this.extensions.name) ||
-    //         !types.isArray(this.extensions.src)){
-    //         return;
-    //     }
-    //     var ext = this.extensions;
-    //     for(var e=0; e<ext.name.length; e++){
-    //         var extPath = ext.src[e],
-    //             extName = ext.name[e],
-    //            extInit = (ext.initialize && ext.initialize[e]) ?
-    //                 ext.initialize[e] : null,
-    //             extDesc = (ext.description && ext.description[e] ) ?
-    //                 ext.description[e] : null;
-
-    //         //Registers extension
-    //         this.Ext.add(extName, extDesc, extPath, extInit);
-    //         if(this.isImported(extPath)){
-    //             extInit.call(null,this);
-    //         } else {
-    //             this.includeFile(extName, extPath, extInit);
-    //         }
-    //     }
-    // }
-
-    LoadThemes(){
         this.EvtManager(this.Evt.name.loadthemes);
     }
 
     /*====================================================
         - loads TF themes
     =====================================================*/
-    _LoadThemes(){
+    _loadThemes(){
         if(!this.hasThemes){
             return;
         }
@@ -1453,7 +1395,7 @@ export default class TableFilter{
             }
             if(this.sort){
                 // this.RemoveSort();
-                this.Extensions.sort.destroy();
+                this.ExtRegistry.sort.destroy();
             }
             if(this.loader){
                 this.Cpt.loader.remove();
@@ -1602,7 +1544,7 @@ export default class TableFilter{
     =====================================================*/
     setSort(){
         var adapterSortabletable = new AdapterSortableTable(this);
-        this.Extensions.sort = adapterSortabletable;
+        this.ExtRegistry.sort = adapterSortabletable;
         adapterSortabletable.init();
     }
     setOldSort(){
@@ -1654,8 +1596,8 @@ export default class TableFilter{
                     var AdapterSortableTable = require(
                         ['extensions/sortabletable/adapterSortabletable'],
                         function(adapterSortabletable){
-                            o.Extensions.sort = new adapterSortabletable(o);
+                            o.ExtRegistry.sort = new adapterSortabletable(o);
-                            o.Extensions.sort.init();
+                            o.ExtRegistry.sort.init();
                     });
 
                     // o.includeFile(
@@ -1697,8 +1639,8 @@ export default class TableFilter{
                     //         ['extensions/sortabletable/adapterSortabletable'],
                     //         function(adapterSortabletable){
                     //             console.log(adapterSortabletable);
-                    //             // o.Extensions.sort = new adapterSortabletable(o);
+                    //             // o.ExtRegistry.sort = new adapterSortabletable(o);
-                    //             // o.Extensions.sort.init();
+                    //             // o.ExtRegistry.sort.init();
                     //     });
                     // });
             //     }
@@ -1966,7 +1908,7 @@ export default class TableFilter{
             //Selected row needs to be visible when paging is activated
             if(o.paging){
                 o.onAfterChangePage = function(tf, i){
-                    var et = tf.Extensions.ezEditTable;
+                    var et = tf.ExtRegistry.ezEditTable;
                     var slc = et.Selection;
                     var row = slc.GetActiveRow();
                     if(row){
@@ -2064,9 +2006,9 @@ export default class TableFilter{
         }
 
         try{
-            o.Extensions.ezEditTable = new EditTable(
+            o.ExtRegistry.ezEditTable = new EditTable(
                 o.id, ezEditConfig, startRow);
-            o.Extensions.ezEditTable.Init();
+            o.ExtRegistry.ezEditTable.Init();
         } catch(e) { console.log(ezEditConfig.err); }
     }
 

src/array.js

@@ -1,4 +1,4 @@
-define(["exports", "string"], function (exports, _string) {
+define(["exports", "./string"], function (exports, _string) {
     /**
      * Array utilities
      */

src/helpers.js

@@ -1,4 +1,4 @@
-define(["exports", "string"], function (exports, _string) {
+define(["exports", "./string"], function (exports, _string) {
     /**
      * Misc helpers
      */

src/index.html

@@ -91,7 +91,9 @@
         </table>
     </div>
 
+    <script src="../libs/system.js"></script>
     <script src="../libs/requirejs/require.js"></script>
+
     <script>
         requirejs(['tablefilter'], function(TableFilter){
             // Your logic here
@@ -140,7 +142,7 @@
                 extensions: [{
                     /*** Columns Visibility Manager extension load ***/
                     name: 'ColsVisibility',
-                    //src: 'extensions/colsVisibility/colsVisibility.js',
+                    src: 'extensions/colsVisibility/colsVisibility.js',
                     description: 'Columns visibility manager',/*
                     initialize: function(o){o.SetColsVisibility();}*/
                     // manager: true,
@@ -179,6 +181,6 @@
             tf.init();
         });
     </script>
-    <button onclick="javascript:tf.Extensions.ColsVisibility.toggleCol(2);">Toggle col 2</button>
+    <button onclick="javascript:tf.ExtRegistry.ColsVisibility.toggleCol(2);">Toggle col 2</button>
 </body>
 </html>

src/tablefilter.js

@@ -1,4 +1,4 @@
-define(["exports", "module", "event", "dom", "string", "cookie", "types", "array", "helpers", "date", "sort", "modules/store", "modules/gridLayout", "modules/loader", "modules/highlightKeywords", "modules/popupFilter", "modules/dropdown", "modules/checkList", "modules/rowsCounter", "modules/statusBar", "modules/paging", "modules/clearButton", "modules/help", "modules/alternateRows", "modules/colOps", "extensions/sortabletable/sortabletable", "extensions/sortabletable/adapterSortabletable", "extensions/colsVisibility/colsVisibility"], function (exports, module, _event, _dom, _string, _cookie, _types, _array, _helpers, _date, _sort, _modulesStore, _modulesGridLayout, _modulesLoader, _modulesHighlightKeywords, _modulesPopupFilter, _modulesDropdown, _modulesCheckList, _modulesRowsCounter, _modulesStatusBar, _modulesPaging, _modulesClearButton, _modulesHelp, _modulesAlternateRows, _modulesColOps, _extensionsSortabletableSortabletable, _extensionsSortabletableAdapterSortabletable, _extensionsColsVisibilityColsVisibility) {
+define(["exports", "module", "event", "dom", "string", "cookie", "types", "array", "helpers", "date", "sort", "modules/store", "modules/gridLayout", "modules/loader", "modules/highlightKeywords", "modules/popupFilter", "modules/dropdown", "modules/checkList", "modules/rowsCounter", "modules/statusBar", "modules/paging", "modules/clearButton", "modules/help", "modules/alternateRows", "modules/colOps", "extensions/sortabletable/sortabletable", "extensions/sortabletable/adapterSortabletable"], function (exports, module, _event, _dom, _string, _cookie, _types, _array, _helpers, _date, _sort, _modulesStore, _modulesGridLayout, _modulesLoader, _modulesHighlightKeywords, _modulesPopupFilter, _modulesDropdown, _modulesCheckList, _modulesRowsCounter, _modulesStatusBar, _modulesPaging, _modulesClearButton, _modulesHelp, _modulesAlternateRows, _modulesColOps, _extensionsSortabletableSortabletable, _extensionsSortabletableAdapterSortabletable) {
     "use strict";
 
     var _createClass = (function () { function defineProperties(target, props) { for (var key in props) { var prop = props[key]; prop.configurable = true; if (prop.value) prop.writable = true; } Object.defineProperties(target, props); } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();
@@ -43,7 +43,8 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
     var AlternateRows = _modulesAlternateRows.AlternateRows;
     var ColOps = _modulesColOps.ColOps;
     var AdapterSortableTable = _extensionsSortabletableAdapterSortabletable.AdapterSortableTable;
-    var ColsVisibility = _extensionsColsVisibilityColsVisibility.ColsVisibility;
+
+    // import {ColsVisibility} from 'extensions/colsVisibility/colsVisibility';
 
     var global = window,
         isValidDate = dateHelper.isValid,
@@ -532,13 +533,11 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
             };
 
             // Extensions registry
-            this.Extensions = {
+            this.ExtRegistry = {
                 sort: null,
                 ezEditTable: null
             };
 
-            this.Exts = [];
-
             /*** TF events ***/
             var o = this;
             this.Evt = {
@@ -554,7 +553,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                     resetpagelength: "resetPageLength",
                     sort: "Sort",
                     loadextensions: "LoadExtensions",
-                    loadthemes: "LoadThemes"
+                    loadthemes: "loadThemes"
                 },
 
                 /*====================================================
@@ -775,7 +774,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
 
                     //loads theme
                     if (this.hasThemes) {
-                        this._LoadThemes();
+                        this._loadThemes();
                     }
 
                     if (this.rememberGridValues || this.rememberPageNb || this.rememberPageLen) {
@@ -1087,7 +1086,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                     if (this.hasExtensions) {
                         // this.loadExtensions();
                         this.registerExtensions();
-                        this.initExtensions();
+                        // this.initExtensions();
                     }
 
                     if (this.onFiltersLoaded) {
@@ -1160,7 +1159,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                                 o._loadExtensions();
                                 break;
                             case o.Evt.name.loadthemes:
-                                o._LoadThemes();
+                                o._loadThemes();
                                 break;
                             default:
                                 //to be used by extensions events when needed
@@ -1178,7 +1177,6 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                     if (this.loader || this.statusBar) {
                         try {
                             this.Cpt.loader.show("");
-                            // this.StatusMsg(o['msg'+evt]);
                             this.Cpt.statusBar.message(this["msg" + evt]);
                         } catch (e) {}
                         global.setTimeout(efx, this.execDelay);
@@ -1196,98 +1194,44 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
 
                     for (var i = 0; i < exts.length; i++) {
                         var ext = exts[i];
-                        if (this.Exts.indexOf(ext.name) === -1) {
+                        if (types.isUndef(this.ExtRegistry[ext.name])) {
-                            this.Exts.push(ext.name);
+                            this.loadExtension(ext);
                         }
                     }
                 }
             },
-            initExtensions: {
+            loadExtension: {
-                value: function initExtensions() {
+                value: function loadExtension(ext) {
-                    var exts = this.extensions;
+                    var _this = this;
-                    if (exts.length === 0) {
+
+                    if (!ext || !ext.name || !ext.src) {
                         return;
                     }
+                    var sys = global.System,
+                        className = ext.name,
+                        tf = this;
 
-                    for (var i = 0; i < exts.length; i++) {
+                    sys.config({
-                        var tf = this;
+                        baseURL: tf.basePath
-                        var ext = exts[i];
+                    });
-                        var name = ext.name;
+
-                        var inst = eval("new " + name + "(tf, ext);");
+                    sys["import"](ext.src.replace(".js", "")).then(function (m) {
-                        tf.Extensions[name] = inst;
+                        _this.ExtRegistry[className] = new m[className](_this, ext);
-                    }
+                    });
                 }
             },
-            LoadThemes: {
+            loadThemes: {
-
+                value: function loadThemes() {
-                // ImportModule(module){
-                //     if(!module.path || !module.name){
-                //         return;
-                //     }
-                //     this.includeFile(module.name, module.path, module.init);
-                // }
-
-                // loadExtensions(){
-                //     if(!this.Ext){
-                //         /*** TF extensions ***/
-                //         var o = this;
-                //         this.Ext = {
-                //             list: {},
-                //             add: function(extName, extDesc, extPath, extCallBack){
-                //                 var file = extPath.split('/')[extPath.split('/').length-1],
-                //                     re = new RegExp(file),
-                //                     path = extPath.replace(re,'');
-                //                 o.Ext.list[extName] = {
-                //                     name: extName,
-                //                     description: extDesc,
-                //                     file: file,
-                //                     path: path,
-                //                     callback: extCallBack
-                //                 };
-                //             }
-                //         };
-                //     }
-                //     this.EvtManager(this.Evt.name.loadextensions);
-                // }
-
-                /*====================================================
-                    - loads TF extensions
-                =====================================================*/
-                // _LoadExtensions(){
-                //     if(!this.hasExtensions || !types.isArray(this.extensions.name) ||
-                //         !types.isArray(this.extensions.src)){
-                //         return;
-                //     }
-                //     var ext = this.extensions;
-                //     for(var e=0; e<ext.name.length; e++){
-                //         var extPath = ext.src[e],
-                //             extName = ext.name[e],
-                //            extInit = (ext.initialize && ext.initialize[e]) ?
-                //                 ext.initialize[e] : null,
-                //             extDesc = (ext.description && ext.description[e] ) ?
-                //                 ext.description[e] : null;
-
-                //         //Registers extension
-                //         this.Ext.add(extName, extDesc, extPath, extInit);
-                //         if(this.isImported(extPath)){
-                //             extInit.call(null,this);
-                //         } else {
-                //             this.includeFile(extName, extPath, extInit);
-                //         }
-                //     }
-                // }
-
-                value: function LoadThemes() {
                     this.EvtManager(this.Evt.name.loadthemes);
                 }
             },
-            _LoadThemes: {
+            _loadThemes: {
 
                 /*====================================================
                     - loads TF themes
                 =====================================================*/
 
-                value: function _LoadThemes() {
+                value: function _loadThemes() {
                     if (!this.hasThemes) {
                         return;
                     }
@@ -1392,7 +1336,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                         }
                         if (this.sort) {
                             // this.RemoveSort();
-                            this.Extensions.sort.destroy();
+                            this.ExtRegistry.sort.destroy();
                         }
                         if (this.loader) {
                             this.Cpt.loader.remove();
@@ -1551,7 +1495,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
 
                 value: function setSort() {
                     var adapterSortabletable = new AdapterSortableTable(this);
-                    this.Extensions.sort = adapterSortabletable;
+                    this.ExtRegistry.sort = adapterSortabletable;
                     adapterSortabletable.init();
                 }
             },
@@ -1603,8 +1547,8 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                             //     console.log(require);
                             //
                             var AdapterSortableTable = require(["extensions/sortabletable/adapterSortabletable"], function (adapterSortabletable) {
-                                o.Extensions.sort = new adapterSortabletable(o);
+                                o.ExtRegistry.sort = new adapterSortabletable(o);
-                                o.Extensions.sort.init();
+                                o.ExtRegistry.sort.init();
                             });
 
                             // o.includeFile(
@@ -1645,8 +1589,8 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                         //         ['extensions/sortabletable/adapterSortabletable'],
                         //         function(adapterSortabletable){
                         //             console.log(adapterSortabletable);
-                        //             // o.Extensions.sort = new adapterSortabletable(o);
+                        //             // o.ExtRegistry.sort = new adapterSortabletable(o);
-                        //             // o.Extensions.sort.init();
+                        //             // o.ExtRegistry.sort.init();
                         //     });
                         // });
                         //     }
@@ -1902,7 +1846,7 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                         //Selected row needs to be visible when paging is activated
                         if (o.paging) {
                             o.onAfterChangePage = function (tf, i) {
-                                var et = tf.Extensions.ezEditTable;
+                                var et = tf.ExtRegistry.ezEditTable;
                                 var slc = et.Selection;
                                 var row = slc.GetActiveRow();
                                 if (row) {
@@ -1996,8 +1940,8 @@ define(["exports", "module", "event", "dom", "string", "cookie", "types", "array
                     }
 
                     try {
-                        o.Extensions.ezEditTable = new EditTable(o.id, ezEditConfig, startRow);
+                        o.ExtRegistry.ezEditTable = new EditTable(o.id, ezEditConfig, startRow);
-                        o.Extensions.ezEditTable.Init();
+                        o.ExtRegistry.ezEditTable.Init();
                     } catch (e) {
                         console.log(ezEditConfig.err);
                     }

test/test-sort-custom-sorter.js

@@ -36,7 +36,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     QUnit.start();
 
     function startTest(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {

test/test-sort-grid-layout.js

@@ -29,7 +29,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     QUnit.start();
 
     function startSimple(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {
@@ -58,7 +58,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     }
 
     function startPaging(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {

test/test-sort-key.js

@@ -26,7 +26,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     QUnit.start();
 
     function start(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {

test/test-sort.js

@@ -27,7 +27,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     QUnit.start();
 
     function startSimple(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {
@@ -64,7 +64,7 @@ requirejs(['test-config', '../src/tablefilter'], function(config, TableFilter){
     }
 
     function startPaging(tf){
-        var sort = tf.Extensions.sort;
+        var sort = tf.ExtRegistry.sort;
 
         module('Sanity checks');
         test('Sort extension', function() {