hedera-web/js/hedera/gui.js

548 lines
11 KiB
JavaScript
Raw Normal View History

2016-09-26 09:28:47 +00:00
var Module = require ('./module');
2016-10-30 22:48:18 +00:00
var Css = require ('./gui.css');
2016-09-26 09:28:47 +00:00
var Tpl = require ('./gui.xml');
2016-09-26 09:28:47 +00:00
module.exports = new Class
({
2016-10-16 14:16:08 +00:00
Extends: Htk.Component,
Properties:
{
conn:
{
2016-09-24 14:32:31 +00:00
type: Db.Connection
2015-12-10 13:48:43 +00:00
,set: function (x)
{
2016-10-14 10:58:35 +00:00
this.link ({_conn: x}, {'loading-changed': this._onConnLoadChange });
2015-12-10 13:48:43 +00:00
}
,get: function ()
{
return this._conn;
}
}
}
,forms: {}
,activeForm: null
,activeCss: null
,requestedForm: null
,menuShown: false
,menuOptions: {}
,choosedOption: null
,_shown: false
,_scrollTimeout: null
,_navbarVisible: true
,initialize: function (props)
{
2016-09-26 09:28:47 +00:00
this.builderInitString (Tpl);
this.loadingCount = 0;
this.$('background').onclick = function () {};
this.$('menu-button').addEventListener ('click', function (event)
{
event.stopPropagation ();
this.showMenu ();
}.bind (this));
this.$('left-panel').addEventListener ('click', function (event)
{
event.stopPropagation ();
});
2015-12-02 17:26:58 +00:00
2015-12-10 13:48:43 +00:00
this.parent (props);
2016-10-14 10:58:35 +00:00
this.$('social-bar').conn = this._conn;
var sql = 'SELECT name FROM customer_user;'
+'SELECT default_form, image_dir, image_host FROM config;'
+'SELECT production_domain, test_domain FROM config;';
this._conn.execQuery (sql, this.onMainQueryDone.bind (this));
this.loadMenu ();
}
,show: function ()
{
if (this._shown)
return;
this._shown = true;
this.doc.body.appendChild (this.node);
2016-10-30 22:48:18 +00:00
Htk.Toast.pushTop (this.$('form-holder'));
if (Vn.isMobile ())
{
this._onScrollHandler = this._onScroll.bind (this);
window.addEventListener ('scroll', this._onScrollHandler );
}
this.hash = Vn.Hash;
this.formParam = new Vn.HashParam ({key: 'form'});
this.formParam.on ('changed', this._onFormChange, this);
2016-09-23 22:47:34 +00:00
if (!localStorage.getItem ('hederaCookies'))
{
2016-09-23 22:47:34 +00:00
localStorage.setItem ('hederaCookies', true);
Htk.Toast.showWarning (_('By using this site you accept cookies'));
}
}
,hide: function ()
{
if (!this._shown)
return;
this._shown = false;
if (Vn.isMobile ())
window.removeEventListener ('scroll', this._onScrollHandler);
2016-10-30 22:48:18 +00:00
Htk.Toast.popTop ();
this.formParam.unref ();
2015-09-16 16:11:15 +00:00
this.closeForm ();
2015-12-10 23:24:14 +00:00
this.hideMenu ();
Vn.Node.remove (this.node);
}
,logout: function ()
{
this.onLogoutClick ();
}
,onLogoutClick: function ()
{
this._conn.close (this._onConnClose.bind (this));
}
,_onConnClose: function ()
{
this.signalEmit ('logout');
}
,_onConnLoadChange: function (conn, isLoading)
{
if (isLoading)
this.loaderPush ();
else
this.loaderPop ();
}
,onMainQueryDone: function (resultSet)
{
2016-10-04 15:27:49 +00:00
// Retrieving the user name
var userName = resultSet.fetchValue ();
Vn.Node.setText (this.$('user-name'), userName);
// Retrieving configuration parameters
var res = resultSet.fetchResult ();
var columns = res.columns;
if (res.next ())
for (var i = 0; i < res.columns.length; i++)
Vn.Config[columns[i].name] = res.get (columns[i].name);
// Retrieving configuration parameters
var res = resultSet.fetchResult ();
if (res.next () && res.get ('test_domain'))
{
if (location.host != res.get ('production_domain'))
{
var linkText = 'ReturnToOldWebsite';
var linkField = 'production_domain';
}
else
{
var linkText = 'TestTheNewWebsite';
var linkField = 'test_domain';
}
Vn.Node.setText (this.$('test-link'), _(linkText));
this.$('test-link').href = '//'+ res.get (linkField);
}
else
Vn.Node.hide (this.$('test-link'));
2016-10-04 15:27:49 +00:00
// Loading the default form
2016-10-04 15:27:49 +00:00
this._onFormChange ();
}
,loadMenu: function ()
{
var sql = 'CALL form_list ()';
this._conn.execQuery (sql, this._onMenuLoad.bind (this));
}
2016-10-04 15:27:49 +00:00
,_onMenuLoad: function (resultSet)
{
// Retrieving menu sections
var res = resultSet.fetchResult ();
var sectionMap = {};
if (res)
for (var i = 0; res.next (); i++)
{
var parent = res.get ('parent');
if (!sectionMap[parent])
sectionMap[parent] = [];
sectionMap[parent].push (i);
}
2016-10-04 15:27:49 +00:00
Vn.Node.removeChilds (this.$('main-menu'));
this.createMenu (res, sectionMap, null, this.$('main-menu'));
}
2015-12-02 17:26:58 +00:00
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Menu
,createMenu: function (res, sectionMap, parent, ul)
{
var sections = sectionMap[parent];
for (var i = 0; i < sections.length; i++)
{
res.row = sections[i];
var li = this.createElement ('li');
ul.appendChild (li);
var text = this.createTextNode (_(res.get ('description')));
var a = this.createElement ('a');
if (res.get ('path'))
{
a.href = Vn.Hash.make ({'form': res.get ('path')});
this.menuOptions[res.get ('path')] = a;
}
a.appendChild (text);
li.appendChild (a);
var formId = res.get ('id');
if (sectionMap[formId])
{
var submenu = this.createElement ('ul');
submenu.className = 'submenu';
li.appendChild (submenu);
li.addEventListener ('mouseover',
2015-12-02 17:26:58 +00:00
this._onLiMouseHover.bind (this, submenu, a));
li.addEventListener ('mouseout',
2015-12-02 17:26:58 +00:00
this._onLiMouseOut.bind (this));
this.createMenu (res, sectionMap, formId, submenu);
}
}
}
2015-12-02 17:26:58 +00:00
,_onLiMouseHover: function (submenu, parent)
{
2015-09-16 16:11:15 +00:00
if (this.menuShown)
return;
this.hideSubmenu ();
this.activeSubmenu = submenu;
var rect = parent.getBoundingClientRect ();
Vn.Node.addClass (submenu, 'popup');
submenu.style.left = rect.right +'px';
submenu.style.top = rect.top +'px';
}
2015-12-02 17:26:58 +00:00
,_onLiMouseOut: function ()
{
this.timeout = setTimeout (this.hideSubmenu.bind (this), 160);
}
,hideSubmenu: function ()
{
var submenu = this.activeSubmenu;
if (submenu)
{
Vn.Node.removeClass (submenu, 'popup');
submenu.style.left = '';
submenu.style.top = '';
clearTimeout (this.timeout);
this.activeSubmenu = null;
this.timeout = 0;
}
}
2016-10-04 15:27:49 +00:00
,showMenu: function ()
{
this.showBackground ();
Vn.Node.addClass (this.$('left-panel'), 'show');
this.menuShown = true;
this.hideMenuCallback = this.hideMenu.bind (this);
this.doc.addEventListener ('click', this.hideMenuCallback);
2016-10-04 15:27:49 +00:00
}
,hideMenu: function ()
{
if (!this.menuShown)
return;
this.hideBackground ();
Vn.Node.removeClass (this.$('left-panel'), 'show');
this.menuShown = false;
this.doc.removeEventListener ('click', this.hideMenuCallback);
2016-10-04 15:27:49 +00:00
this.hideMenuCallback = null;
}
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Navigation bar
,_onScroll: function ()
{
if (this._scrollTimeout === null)
this._scrollTimeout = setTimeout (
this._scrollTimeoutFunc.bind (this), 150);
}
,_scrollTimeoutFunc: function ()
{
if (!this._shown)
return;
var navbar = this.$('top-bar');
var yOffset = Vn.Browser.getPageYOffset ();
var showNavbar = this._lastYOffset > yOffset || yOffset < navbar.offsetHeight;
if (showNavbar !== this._navbarVisible)
{
if (showNavbar)
var translateY = 0;
else
var translateY = -navbar.offsetHeight;
navbar.style.transform =
'translateZ(0) translateY('+ translateY +'px)';
}
this._navbarVisible = showNavbar;
this._lastYOffset = yOffset;
this._scrollTimeout = null;
}
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Background
,showBackground: function ()
{
Vn.Node.addClass (this.$('background'), 'show');
}
,hideBackground: function ()
{
Vn.Node.removeClass (this.$('background'), 'show');
}
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Spinner
,loaderPush: function ()
{
this.loadingCount++;
if (this.loadingCount == 1)
this.$('loader').start ();
}
,loaderPop: function ()
{
if (this.loadingCount == 0)
return;
this.loadingCount--;
if (this.loadingCount == 0)
this.$('loader').stop ();
}
2015-12-02 17:26:58 +00:00
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Forms
,_onFormChange: function ()
{
var formPath = this.formParam.value;
if (!formPath)
formPath = Vn.Config['default_form'];
this.openForm (formPath,
this._onFormLoad.bind (this));
}
,openForm: function (formPath, callback)
{
this.hideMenu ();
this.loaderPush ();
2015-09-16 16:11:15 +00:00
this.closeForm ();
this.requestedForm = formPath;
var newChoosedOption = this.menuOptions[formPath];
if (newChoosedOption)
{
Vn.Node.addClass (newChoosedOption, 'selected');
this.choosedOption = newChoosedOption;
}
this.activeCss = 'forms/'+ formPath +'/style.css';
Vn.includeCss (this.activeCss);
var formInfo = this.forms[formPath];
if (!formInfo)
{
2016-09-26 09:28:47 +00:00
formInfo = new Module ('forms', formPath);
this.forms[formPath] = formInfo;
}
formInfo.addCallback (callback);
}
,_onFormLoad: function (formInfo)
{
this.loaderPop ();
if (formInfo.error)
{
Htk.Toast.showError (_('Error loading form'));
return;
}
this.activeForm = new formInfo.klass (this, formInfo);
this.activeForm.open ();
}
,setForm: function (form)
{
Vn.Node.removeChilds (this.$('form-holder'));
if (form)
{
this.$('form-holder').appendChild (form);
setTimeout (this._onSetFormTimeout.bind (this), 0);
}
}
,_onSetFormTimeout: function ()
{
Vn.Node.addClass (this.$('form-holder'), 'show');
}
,setTitle: function (title)
{
2016-12-20 09:32:17 +00:00
Vn.Node.setChild (this.$('title'), title);
}
,setActions: function (actions)
{
2016-12-20 09:32:17 +00:00
Vn.Node.setChild (this.$('action-bar'), actions);
2015-09-16 16:11:15 +00:00
}
,closeForm: function ()
{
if (this.activeForm)
{
Vn.Node.removeClass (this.$('form-holder'), 'show');
2015-09-16 16:11:15 +00:00
this.activeForm.close ();
this.activeForm.unref ();
this.activeForm = null;
}
if (this.activeCss)
{
Vn.excludeCss (this.activeCss);
2015-09-16 16:11:15 +00:00
this.activeCss = null;
}
if (this.choosedOption)
{
Vn.Node.removeClass (this.choosedOption, 'selected');
this.choosedOption = null;
}
}
2015-12-02 17:26:58 +00:00
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Reports
,openReport: function (reportName, batch)
{
this.loaderPush ();
2016-09-26 09:28:47 +00:00
var module = new Module ('reports', reportName);
module.addCallback (this._onReportLoad.bind (this, batch));
}
,_onReportLoad: function (batch, module)
{
this.loaderPop ();
if (module.error)
{
Htk.Toast.showError (_('Error loading report'));
return;
}
var report = new module.klass (module, this);
report.open (batch);
}
2015-12-02 17:26:58 +00:00
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Supplant
2016-10-04 15:27:49 +00:00
,supplantUser: function (user, callback)
{
2016-10-04 15:27:49 +00:00
this._conn.supplantUser (user,
this._onUserSupplant.bind (this, callback));
}
2016-10-04 15:27:49 +00:00
,_onUserSupplant: function (callback, supplantOk)
{
2016-10-04 15:27:49 +00:00
if (!supplantOk)
return;
2016-10-04 15:27:49 +00:00
this.loadMenu ();
var sql = 'SELECT name FROM customer_user';
this._conn.execQuery (sql, this._onSupplantName.bind (this));
if (callback)
callback ();
}
2016-10-04 15:27:49 +00:00
,_onSupplantName: function (resultSet)
{
2016-10-04 15:27:49 +00:00
var userName = resultSet.fetchValue ();
Vn.Node.setText (this.$('supplanted'), userName);
Vn.Node.show (this.$('supplant'));
}
2016-10-04 15:27:49 +00:00
,onSupplantExitClick: function ()
{
2016-10-04 15:27:49 +00:00
Vn.Node.hide (this.$('supplant'));
this._conn.supplantEnd ();
this.loadMenu ();
this._onFormChange ();
}
2015-12-02 17:26:58 +00:00
//++++++++++++++++++++++++++++++++++++++++++++++++++++++ Destroy
,_destroy: function ()
{
2015-09-16 16:11:15 +00:00
this.hide ();
this.parent ();
}
});