Merge pull request #6 from EclipseTrading/feature/update-jsdoc-for-ts-compiler

Use TypeScript compiler for Hypergrid JS build

Author: aaronbloom

.gitignore

@@ -9,3 +9,4 @@
 
 /node_modules
 /lib
+/dist

.npmignore

@@ -19,5 +19,4 @@ build
 /*.sh
 /*.md
 
-/src/behaviors/index.js
-/src/lib/index.js
+/src

css/index.js

@@ -1,41 +1,41 @@
 'use strict';
 
-exports.grid = [
-    '.hypergrid-container {',
-    '	position: relative;',
-    '	height: 500px;',
-    '}',
-    '.hypergrid-container > div:first-child {',
-    '	position: absolute;',
-    '	left: 0;',
-    '	top: 0;',
-    '	right: 0;',
-    '	bottom: 0;',
-    '}',
-    '.hypergrid-container > div:first-child > div.info {',
-    '	position: absolute;',
-    '	display: none; /* initially hidden */',
-    '	margin-top: 150px; /* to place below headers */',
-    '	color: #eee;',
-    '	text-shadow: 1px 1px #ccc;',
-    '	font-size: 36pt;',
-    '	font-weight: bold;',
-    '	text-align: center;',
-    '	top: 0; right: 0; bottom: 0; left: 0;',
-    '}',
-    '.hypergrid-textfield {',
-    '	position: absolute;',
-    '	font-size: 12px;',
-    '	color: black;',
-    '	background-color: ivory;',
-    '	box-sizing: border-box;',
-    '	margin: 0;',
-    '	padding: 0 5px;',
-    '	border: 0; /*border: 1px solid #777;*/',
-    '	outline: 0;',
-    '}',
-    '',
-    '.hypergrid {',
-    '	touch-action: none;',
-    '}'
-].join('\n');
+exports.grid = `
+.hypergrid-container {
+    position: relative;
+    height: 500px;
+}
+.hypergrid-container > div:first-child {
+    position: absolute;
+    left: 0;
+    top: 0;
+    right: 0;
+    bottom: 0;
+}
+.hypergrid-container > div:first-child > div.info {
+    position: absolute;
+    display: none; /* initially hidden */
+    margin-top: 150px; /* to place below headers */
+    color: #eee;
+    text-shadow: 1px 1px #ccc;
+    font-size: 36pt;
+    font-weight: bold;
+    text-align: center;
+    top: 0; right: 0; bottom: 0; left: 0;
+}
+.hypergrid-textfield {
+    position: absolute;
+    font-size: 12px;
+    color: black;
+    background-color: ivory;
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0 5px;
+    border: 0; /*border: 1px solid #777;*/
+    outline: 0;
+}
+
+.hypergrid {
+    touch-action: none;
+}
+`;

gulpfile.js

@@ -91,25 +91,8 @@ function swallowImages() {
 function templates(src, type) {
     return gulp.src(src)
         .pipe($$.each(function(content, file, callback) {
-            var filename = path.basename(file.path, "." + type),
-                member = /[^\w]/.test(filename) ? "['" + filename + "']" : "." + filename;
-
-            // convert (groups of) 4 space chars at start of lines to tab(s)
-            do {
-                var len = content.length;
-                content = content.replace(/\n((    )*)    (.*)/, "\n$1\t$3");
-            } while (content.length < len);
-
-            // quote each line and join them into a single string
-            content = 'exports' + member + " = [\n'" + content
-                    .replace(/\\/g, "\\\\") // escape all backslashes
-                    .replace(/'/g, "\\'") // escape all single-quotes
-                    .replace(/\n/g, "',\n'") + "'\n].join('\\n');\n";
-
-            // remove possible blank line at end of each
-            content = content.replace(/,\n''\n]/g, "\n]");
-
-            callback(null, content); // the first argument is an error, if you encounter one
+            let filename = path.basename(file.path, "." + type);
+            callback(null, `exports.${filename} = \`\n${content}\`;\n`); // the first argument is an error, if you encounter one
         }))
         .pipe($$.concat("index.js"))
         .pipe($$.header("'use strict';\n\n"))

images/index.js

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* eslint-env browser */
 
 /**
@@ -96,7 +97,7 @@ images['checkbox-off'] = images.unchecked;
  * Possible styles must be one of those listed in {*link https://github.com/joneit/svg-themer/blob/master/README.md#cssimagepropertynames svgThemer.cssImagePropertyNames} (which you can extend if needed).
  * * Will be automatically themed when the grid is themed (which is the whole point).
  *
- * @see {@link https://github.com/joneit/svg-themer}
+ * {@link https://github.com/joneit/svg-themer}
  * @memberOf module:images
  */
 function add(name, img, themeable, setSvgProps, styles) {