Refactors in tsconfig.json, App.tsx, tslint.json

build/asset-manifest.json

@@ -1,6 +1,6 @@
 {
   "main.css": "static/css/main.0748cb86.css",
   "main.css.map": "static/css/main.0748cb86.css.map",
-  "main.js": "static/js/main.ae9851b1.js",
-  "main.js.map": "static/js/main.ae9851b1.js.map"
+  "main.js": "static/js/main.53f7a8dd.js",
+  "main.js.map": "static/js/main.53f7a8dd.js.map"
 }

build/dist/src/App.js

@@ -1,4 +1,3 @@
-"use strict";
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = Object.setPrototypeOf ||
         ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -17,24 +16,23 @@ var __assign = (this && this.__assign) || Object.assign || function(t) {
     }
     return t;
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var VrviewCmp_1 = require("./vrview/VrviewCmp");
-var Fabric_1 = require("office-ui-fabric-react/lib/Fabric");
-var CommandBar_1 = require("office-ui-fabric-react/lib/CommandBar");
-var ContextualMenu_1 = require("office-ui-fabric-react/lib/ContextualMenu");
-var Panel_1 = require("office-ui-fabric-react/lib/Panel");
-var Nav_1 = require("office-ui-fabric-react/lib/Nav");
-var DocumentCard_1 = require("office-ui-fabric-react/lib/DocumentCard");
-var ChoiceGroup_1 = require("office-ui-fabric-react/lib/ChoiceGroup");
-var Scenes_1 = require("./scenes/Scenes");
-require("./App.css");
+import * as React from 'react';
+import Vrview from './vrview/VrviewCmp';
+import { Fabric } from "office-ui-fabric-react/lib/Fabric";
+import { CommandBar } from "office-ui-fabric-react/lib/CommandBar";
+import { ContextualMenuItemType } from "office-ui-fabric-react/lib/ContextualMenu";
+import { Panel, PanelType } from 'office-ui-fabric-react/lib/Panel';
+import { Nav } from 'office-ui-fabric-react/lib/Nav';
+import { DocumentCard } from 'office-ui-fabric-react/lib/DocumentCard';
+import { ChoiceGroup } from 'office-ui-fabric-react/lib/ChoiceGroup';
+import ScenesCollection from "./scenes/Scenes";
+import './App.css';
 var App = (function (_super) {
     __extends(App, _super);
     function App() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         // Collection of scenes
-        _this.scenes = new Scenes_1.default();
+        _this.scenes = new ScenesCollection();
         // Initial state contains first scene of the collection
         _this.state = _this.scenes.getSceneByArrayIndex(0);
         /**
@@ -117,7 +115,7 @@ var App = (function (_super) {
             },
             {
                 key: 'divider',
-                itemType: ContextualMenu_1.ContextualMenuItemType.Divider
+                itemType: ContextualMenuItemType.Divider
             },
             {
                 key: 'resetScene',
@@ -168,7 +166,7 @@ var App = (function (_super) {
                             }],
                         isExpanded: false
                     },
-                    { name: 'Image Format Conversor', key: 'imageFormatConversor', url: '',
+                    { name: 'Change Img Format', key: 'imageFormatConversor', url: '',
                         onClick: this.openImageFormatConversor }
                 ]
             }];
@@ -210,21 +208,21 @@ var App = (function (_super) {
                 onClick: function () { return _this.handleClickHotspot(4); }
             }
         ];
-        return (React.createElement(Fabric_1.Fabric, null,
-            React.createElement(CommandBar_1.CommandBar, { isSearchBoxVisible: false, items: topMenuItems, className: "command-bar" }),
-            React.createElement(Panel_1.Panel, { ref: "panel", type: Panel_1.PanelType.smallFixedNear, isLightDismiss: true, headerText: "Vrview React" },
+        return (React.createElement(Fabric, null,
+            React.createElement(CommandBar, { isSearchBoxVisible: false, items: topMenuItems, className: "command-bar" }),
+            React.createElement(Panel, { ref: "panel", type: PanelType.smallFixedNear, isLightDismiss: true, headerText: "Vrview React" },
                 React.createElement("div", null,
-                    React.createElement(Nav_1.Nav, { groups: leftMenuItems, selectedKey: scene.id.toString() }))),
+                    React.createElement(Nav, { groups: leftMenuItems, selectedKey: scene.id.toString() }))),
             React.createElement("div", { className: "pad15" },
                 React.createElement("div", { className: "centered header" }, "Vrview React Component"),
                 React.createElement("div", { className: "centered subheader" }, "Visualization of virtual tours, 360\u00BA photos and videos")),
-            React.createElement(DocumentCard_1.DocumentCard, { className: "layout shadow" },
-                React.createElement(VrviewCmp_1.default, __assign({}, this.state, { ref: function (vrview) { _this.vrviewCmp = vrview; }, onClickHotspot: this.handleClickHotspot })),
+            React.createElement(DocumentCard, { className: "layout shadow" },
+                React.createElement(Vrview, __assign({}, this.state, { ref: function (vrview) { _this.vrviewCmp = vrview; }, onClickHotspot: this.handleClickHotspot })),
                 React.createElement("div", { className: "pad15" },
                     React.createElement("div", { className: "card-title" }, scene.title),
                     React.createElement("div", { dangerouslySetInnerHTML: { __html: scene.description } }))),
-            React.createElement(ChoiceGroup_1.ChoiceGroup, { label: 'Change Scene Programatically', options: choiceGroup, className: "centered pad15" })));
+            React.createElement(ChoiceGroup, { label: 'Change Scene Programatically', options: choiceGroup, className: "centered pad15" })));
     };
     return App;
 }(React.PureComponent));
-exports.App = App;
+export { App };

build/dist/src/index.js

@@ -1,6 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var ReactDOM = require("react-dom");
-var App_1 = require("./App");
-ReactDOM.render(React.createElement(App_1.App, null), document.getElementById('root'));
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import { App } from './App';
+ReactDOM.render(React.createElement(App, null), document.getElementById('root'));

build/dist/src/scenes/Scenes.js

@@ -1,5 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 /**
  * @Class {ScenesCollection} It represents a list of scenes.
  *
@@ -27,4 +25,4 @@ var ScenesCollection = (function () {
     };
     return ScenesCollection;
 }());
-exports.default = ScenesCollection;
+export default ScenesCollection;

build/dist/src/vrview/VrviewCmp.js

@@ -1,4 +1,3 @@
-"use strict";
 //todo: consultar digarama uml
 //todo: test browserstack ios
 //todo: favicon
@@ -27,9 +26,8 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var VRView = require("./vrview.js");
+import * as React from "react";
+import * as VRView from "./vrview.js";
 /**
  * Vrview creates a 3d scene with optional hotspots
  * It receives scene data as props from parent component
@@ -162,4 +160,4 @@ var Vrview = (function (_super) {
     };
     return Vrview;
 }(React.PureComponent));
-exports.default = Vrview;
+export default Vrview;

build/dist/src/vrview/interfaces/IHotspot.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

build/dist/src/vrview/interfaces/IScene.js

@@ -1,3 +1 @@
-"use strict";
 //todo: eliminar la propiedad "scene" para simplificar?
-Object.defineProperty(exports, "__esModule", { value: true });

build/dist/src/vrview/interfaces/IVrviewPlayer.js

@@ -1,3 +1 @@
-"use strict";
 //todo: completar, posiblemente faltan campos del interfaz, revisar vrview.js
-Object.defineProperty(exports, "__esModule", { value: true });

build/index.html

@@ -7,11 +7,11 @@
   <link rel="manifest" href="manifest.json">
   <link rel="shortcut icon" href="favicon.ico">
   <title>Vrview React</title>
-  <link href="static/css/main.0748cb86.css" rel="stylesheet">
+  <link href="./static/css/main.0748cb86.css" rel="stylesheet">
 </head>
 <body>
 <noscript>You need to enable JavaScript to run this app</noscript>
 <div id="root"></div>
-<script type="text/javascript" src="static/js/main.ae9851b1.js"></script>
+<script type="text/javascript" src="./static/js/main.53f7a8dd.js"></script>
 </body>
 </html>

package.json

@@ -2,6 +2,8 @@
   "name": "vrview-react",
   "version": "0.1.0",
   "private": true,
+  "homepage": ".",
+  "license": "MIT",
   "dependencies": {
     "@types/jest": "^20.0.4",
     "@types/node": "^8.0.14",

src/App.tsx

@@ -11,8 +11,6 @@ import {ChoiceGroup, IChoiceGroupOption} from 'office-ui-fabric-react/lib/Choice
 import ScenesCollection from "./scenes/Scenes";
 import './App.css';
 
-
-
 export class App extends React.PureComponent<{}, IScene> {
 
   // Collection of scenes
@@ -160,7 +158,7 @@ export class App extends React.PureComponent<{}, IScene> {
             }],
             isExpanded: false
           },
-          { name: 'Image Format Conversor', key: 'imageFormatConversor', url: '',
+          { name: 'Change Img Format', key: 'imageFormatConversor', url: '',
             onClick: this.openImageFormatConversor }
         ]
     }];

src/vrview/interfaces/IHotspot.ts

@@ -1,8 +1,8 @@
 /**
  * Hotspot: clickable point in scene
  *
- * It enables to load another 3d scene in VrView
- * or execution of an arbitrary function on click (still not implemented)
+ * It enables to load another 3d scene
+ * or arbitrary function execution on click (still not implemented)
  */
 export interface IHotspot {
   name: string,                   // Hotspot identifier. Used on click event

tmp/tslint.json

@@ -0,0 +1,99 @@
+{
+    "extends": ["tslint-react"],
+    "rules": {
+        "align": [
+            true,
+            "parameters",
+            "arguments",
+            "statements"
+        ],
+        "ban": false,
+        "class-name": true,
+        "comment-format": [
+            true,
+            "check-space"
+        ],
+        "curly": true,
+        "eofline": false,
+        "forin": true,
+        "indent": [ true, "spaces" ],
+        "interface-name": [true, "never-prefix"],
+        "jsdoc-format": true,
+        "jsx-no-lambda": false,
+        "jsx-no-multiline-js": false,
+        "label-position": true,
+        "max-line-length": [ true, 120 ],
+        "member-ordering": [
+            true,
+            "public-before-private",
+            "static-before-instance",
+            "variables-before-functions"
+        ],
+        "no-any": true,
+        "no-arg": true,
+        "no-bitwise": true,
+        "no-console": [
+            true,
+            "log",
+            "error",
+            "debug",
+            "info",
+            "time",
+            "timeEnd",
+            "trace"
+        ],
+        "no-consecutive-blank-lines": true,
+        "no-construct": true,
+        "no-debugger": true,
+        "no-duplicate-variable": true,
+        "no-empty": true,
+        "no-eval": true,
+        "no-shadowed-variable": true,
+        "no-string-literal": true,
+        "no-switch-case-fall-through": true,
+        "no-trailing-whitespace": false,
+        "no-unused-expression": true,
+        "no-use-before-declare": true,
+        "one-line": [
+            true,
+            "check-catch",
+            "check-else",
+            "check-open-brace",
+            "check-whitespace"
+        ],
+        "quotemark": [true, "single", "jsx-double"],
+        "radix": true,
+        "semicolon": [true, "always"],
+        "switch-default": true,
+
+        "trailing-comma": false,
+
+        "triple-equals": [ true, "allow-null-check" ],
+        "typedef": [
+            true,
+            "parameter",
+            "property-declaration"
+        ],
+        "typedef-whitespace": [
+            true,
+            {
+                "call-signature": "nospace",
+                "index-signature": "nospace",
+                "parameter": "nospace",
+                "property-declaration": "nospace",
+                "variable-declaration": "nospace"
+            }
+        ],
+        "variable-name": [true, "ban-keywords", "check-format", "allow-leading-underscore", "allow-pascal-case"],
+        "whitespace": [
+            true,
+            "check-branch",
+            "check-decl",
+            "check-module",
+            "check-operator",
+            "check-separator",
+            "check-type",
+            "check-typecast"
+        ]
+    }
+}

tsconfig.json

@@ -1,27 +1,27 @@
 {
   "compilerOptions": {
     "outDir": "build/dist",
-    "module": "commonjs",
+    "module": "es6",
     "target": "es5",
     "lib": ["es6", "dom"],
     "sourceMap": false,
     "allowJs": true,
     "jsx": "react",
     "moduleResolution": "node",
     "rootDir": "src",
+    "skipDefaultLibCheck": true,
     "forceConsistentCasingInFileNames": true,
     "noImplicitReturns": true,
     "noImplicitThis": true,
     "noImplicitAny": true,
     "strictNullChecks": true,
     "suppressImplicitAnyIndexErrors": true,
-    "noUnusedLocals": true
+    "noUnusedLocals": false
   },
   "exclude": [
     "node_modules",
     "tmp",
-    "build",
-    "jest"
+    "build"
   ],
   "types": [
     "typePatches"