refs #3971 Webpack imports

app.js

@@ -1,6 +1,7 @@
 __webpack_public_path__ = _PUBLIC_PATH;
 
 require('hedera/hedera');
+const locales = require('./import').locales;
 const packageJson = require('./package.json');
 
 window.onload = function() {
@@ -22,35 +23,11 @@ function loadLocale(cb) {
 	var req = require.context('js', true, /locale\/en.yml$/);
 	onLocaleLoad(req);
 
-	switch (lang) {
+	const fn = locales[lang];
-		case 'ca':
+	if (fn)
-			require([], function() {
+		fn(cb);
-				cb(require.context('js', true, /locale\/ca.yml$/)); 
+	else
-			});
+		cb();
-			break;
-		case 'es':
-			require([], function() {
-				cb(require.context('js', true, /locale\/es.yml$/)); 
-			});
-			break;
-		case 'fr':
-			require([], function() {	
-				cb(require.context('js', true, /locale\/fr.yml$/)); 
-			});
-			break;
-		case 'mn':
-			require([], function() {	
-				cb(require.context('js', true, /locale\/mn.yml$/)); 
-			});
-			break;
-		case 'pt':
-			require([], function() {	
-				cb(require.context('js', true, /locale\/pt.yml$/)); 
-			});
-			break;
-		default:
-			cb();
-	}
 }
 
 function onLocaleLoad(req) {

debian/changelog

@@ -1,4 +1,4 @@
-hedera-web (22.44.15) stable; urgency=low
+hedera-web (22.44.16) stable; urgency=low
 
   * Initial Release.
 

forms/account/address-list/index.js

@@ -1,37 +1,39 @@
+import './style.scss';
 
-Hedera.AddressList = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
-	,activate: function() {
+	,activate() {
 		this.$.userModel.setInfo('c', 'myClient', 'hedera');
 		this.$.addresses.setInfo('a', 'myAddress', 'hedera');
 	}
 	
-	,onAddAddressClick: function() {
+	,onAddAddressClick() {
 		this.hash.setAll({
 			form: 'account/address',
 			address: 0
 		});
 	}
 	
-	,onReturnClick: function() {
+	,onReturnClick() {
 		window.history.back();
 	}
 
-	,onSetDefaultClick: function(event, addressId) {
+	,onSetDefaultClick(event, addressId) {
 		if (event.defaultPrevented) return;
 		this.$.defaultAddress.value = addressId;
 		Htk.Toast.showMessage(_('DefaultAddressModified'));
 	}
 	
-	,onRemoveAddressClick: function(form) {
+	,onRemoveAddressClick(form) {
 		if (confirm(_('AreYouSureDeleteAddress'))) {
 			form.set('isActive', false);
 			form.refresh();
 		}
 	}
 	
-	,onEditAddressClick: function(id) {
+	,onEditAddressClick(id) {
 		this.hash.setAll({
 			form: 'account/address',
 			address: id

forms/account/address/index.js

@@ -1,19 +1,19 @@
-
+export default new Class({
-Hedera.Address = new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
-	activate: function() {
+	activate() {
 		this.$.model.setInfo('a', 'myAddress', 'hedera', ['id'], 'id');
 		this.$.model.setDefault('clientFk', 'a',
 			new Sql.Function({schema: 'account', name: 'myUser_getId'}));
 	},
 	
-	onStatusChange: function() {
+	onStatusChange() {
 		if (this.$.iter.ready && this.hash.$.address == 0)
 			this.$.iter.insertRow();
 	},
 	
-	onOperationsDone: function() {
+	onOperationsDone() {
 		Htk.Toast.showMessage(_('AddressChangedSuccessfully'));
 		window.history.back()
 	}

forms/account/conf/index.js

@@ -1,8 +1,10 @@
+import './style.scss';
 
-Hedera.Conf = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
-
+	Template: require('./ui.xml'),
-	,activate: function() {
+	
+	activate: function() {
 		this.$.userModel.setInfo('c', 'myClient', 'hedera');
 		this.$.userModel.setInfo('u', 'myUser', 'account');
 

forms/admin/access-log/access-log.js

@@ -1,5 +0,0 @@
-
-Hedera.AccessLog = new Class({
-	Extends: Hedera.Form
-});
-

forms/admin/access-log/index.js

@@ -0,0 +1,7 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});
+

forms/admin/connections/connections.js

@@ -1,35 +0,0 @@
-
-Hedera.Connections = new Class({
-	Extends: Hedera.Form
-	
-	,_timeoutId: null
-
-	,onModelStatusChange: function() {
-		if (!this.$.sessions.ready)
-			return;
-
-		if (this._timeoutId)
-			clearTimeout(this._timeoutId);
-			
-		this._timeoutId = setTimeout(
-			() => this.$.sessions.refresh(), 60000);
-	}
-	
-	,deactivate: function() {
-		clearTimeout(this._timeoutId);
-	}
-
-	,onChangeUserClick: function(userName) {
-		this.gui.supplantUser(userName,
-			this._onUserSupplant.bind(this));
-	}
-	
-	,_onUserSupplant: function() {
-		this.hash.setAll({form: 'ecomerce/orders'});
-	}
-	
-	,sessionsFunc: function() {
-		return 1;
-	}
-});
-

forms/admin/connections/index.js

@@ -21,7 +21,7 @@ export default new Class({
 		clearTimeout(this._timeoutId);
 	}
 
-	,onChangeUserClick: function(userName) {
+	,onChangeUserClick(userName) {
 		this.gui.supplantUser(userName,
 			this._onUserSupplant.bind(this));
 	}

forms/admin/items/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Items = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 	
 	activate: function() {	
 		this.$.items.setInfo('i', 'item', 'vn', ['id']);

forms/admin/links/index.js

@@ -0,0 +1,7 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});
+

forms/admin/links/links.js

@@ -1,5 +0,0 @@
-
-Hedera.Links = new Class({
-	Extends: Hedera.Form
-});
-

forms/admin/photos/index.js

@@ -1,4 +1,5 @@
-(function() {
+import './style.scss';
+
 var Status = {
 	 NONE      : 0
 	,WAITING   : 1
@@ -6,8 +7,10 @@ var Status = {
 	,UPLOADED  : 3
 };
 
-Hedera.Photos = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+
 	,filesData: []
 	,uploadCount: 0
 	,errors: false
@@ -210,4 +213,3 @@ function getFileName(path) {
 
 	return path.substr(barIndex, dotIndex);
 }
-})();

forms/admin/queries/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Queries = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 	
 	,activate: function() {
 		this.$.resultIndex.value = 0;

forms/admin/users/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Users = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
 	,rendererFunc: function(scope, form) {
 		var isEnabled = form.$.active

forms/admin/visits/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Visits = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
 	,activate: function() {
 		if (!this.hash.$.to)

forms/agencies/packages/index.js

@@ -0,0 +1,14 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
+	
+	onShowClick: function(column, agencyId) {
+		this.hash.setAll({
+			form: 'agencies/provinces',
+			agency: agencyId
+		});
+	}
+});
+

forms/agencies/packages/packages.js

@@ -1,12 +0,0 @@
-
-Hedera.Packages = new Class({
-	Extends: Hedera.Form
-	
-	,onShowClick: function(column, agencyId) {
-		this.hash.setAll({
-			form: 'agencies/provinces',
-			agency: agencyId
-		});
-	}
-});
-

forms/agencies/provinces/index.js

@@ -0,0 +1,7 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});
+

forms/agencies/provinces/provinces.js

@@ -1,5 +0,0 @@
-
-Hedera.Provinces = new Class({
-	Extends: Hedera.Form
-});
-

forms/cms/about/about.js

@@ -1,6 +0,0 @@
-
-Hedera.About = new Class
-({
-	Extends: Hedera.Form
-});
-

forms/cms/about/index.js

@@ -0,0 +1,7 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});
+

forms/cms/contact/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Contact = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
 	,activate: function() {
 		var self = this;

forms/cms/home/home.js

@@ -1,5 +0,0 @@
-
-Hedera.Home = new Class({
-	Extends: Hedera.Form
-});
-

forms/cms/home/index.js

@@ -0,0 +1,6 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});

forms/cms/location/index.js

@@ -1,8 +1,10 @@
+import './style.scss';
 
 var gmapsIsLoaded = false;
 
-Hedera.Location = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
 	,locations: null
 

forms/cms/why/index.js

@@ -0,0 +1,7 @@
+import './style.scss';
+
+export default new Class({
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
+});
+

forms/cms/why/why.js

@@ -1,6 +0,0 @@
-
-Hedera.Why = new Class
-({
-	Extends: Hedera.Form
-});
-

forms/ecomerce/basket/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Basket = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
 	open() {
 		this.close();

forms/ecomerce/catalog/index.js

@@ -1,6 +1,7 @@
 
-Hedera.Catalog = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 	
 	,_menuShown: false
 

forms/ecomerce/catalog/ui.xml

@@ -152,7 +152,7 @@
 			on-click="this.onAddItemClick($event, $iter)">
 			<htk-image
 				directory="catalog"
-				subdir="200x200"
+				subdir="500x500"
 				form="$iter"
 				column="image"
 				stamp-column="updated"

forms/ecomerce/checkout/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Checkout = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
 	activate: function() {
 		this.autoStepLocked = true;

forms/ecomerce/confirm/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Confirm = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
 	open: function() {
 		this.close();

forms/ecomerce/invoices/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Invoices = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 	
 	donwloadRenderer: function(column, invoice) {
 		var invoiceId = invoice.$.id;

forms/ecomerce/orders/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Orders = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
 	activate: function() {
 		this.tpv = new Hedera.Tpv({

forms/ecomerce/ticket/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.Ticket = new Class({
+export default new Class({
 	Extends: Hedera.Form,
+	Template: require('./ui.xml'),
 
 	onTicketChange: function(ticket) {
 		if (!ticket.value)

forms/news/new/index.js

@@ -1,8 +1,9 @@
+const tinymce = require('tinymce/tinymce.min');
+import './style.scss';
 
-Vn.include('node_modules/tinymce/tinymce.min');
+export default new Class({
-Vn.define(function() {
+	Extends: Hedera.Form,
-Hedera.New = new Class({
+	Template: require('./ui.xml')
-	Extends: Hedera.Form
 	
 	,editor: null
 
@@ -72,4 +73,3 @@ Hedera.New = new Class({
 		this.hash.setAll({form: 'news/news'});
 	}
 });
-});

forms/news/news/index.js

@@ -1,6 +1,8 @@
+import './style.scss';
 
-Hedera.News = new Class({
+export default new Class({
-	Extends: Hedera.Form
+	Extends: Hedera.Form,
+	Template: require('./ui.xml')
 
 	,activate: function() {
 		this.$.newsModel.setInfo('n', 'news', 'hedera', ['id'], 'id');

forms/reports/items-form/items-form.js

@@ -1,5 +1,5 @@
 
-Hedera.ItemsForm = new Class({
+export default new Class({
 	Extends: Hedera.Form
 	
 	,activate: function() {

forms/reports/shelves/shelves.js

@@ -1,5 +1,5 @@
 
-Hedera.Shelves = new Class({
+export default new Class({
 	Extends: Hedera.Form
 
 	,activate: function() {

import.js

@@ -0,0 +1,65 @@
+
+export const locales = {
+    'ca': cb => require([], () => cb(require.context('js', true, /locale\/ca.yml$/))),
+    'es': cb => require([], () => cb(require.context('js', true, /locale\/es.yml$/))),
+    'fr': cb => require([], () => cb(require.context('js', true, /locale\/fr.yml$/))),
+    'mn': cb => require([], () => cb(require.context('js', true, /locale\/mn.yml$/))),
+    'pt': cb => require([], () => cb(require.context('js', true, /locale\/pt.yml$/)))
+};
+
+export const formMap = {
+	'account/address':
+		() => import('account/address'),
+	'account/address-list':
+		() => import('account/address-list'),
+	'account/conf':
+		() => import('account/conf'),
+	'admin/access-log':
+		() => import('admin/access-log'),
+	'admin/connections':
+		() => import('admin/connections'),
+	'admin/items':
+		() => import('admin/items'),
+	'admin/links':
+		() => import('admin/links'),
+	'admin/photos':
+		() => import('admin/photos'),
+	'admin/queries':
+		() => import('admin/queries'),
+	'admin/users':
+		() => import('admin/users'),
+	'admin/visits':
+		() => import('admin/visits'),
+	'agencies/packages':
+		() => import('agencies/packages'),
+	'agencies/provinces':
+		() => import('agencies/provinces'),
+	'cms/about':
+		() => import('cms/about'),
+	'cms/contact':
+		() => import('cms/contact'),
+	'cms/home':
+		() => import('cms/home'),
+	'cms/location':
+		() => import('cms/location'),
+	'cms/why':
+		() => import('cms/why'),
+	'ecomerce/basket':
+		() => import('ecomerce/basket'),
+	'ecomerce/catalog':
+		() => import('ecomerce/catalog'),
+	'ecomerce/checkout':
+		() => import('ecomerce/checkout'),
+	'ecomerce/confirm':
+		() => import('ecomerce/confirm'),
+	'ecomerce/invoices':
+		() => import('ecomerce/invoices'),
+	'ecomerce/orders':
+		() => import('ecomerce/orders'),
+	'ecomerce/ticket':
+		() => import('ecomerce/ticket'),
+	'news/new':
+		() => import('news/new'),
+	'news/news':
+		() => import('news/news')
+};

js/hedera/form.js

@@ -5,11 +5,10 @@ module.exports = new Class({
 	,isOpen: false
 	,uiLoaded: false
 
-	,initialize: function(gui, formInfo) {
+	,initialize: function(gui) {
 		this.gui = gui;
 		this.conn = gui.conn;
 		this.hash = gui.hash;
-		this.formInfo = formInfo;
 	}
 	
 	,loadUi: function() {
@@ -20,7 +19,7 @@ module.exports = new Class({
 		const hash = this.hash;
 	
 		const builder = new Vn.Builder();
-		builder.compileFile(`forms/${this.formInfo.path}/ui.xml`);
+		builder.compileString(this.$constructor.Template.default);
 
 		const scope = this.builder = builder.load(null, this);
 		this.$ = scope.$;

js/hedera/gui.js

@@ -1,7 +1,7 @@
 
-var Module = require('./module');
+const Module = require('./module');
-var Tpl = require('./gui.xml').default;
+const Tpl = require('./gui.xml').default;
-
+const formMap = require('../../import').formMap;
 require('./gui.scss');
 
 module.exports = new Class({
@@ -350,17 +350,12 @@ module.exports = new Class({
 	
 	//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Forms
 	
-	,_onFormChange: function() {
+	,async _onFormChange() {
 		var formPath = this.formParam.value;
 		
 		if (!formPath)
 			formPath = Vn.Config.defaultForm;
 		
-		this.openForm(formPath,
-			this._onFormLoad.bind(this));
-	}
-
-	,openForm: function(formPath, callback) {
 		this.hideMenu();
 		this.loaderPush();
 		
@@ -374,30 +369,28 @@ module.exports = new Class({
 			this.choosedOption = newChoosedOption;
 		}
 
-		this.activeCss = 'forms/'+ formPath +'/style.css';
+		let FormKlass;
-		Vn.includeCss(this.activeCss);
-
-		var formInfo = this.forms[formPath];
-
-		if (!formInfo) {
-			formInfo = new Module('forms', formPath);
-			this.forms[formPath] = formInfo;
-		}
 		
-		formInfo.addCallback(callback);
+		try {
-	}
+			FormKlass = (await this.importForm(formPath)).default;
+		} catch (err) {
+			this.loaderPop();
+			return Htk.Toast.showError(_('Error loading form'));
+		}
 
-	,_onFormLoad: function(formInfo) {
 		this.loaderPop();
 
-		if (formInfo.error)	
-			return Htk.Toast.showError(_('Error loading form'));
 		if (!this._shown)
 			return;
 
-		this.activeForm = new formInfo.klass(this, formInfo);
+		this.activeForm = new FormKlass(this);
 		this.activeForm.open();
 	}
+
+	,async importForm(path) {
+		const fn = formMap[path];
+		return fn ? fn() : null;
+	}
 	
 	,setForm: function(form) {
 		const holder = this.$.formHolder;

js/hedera/login.js

@@ -1,6 +1,5 @@
-
+var Tpl = require('./login.xml');
 require('./login.scss');
-var Tpl = require('./login.xml').default;
 
 module.exports = new Class({
 	Extends: Vn.Component,

js/vn/mutators.js

@@ -9,6 +9,10 @@ Mutators.Extends = function() {
 	this.implement({Properties: {}});
 }
 
+Mutators.Template = function(template) {
+	this.extend({Template: template});
+};
+
 Mutators.Tag = function(tagName) {
 	vnCustomTags[tagName] = this;
 	this.extend({Tag: tagName});

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hedera-web",
-  "version": "22.44.15",
+  "version": "22.44.16",
   "description": "Verdnatura web page",
   "license": "GPL-3.0",
   "repository": {

webpack.config.js

@@ -49,6 +49,7 @@ const baseConfig = {
 		modules: [
 			__dirname +'/js',
 			__dirname,
+			__dirname +'/forms',
 			'node_modules',
 			'/usr/lib/node_modules'
 		]