Use webpack to bundle js, css and html templates

This commit includes webpack.dev config and some initial but untested
config for prodution. It builds hslayers.js bundle in dist folder,
which will be included in npm package. All the html templates are now
packaged in this bundle with ng-cache-loader.

refs #203

README.md

@@ -71,7 +71,7 @@ define([ /* List of js files to be loaded. They are both hslayers and third-part
                 function(config, Core) {
                     return {
                         /* A different layout of the application can be achieved by changing the main template*/
-                        templateUrl: config.hsl_path + 'hslayers.html',
+                        template: require('hslayers.html'),
                         link: function(scope, element) {
                             Core.fullScreenMap(element);
                         }

app.js

@@ -0,0 +1,44 @@
+'use strict';
+
+define(['angular', 'ol', 'toolbar', 'layermanager', 'sidebar', 'map', 'ows', 'query', 'search', 'print', 'permalink', 'measure', 'legend', 'bootstrap.bundle', 'geolocation', 'core', 'datasource_selector', 'api', 'angular-gettext', 'translations', 'compositions', 'status_creator', 'info'],
+
+    function(angular, ol, toolbar, layermanager) {
+        var module = angular.module('hs', [
+            'hs.sidebar',
+            'hs.toolbar',
+            'hs.layermanager',
+            'hs.map',
+            'hs.query',
+            'hs.search', 'hs.print', 'hs.permalink', 'hs.measure',
+            'hs.legend', 'hs.geolocation', 'hs.core',
+            'hs.datasource_selector',
+            'hs.status_creator',
+            'hs.api',
+            'hs.ows',
+            'gettext',
+            'hs.compositions',
+            'hs.info'
+        ]);
+
+        module.directive('hs', ['config', 'Core', function(config, Core) {
+            return {
+                template: require('hslayers.html'),
+                link: function(scope, element, attrs) {
+                    Core.fullScreenMap(element);
+                }
+            };
+        }]);
+
+        if(window.hslayersNgConfig) module.value('config', Object.assign({}, window.hslayersNgConfig(ol)));
+
+        module.controller('Main', ['$scope', 'Core', 'hs.ows.wms.service_layer_producer', 'hs.compositions.service_parser', 'config',
+            function($scope, Core, srv_producer, composition_parser, config) {
+                $scope.hsl_path = config.hsl_path; //Get this from hslayers.js file
+                $scope.Core = Core;
+                Core.sidebarRight = false;
+                Core.singleDatasources = true;
+            }
+        ]);
+
+        return module;
+    });

app.js.template

@@ -22,7 +22,7 @@ define(['angular', 'ol', 'toolbar', 'layermanager', 'sidebar', 'map', 'ows', 'qu
 
         module.directive('hs', ['config', 'Core', function(config, Core) {
             return {
-                templateUrl: config.hsl_path + 'hslayers.html',
+                template: require('hslayers.html'),
                 link: function(scope, element) {
                     Core.fullScreenMap(element);
                 }

components/compositions/compositions.js

@@ -18,7 +18,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'hs.comp
         var module = angular.module('hs.compositions', ['720kb.socialshare', 'hs.map', 'hs.core', 'hs.ows.nonwms', 'hs.compositions.config_parsers'])
             .directive('hs.compositions.directive', ['config', function (config) {
                 return {
-                    templateUrl: `${config.hsl_path}components/compositions/partials/compositions${config.design || ''}.html`,
+                    template: require('components/compositions/partials/compositions.html'),
                     link: function (scope, element) {
                         if(angular.isUndefined(config.design) || config.design == ''){
                             var el = document.getElementsByClassName('mid-pane');
@@ -41,7 +41,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'hs.comp
              */
             .directive('hs.compositions.overwriteDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/compositions/partials/dialog_overwriteconfirm.html',
+                    template: require('components/compositions/partials/dialog_overwriteconfirm.html'),
                     link: function (scope, element, attrs) {
                         scope.overwriteModalVisible = true;
                     }
@@ -55,7 +55,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'hs.comp
              */
             .directive('hs.compositions.deleteDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/compositions/partials/dialog_delete.html',
+                    template: require('components/compositions/partials/dialog_delete.html'),
                     link: function (scope, element, attrs) {
                         scope.deleteModalVisible = true;
                     }
@@ -69,7 +69,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'hs.comp
              */
             .directive('hs.compositions.shareDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/compositions/partials/dialog_share.html',
+                    template: require('components/compositions/partials/dialog_share.html'),
                     link: function (scope, element, attrs) {
                         scope.shareModalVisible = true;
                     }
@@ -83,7 +83,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'hs.comp
              */
             .directive('hs.compositions.infoDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/compositions/partials/dialog_info.html',
+                    template: require('components/compositions/partials/dialog_info.html'),
                     link: function (scope, element, attrs) {
                         scope.infoModalVisible = true;
                     }

components/compositions/hs.compositions.controller.js

@@ -204,7 +204,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'map', '
                                     escapeToClose: true,
                                     scope: $scope,
                                     preserveScope: true,
-                                    templateUrl: config.hsl_path + 'materialComponents/panelContents/compositionLoadUnsavedDialog.html',
+                                    template: require('materialComponents/panelContents/compositionLoadUnsavedDialog.html'),
                                     controller: function DialogController($scope, $mdDialog) {
                                         $scope.closeDialog = function () {
                                             $mdDialog.hide();
@@ -285,7 +285,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'map', '
                                     escapeToClose: true,
                                     scope: $scope,
                                     preserveScope: true,
-                                    templateUrl: config.hsl_path + 'components/compositions/partials/dialog_sharemd.html',
+                                    template: require('components/compositions/partials/dialog_sharemd.html'),
                                     controller: function DialogController($scope, $mdDialog) {
                                         $scope.closeDialog = function () {
                                             $mdDialog.hide();
@@ -484,7 +484,7 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'map', '
                                     escapeToClose: true,
                                     scope: $scope,
                                     preserveScope: true,
-                                    templateUrl: config.hsl_path + 'materialComponents/panelContents/compositionLoadUnsavedDialog.html',
+                                    template: require('materialComponents/panelContents/compositionLoadUnsavedDialog.html'),
                                     controller: function DialogController($scope, $mdDialog) {
                                         $scope.closeDialog = function () {
                                             $mdDialog.hide();

components/customhtml/customhtml.js

@@ -7,7 +7,7 @@ define(['angular', 'ol'],
         angular.module('hs.customhtml', [])
             .directive('hs.customhtml.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'customhtml.html',
+                    template: require('customhtml.html'),
                     link: function link(scope, element, attrs) {},
                     replace: true
                 };

components/datasource_selector/datasource_selector.js

@@ -13,7 +13,7 @@ define(['angular', 'ol', 'map'],
              */
             .directive('hs.datasourceSelector.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/datasource_selector/partials/datasource_selector.html'
+                    template: require('components/datasource_selector/partials/datasource_selector.html')
                 };
             }])
 
@@ -25,7 +25,7 @@ define(['angular', 'ol', 'map'],
              */
             .directive('hs.datasourceSelector.metadataDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/datasource_selector/partials/dialog_metadata.html',
+                    template: require('components/datasource_selector/partials/dialog_metadata.html'),
                     link: function (scope, element, attrs) {
                         scope.metadataModalVisible = true;
                     }
@@ -40,7 +40,7 @@ define(['angular', 'ol', 'map'],
              */
             .directive('hs.datasourceSelector.advancedMickaDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/datasource_selector/partials/dialog_micka_advanced.html',
+                    template: require('components/datasource_selector/partials/dialog_micka_advanced.html'),
                     link: function (scope, element, attrs) {
                         scope.modalVisible = true;
                     }
@@ -55,7 +55,7 @@ define(['angular', 'ol', 'map'],
              */
             .directive('hs.datasourceSelector.suggestionsDialogDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/datasource_selector/partials/dialog_micka_suggestions.html',
+                    template: require('components/datasource_selector/partials/dialog_micka_suggestions.html'),
                     link: function (scope, element, attrs) {
                         scope.suggestionsModalVisible = true;
                         scope.data.suggestionFilter = scope.data.query[scope.data.suggestionConfig.input];
@@ -73,7 +73,7 @@ define(['angular', 'ol', 'map'],
              */
             .directive('hs.datasourceSelector.objectDirective', ['$compile', 'config', function ($compile, config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/datasource_selector/partials/object.html',
+                    template: require('components/datasource_selector/partials/object.html'),
                     compile: function compile(element) {
                         var contents = element.contents().remove();
                         var contentsLinker;
@@ -752,7 +752,7 @@ define(['angular', 'ol', 'map'],
                             escapeToClose: true,
                             scope: $scope,
                             preserveScope: true,
-                            templateUrl: config.hsl_path + 'materialComponents/panelContents/datasourceBrowserMetadata.html',
+                            template: require('materialComponents/panelContents/datasourceBrowserMetadata.html'),
                             controller: function DialogController($scope, $mdDialog) {
                                 $scope.closeDialog = function () {
                                     $mdDialog.hide();

components/draw/draw.js

@@ -14,7 +14,7 @@ define(['angular', 'ol', 'map', 'core', 'utils', 'geolocation'],
             */
             .directive('hs.draw.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/draw/partials/draw.html'
+                    template: require('components/draw/partials/draw.html')
                 };
             }])
 
@@ -26,7 +26,7 @@ define(['angular', 'ol', 'map', 'core', 'utils', 'geolocation'],
             */
             .directive('hs.draw.toolbarButtonDirective', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/draw/partials/toolbar_button_directive.html'
+                    template: require('components/draw/partials/toolbar_button_directive.html')
                 };
             }])
 

components/feature_crossfilter/f_crossfilter.js

@@ -34,7 +34,7 @@ define(['angular', 'ol', 'dc', 'map'],
             */
             .directive('hs.featureCrossfilter.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/feature_crossfilter/partials/f_crossfilter.html',
+                    template: require('components/feature_crossfilter/partials/f_crossfilter.html'),
                     link: function(scope, element) {
 
                     }

components/feature_filter/feature_filter.js

@@ -23,7 +23,7 @@ define(['angular', 'ol', 'angular-material', 'map', 'layermanager'],
             */
             .directive('hs.featureFilter.directive', ['config', function(config) {
                 return {
-                    templateUrl: `${config.hsl_path}components/feature_filter/partials/feature_filter${config.design || ''}.html`,
+                    template: require(`components/feature_filter/partials/feature_filter.html`),
                     link: function(scope, element) {
 
                     }
@@ -38,7 +38,7 @@ define(['angular', 'ol', 'angular-material', 'map', 'layermanager'],
             */
             .directive('hs.featureList.directive', ['config', function(config) {
                 return {
-                    templateUrl: `${config.hsl_path}components/feature_filter/partials/feature_list${config.design || ''}.html`,
+                    template: require(`components/feature_filter/partials/feature_list.html`),
                     link: function(scope, element) {
 
                     }
@@ -74,7 +74,7 @@ define(['angular', 'ol', 'angular-material', 'map', 'layermanager'],
                     // link: function(scope, element, attrs) {
                     //     scope.filter = scope.$eval(attrs.filter);
                     // },
-                    // templateUrl: config.hsl_path + 'components/feature_filter/partials/{{filter.type}}md.html',
+                    // template: require('components/feature_filter/partials/{{filter.type}}md.html'),
                 };
             }])
 

components/floating_action_button/floating_action_button.js

@@ -24,7 +24,7 @@ define(['angular', 'core'],
             */
             .directive('hs.floatingActionButton.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/floating_action_button/partials/floating_action_button.html'
+                    template: require('components/floating_action_button/partials/floating_action_button.html')
                 };
             }])
 

components/hscesium/hscesium.js

@@ -241,14 +241,14 @@ define(['angular', 'permalink', 'ol', 'hs_cesium_camera', 'hs_cesium_time', 'hs_
          */
         .directive('hs.cesium.directive', ['config', function(config) {
             return {
-                templateUrl: config.hsl_path + 'components/hscesium/partials/cesium.html',
+                template: require('components/hscesium/partials/cesium.html'),
                 link: function(scope, element) {}
             };
         }])
 
         .directive('hs.cesium.toolbarButtonDirective', ['config', function (config) {
             return {
-                templateUrl: config.hsl_path + 'components/hscesium/partials/toolbar_button_directive.html'
+                template: require('components/hscesium/partials/toolbar_button_directive.html')
             };
         }])
 

components/info/info.js

@@ -16,8 +16,7 @@ define(['angular', 'map', 'core', 'update-meta', 'permalink'],
              */
             .directive('hs.info.directive', ['config', function (config) {
                 return {
-                    templateUrl: config.hsl_path + 'components/info/partials/info.html'
-
+                    template: require('components/info/partials/info.html')
                 };
             }])
 

components/language/language.js

@@ -14,7 +14,7 @@ define(['angular'],
              */
             .directive('hs.language.directive', ['config', function (config) {
                 return {
-                    templateUrl: `${config.hsl_path}components/language/partials/language${config.design || ''}.html`,
+                    template: require(`components/language/partials/language.html`),
                 };
             }])
 

components/layermanager/hs.layermanager.layerlistDirective.js

@@ -12,15 +12,15 @@ define(['angular', 'ol', 'hs.source.SparqlJson', 'angular-socialshare', 'map', '
             init() {
                 angular.module('hs.layermanager')
                     /**
-         * @module hs.layermanager
-         * @name hs.layermanager.layerlistDirective
-         * @ngdoc directive
-         * @description Directive for displaying list of layers in default HSLayers manager template. Every directive instance contain one folder of folder stucture. For every layer displays current information notes and on click opens layer options panel. Every directive instance is automatically refresh when layermanager.updated fires.
-         * Directive has access to contollers data object.
-         */
+                     * @module hs.layermanager
+                     * @name hs.layermanager.layerlistDirective
+                     * @ngdoc directive
+                     * @description Directive for displaying list of layers in default HSLayers manager template. Every directive instance contain one folder of folder stucture. For every layer displays current information notes and on click opens layer options panel. Every directive instance is automatically refresh when layermanager.updated fires.
+                     * Directive has access to contollers data object.
+                     */
                     .directive('hs.layermanager.layerlistDirective', ['$compile', 'config', function ($compile, config) {
                         return {
-                            templateUrl: config.hsl_path + 'components/layermanager/partials/layerlist.html',
+                            template: require('components/layermanager/partials/layerlist.html'),
                             compile: function compile(element) {
                                 var contents = element.contents().remove();
                                 var contentsLinker;