-
-
-
-
${this.title}
+
+
+
@@ -42,11 +48,8 @@ export class Overlay extends Events {
}
open() {
- $('body')
- .css('padding-right', '13px')
- .css('overflow-x', 'hidden')
- .addClass('modal-open');
- this.container.append(this.elem);
+ $('body').addClass('modal-open');
+ this.container.append(this.wrapper);
this.elem.show();
this.is_open = true;
this.trigger('on_open');
@@ -54,12 +57,10 @@ export class Overlay extends Events {
close() {
if ($('.modal:visible').length === 1) {
- $('body')
- .css('padding-right', '')
- .css('overflow-x', 'auto')
- .removeClass('modal-open');
+ $('body').removeClass('modal-open');
}
- this.elem.remove();
+ ajax_destroy(this.wrapper);
+ this.wrapper.remove();
this.is_open = false;
this.trigger('on_close');
}
@@ -87,14 +88,13 @@ export class Message extends Overlay {
constructor(opts) {
opts.content = opts.message ? opts.message : opts.content;
- opts.css = opts.flavor ? opts.flavor : opts.css;
super(opts);
- this.compile_actions()
+ this.compile_actions();
}
compile_actions() {
compile_template(this, `
-
`, this.footer);
}
@@ -106,7 +106,8 @@ export class Message extends Overlay {
* ts.show_message({
* title: 'Message title',
* message: 'Message text',
- * flavor: 'info'
+ * flavor: 'info',
+ * css: 'modal-xl
* });
*
* @param {Object} opts - Message options.
@@ -121,6 +122,7 @@ export function show_message(opts) {
title: opts.title,
message: opts.message,
flavor: opts.flavor,
+ css: opts.css,
on_open: function(inst) {
$('button', inst.elem).first().focus();
}
@@ -134,11 +136,12 @@ export function show_message(opts) {
*
* @param {string} message - Info message to display in overlay content.
*/
-export function show_info(message) {
+export function show_info(message, css) {
show_message({
title: 'Info',
message: message,
- flavor: 'info'
+ flavor: 'info',
+ css: css
});
}
@@ -149,11 +152,12 @@ export function show_info(message) {
*
* @param {string} message - Warning message to display in overlay content.
*/
-export function show_warning(message) {
+export function show_warning(message, css) {
show_message({
title: 'Warning',
message: message,
- flavor: 'warning'
+ flavor: 'warning',
+ css: css
});
}
@@ -164,11 +168,12 @@ export function show_warning(message) {
*
* @param {string} message - Error message to display in overlay content.
*/
-export function show_error(message) {
+export function show_error(message, css) {
show_message({
title: 'Error',
message: message,
- flavor: 'error'
+ flavor: 'error',
+ css: css
});
}
@@ -182,9 +187,9 @@ export class Dialog extends Message {
compile_actions() {
compile_template(this, `
-
-
`, this.footer);
}
diff --git a/src/spinner.js b/src/spinner.js
index c2d7bbe..55f6909 100644
--- a/src/spinner.js
+++ b/src/spinner.js
@@ -1,8 +1,6 @@
import $ from 'jquery';
import {compile_template} from './parser.js';
-const default_spinner_image = '/resources/treibstoff/loading-spokes.svg';
-
/**
* Loading spinner.
*
@@ -34,13 +32,12 @@ export class LoadingSpinner {
constructor() {
this._count = 0;
- this.compile();
}
compile() {
compile_template(this, `
-
+
+
-
${this.content}
-
- 
+
+ Loading...
`);
}
@@ -53,6 +50,7 @@ export class LoadingSpinner {
if (this._count > 1) {
return;
}
+ this.compile();
$('body').append(this.elem);
}
@@ -66,11 +64,17 @@ export class LoadingSpinner {
this._count--;
if (force) {
this._count = 0;
- this.elem.remove();
+ if (this.elem) {
+ this.elem.remove();
+ }
+ this.elem = null;
return;
} else if (this._count <= 0) {
this._count = 0;
- this.elem.remove();
+ if (this.elem) {
+ this.elem.remove();
+ }
+ this.elem = null;
}
}
}
diff --git a/src/ssr/action.js b/src/ssr/action.js
new file mode 100644
index 0000000..983f984
--- /dev/null
+++ b/src/ssr/action.js
@@ -0,0 +1,63 @@
+import {show_error} from '../overlay.js';
+import {
+ parse_url,
+ set_default
+} from '../utils.js';
+import {AjaxOperation} from './util.js';
+
+
+/**
+ * Handle for action operation.
+ */
+export class AjaxAction extends AjaxOperation {
+
+ constructor(opts) {
+ set_default(opts, 'event', 'on_action');
+ super(opts);
+ this.spinner = opts.spinner;
+ this._handle = opts.handle;
+ this._request = opts.request;
+ }
+
+ execute(opts) {
+ opts.success = this.complete.bind(this);
+ this.request(opts);
+ }
+
+ request(opts) {
+ opts.params['ajax.action'] = opts.name;
+ opts.params['ajax.mode'] = opts.mode;
+ opts.params['ajax.selector'] = opts.selector;
+ this._request.execute({
+ url: parse_url(opts.url) + '/ajaxaction',
+ type: 'json',
+ params: opts.params,
+ success: opts.success
+ });
+ }
+
+ complete(data) {
+ if (!data) {
+ show_error('Empty Response');
+ this.spinner.hide();
+ } else {
+ this._handle.update(data);
+ this._handle.next(data.continuation);
+ }
+ }
+
+ handle(inst, opts) {
+ let target = opts.target,
+ action = opts.action;
+ for (let action_ of this.parse_definition(action)) {
+ let defs = action_.split(':');
+ this.execute({
+ name: defs[0],
+ selector: defs[1],
+ mode: defs[2],
+ url: target.url,
+ params: target.params
+ });
+ }
+ }
+}
diff --git a/src/ssr/ajax.js b/src/ssr/ajax.js
new file mode 100644
index 0000000..44228f2
--- /dev/null
+++ b/src/ssr/ajax.js
@@ -0,0 +1,499 @@
+import $ from 'jquery';
+import {
+ Overlay,
+ show_dialog,
+ show_error,
+ show_info,
+ show_message,
+ show_warning
+} from '../overlay.js';
+import {
+ deprecate,
+ parse_path,
+ parse_query,
+ parse_url,
+ uuid4
+} from '../utils.js';
+import {
+ HTTPRequest,
+ http_request
+} from '../request.js';
+import {spinner} from '../spinner.js';
+import {AjaxUtil} from './util.js';
+import {AjaxDispatcher} from './dispatcher.js';
+import {AjaxAction} from './action.js';
+import {AjaxOverlay} from './overlay.js';
+import {AjaxForm} from './form.js';
+import {AjaxPath} from './path.js';
+import {AjaxEvent} from './event.js';
+import {AjaxHandle} from './handle.js';
+import {AjaxParser} from './parser.js';
+
+/**
+ * Ajax singleton.
+ */
+export class Ajax extends AjaxUtil {
+
+ constructor(win=window) {
+ super();
+ this.win = win;
+ this.binders = {};
+ let spinner_ = this.spinner = spinner;
+ let dispatcher = this.dispatcher = new AjaxDispatcher();
+ let request = this._request = new HTTPRequest({win: win});
+ this._path = new AjaxPath({dispatcher: dispatcher, win: win});
+ this._event = new AjaxEvent({dispatcher: dispatcher});
+ let handle = new AjaxHandle(this);
+ let action_opts = {
+ dispatcher: dispatcher,
+ win: win,
+ handle: handle,
+ spinner: spinner_,
+ request: request
+ }
+ this._action = new AjaxAction(action_opts);
+ this._overlay = new AjaxOverlay(action_opts);
+ this._form = new AjaxForm({handle: handle, spinner: spinner_});
+ this._is_bound = false;
+ }
+
+ /**
+ * Register binder callback function.
+ *
+ * Integration of custom JavaScript to the binding mechanism is done via
+ * this function. The register function takes a callback function and a
+ * boolean flag whether to immediately execute the callback as arguments.
+ *
+ * The passed binder callback gets called every time when markup is changed
+ * by this object and gets passed the changed DOM part as ``context``::
+ *
+ * $(function() {
+ * ts.ajax.register(function(context) {
+ * $('.sel', context).on('click', function() {});
+ * }, true);
+ * });
+ *
+ * @param {function} func - Binder callback.
+ * @param {boolean} instant - Flag whether to execute binder callback
+ * immediately at registration time.
+ */
+ register(func, instant) {
+ let func_name = 'binder_' + uuid4();
+ while (true) {
+ if (this.binders[func_name] === undefined) {
+ break;
+ }
+ func_name = 'binder_' + uuid4();
+ }
+ this.binders[func_name] = func;
+ // Only execute instant if ajax.bind() already has been initially
+ // called via document ready event. Otherwise the binder functions
+ // would be called twice on page load. This can happen if
+ // ``ajax.register`` gets called in a document ready event handler
+ // which is registered before treibstoff's document ready handler.
+ if (instant && this._is_bound) {
+ func();
+ }
+ }
+
+ /**
+ * Bind Ajax operations.
+ *
+ * Parses given piece of DOM for Ajax operation related attributes and binds
+ * the Ajax dispatcher.
+ *
+ * Additionally calls all registered binder functions for given context.
+ *
+ * @param {$} context - jQuery wrapped piece of DOM.
+ * @returns {$} The given jQuery wrapped context.
+ */
+ bind(context) {
+ this._is_bound = true;
+ let parser = new AjaxParser({
+ dispatcher: this.dispatcher,
+ form: this._form
+ });
+ context.each(function() {
+ parser.walk(this);
+ });
+ for (let func_name in this.binders) {
+ try {
+ this.binders[func_name](context)
+ } catch (err) {
+ console.log(err);
+ }
+ }
+ return context;
+ }
+
+ /**
+ * Attach JavaScript instance to DOM element.
+ *
+ * ``destroy`` function of attached instance gets called when DOM element
+ * is removed.
+ *
+ * This is the supposed mechanism if a user needs to gracefully destruct
+ * things when DOM parts get removed.
+ *
+ * Attaching of instances is normally done inside a binder function or a
+ * subsequent operation of it.
+ *
+ * A best practice pattern look like so::
+ *
+ * class Widget {
+ *
+ * static initialize(context) {
+ * $('.sel', context).each(function() {
+ * new Widget($(this));
+ * });
+ * }
+ *
+ * constructor(elem) {
+ * ts.ajax.attach(this, elem);
+ * }
+ *
+ * destroy() {
+ * // graceful destruction goes here
+ * }
+ * }
+ *
+ * $(function() {
+ * ts.ajax.register(Widget.initialize, true);
+ * });
+ *
+ * @param {Object} instance - Arbitrary JavaScript object instance.
+ * @param {HTMLElement|$} elem - DOM element to attach instance to.
+ */
+ attach(instance, elem) {
+ if (elem instanceof $) {
+ if (elem.length != 1) {
+ throw `${instance.constructor.name}: Instance can be attached to exactly one DOM element`;
+ }
+ elem = elem[0];
+ }
+ if (elem._ajax_attached === undefined) {
+ elem._ajax_attached = [];
+ }
+ elem._ajax_attached.push(instance);
+ }
+
+ /**
+ * Execute path operation.
+ *
+ * Wites browser session history stack. Executes Ajax operations on
+ * window popstate event.
+ *
+ * Add an entry to the browser history::
+ *
+ * ts.ajax.path({
+ * path: '/some/path',
+ * target: 'http://tld.com/some/path',
+ * action: 'layout:#layout:replace',
+ * event: 'contextchanged:#layout',
+ * overlay: 'actionname',
+ * overlay_css: 'additional-overlay-css-class'
+ * });
+ *
+ * If ``replace`` option is given, browser history gets reset::
+ *
+ * ts.ajax.path({
+ * path: '/some/path',
+ * target: 'http://example.com/some/path',
+ * action: 'layout:#layout:replace',
+ * replace: true
+ * });
+ *
+ * @param {Object} opts - Path options.
+ * @param {string} opts.path - The path to write to the address bar.
+ * @param {string} opts.target - Related target URL.
+ * @param {string} opts.action - Ajax action to perform.
+ * @param {string} opts.event - Ajax event to trigger.
+ * @param {string} opts.overlay - Ajax overlay to display.
+ * @param {string} opts.overlay_css - CSS class to add to ajax overlay.
+ * @param {boolean} opts.replace - Flag whether to reset browser history.
+ */
+ path(opts) {
+ this._path.execute(opts);
+ }
+
+ /**
+ * Execute action operation.
+ *
+ * Requests ``ajaxaction`` on server and modifies DOM with response
+ * according to mode and selector::
+ *
+ * let target = ts.ajax.parse_target('http://tld.com/some/path?param=value');
+ * ts.ajax.action({
+ * name: 'content',
+ * selector: '#content',
+ * mode: 'inner',
+ * url: target.url,
+ * params: target.params
+ * });
+ *
+ * @param {Object} opts - Ajax options.
+ * @param {string} opts.name - Action name.
+ * @param {string} opts.selector - CSS selector of DOM element to modify
+ * with response payload.
+ * @param {string} opts.mode - Mode for manipulation. Either ``inner`` or
+ * ``replace``.
+ * @param {string} opts.url - URL on which ``ajaxaction`` gets requested.
+ * @param {Object} opts.params - Query parameters.
+ */
+ action(opts) {
+ this._action.execute(opts);
+ }
+
+ /**
+ * Execute event operation.
+ *
+ * Creates an event providing ``ajaxtarget`` and ``ajaxdata`` properties
+ * and trigger it on DOM elements by selector.
+ *
+ * The ``ajaxtarget`` property on the event instance is an object containing
+ * ``url`` and ``params`` properties, as returned by ``Ajax.parse_target``::
+ *
+ * let url = 'http://tls.com?param=value';
+ * ts.ajax.trigger({
+ * name: 'contextchanged',
+ * selector: '.contextsensitiv',
+ * target: ts.ajax.parse_target(url);
+ * });
+ *
+ * If given target is a URL string, it gets automatically parsed by the
+ * trigger function::
+ *
+ * ts.ajax.trigger({
+ * name: 'contextchanged',
+ * selector: '.contextsensitiv',
+ * target: 'http://tls.com?param=value'
+ * });
+ *
+ * Optionally a ``data`` option can be passed, which gets set at the
+ * ``ajaxdata`` attribute of the event::
+ *
+ * ts.ajax.trigger({
+ * name: 'contextchanged',
+ * selector: '.contextsensitiv',
+ * target: 'http://tld.com?param=value',
+ * data: {key: 'val'}
+ * });
+ *
+ * **Note** - For B/C reasons, ``trigger`` can be called with positional
+ * arguments (name, selector, target, data). This behavior is deprecated
+ * and will be removed in future versions.
+ *
+ * @param {Object} opts - Event options.
+ * @param {string} opts.name - Event name.
+ * @param {string} opts.selector - CSS selector of DOM elements on which to
+ * trigger events on.
+ * @param {string|Object} opts.target - Event target. Gets set as
+ * ``ajaxtarget`` property on event instance.
+ * @param {*} opts.data - Optional event data. Gets set as
+ * ``ajaxdata`` property on event instance.
+ */
+ trigger(opts) {
+ if (arguments.length > 1) {
+ deprecate('Calling Ajax.event with positional arguments', 'opts', '1.0');
+ opts = {
+ name: arguments[0],
+ selector: arguments[1],
+ target: arguments[2],
+ data: arguments[3]
+ }
+ }
+ this._event.execute(opts);
+ }
+
+ /**
+ * Execute overlay operation.
+ *
+ * Load action result into an overlay.
+ *
+ * Display action operation in overlay. Contents of the ``title`` option
+ * gets displayed in the overlay header::
+ *
+ * ts.ajax.overlay({
+ * action: 'actionname',
+ * url: 'https://tld.com',
+ * params: {param: 'value'},
+ * title: 'Overlay Title'
+ * });
+ *
+ * Optional to ``url`` and ``params``, ``target`` can be passed as option.
+ * If both ``target`` and ``url``/``params`` given, ``target`` takes
+ * precedence::
+ *
+ * ts.ajax.overlay({
+ * action: 'actionname',
+ * target: 'https://tld.com?param=value'
+ * });
+ *
+ * If ``css`` option is given, it gets set on overlay DOM element. This
+ * way it's possible to add custom styles for a specific overlay::
+ *
+ * ts.ajax.overlay({
+ * action: 'actionname',
+ * target: 'https://tld.com?param=value',
+ * css: 'some-class'
+ * });
+ *
+ * Overlays get a generated UID by default for later reference which gets
+ * passed as ``ajax:overlay-uid`` request parameter to the server.
+ * ``Ajax.overlay`` returns the overlay instance, from which this uid
+ * can be read::
+ *
+ * let overlay = ts.ajax.overlay({
+ * action: 'actionname',
+ * target: 'https://tld.com?param=value'
+ * });
+ * let uid = overlay.uid;
+ *
+ * Already open ajax overlays can be closed by passing the ``close`` option
+ * and the overlay ``uid``::
+ *
+ * ts.ajax.overlay({
+ * close: true,
+ * uid: uid
+ * });
+ *
+ * A callback can be provided when overlay gets closed by passing it as
+ * ``on_close`` option::
+ *
+ * ts.ajax.overlay({
+ * action: 'actionname',
+ * target: 'http://foobar.org?param=value',
+ * on_close: function(inst) {
+ * // inst is the overlay instance.
+ * }
+ * });
+ *
+ * @param {Object} opts - Overlay options.
+ * @param {string} opts.action - Ajax action name.
+ * @param {string} opts.url - URL on which ``ajaxaction`` gets requested.
+ * @param {Object} opts.params - Query parameters.
+ * @param {string|Object} opts.target - Optional action target. Takes
+ * precedence over ``url`` and ``params``.
+ * @param {string} opts.title - Title to display in overlay header.
+ * @param {string} opts.css - CSS class to add to overlay DOM element.
+ * @param {string} opts.uid - The overlay UID.
+ * @param {boolean} opts.close - Flag whether to close an open overlay.
+ * @returns {Overlay} Overlay instance.
+ */
+ overlay(opts) {
+ return this._overlay.execute(opts);
+ }
+
+ /**
+ * Render ajax form after form processing.
+ *
+ * Gets called from hidden form iframe when response returns. See server
+ * integration documentation for details.
+ *
+ * @param {Object} opts - Form options.
+ * @param {HTMLElement} opts.payload - The rendered form.
+ * @param {string} opts.selector - CSS selector of the form.
+ * @param {string} opts.mode - DOM manipulation mode.
+ * @param {Array} opts.next - Continuation operation definitions.
+ * @param {boolean} opts.error - A flag whether an error occured while
+ * processing the form. The error flag not means a validation error but
+ * an exception happened and is needed for proper application
+ * state handling.
+ */
+ form(opts) {
+ this._form.render(opts);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.parse_url`` instead.
+ */
+ parseurl(url) {
+ deprecate('ts.ajax.parseurl', 'ts.parse_url', '1.0');
+ return parse_url(url);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.parse_query`` instead.
+ */
+ parsequery(url, as_string) {
+ deprecate('ts.ajax.parsequery', 'ts.parse_query', '1.0');
+ return parse_query(url, as_string);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.parse_path`` instead.
+ */
+ parsepath(url, include_query) {
+ deprecate('ts.ajax.parsepath', 'ts.parse_path', '1.0');
+ return parse_path(url, include_query);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.ajax.parse_target`` instead.
+ */
+ parsetarget(target) {
+ deprecate('ts.ajax.parsetarget', 'ts.ajax.parse_target', '1.0');
+ return this.parse_target(target);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.show_message`` instead.
+ */
+ message(message, flavor='') {
+ deprecate('ts.ajax.message', 'ts.show_message', '1.0');
+ show_message({message: message, flavor: flavor});
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.show_info`` instead.
+ */
+ info(message) {
+ deprecate('ts.ajax.info', 'ts.show_info', '1.0');
+ show_info(message);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.show_warning`` instead.
+ */
+ warning(message) {
+ deprecate('ts.ajax.warning', 'ts.show_warning', '1.0');
+ show_warning(message);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.show_error`` instead.
+ */
+ error(message) {
+ deprecate('ts.ajax.error', 'ts.show_error', '1.0');
+ show_error(message);
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.show_dialog`` instead.
+ */
+ dialog(opts, callback) {
+ deprecate('ts.ajax.dialog', 'ts.show_dialog', '1.0');
+ show_dialog({
+ message: opts.message,
+ on_confirm: function() {
+ callback(opts);
+ }
+ });
+ }
+
+ /**
+ * This function is deprecated. Use ``ts.http_request`` instead.
+ */
+ request(opts) {
+ deprecate('ts.ajax.request', 'ts.http_request', '1.0');
+ http_request(opts);
+ }
+}
+
+let ajax = new Ajax();
+export {ajax};
+
+$.fn.tsajax = function() {
+ ajax.bind(this);
+ return this;
+}
diff --git a/src/ssr/destroy.js b/src/ssr/destroy.js
new file mode 100644
index 0000000..7b268da
--- /dev/null
+++ b/src/ssr/destroy.js
@@ -0,0 +1,80 @@
+import {Parser} from "../parser";
+import $ from 'jquery';
+
+var destroy_handles = [];
+
+/**
+ * DOM parser for destroying JavaScript instances attached to DOM elements
+ * going to be removed.
+ */
+export class AjaxDestroy extends Parser {
+
+ parse(node) {
+ let instances = node._ajax_attached;
+ if (instances !== undefined) {
+ for (let instance of instances) {
+ if (instance.destroy !== undefined) {
+ instance.destroy();
+ } else {
+ console.warn('ts.ajax bound but no destroy method defined: ' + instance.constructor.name);
+ }
+ }
+ node._ajax_attached = null; // remove class instances from memory
+ }
+
+ // Run all registered callbacks
+ for (let cb of destroy_handles) {
+ cb(node);
+ }
+ // remove event listeners, cached data and retained comments
+ $(node).off().removeData().empty();
+ }
+}
+
+/**
+ * Destroys an AJAX-bound element.
+ *
+ * @param {HTMLElement|jQuery} elem - The element to destroy. Can be a jQuery object or a DOM element.
+ * @returns {void}
+ */
+export function ajax_destroy(elem) {
+ elem = elem instanceof $ ? elem.get(0) : elem;
+ let handle = new AjaxDestroy();
+ handle.walk(elem);
+ handle = null;
+}
+
+/**
+ * Registers a callback to be executed on ajax destroy.
+ *
+ * @param {Function} callback - The callback to execute on each node.
+ * @returns {void}
+ */
+export function register_ajax_destroy_handle(callback) {
+ if (!destroy_handles.includes(callback)) {
+ destroy_handles.push(callback);
+ } else {
+ console.warn(
+ 'Warning: Ajax destroy handle already registered, skipping registration: '
+ + callback
+ );
+ }
+}
+
+/**
+ * Unregisters a previously registered callback from ajax destroy.
+ *
+ * @param {Function} callback - The callback to unregister.
+ * @returns {void}
+ */
+export function unregister_ajax_destroy_handle(callback) {
+ const index = destroy_handles.indexOf(callback);
+ if (index > -1) {
+ destroy_handles.splice(index, 1);
+ } else {
+ console.warn(
+ 'Warning: Ajax destroy handle is not registered and cannot be unregistered: '
+ + callback
+ );
+ }
+}
diff --git a/src/ssr/dispatcher.js b/src/ssr/dispatcher.js
new file mode 100644
index 0000000..7e19019
--- /dev/null
+++ b/src/ssr/dispatcher.js
@@ -0,0 +1,65 @@
+import $ from 'jquery';
+import {show_dialog} from '../overlay.js';
+import {AjaxUtil} from './util.js';
+
+/**
+ * DOM event handle for elements defining Ajax operations.
+ */
+export class AjaxDispatcher extends AjaxUtil {
+
+ bind(node, evts) {
+ $(node).off(evts).on(evts, this.dispatch_handle.bind(this));
+ }
+
+ dispatch_handle(evt) {
+ evt.preventDefault();
+ evt.stopPropagation();
+ let elem = $(evt.currentTarget),
+ opts = {
+ elem: elem,
+ event: evt
+ };
+ if (elem.attr('ajax:confirm')) {
+ show_dialog({
+ message: elem.attr('ajax:confirm'),
+ on_confirm: function(inst) {
+ this.dispatch(opts);
+ }.bind(this)
+ });
+ } else {
+ this.dispatch(opts);
+ }
+ }
+
+ dispatch(opts) {
+ let elem = opts.elem,
+ event = opts.event;
+ if (elem.attr('ajax:action')) {
+ this.trigger('on_action', {
+ target: this.action_target(elem, event),
+ action: elem.attr('ajax:action')
+ });
+ }
+ if (elem.attr('ajax:event')) {
+ this.trigger('on_event', {
+ target: elem.attr('ajax:target'),
+ event: elem.attr('ajax:event')
+ });
+ }
+ if (elem.attr('ajax:overlay')) {
+ this.trigger('on_overlay', {
+ target: this.action_target(elem, event),
+ overlay: elem.attr('ajax:overlay'),
+ css: elem.attr('ajax:overlay-css'),
+ uid: elem.attr('ajax:overlay-uid'),
+ title: elem.attr('ajax:overlay-title')
+ });
+ }
+ if (elem.attr('ajax:path')) {
+ this.trigger('on_path', {
+ elem: elem,
+ event: event
+ });
+ }
+ }
+}
diff --git a/src/ssr/event.js b/src/ssr/event.js
new file mode 100644
index 0000000..7164ec0
--- /dev/null
+++ b/src/ssr/event.js
@@ -0,0 +1,45 @@
+import $ from 'jquery';
+import {AjaxOperation} from './util.js';
+
+
+/**
+ * Handle for event operation.
+ */
+export class AjaxEvent extends AjaxOperation {
+
+ constructor(opts) {
+ opts.event = 'on_event';
+ super(opts);
+ }
+
+ execute(opts) {
+ let create_event = this.create_event.bind(this);
+ $(opts.selector).each(function() {
+ $(this).trigger(create_event(opts.name, opts.target, opts.data));
+ });
+ }
+
+ create_event(name, target, data) {
+ let evt = $.Event(name);
+ if (target.url) {
+ evt.ajaxtarget = target;
+ } else {
+ evt.ajaxtarget = this.parse_target(target);
+ }
+ evt.ajaxdata = data;
+ return evt;
+ }
+
+ handle(inst, opts) {
+ let target = opts.target,
+ event = opts.event;
+ for (let event_ of this.parse_definition(event)) {
+ let def = event_.split(':');
+ this.execute({
+ name: def[0],
+ selector: def[1],
+ target: target
+ });
+ }
+ }
+}
diff --git a/src/ssr/form.js b/src/ssr/form.js
new file mode 100644
index 0000000..13a5dc2
--- /dev/null
+++ b/src/ssr/form.js
@@ -0,0 +1,45 @@
+import $ from 'jquery';
+import {compile_template} from '../parser.js';
+
+
+/**
+ * Handle for Ajax form.
+ */
+export class AjaxForm {
+
+ constructor(opts) {
+ this.handle = opts.handle;
+ this.spinner = opts.spinner;
+ this.afr = null;
+ }
+
+ bind(form) {
+ if (!this.afr) {
+ compile_template(this, `
+
+ `, $('body'));
+ }
+ $(form)
+ .append('')
+ .attr('target', 'ajaxformresponse')
+ .off()
+ .on('submit', function(event) {
+ this.spinner.show();
+ }.bind(this));
+ }
+
+ render(opts) {
+ this.spinner.hide();
+ if (!opts.error) {
+ this.afr.remove();
+ this.afr = null;
+ }
+ if (opts.payload) {
+ this.handle.update(opts);
+ }
+ this.handle.next(opts.next);
+ }
+}
diff --git a/src/ssr/handle.js b/src/ssr/handle.js
new file mode 100644
index 0000000..a2aaefa
--- /dev/null
+++ b/src/ssr/handle.js
@@ -0,0 +1,83 @@
+import $ from 'jquery';
+import {show_message} from '../overlay.js';
+import {AjaxDestroy} from './destroy.js';
+import {AjaxUtil} from './util.js';
+
+/**
+ * Handle for DOM manipulation and Ajax continuation operations.
+ */
+export class AjaxHandle extends AjaxUtil {
+
+ constructor(ajax) {
+ super();
+ this.ajax = ajax;
+ this.spinner = ajax.spinner;
+ }
+
+ destroy(context) {
+ let parser = new AjaxDestroy();
+ context.each(function() {
+ parser.walk(this);
+ });
+ }
+
+ update(opts) {
+ let payload = opts.payload,
+ selector = opts.selector,
+ mode = opts.mode,
+ context;
+ if (mode === 'replace') {
+ let old_context = $(selector);
+ this.destroy(old_context);
+ old_context.replaceWith(payload);
+ context = $(selector);
+ if (context.length) {
+ this.ajax.bind(context.parent());
+ } else {
+ this.ajax.bind($(document));
+ }
+ } else if (mode === 'inner') {
+ context = $(selector);
+ this.destroy(context.children());
+ context.html(payload);
+ this.ajax.bind(context);
+ }
+ }
+
+ next(operations) {
+ if (!operations || !operations.length) {
+ return;
+ }
+ this.spinner.hide();
+ for (let op of operations) {
+ let type = op.type;
+ delete op.type;
+ if (type === 'path') {
+ this.ajax.path(op);
+ } else if (type === 'action') {
+ let target = this.parse_target(op.target);
+ op.url = target.url;
+ op.params = target.params;
+ this.ajax.action(op);
+ } else if (type === 'event') {
+ this.ajax.trigger(op);
+ } else if (type === 'overlay') {
+ let target = this.parse_target(op.target);
+ op.url = target.url;
+ op.params = target.params;
+ this.ajax.overlay(op);
+ } else if (type === 'message') {
+ // if flavor given, message rendered in overlay
+ if (op.flavor) {
+ show_message({
+ message: op.payload,
+ flavor: op.flavor
+ });
+ // no overlay message, set message payload at selector
+ } else {
+ $(op.selector).html(op.payload);
+ }
+ }
+ }
+ }
+}
diff --git a/src/ssr/overlay.js b/src/ssr/overlay.js
new file mode 100644
index 0000000..26ad671
--- /dev/null
+++ b/src/ssr/overlay.js
@@ -0,0 +1,90 @@
+import {
+ get_overlay,
+ Overlay,
+} from '../overlay.js';
+import {
+ uuid4
+} from '../utils.js';
+import {AjaxAction} from './action.js';
+
+
+/**
+ * Handle for overlay operation.
+ */
+export class AjaxOverlay extends AjaxAction {
+
+ constructor(opts) {
+ opts.event = 'on_overlay';
+ super(opts);
+ this.overlay_content_sel = '.modal-body';
+ }
+
+ execute(opts) {
+ let ol;
+ if (opts.close) {
+ ol = get_overlay(opts.uid);
+ if (ol) {
+ ol.close();
+ }
+ return ol;
+ }
+ let url, params;
+ if (opts.target) {
+ let target = opts.target;
+ if (!target.url) {
+ target = this.parse_target(target);
+ }
+ url = target.url;
+ params = target.params;
+ } else {
+ url = opts.url;
+ params = opts.params;
+ }
+ let uid = opts.uid ? opts.uid : uuid4();
+ params['ajax.overlay-uid'] = uid;
+ ol = new Overlay({
+ uid: uid,
+ css: opts.css,
+ title: opts.title,
+ on_close: opts.on_close
+ })
+ this.request({
+ name: opts.action,
+ selector: `#${uid} ${this.overlay_content_sel}`,
+ mode: 'inner',
+ url: url,
+ params: params,
+ success: function(data) {
+ // overlays are not displayed if no payload is received.
+ if (!data.payload) {
+ // ensure continuation gets performed anyway.
+ this.complete(data);
+ return;
+ }
+ ol.open();
+ this.complete(data);
+ }.bind(this)
+ });
+ return ol;
+ }
+
+ handle(inst, opts) {
+ let target = opts.target,
+ overlay = opts.overlay;
+ if (overlay.indexOf('CLOSE') > -1) {
+ this.execute({
+ close: true,
+ uid: overlay.indexOf(':') > -1 ? overlay.split(':')[1] : opts.uid
+ });
+ return;
+ }
+ this.execute({
+ action: overlay,
+ url: target.url,
+ params: target.params,
+ css: opts.css,
+ uid: opts.uid,
+ title: opts.title
+ });
+ }
+}
diff --git a/src/ssr/parser.js b/src/ssr/parser.js
new file mode 100644
index 0000000..606782b
--- /dev/null
+++ b/src/ssr/parser.js
@@ -0,0 +1,32 @@
+import {Parser} from '../parser.js';
+
+/**
+ * DOM Parser for binding Ajax operations.
+ */
+export class AjaxParser extends Parser {
+
+ constructor(opts) {
+ super();
+ this.dispatcher = opts.dispatcher;
+ this.form = opts.form;
+ }
+
+ parse(node) {
+ let attrs = this.node_attrs(node);
+ if (attrs['ajax:bind'] && (
+ attrs['ajax:action'] ||
+ attrs['ajax:event'] ||
+ attrs['ajax:overlay'])) {
+ let evts = attrs['ajax:bind'];
+ this.dispatcher.bind(node, evts);
+ }
+ if (attrs['ajax:form']) {
+ this.form.bind(node);
+ }
+ if (node.tagName.toLowerCase() === 'form') {
+ if (node.className.split(' ').includes('ajax')) {
+ this.form.bind(node);
+ }
+ }
+ }
+}
diff --git a/src/ssr/path.js b/src/ssr/path.js
new file mode 100644
index 0000000..60f906e
--- /dev/null
+++ b/src/ssr/path.js
@@ -0,0 +1,143 @@
+import $ from 'jquery';
+import {
+ parse_path,
+ set_default,
+} from '../utils.js';
+import {AjaxOperation} from './util.js';
+
+
+/**
+ * Handle for path operation.
+ */
+export class AjaxPath extends AjaxOperation {
+
+ constructor(opts) {
+ opts.event = 'on_path';
+ super(opts);
+ this.win = opts.win;
+ $(this.win).on('popstate', this.state_handle.bind(this));
+ }
+
+ execute(opts) {
+ let history = this.win.history;
+ if (history.pushState === undefined) {
+ return;
+ }
+ let path = opts.path.charAt(0) !== '/' ? `/${opts.path}` : opts.path;
+ set_default(opts, 'target', this.win.location.origin + path);
+ set_default(opts, 'replace', false);
+ let replace = opts.replace;
+ // delete options which should not end up in state
+ delete opts.path;
+ delete opts.replace;
+ opts._t_ajax = true;
+ if (replace) {
+ history.replaceState(opts, '', path);
+ } else {
+ history.pushState(opts, '', path);
+ }
+ }
+
+ state_handle(evt) {
+ let state = evt.originalEvent.state;
+ if (!state) {
+ return;
+ }
+ if (!state._t_ajax) {
+ return;
+ }
+ evt.preventDefault();
+ let target;
+ if (state.target.url) {
+ target = state.target;
+ } else {
+ target = this.parse_target(state.target);
+ }
+ target.params.popstate = '1';
+ if (state.action) {
+ this.dispatcher.trigger('on_action', {
+ target: target,
+ action: state.action
+ });
+ }
+ if (state.event) {
+ this.dispatcher.trigger('on_event', {
+ target: target,
+ event: state.event
+ });
+ }
+ if (state.overlay) {
+ this.dispatcher.trigger('on_overlay', {
+ target: target,
+ overlay: state.overlay,
+ css: state.overlay_css,
+ uid: state.overlay_uid,
+ title: state.overlay_title
+ });
+ }
+ if (!state.action && !state.event && !state.overlay) {
+ this.win.location = target.url;
+ }
+ }
+
+ handle(inst, opts) {
+ let elem = opts.elem,
+ evt = opts.event,
+ path = elem.attr('ajax:path');
+ if (path === 'href') {
+ let href = elem.attr('href');
+ path = parse_path(href, true);
+ } else if (path === 'target') {
+ let tgt = this.action_target(elem, evt);
+ path = tgt.path + tgt.query;
+ }
+ let target;
+ if (this.has_attr(elem, 'ajax:path-target')) {
+ let path_target = elem.attr('ajax:path-target');
+ if (path_target) {
+ target = this.parse_target(path_target);
+ }
+ } else {
+ target = this.action_target(elem, evt);
+ }
+ let p_opts = {
+ path: path,
+ target: target
+ }
+ p_opts.action = this.attr_val(elem, 'ajax:path-action', 'ajax:action');
+ p_opts.event = this.attr_val(elem, 'ajax:path-event', 'ajax:event');
+ p_opts.overlay = this.attr_val(elem, 'ajax:path-overlay', 'ajax:overlay');
+ if (p_opts.overlay) {
+ p_opts.overlay_css = this.attr_val(
+ elem,
+ 'ajax:path-overlay-css',
+ 'ajax:overlay-css'
+ );
+ p_opts.overlay_uid = this.attr_val(
+ elem,
+ 'ajax:path-overlay-uid',
+ 'ajax:overlay-uid'
+ );
+ p_opts.overlay_title = this.attr_val(
+ elem,
+ 'ajax:path-overlay-title',
+ 'ajax:overlay-title'
+ );
+ }
+ this.execute(p_opts);
+ }
+
+ has_attr(elem, name) {
+ let val = elem.attr(name);
+ // In some browsers val is undefined, in others it's false.
+ return val !== undefined && val !== false;
+ }
+
+ attr_val(elem, name, fallback) {
+ if (this.has_attr(elem, name)) {
+ return elem.attr(name);
+ } else {
+ return elem.attr(fallback);
+ }
+ }
+}
diff --git a/src/ssr/util.js b/src/ssr/util.js
new file mode 100644
index 0000000..aff0e79
--- /dev/null
+++ b/src/ssr/util.js
@@ -0,0 +1,108 @@
+import $ from 'jquery';
+import {
+ parse_path,
+ parse_query,
+ parse_url,
+} from '../utils.js';
+import {Events} from '../events.js';
+
+/**
+ * Ajax utility mixin.
+ */
+export class AjaxUtil extends Events {
+
+ /**
+ * Parse URL, query and path from URL string::
+ *
+ * >> ts.ajax.parse_target('http://tld.com/some/path?param=value');
+ * -> {
+ * url: 'http://tld.com/some/path',
+ * params: { param: 'value' },
+ * path: '/some/path',
+ * query: '?param=value'
+ * }
+ *
+ * @param {string} target - URL string to parse.
+ * @returns {Object} Containing ``url``, ``params``, ``path`` and ``query``.
+ */
+ parse_target(target) {
+ return {
+ url: target ? parse_url(target) : undefined,
+ params: target ? parse_query(target) : {},
+ path: target ? parse_path(target) : undefined,
+ query: target ? parse_query(target, true) : undefined
+ };
+ }
+
+ /**
+ * Parse ajax operation definition from string into array.
+ *
+ * XXX: Fails if spaces in selector. Fix.
+ *
+ * @param {string} val - Definition string to parse.
+ * @returns {Array} Containing operation definitions.
+ */
+ parse_definition(val) {
+ return val.replace(/\s+/g, ' ').split(' ');
+ }
+
+ /**
+ * Get ajax target for action.
+ *
+ * Lookup ``ajaxtarget`` on event, fall back to ``ajax:target`` attribute
+ * on elem.
+ *
+ * @param {$} elem - jQuery wrapped DOM element.
+ * @param {$.Event} evt - jQuery event.
+ * @returns {Object} Target for event.
+ */
+ action_target(elem, evt) {
+ if (evt.ajaxtarget) {
+ return evt.ajaxtarget;
+ }
+ return this.parse_target(elem.attr('ajax:target'));
+ }
+}
+
+/**
+ * Abstract Ajax operation.
+ */
+export class AjaxOperation extends AjaxUtil {
+
+ /**
+ * Create Ajax operation.
+ *
+ * Binds this operation to given dispatcher event.
+ *
+ * @param {Object} opts - Ajax operation options.
+ * @param {AjaxDispatcher} opts.dispatcher - Dispatcher instance.
+ * @param {string} opts.event - AjaxDispatecher event to bind.
+ */
+ constructor(opts) {
+ super();
+ this.event = opts.event;
+ this.dispatcher = opts.dispatcher;
+ this.dispatcher.on(this.event, this.handle.bind(this));
+ }
+
+ /**
+ * Execute operation as JavaScript API.
+ *
+ * @abstract
+ * @param {Object} opts - Options needed for operation execution.
+ */
+ execute(opts) {
+ throw 'Abstract AjaxOperation does not implement execute';
+ }
+
+ /**
+ * Handle operation from dispatcher.
+ *
+ * @abstract
+ * @param {AjaxDispatcher} inst - Dispatcher instance.
+ * @param {Object} opts - Options needed for operation execution.
+ */
+ handle(inst, opts) {
+ throw 'Abstract AjaxOperation does not implement handle';
+ }
+}
diff --git a/src/treibstoff.js b/src/treibstoff.js
index 20ba834..ede293e 100644
--- a/src/treibstoff.js
+++ b/src/treibstoff.js
@@ -1,4 +1,16 @@
-import * as ajax from './ajax.js';
+import * as ajax_action from './ssr/action.js';
+import * as ajax_destroy from './ssr/destroy.js';
+import * as ajax_dispatcher from './ssr/dispatcher.js';
+import * as ajax_event from './ssr/event.js';
+import * as ajax_form from './ssr/form.js';
+import * as ajax_handle from './ssr/handle.js';
+import * as ajax_overlay from './ssr/overlay.js';
+import * as ajax_parser from './ssr/parser.js';
+import * as ajax_path from './ssr/path.js';
+import * as ajax_util from './ssr/util.js';
+import * as ajax from './ssr/ajax.js';
+
+import * as bootstrap from './bootstrap.js';
import * as clock from './clock.js';
import * as events from './events.js';
import * as form from './form.js';
@@ -17,6 +29,18 @@ import * as widget from './widget.js';
let api = {};
Object.assign(api, ajax);
+Object.assign(api, ajax_action);
+Object.assign(api, ajax_destroy);
+Object.assign(api, ajax_dispatcher);
+Object.assign(api, ajax_event);
+Object.assign(api, ajax_form);
+Object.assign(api, ajax_handle);
+Object.assign(api, ajax_overlay);
+Object.assign(api, ajax_parser);
+Object.assign(api, ajax_path);
+Object.assign(api, ajax_util);
+
+Object.assign(api, bootstrap);
Object.assign(api, clock);
Object.assign(api, events);
Object.assign(api, form);
@@ -33,4 +57,5 @@ Object.assign(api, websocket);
Object.assign(api, widget);
const ts = api;
+
export default ts;
diff --git a/src/utils.js b/src/utils.js
index 3a2698f..5732649 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -216,7 +216,7 @@ export function parse_path(url, include_query) {
}
export function create_cookie(name, value, days) {
- var date,
+ let date,
expires;
if (days) {
date = new Date();
@@ -229,7 +229,7 @@ export function create_cookie(name, value, days) {
}
export function read_cookie(name) {
- var nameEQ = name + "=",
+ let nameEQ = name + "=",
ca = document.cookie.split(';'),
i,
c;
@@ -239,7 +239,7 @@ export function read_cookie(name) {
c = c.substring(1, c.length);
}
if (c.indexOf(nameEQ) === 0) {
- return unescape(c.substring(nameEQ.length, c.length));
+ return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
}
return null;
@@ -249,7 +249,20 @@ export const svg_ns = 'http://www.w3.org/2000/svg';
export function set_svg_attrs(el, opts) {
for (let n in opts) {
- el.setAttributeNS(null, n, opts[n]);
+ if (n === 'width' || n === 'height') {
+ const val = parseFloat(opts[n]);
+ if (val >= 0) {
+ el.setAttributeNS(null, n, opts[n]);
+ } else {
+ console.error(
+ `Invalid value for ${n}:`,
+ opts[n],
+ el
+ );
+ }
+ } else {
+ el.setAttributeNS(null, n, opts[n]);
+ }
}
}
@@ -263,7 +276,7 @@ export function create_svg_elem(name, opts, container) {
}
export function parse_svg(tmpl, container) {
- var wrapper = create_svg_elem('svg', {});
+ let wrapper = create_svg_elem('svg', {});
wrapper.innerHTML = tmpl.trim();
let elems = [];
let children = wrapper.childNodes;
diff --git a/src/widget.js b/src/widget.js
index 3a8a672..1e8d43e 100644
--- a/src/widget.js
+++ b/src/widget.js
@@ -226,7 +226,7 @@ export class Collapsible {
* @type {boolean}
*/
get collapsed() {
- return !this.elem.hasClass('in');
+ return !this.elem.hasClass('show');
}
set collapsed(value) {
@@ -249,12 +249,14 @@ export class Button extends ClickListener {
* Create button instance.
*
* @param {Object} opts - Button options.
- * @param {$} opts.elem - jQuery wrapped button element.
+ * @param {$} opts.elem - jQuery wrapped button element.+
+ * @param {$} opts.unselected_class - css class for unselected button.
+ * @param {$} opts.selected_class - css class for selected button.
*/
constructor(opts) {
super(opts);
- this.unselected_class = 'btn-default';
- this.selected_class = 'btn-success';
+ this.unselected_class = opts.unselected_class ?? 'btn-primary';
+ this.selected_class = opts.selected_class ?? 'btn-success';
}
/**
diff --git a/tests/test_ajax.js b/tests/test_ajax.js
index 4a50870..c436513 100644
--- a/tests/test_ajax.js
+++ b/tests/test_ajax.js
@@ -1,18 +1,15 @@
import $ from 'jquery';
-import {
- Ajax,
- AjaxAction,
- AjaxDestroy,
- AjaxDispatcher,
- AjaxEvent,
- AjaxForm,
- AjaxHandle,
- AjaxOperation,
- AjaxOverlay,
- AjaxParser,
- AjaxPath,
- AjaxUtil
-} from '../src/ajax.js';
+import {Ajax} from '../src/ssr/ajax.js';
+import {AjaxAction} from '../src/ssr/action.js';
+import {AjaxDispatcher} from '../src/ssr/dispatcher.js';
+import {AjaxEvent} from '../src/ssr/event.js';
+import {AjaxForm} from '../src/ssr/form.js';
+import {AjaxHandle} from '../src/ssr/handle.js';
+import {AjaxOperation} from '../src/ssr/util.js';
+import {AjaxOverlay} from '../src/ssr/overlay.js';
+import {AjaxParser} from '../src/ssr/parser.js';
+import {AjaxPath} from '../src/ssr/path.js';
+import {AjaxUtil} from '../src/ssr/util.js';
import {HTTPRequest} from '../src/request.js';
import {spinner} from '../src/spinner.js';
import {uuid4} from '../src/utils.js';
@@ -1220,7 +1217,7 @@ QUnit.module('treibstoff.ajax', hooks => {
dispatcher.bind(elem.get(0), 'click');
elem.trigger('click');
- let dialog = $('body > .modal.dialog').data('overlay');
+ let dialog = $('body > .modal-wrapper > .modal.dialog').data('overlay');
assert.deepEqual(dialog.content, 'Really?');
assert.ok(dialog.is_open);
@@ -1229,7 +1226,7 @@ QUnit.module('treibstoff.ajax', hooks => {
assert.deepEqual(dispatch_opts, null);
elem.trigger('click');
- dialog = $('body > .modal.dialog').data('overlay');
+ dialog = $('body > .modal-wrapper > .modal.dialog').data('overlay');
assert.ok(dialog.is_open);
$('button.ok', dialog.elem).trigger('click');
@@ -1337,30 +1334,6 @@ QUnit.module('treibstoff.ajax', hooks => {
assert.deepEqual(path_opts.event.type, 'click');
});
- ///////////////////////////////////////////////////////////////////////////
- // Test AjaxDestroy
- ///////////////////////////////////////////////////////////////////////////
-
- QUnit.test('Test AjaxDestroy', assert => {
- class Inst {
- constructor() {
- this.destroyed = false;
- }
- destroy() {
- this.destroyed = true;
- }
- }
-
- let inst = new Inst();
- let elem = $('').appendTo(container);
- elem[0]._ajax_attached = [inst];
-
- assert.deepEqual(inst.destroyed, false);
- let parser = new AjaxDestroy();
- parser.walk(container[0]);
- assert.deepEqual(inst.destroyed, true);
- });
-
///////////////////////////////////////////////////////////////////////////
// Test AjaxHandle
///////////////////////////////////////////////////////////////////////////
@@ -1561,7 +1534,7 @@ QUnit.module('treibstoff.ajax', hooks => {
flavor: 'info',
selector: null,
}]);
- let ol = $('body > .modal.info').data('overlay');
+ let ol = $('body > .modal-wrapper > .modal.info').data('overlay');
assert.ok(ol.is_open);
assert.deepEqual(ol.content, 'Message Content');
ol.close();
diff --git a/tests/test_ajaxdestroy.js b/tests/test_ajaxdestroy.js
new file mode 100644
index 0000000..080d479
--- /dev/null
+++ b/tests/test_ajaxdestroy.js
@@ -0,0 +1,162 @@
+import $ from 'jquery';
+import {AjaxDestroy} from '../src/ssr/destroy.js';
+import {ajax_destroy} from '../src/ssr/destroy.js';
+import {register_ajax_destroy_handle} from '../src/ssr/destroy.js';
+import {unregister_ajax_destroy_handle} from '../src/ssr/destroy.js';
+import {spinner} from '../src/spinner.js';
+import {ajax, AjaxDispatcher} from '../src/bundle.js';
+
+QUnit.module('treibstoff.ajaxdestroy', hooks => {
+ let container;
+ let ajax_orgin = $.ajax;
+
+ hooks.beforeEach(() => {
+ container = $('');
+ $('body').append(container);
+ });
+
+ hooks.afterEach(() => {
+ container.remove();
+ // Ajax binds popstate
+ $(window).off('popstate');
+ // Reset $.ajax patch if any
+ $.ajax = ajax_orgin;
+ // Force hide spinner
+ spinner.hide(true);
+ });
+
+ QUnit.test('Test AjaxDestroy', assert => {
+ class Inst {
+ constructor() {
+ this.destroyed = false;
+ }
+ destroy() {
+ this.destroyed = true;
+ }
+ }
+
+ let inst = new Inst();
+ let elem = $('').appendTo(container);
+ elem[0]._ajax_attached = [inst];
+
+ assert.deepEqual(inst.destroyed, false);
+ let parser = new AjaxDestroy();
+ assert.strictEqual(window.bootstrap, undefined);
+ parser.walk(container[0]);
+ assert.deepEqual(inst.destroyed, true);
+ });
+
+ QUnit.test.skip('Test AjaxDestroy bootstrap callback', assert => {
+ // XXX: window.bootstrap must be defined initally.
+ class Inst {
+ constructor() {
+ this.destroyed = false;
+ }
+ destroy() {
+ this.destroyed = true;
+ }
+ }
+
+ // bootstrap callback - patch window.bootstrap
+ window.bootstrap = {
+ Dropdown: {
+ getInstance: function() {assert.step('get Dropdown instance')}
+ },
+ Tooltip: {
+ getInstance: function() {assert.step('get Tooltip instance')}
+ }
+ }
+ let inst = new Inst();
+ let elem = $('').appendTo(container);
+ elem[0]._ajax_attached = [inst];
+
+ assert.deepEqual(inst.destroyed, false);
+ let parser = new AjaxDestroy();
+ parser.walk(elem[0]);
+ assert.deepEqual(inst.destroyed, true);
+
+ assert.verifySteps(['get Dropdown instance', 'get Tooltip instance']);
+ window.bootstrap = undefined;
+ });
+
+ QUnit.test('Test AjaxDestroy custom callbacks', assert => {
+ class Inst {
+ constructor() {
+ // ...
+ }
+ destroy() {
+ assert.step('destroy');
+ }
+ }
+ let inst = new Inst();
+ let elem = $('').appendTo(container);
+ elem[0]._ajax_attached = [inst];
+
+ // custom callback 1
+ function custom_callback1(node) {
+ assert.step('custom1');
+ }
+ // custom callback 2
+ function custom_callback2(node) {
+ assert.step('custom2');
+ }
+
+ // vanilla destroy
+ let parser = new AjaxDestroy();
+ parser.walk(elem[0]);
+ assert.verifySteps(['destroy']);
+
+ // register callbacks
+ elem[0]._ajax_attached = [inst]; // reattach instance
+ register_ajax_destroy_handle(custom_callback1);
+ register_ajax_destroy_handle(custom_callback2);
+ parser.walk(elem[0]);
+ assert.verifySteps(['destroy', 'custom1', 'custom2']);
+ // unregister callbacks
+ elem[0]._ajax_attached = [inst]; // reattach instance
+ unregister_ajax_destroy_handle(custom_callback1);
+ unregister_ajax_destroy_handle(custom_callback2);
+ parser.walk(elem[0]);
+ assert.verifySteps(['destroy']);
+ });
+
+ QUnit.test('Test AjaxDestroy utility', assert => {
+ class Inst {
+ constructor() {
+ // ...
+ }
+ destroy() {
+ assert.step('destroy');
+ }
+ }
+ let inst = new Inst();
+ let elem = $('').appendTo(container);
+ elem[0]._ajax_attached = [inst];
+
+ // custom callback 1
+ function custom_callback1(node) {
+ assert.step('custom1');
+ }
+ // custom callback 2
+ function custom_callback2(node) {
+ assert.step('custom2');
+ }
+
+ // vanilla destroy
+ ajax_destroy(elem);
+ assert.verifySteps(['destroy']);
+
+ // register callbacks
+ elem[0]._ajax_attached = [inst]; // reattach instance
+ register_ajax_destroy_handle(custom_callback1);
+ register_ajax_destroy_handle(custom_callback2);
+ ajax_destroy(elem);
+ assert.verifySteps(['destroy', 'custom1', 'custom2']);
+ // unregister callbacks
+ elem[0]._ajax_attached = [inst]; // reattach instance
+ unregister_ajax_destroy_handle(custom_callback1);
+ unregister_ajax_destroy_handle(custom_callback2);
+ ajax_destroy(elem);
+ assert.verifySteps(['destroy']);
+ });
+});
diff --git a/tests/test_overlay.js b/tests/test_overlay.js
index 867f726..3763a63 100644
--- a/tests/test_overlay.js
+++ b/tests/test_overlay.js
@@ -52,16 +52,12 @@ QUnit.module('treibstoff.overlay', hooks => {
let body = $('body');
assert.true(body.hasClass('modal-open'));
- assert.deepEqual(body.css('padding-right'), '13px');
- assert.deepEqual(body.css('overflow-x'), 'hidden');
ol.close();
assert.deepEqual(container.children().length, 0);
assert.false(ol.elem.is(':visible'));
assert.false(body.hasClass('modal-open'));
- assert.deepEqual(body.css('padding-right'), '0px');
- assert.deepEqual(body.css('overflow-x'), 'auto');
});
QUnit.test('Test Overlay events', assert => {
diff --git a/tests/test_treibstoff.js b/tests/test_treibstoff.js
index 2bb5406..56faf9a 100644
--- a/tests/test_treibstoff.js
+++ b/tests/test_treibstoff.js
@@ -9,18 +9,21 @@ QUnit.module('Test treibstoff', hooks => {
}
assert.deepEqual(members, [
'Ajax',
+ 'ajax',
'AjaxAction',
'AjaxDestroy',
+ 'ajax_destroy',
+ 'register_ajax_destroy_handle',
+ 'unregister_ajax_destroy_handle',
'AjaxDispatcher',
'AjaxEvent',
'AjaxForm',
'AjaxHandle',
- 'AjaxOperation',
'AjaxOverlay',
'AjaxParser',
'AjaxPath',
+ 'AjaxOperation',
'AjaxUtil',
- 'ajax',
'Clock',
'ClockFrameEvent',
'ClockIntervalEvent',
diff --git a/tests/test_widget.js b/tests/test_widget.js
index 56d5fe5..6ff1916 100644
--- a/tests/test_widget.js
+++ b/tests/test_widget.js
@@ -189,7 +189,7 @@ QUnit.module('treibstoff.widget', hooks => {
assert.step('External on_click');
});
- assert.deepEqual(button.unselected_class, 'btn-default');
+ assert.deepEqual(button.unselected_class, 'btn-primary');
assert.deepEqual(button.selected_class, 'btn-success');
button.selected = true;
diff --git a/treibstoff/bundle/loading-spokes.svg b/treibstoff/bundle/loading-spokes.svg
deleted file mode 100644
index cdb14dd..0000000
--- a/treibstoff/bundle/loading-spokes.svg
+++ /dev/null
@@ -1,26 +0,0 @@
-
diff --git a/treibstoff/bundle/treibstoff.bundle.js b/treibstoff/bundle/treibstoff.bundle.js
index 12af67f..a811ac9 100644
--- a/treibstoff/bundle/treibstoff.bundle.js
+++ b/treibstoff/bundle/treibstoff.bundle.js
@@ -104,7 +104,7 @@ var ts = (function (exports, $) {
return path;
}
function create_cookie(name, value, days) {
- var date,
+ let date,
expires;
if (days) {
date = new Date();
@@ -116,7 +116,7 @@ var ts = (function (exports, $) {
document.cookie = name + "=" + escape(value) + expires + "; path=/;";
}
function read_cookie(name) {
- var nameEQ = name + "=",
+ let nameEQ = name + "=",
ca = document.cookie.split(';'),
i,
c;
@@ -126,7 +126,7 @@ var ts = (function (exports, $) {
c = c.substring(1, c.length);
}
if (c.indexOf(nameEQ) === 0) {
- return unescape(c.substring(nameEQ.length, c.length));
+ return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
}
return null;
@@ -134,7 +134,20 @@ var ts = (function (exports, $) {
const svg_ns = 'http://www.w3.org/2000/svg';
function set_svg_attrs(el, opts) {
for (let n in opts) {
- el.setAttributeNS(null, n, opts[n]);
+ if (n === 'width' || n === 'height') {
+ const val = parseFloat(opts[n]);
+ if (val >= 0) {
+ el.setAttributeNS(null, n, opts[n]);
+ } else {
+ console.error(
+ `Invalid value for ${n}:`,
+ opts[n],
+ el
+ );
+ }
+ } else {
+ el.setAttributeNS(null, n, opts[n]);
+ }
}
}
function create_svg_elem(name, opts, container) {
@@ -146,7 +159,7 @@ var ts = (function (exports, $) {
return el;
}
function parse_svg(tmpl, container) {
- var wrapper = create_svg_elem('svg', {});
+ let wrapper = create_svg_elem('svg', {});
wrapper.innerHTML = tmpl.trim();
let elems = [];
let children = wrapper.childNodes;
@@ -507,7 +520,7 @@ var ts = (function (exports, $) {
}
let idx = subscribers.indexOf(subscriber);
if (idx > -1) {
- subscribers = subscribers.splice(idx, 1);
+ subscribers.splice(idx, 1);
}
this._subscribers[event] = subscribers;
return this;
@@ -554,10 +567,59 @@ var ts = (function (exports, $) {
}
}
+ var destroy_handles = [];
+ class AjaxDestroy extends Parser {
+ parse(node) {
+ let instances = node._ajax_attached;
+ if (instances !== undefined) {
+ for (let instance of instances) {
+ if (instance.destroy !== undefined) {
+ instance.destroy();
+ } else {
+ console.warn('ts.ajax bound but no destroy method defined: ' + instance.constructor.name);
+ }
+ }
+ node._ajax_attached = null;
+ }
+ for (let cb of destroy_handles) {
+ cb(node);
+ }
+ $(node).off().removeData().empty();
+ }
+ }
+ function ajax_destroy(elem) {
+ elem = elem instanceof $ ? elem.get(0) : elem;
+ let handle = new AjaxDestroy();
+ handle.walk(elem);
+ handle = null;
+ }
+ function register_ajax_destroy_handle(callback) {
+ if (!destroy_handles.includes(callback)) {
+ destroy_handles.push(callback);
+ } else {
+ console.warn(
+ 'Warning: Ajax destroy handle already registered, skipping registration: '
+ + callback
+ );
+ }
+ }
+ function unregister_ajax_destroy_handle(callback) {
+ const index = destroy_handles.indexOf(callback);
+ if (index > -1) {
+ destroy_handles.splice(index, 1);
+ } else {
+ console.warn(
+ 'Warning: Ajax destroy handle is not registered and cannot be unregistered: '
+ + callback
+ );
+ }
+ }
+
class Overlay extends Events {
constructor(opts) {
super();
this.uid = opts.uid ? opts.uid : uuid4();
+ this.flavor = opts.flavor ? opts.flavor : '';
this.css = opts.css ? opts.css : '';
this.title = opts.title ? opts.title : ' ';
this.content = opts.content ? opts.content : '';
@@ -568,42 +630,41 @@ var ts = (function (exports, $) {
this.is_open = false;
}
compile() {
+ let z_index = 1055;
+ z_index += $('.modal:visible').length;
compile_template(this, `
-
-
-
- -1?S.splice(e,1):console.warn("Warning: Ajax destroy handle is not registered and cannot be unregistered: "+t)},t.uuid4=a,Object.defineProperty(t,"__esModule",{value:!0}),window.treibstoff=t,window.bdajax=t.ajax,e.fn.bdajax=e.fn.tsajax,t}({},jQuery);
diff --git a/treibstoff/bundle/treibstoff.css b/treibstoff/bundle/treibstoff.css
index e49eb7e..72131a2 100644
--- a/treibstoff/bundle/treibstoff.css
+++ b/treibstoff/bundle/treibstoff.css
@@ -7,15 +7,8 @@
margin-top:-32px;
margin-left:-32px;
}
-.modal-footer button.close {
- background-image:linear-gradient(to bottom, #fff 0%, #e0e0e0 100%);
- background-repeat:repeat-x;
- border:#ccc 1px solid;
- padding:6px 12px;
- font-size:14px;
- font-weight:normal;
- line-height:1.42857;
- opacity:1;
+.modal-footer:empty {
+ display: none;
}
.modal.info .modal-body,
.modal.warning .modal-body,
@@ -28,27 +21,25 @@
.modal.warning .modal-body:before,
.modal.error .modal-body:before,
.modal.dialog .modal-body:before {
- top:2px;
- position:relative;
- display:inline-block;
- font-family:'Glyphicons Halflings';
- font-style:normal;
- font-weight:400;
- width:60px;
- height:60px;
- font-size:46px;
- line-height:46px;
- float:left;
+ font-family: 'bootstrap-icons'!important;
+ font-size: 40px;
+ line-height: 40px;
+ float: left;
+ margin-right: 1rem;
}
.modal.info .modal-body:before {
- content:"";
+ content:"\F430";
+ color: var(--bs-cyan);
}
.modal.warning .modal-body:before {
- content:"";
+ content:"\F46C";
+ color: var(--bs-orange);
}
.modal.error .modal-body:before {
- content:"";
+ content:"\F33A";
+ color: var(--bs-red);
}
.modal.dialog .modal-body:before {
- content:"\e085";
+ content:"\F505";
+ color: var(--bs-secondary);
}
-
- 1)throw`Element by selector ${t} not unique.`;return n.length?n:null}function n(t,e,s=!0){let n=i(t,e,s);if(null===n)throw`Element by selector ${t} not found.`;return n}function r(t,e){e?t.removeClass("hidden"):t.addClass("hidden")}function a(){return([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g,t=>(t^crypto.getRandomValues(new Uint8Array(1))[0]&15>>t/4).toString(16))}function o(t,e,s){return void 0===t[e]&&(t[e]=s),t[e]}function l(t,e){return t.charAt(t.length-1)===e&&(t=t.substring(0,t.length-1)),t}function h(t){let e=document.createElement("a");e.href=t;let s=e.pathname;return l(t=e.protocol+"//"+e.host+s,"/")}function c(t,e){let s=document.createElement("a");s.href=t;let i=s.search;if(e)return i||"";let n={};if(i){let t=i.substring(1,i.length).split("&");for(let e=0;e=0?t.setAttributeNS(null,s,e[s]):console.error(`Invalid value for ${s}:`,e[s],t)}else t.setAttributeNS(null,s,e[s])}function p(t,e,s){let i=document.createElementNS(u,t);return _(i,e),void 0!==s&&s.appendChild(i),i}function m(t,e){let s=p("svg",{});s.innerHTML=t.trim();let i=[],n=s.childNodes;for(let t=0;t${e[1]}`);this.handle_input(t,e)}handle_button(t,e){let s=e["t-prop"];if(!s)return;let i=this.widget;new w(i,s,{ctx:t,ctxa:e["t-elem"],val:e["t-val"]});for(let t of["down","up","click"])if(e[`t-bind-${t}`]){let n=i[e[`t-bind-${t}`]].bind(i);this.widget.on(`on_${s}_${t}`,n)}}}function C(t,s,i){let n=e(s.trim());i&&i.append(n);let r=new k(t);return n.each(function(){r.walk(this)}),n}class $ extends y{}class A{constructor(){this._subscribers={},this._suppress_events=!1}on(t,e){let s=this._subscribers[t];return void 0===s&&(this._subscribers[t]=s=new Array),this._contains_subscriber(t,e)||s.push(e),this}off(t,e){let s=this._subscribers[t];if(void 0===s)return this;if(!e)return delete this._subscribers[t],this;let i=s.indexOf(e);return i>-1&&s.splice(i,1),this._subscribers[t]=s,this}trigger(t,...e){if(this._suppress_events)return;this[t]&&this[t](...e);let s=this._subscribers[t];if(!s)return this;for(let t=0;t\n \n
\n `)}open(){e("body").addClass("modal-open"),this.container.append(this.wrapper),this.elem.show(),this.is_open=!0,this.trigger("on_open")}close(){1===e(".modal:visible").length&&e("body").removeClass("modal-open"),T(this.wrapper),this.wrapper.remove(),this.is_open=!1,this.trigger("on_close")}}function N(t){let s=e(`#${t}`);if(!s.length)return null;let i=s.data("overlay");return i||null}class P extends q{constructor(t){t.content=t.message?t.message:t.content,super(t),this.compile_actions()}compile_actions(){C(this,'\n \n ',this.footer)}}function I(t){new P({title:t.title,message:t.message,flavor:t.flavor,css:t.css,on_open:function(t){e("button",t.elem).first().focus()}}).open()}function L(t,e){I({title:"Info",message:t,flavor:"info",css:e})}function D(t,e){I({title:"Warning",message:t,flavor:"warning",css:e})}function F(t,e){I({title:"Error",message:t,flavor:"error",css:e})}class M extends P{constructor(t){o(t,"css","dialog"),super(t),this.bind_from_options(["on_confirm"],t)}compile_actions(){C(this,'\n \n \n ',this.footer)}on_ok_btn_click(){this.close(),this.trigger("on_confirm")}}function W(t){new M({title:t.title,message:t.message,on_confirm:t.on_confirm}).open()}class G{constructor(){this._count=0}compile(){C(this,'\n ${this.title}
+
+
+
`);
}
open() {
- $('body')
- .css('padding-right', '13px')
- .css('overflow-x', 'hidden')
- .addClass('modal-open');
- this.container.append(this.elem);
+ $('body').addClass('modal-open');
+ this.container.append(this.wrapper);
this.elem.show();
this.is_open = true;
this.trigger('on_open');
}
close() {
if ($('.modal:visible').length === 1) {
- $('body')
- .css('padding-right', '')
- .css('overflow-x', 'auto')
- .removeClass('modal-open');
+ $('body').removeClass('modal-open');
}
- this.elem.remove();
+ ajax_destroy(this.wrapper);
+ this.wrapper.remove();
this.is_open = false;
this.trigger('on_close');
}
@@ -622,13 +683,12 @@ var ts = (function (exports, $) {
class Message extends Overlay {
constructor(opts) {
opts.content = opts.message ? opts.message : opts.content;
- opts.css = opts.flavor ? opts.flavor : opts.css;
super(opts);
this.compile_actions();
}
compile_actions() {
compile_template(this, `
-
`, this.footer);
}
@@ -638,30 +698,34 @@ var ts = (function (exports, $) {
title: opts.title,
message: opts.message,
flavor: opts.flavor,
+ css: opts.css,
on_open: function(inst) {
$('button', inst.elem).first().focus();
}
}).open();
}
- function show_info(message) {
+ function show_info(message, css) {
show_message({
title: 'Info',
message: message,
- flavor: 'info'
+ flavor: 'info',
+ css: css
});
}
- function show_warning(message) {
+ function show_warning(message, css) {
show_message({
title: 'Warning',
message: message,
- flavor: 'warning'
+ flavor: 'warning',
+ css: css
});
}
- function show_error(message) {
+ function show_error(message, css) {
show_message({
title: 'Error',
message: message,
- flavor: 'error'
+ flavor: 'error',
+ css: css
});
}
class Dialog extends Message {
@@ -672,9 +736,9 @@ var ts = (function (exports, $) {
}
compile_actions() {
compile_template(this, `
-
-
`, this.footer);
}
@@ -691,16 +755,14 @@ var ts = (function (exports, $) {
}).open();
}
- const default_spinner_image = '/resources/treibstoff/loading-spokes.svg';
class LoadingSpinner {
constructor() {
this._count = 0;
- this.compile();
}
compile() {
compile_template(this, `
-
+
+
-
${this.content}
-
-
+ ${e[1]}`);this.handle_input(t,e)}handle_button(t,e){let s=e["t-prop"];if(!s)return;let i=this.widget;new w(i,s,{ctx:t,ctxa:e["t-elem"],val:e["t-val"]});for(let t of["down","up","click"])if(e[`t-bind-${t}`]){let n=i[e[`t-bind-${t}`]].bind(i);this.widget.on(`on_${s}_${t}`,n)}}}function C(t,s,i){let n=e(s.trim());i&&i.append(n);let r=new k(t);return n.each((function(){r.walk(this)})),n}class $ extends y{}class A{constructor(){this._subscribers={},this._suppress_events=!1}on(t,e){let s=this._subscribers[t];return void 0===s&&(this._subscribers[t]=s=new Array),this._contains_subscriber(t,e)||s.push(e),this}off(t,e){let s=this._subscribers[t];if(void 0===s)return this;if(!e)return delete this._subscribers[t],this;let i=s.indexOf(e);return i>-1&&(s=s.splice(i,1)),this._subscribers[t]=s,this}trigger(t,...e){if(this._suppress_events)return;this[t]&&this[t](...e);let s=this._subscribers[t];if(!s)return this;for(let t=0;t\n
\n `)}open(){e("body").css("padding-right","13px").css("overflow-x","hidden").addClass("modal-open"),this.container.append(this.elem),this.elem.show(),this.is_open=!0,this.trigger("on_open")}close(){1===e(".modal:visible").length&&e("body").css("padding-right","").css("overflow-x","auto").removeClass("modal-open"),this.elem.remove(),this.is_open=!1,this.trigger("on_close")}}function S(t){let s=e(`#${t}`);if(!s.length)return null;let i=s.data("overlay");return i||null}class T extends E{constructor(t){t.content=t.message?t.message:t.content,t.css=t.flavor?t.flavor:t.css,super(t),this.compile_actions()}compile_actions(){C(this,'\n \n ',this.footer)}}function O(t){new T({title:t.title,message:t.message,flavor:t.flavor,on_open:function(t){e("button",t.elem).first().focus()}}).open()}function q(t){O({title:"Info",message:t,flavor:"info"})}function N(t){O({title:"Warning",message:t,flavor:"warning"})}function P(t){O({title:"Error",message:t,flavor:"error"})}class L extends T{constructor(t){o(t,"css","dialog"),super(t),this.bind_from_options(["on_confirm"],t)}compile_actions(){C(this,'\n \n \n ',this.footer)}on_ok_btn_click(){this.close(),this.trigger("on_confirm")}}function D(t){new L({title:t.title,message:t.message,on_confirm:t.on_confirm}).open()}class M{constructor(){this._count=0,this.compile()}compile(){C(this,'\n
+ Loading...
`);
}
@@ -709,17 +771,24 @@ var ts = (function (exports, $) {
if (this._count > 1) {
return;
}
+ this.compile();
$('body').append(this.elem);
}
hide(force) {
this._count--;
if (force) {
this._count = 0;
- this.elem.remove();
+ if (this.elem) {
+ this.elem.remove();
+ }
+ this.elem = null;
return;
} else if (this._count <= 0) {
this._count = 0;
- this.elem.remove();
+ if (this.elem) {
+ this.elem.remove();
+ }
+ this.elem = null;
}
}
}
@@ -829,130 +898,63 @@ var ts = (function (exports, $) {
throw 'Abstract AjaxOperation does not implement handle';
}
}
- class AjaxPath extends AjaxOperation {
- constructor(opts) {
- opts.event = 'on_path';
- super(opts);
- this.win = opts.win;
- $(this.win).on('popstate', this.state_handle.bind(this));
- }
- execute(opts) {
- let history = this.win.history;
- if (history.pushState === undefined) {
- return;
- }
- let path = opts.path.charAt(0) !== '/' ? `/${opts.path}` : opts.path;
- set_default(opts, 'target', this.win.location.origin + path);
- set_default(opts, 'replace', false);
- let replace = opts.replace;
- delete opts.path;
- delete opts.replace;
- opts._t_ajax = true;
- if (replace) {
- history.replaceState(opts, '', path);
- } else {
- history.pushState(opts, '', path);
- }
+
+ class AjaxDispatcher extends AjaxUtil {
+ bind(node, evts) {
+ $(node).off(evts).on(evts, this.dispatch_handle.bind(this));
}
- state_handle(evt) {
- let state = evt.originalEvent.state;
- if (!state) {
- return;
- }
- if (!state._t_ajax) {
- return;
- }
+ dispatch_handle(evt) {
evt.preventDefault();
- let target;
- if (state.target.url) {
- target = state.target;
+ evt.stopPropagation();
+ let elem = $(evt.currentTarget),
+ opts = {
+ elem: elem,
+ event: evt
+ };
+ if (elem.attr('ajax:confirm')) {
+ show_dialog({
+ message: elem.attr('ajax:confirm'),
+ on_confirm: function(inst) {
+ this.dispatch(opts);
+ }.bind(this)
+ });
} else {
- target = this.parse_target(state.target);
+ this.dispatch(opts);
}
- target.params.popstate = '1';
- if (state.action) {
- this.dispatcher.trigger('on_action', {
- target: target,
- action: state.action
+ }
+ dispatch(opts) {
+ let elem = opts.elem,
+ event = opts.event;
+ if (elem.attr('ajax:action')) {
+ this.trigger('on_action', {
+ target: this.action_target(elem, event),
+ action: elem.attr('ajax:action')
});
}
- if (state.event) {
- this.dispatcher.trigger('on_event', {
- target: target,
- event: state.event
+ if (elem.attr('ajax:event')) {
+ this.trigger('on_event', {
+ target: elem.attr('ajax:target'),
+ event: elem.attr('ajax:event')
});
}
- if (state.overlay) {
- this.dispatcher.trigger('on_overlay', {
- target: target,
- overlay: state.overlay,
- css: state.overlay_css,
- uid: state.overlay_uid,
- title: state.overlay_title
+ if (elem.attr('ajax:overlay')) {
+ this.trigger('on_overlay', {
+ target: this.action_target(elem, event),
+ overlay: elem.attr('ajax:overlay'),
+ css: elem.attr('ajax:overlay-css'),
+ uid: elem.attr('ajax:overlay-uid'),
+ title: elem.attr('ajax:overlay-title')
});
}
- if (!state.action && !state.event && !state.overlay) {
- this.win.location = target.url;
- }
- }
- handle(inst, opts) {
- let elem = opts.elem,
- evt = opts.event,
- path = elem.attr('ajax:path');
- if (path === 'href') {
- let href = elem.attr('href');
- path = parse_path(href, true);
- } else if (path === 'target') {
- let tgt = this.action_target(elem, evt);
- path = tgt.path + tgt.query;
- }
- let target;
- if (this.has_attr(elem, 'ajax:path-target')) {
- let path_target = elem.attr('ajax:path-target');
- if (path_target) {
- target = this.parse_target(path_target);
- }
- } else {
- target = this.action_target(elem, evt);
- }
- let p_opts = {
- path: path,
- target: target
- };
- p_opts.action = this.attr_val(elem, 'ajax:path-action', 'ajax:action');
- p_opts.event = this.attr_val(elem, 'ajax:path-event', 'ajax:event');
- p_opts.overlay = this.attr_val(elem, 'ajax:path-overlay', 'ajax:overlay');
- if (p_opts.overlay) {
- p_opts.overlay_css = this.attr_val(
- elem,
- 'ajax:path-overlay-css',
- 'ajax:overlay-css'
- );
- p_opts.overlay_uid = this.attr_val(
- elem,
- 'ajax:path-overlay-uid',
- 'ajax:overlay-uid'
- );
- p_opts.overlay_title = this.attr_val(
- elem,
- 'ajax:path-overlay-title',
- 'ajax:overlay-title'
- );
- }
- this.execute(p_opts);
- }
- has_attr(elem, name) {
- let val = elem.attr(name);
- return val !== undefined && val !== false;
- }
- attr_val(elem, name, fallback) {
- if (this.has_attr(elem, name)) {
- return elem.attr(name);
- } else {
- return elem.attr(fallback);
+ if (elem.attr('ajax:path')) {
+ this.trigger('on_path', {
+ elem: elem,
+ event: event
+ });
}
}
}
+
class AjaxAction extends AjaxOperation {
constructor(opts) {
set_default(opts, 'event', 'on_action');
@@ -1000,40 +1002,7 @@ var ts = (function (exports, $) {
}
}
}
- class AjaxEvent extends AjaxOperation {
- constructor(opts) {
- opts.event = 'on_event';
- super(opts);
- }
- execute(opts) {
- let create_event = this.create_event.bind(this);
- $(opts.selector).each(function() {
- $(this).trigger(create_event(opts.name, opts.target, opts.data));
- });
- }
- create_event(name, target, data) {
- let evt = $.Event(name);
- if (target.url) {
- evt.ajaxtarget = target;
- } else {
- evt.ajaxtarget = this.parse_target(target);
- }
- evt.ajaxdata = data;
- return evt;
- }
- handle(inst, opts) {
- let target = opts.target,
- event = opts.event;
- for (let event_ of this.parse_definition(event)) {
- let def = event_.split(':');
- this.execute({
- name: def[0],
- selector: def[1],
- target: target
- });
- }
- }
- }
+
class AjaxOverlay extends AjaxAction {
constructor(opts) {
opts.event = 'on_overlay';
@@ -1106,6 +1075,7 @@ var ts = (function (exports, $) {
});
}
}
+
class AjaxForm {
constructor(opts) {
this.handle = opts.handle;
@@ -1141,73 +1111,167 @@ var ts = (function (exports, $) {
this.handle.next(opts.next);
}
}
- class AjaxDispatcher extends AjaxUtil {
- bind(node, evts) {
- $(node).off(evts).on(evts, this.dispatch_handle.bind(this));
+
+ class AjaxPath extends AjaxOperation {
+ constructor(opts) {
+ opts.event = 'on_path';
+ super(opts);
+ this.win = opts.win;
+ $(this.win).on('popstate', this.state_handle.bind(this));
}
- dispatch_handle(evt) {
- evt.preventDefault();
- evt.stopPropagation();
- let elem = $(evt.currentTarget),
- opts = {
- elem: elem,
- event: evt
- };
- if (elem.attr('ajax:confirm')) {
- show_dialog({
- message: elem.attr('ajax:confirm'),
- on_confirm: function(inst) {
- this.dispatch(opts);
- }.bind(this)
- });
+ execute(opts) {
+ let history = this.win.history;
+ if (history.pushState === undefined) {
+ return;
+ }
+ let path = opts.path.charAt(0) !== '/' ? `/${opts.path}` : opts.path;
+ set_default(opts, 'target', this.win.location.origin + path);
+ set_default(opts, 'replace', false);
+ let replace = opts.replace;
+ delete opts.path;
+ delete opts.replace;
+ opts._t_ajax = true;
+ if (replace) {
+ history.replaceState(opts, '', path);
} else {
- this.dispatch(opts);
+ history.pushState(opts, '', path);
}
}
- dispatch(opts) {
- let elem = opts.elem,
- event = opts.event;
- if (elem.attr('ajax:action')) {
- this.trigger('on_action', {
- target: this.action_target(elem, event),
- action: elem.attr('ajax:action')
- });
+ state_handle(evt) {
+ let state = evt.originalEvent.state;
+ if (!state) {
+ return;
}
- if (elem.attr('ajax:event')) {
- this.trigger('on_event', {
- target: elem.attr('ajax:target'),
- event: elem.attr('ajax:event')
+ if (!state._t_ajax) {
+ return;
+ }
+ evt.preventDefault();
+ let target;
+ if (state.target.url) {
+ target = state.target;
+ } else {
+ target = this.parse_target(state.target);
+ }
+ target.params.popstate = '1';
+ if (state.action) {
+ this.dispatcher.trigger('on_action', {
+ target: target,
+ action: state.action
});
}
- if (elem.attr('ajax:overlay')) {
- this.trigger('on_overlay', {
- target: this.action_target(elem, event),
- overlay: elem.attr('ajax:overlay'),
- css: elem.attr('ajax:overlay-css'),
- uid: elem.attr('ajax:overlay-uid'),
- title: elem.attr('ajax:overlay-title')
+ if (state.event) {
+ this.dispatcher.trigger('on_event', {
+ target: target,
+ event: state.event
});
}
- if (elem.attr('ajax:path')) {
- this.trigger('on_path', {
- elem: elem,
- event: event
+ if (state.overlay) {
+ this.dispatcher.trigger('on_overlay', {
+ target: target,
+ overlay: state.overlay,
+ css: state.overlay_css,
+ uid: state.overlay_uid,
+ title: state.overlay_title
});
}
+ if (!state.action && !state.event && !state.overlay) {
+ this.win.location = target.url;
+ }
}
- }
- class AjaxDestroy extends Parser {
- parse(node) {
- let instances = node._ajax_attached;
- if (instances !== undefined) {
- for (let instance of instances) {
- if (instance.destroy !== undefined) {
- instance.destroy();
- }
+ handle(inst, opts) {
+ let elem = opts.elem,
+ evt = opts.event,
+ path = elem.attr('ajax:path');
+ if (path === 'href') {
+ let href = elem.attr('href');
+ path = parse_path(href, true);
+ } else if (path === 'target') {
+ let tgt = this.action_target(elem, evt);
+ path = tgt.path + tgt.query;
+ }
+ let target;
+ if (this.has_attr(elem, 'ajax:path-target')) {
+ let path_target = elem.attr('ajax:path-target');
+ if (path_target) {
+ target = this.parse_target(path_target);
}
+ } else {
+ target = this.action_target(elem, evt);
+ }
+ let p_opts = {
+ path: path,
+ target: target
+ };
+ p_opts.action = this.attr_val(elem, 'ajax:path-action', 'ajax:action');
+ p_opts.event = this.attr_val(elem, 'ajax:path-event', 'ajax:event');
+ p_opts.overlay = this.attr_val(elem, 'ajax:path-overlay', 'ajax:overlay');
+ if (p_opts.overlay) {
+ p_opts.overlay_css = this.attr_val(
+ elem,
+ 'ajax:path-overlay-css',
+ 'ajax:overlay-css'
+ );
+ p_opts.overlay_uid = this.attr_val(
+ elem,
+ 'ajax:path-overlay-uid',
+ 'ajax:overlay-uid'
+ );
+ p_opts.overlay_title = this.attr_val(
+ elem,
+ 'ajax:path-overlay-title',
+ 'ajax:overlay-title'
+ );
+ }
+ this.execute(p_opts);
+ }
+ has_attr(elem, name) {
+ let val = elem.attr(name);
+ return val !== undefined && val !== false;
+ }
+ attr_val(elem, name, fallback) {
+ if (this.has_attr(elem, name)) {
+ return elem.attr(name);
+ } else {
+ return elem.attr(fallback);
}
}
}
+
+ class AjaxEvent extends AjaxOperation {
+ constructor(opts) {
+ opts.event = 'on_event';
+ super(opts);
+ }
+ execute(opts) {
+ let create_event = this.create_event.bind(this);
+ $(opts.selector).each(function() {
+ $(this).trigger(create_event(opts.name, opts.target, opts.data));
+ });
+ }
+ create_event(name, target, data) {
+ let evt = $.Event(name);
+ if (target.url) {
+ evt.ajaxtarget = target;
+ } else {
+ evt.ajaxtarget = this.parse_target(target);
+ }
+ evt.ajaxdata = data;
+ return evt;
+ }
+ handle(inst, opts) {
+ let target = opts.target,
+ event = opts.event;
+ for (let event_ of this.parse_definition(event)) {
+ let def = event_.split(':');
+ this.execute({
+ name: def[0],
+ selector: def[1],
+ target: target
+ });
+ }
+ }
+ }
+
class AjaxHandle extends AjaxUtil {
constructor(ajax) {
super();
@@ -1277,6 +1341,7 @@ var ts = (function (exports, $) {
}
}
}
+
class AjaxParser extends Parser {
constructor(opts) {
super();
@@ -1302,6 +1367,7 @@ var ts = (function (exports, $) {
}
}
}
+
class Ajax extends AjaxUtil {
constructor(win=window) {
super();
@@ -1359,7 +1425,7 @@ var ts = (function (exports, $) {
attach(instance, elem) {
if (elem instanceof $) {
if (elem.length != 1) {
- throw 'Instance can be attached to exactly one DOM element';
+ throw `${instance.constructor.name}: Instance can be attached to exactly one DOM element`;
}
elem = elem[0];
}
@@ -1444,6 +1510,24 @@ var ts = (function (exports, $) {
return this;
};
+ function destroy_bootstrap(node) {
+ let dd = window.bootstrap.Dropdown.getInstance(node);
+ let tt = window.bootstrap.Tooltip.getInstance(node);
+ if (dd) {
+ dd.dispose();
+ }
+ if (tt) {
+ tt.dispose();
+ }
+ dd = null;
+ tt = null;
+ }
+ $(function() {
+ if (window.bootstrap !== undefined) {
+ register_ajax_destroy_handle(destroy_bootstrap);
+ }
+ });
+
class ClockFrameEvent {
constructor(callback, ...opts) {
this._request_id = window.requestAnimationFrame((timestamp) => {
@@ -1515,9 +1599,16 @@ var ts = (function (exports, $) {
if (!elem) {
throw 'No element found';
}
- elem.on(event, evt => {
- this.trigger(`on_${event}`, evt);
- });
+ this.event = event;
+ this.trigger_event = this.trigger_event.bind(this);
+ this.elem.on(this.event, this.trigger_event);
+ ajax.attach(this, this.elem);
+ }
+ trigger_event(evt) {
+ this.trigger(`on_${event}`, evt);
+ }
+ destroy() {
+ this.elem.off(this.event, this.trigger_event);
}
};
}
@@ -1681,7 +1772,7 @@ var ts = (function (exports, $) {
this.elem = opts.elem;
}
get collapsed() {
- return !this.elem.hasClass('in');
+ return !this.elem.hasClass('show');
}
set collapsed(value) {
if (value) {
@@ -1694,8 +1785,8 @@ var ts = (function (exports, $) {
class Button extends ClickListener {
constructor(opts) {
super(opts);
- this.unselected_class = 'btn-default';
- this.selected_class = 'btn-success';
+ this.unselected_class = opts.unselected_class ?? 'btn-primary';
+ this.selected_class = opts.selected_class ?? 'btn-success';
}
get selected() {
return this.elem.hasClass(this.selected_class);
@@ -2056,6 +2147,7 @@ var ts = (function (exports, $) {
exports.Websocket = Websocket;
exports.Widget = Widget;
exports.ajax = ajax;
+ exports.ajax_destroy = ajax_destroy;
exports.changeListener = changeListener;
exports.clickListener = clickListener;
exports.clock = clock;
@@ -2079,6 +2171,7 @@ var ts = (function (exports, $) {
exports.parse_url = parse_url;
exports.query_elem = query_elem;
exports.read_cookie = read_cookie;
+ exports.register_ajax_destroy_handle = register_ajax_destroy_handle;
exports.set_default = set_default;
exports.set_svg_attrs = set_svg_attrs;
exports.set_visible = set_visible;
@@ -2089,6 +2182,7 @@ var ts = (function (exports, $) {
exports.show_warning = show_warning;
exports.spinner = spinner;
exports.svg_ns = svg_ns;
+ exports.unregister_ajax_destroy_handle = unregister_ajax_destroy_handle;
exports.uuid4 = uuid4;
Object.defineProperty(exports, '__esModule', { value: true });
diff --git a/treibstoff/bundle/treibstoff.bundle.min.js b/treibstoff/bundle/treibstoff.bundle.min.js
index d31fbc5..3104f09 100644
--- a/treibstoff/bundle/treibstoff.bundle.min.js
+++ b/treibstoff/bundle/treibstoff.bundle.min.js
@@ -1 +1 @@
-var ts=function(t,e){"use strict";function s(t,e,s){console.log(`DEPRECATED: ${t} is deprecated and will be removed as of ${s}. Use ${e} instead.`)}function i(t,s,i=!0){let n=e(t,s);if(i&&n.length>1)throw`Element by selector ${t} not unique.`;return n.length?n:null}function n(t,e,s=!0){let n=i(t,e,s);if(null===n)throw`Element by selector ${t} not found.`;return n}function r(t,e){e?t.removeClass("hidden"):t.addClass("hidden")}function a(){return([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g,(t=>(t^crypto.getRandomValues(new Uint8Array(1))[0]&15>>t/4).toString(16)))}function o(t,e,s){return void 0===t[e]&&(t[e]=s),t[e]}function l(t,e){return t.charAt(t.length-1)===e&&(t=t.substring(0,t.length-1)),t}function h(t){let e=document.createElement("a");e.href=t;let s=e.pathname;return l(t=e.protocol+"//"+e.host+s,"/")}function c(t,e){let s=document.createElement("a");s.href=t;let i=s.search;if(e)return i||"";let n={};if(i){let t=i.substring(1,i.length).split("&");for(let e=0;e\n \n
\n \n 
\n
\n ')}show(){this._count++,this._count>1||e("body").append(this.elem)}hide(t){if(this._count--,t)return this._count=0,void this.elem.remove();this._count<=0&&(this._count=0,this.elem.remove())}}const F=new M;class I{constructor(t){this.spinner=o(t,"spinner",null),this.default_403=o(t,"default_403","/login"),this._win=o(t,"win",window)}execute(t){if(-1!==t.url.indexOf("?")){let e=t.params;t.params=c(t.url),t.url=h(t.url);for(let s in e)t.params[s]=e[s]}else o(t,"params",{});o(t,"error",((t,e,s)=>{403!==parseInt(e,10)?P(`${e}${s}`):this.redirect(this.default_403)})),this.show_spinner(),e.ajax({url:t.url,dataType:o(t,"type","html"),data:t.params,method:o(t,"method","GET"),success:(e,s,i)=>{this.hide_spinner(),t.success(e,s,i)},error:(e,s,i)=>{0!==e.status?(s=e.status||s,i=e.statusText||i,this.hide_spinner(!0),t.error(e,s,i)):this.hide_spinner(!0)},cache:o(t,"cache",!1)})}redirect(t){const e=this._win.location;e.hash="",e.pathname=t}show_spinner(){null!==this.spinner&&this.spinner.show()}hide_spinner(t){null!==this.spinner&&this.spinner.hide(t)}}function W(t){new I({spinner:o(t,"spinner",F),win:o(t,"win",window),default_403:o(t,"default_403","/login")}).execute(t)}class G extends A{parse_target(t){return{url:t?h(t):void 0,params:t?c(t):{},path:t?d(t):void 0,query:t?c(t,!0):void 0}}parse_definition(t){return t.replace(/\s+/g," ").split(" ")}action_target(t,e){return e.ajaxtarget?e.ajaxtarget:this.parse_target(t.attr("ajax:target"))}}class H extends G{constructor(t){super(),this.event=t.event,this.dispatcher=t.dispatcher,this.dispatcher.on(this.event,this.handle.bind(this))}execute(t){throw"Abstract AjaxOperation does not implement execute"}handle(t,e){throw"Abstract AjaxOperation does not implement handle"}}class R extends H{constructor(t){t.event="on_path",super(t),this.win=t.win,e(this.win).on("popstate",this.state_handle.bind(this))}execute(t){let e=this.win.history;if(void 0===e.pushState)return;let s="/"!==t.path.charAt(0)?`/${t.path}`:t.path;o(t,"target",this.win.location.origin+s),o(t,"replace",!1);let i=t.replace;delete t.path,delete t.replace,t._t_ajax=!0,i?e.replaceState(t,"",s):e.pushState(t,"",s)}state_handle(t){let e,s=t.originalEvent.state;s&&s._t_ajax&&(t.preventDefault(),e=s.target.url?s.target:this.parse_target(s.target),e.params.popstate="1",s.action&&this.dispatcher.trigger("on_action",{target:e,action:s.action}),s.event&&this.dispatcher.trigger("on_event",{target:e,event:s.event}),s.overlay&&this.dispatcher.trigger("on_overlay",{target:e,overlay:s.overlay,css:s.overlay_css,uid:s.overlay_uid,title:s.overlay_title}),s.action||s.event||s.overlay||(this.win.location=e.url))}handle(t,e){let s,i=e.elem,n=e.event,r=i.attr("ajax:path");if("href"===r){r=d(i.attr("href"),!0)}else if("target"===r){let t=this.action_target(i,n);r=t.path+t.query}if(this.has_attr(i,"ajax:path-target")){let t=i.attr("ajax:path-target");t&&(s=this.parse_target(t))}else s=this.action_target(i,n);let a={path:r,target:s};a.action=this.attr_val(i,"ajax:path-action","ajax:action"),a.event=this.attr_val(i,"ajax:path-event","ajax:event"),a.overlay=this.attr_val(i,"ajax:path-overlay","ajax:overlay"),a.overlay&&(a.overlay_css=this.attr_val(i,"ajax:path-overlay-css","ajax:overlay-css"),a.overlay_uid=this.attr_val(i,"ajax:path-overlay-uid","ajax:overlay-uid"),a.overlay_title=this.attr_val(i,"ajax:path-overlay-title","ajax:overlay-title")),this.execute(a)}has_attr(t,e){let s=t.attr(e);return void 0!==s&&!1!==s}attr_val(t,e,s){return this.has_attr(t,e)?t.attr(e):t.attr(s)}}class V extends H{constructor(t){o(t,"event","on_action"),super(t),this.spinner=t.spinner,this._handle=t.handle,this._request=t.request}execute(t){t.success=this.complete.bind(this),this.request(t)}request(t){t.params["ajax.action"]=t.name,t.params["ajax.mode"]=t.mode,t.params["ajax.selector"]=t.selector,this._request.execute({url:h(t.url)+"/ajaxaction",type:"json",params:t.params,success:t.success})}complete(t){t?(this._handle.update(t),this._handle.next(t.continuation)):(P("Empty Response"),this.spinner.hide())}handle(t,e){let s=e.target,i=e.action;for(let t of this.parse_definition(i)){let e=t.split(":");this.execute({name:e[0],selector:e[1],mode:e[2],url:s.url,params:s.params})}}}class B extends H{constructor(t){t.event="on_event",super(t)}execute(t){let s=this.create_event.bind(this);e(t.selector).each((function(){e(this).trigger(s(t.name,t.target,t.data))}))}create_event(t,s,i){let n=e.Event(t);return s.url?n.ajaxtarget=s:n.ajaxtarget=this.parse_target(s),n.ajaxdata=i,n}handle(t,e){let s=e.target,i=e.event;for(let t of this.parse_definition(i)){let e=t.split(":");this.execute({name:e[0],selector:e[1],target:s})}}}class z extends V{constructor(t){t.event="on_overlay",super(t),this.overlay_content_sel=".modal-body"}execute(t){let e,s,i;if(t.close)return e=S(t.uid),e&&e.close(),e;if(t.target){let e=t.target;e.url||(e=this.parse_target(e)),s=e.url,i=e.params}else s=t.url,i=t.params;let n=t.uid?t.uid:a();return i["ajax.overlay-uid"]=n,e=new E({uid:n,css:t.css,title:t.title,on_close:t.on_close}),this.request({name:t.action,selector:`#${n} ${this.overlay_content_sel}`,mode:"inner",url:s,params:i,success:function(t){t.payload?(e.open(),this.complete(t)):this.complete(t)}.bind(this)}),e}handle(t,e){let s=e.target,i=e.overlay;i.indexOf("CLOSE")>-1?this.execute({close:!0,uid:i.indexOf(":")>-1?i.split(":")[1]:e.uid}):this.execute({action:i,url:s.url,params:s.params,css:e.css,uid:e.uid,title:e.title})}}class J{constructor(t){this.handle=t.handle,this.spinner=t.spinner,this.afr=null}bind(t){this.afr||C(this,'\n \n ',e("body")),e(t).append('').attr("target","ajaxformresponse").off().on("submit",function(t){this.spinner.show()}.bind(this))}render(t){this.spinner.hide(),t.error||(this.afr.remove(),this.afr=null),t.payload&&this.handle.update(t),this.handle.next(t.next)}}class U extends G{bind(t,s){e(t).off(s).on(s,this.dispatch_handle.bind(this))}dispatch_handle(t){t.preventDefault(),t.stopPropagation();let s=e(t.currentTarget),i={elem:s,event:t};s.attr("ajax:confirm")?D({message:s.attr("ajax:confirm"),on_confirm:function(t){this.dispatch(i)}.bind(this)}):this.dispatch(i)}dispatch(t){let e=t.elem,s=t.event;e.attr("ajax:action")&&this.trigger("on_action",{target:this.action_target(e,s),action:e.attr("ajax:action")}),e.attr("ajax:event")&&this.trigger("on_event",{target:e.attr("ajax:target"),event:e.attr("ajax:event")}),e.attr("ajax:overlay")&&this.trigger("on_overlay",{target:this.action_target(e,s),overlay:e.attr("ajax:overlay"),css:e.attr("ajax:overlay-css"),uid:e.attr("ajax:overlay-uid"),title:e.attr("ajax:overlay-title")}),e.attr("ajax:path")&&this.trigger("on_path",{elem:e,event:s})}}class K extends b{parse(t){let e=t._ajax_attached;if(void 0!==e)for(let t of e)void 0!==t.destroy&&t.destroy()}}class X extends G{constructor(t){super(),this.ajax=t,this.spinner=t.spinner}destroy(t){let e=new K;t.each((function(){e.walk(this)}))}update(t){let s,i=t.payload,n=t.selector,r=t.mode;if("replace"===r){let t=e(n);this.destroy(t),t.replaceWith(i),s=e(n),s.length?this.ajax.bind(s.parent()):this.ajax.bind(e(document))}else"inner"===r&&(s=e(n),this.destroy(s.children()),s.html(i),this.ajax.bind(s))}next(t){if(t&&t.length){this.spinner.hide();for(let s of t){let t=s.type;if(delete s.type,"path"===t)this.ajax.path(s);else if("action"===t){let t=this.parse_target(s.target);s.url=t.url,s.params=t.params,this.ajax.action(s)}else if("event"===t)this.ajax.trigger(s);else if("overlay"===t){let t=this.parse_target(s.target);s.url=t.url,s.params=t.params,this.ajax.overlay(s)}else"message"===t&&(s.flavor?O({message:s.payload,flavor:s.flavor}):e(s.selector).html(s.payload))}}}}class Y extends b{constructor(t){super(),this.dispatcher=t.dispatcher,this.form=t.form}parse(t){let e=this.node_attrs(t);if(e["ajax:bind"]&&(e["ajax:action"]||e["ajax:event"]||e["ajax:overlay"])){let s=e["ajax:bind"];this.dispatcher.bind(t,s)}e["ajax:form"]&&this.form.bind(t),"form"===t.tagName.toLowerCase()&&t.className.split(" ").includes("ajax")&&this.form.bind(t)}}class Q extends G{constructor(t=window){super(),this.win=t,this.binders={};let e=this.spinner=F,s=this.dispatcher=new U,i=this._request=new I({win:t});this._path=new R({dispatcher:s,win:t}),this._event=new B({dispatcher:s});let n=new X(this),r={dispatcher:s,win:t,handle:n,spinner:e,request:i};this._action=new V(r),this._overlay=new z(r),this._form=new J({handle:n,spinner:e}),this._is_bound=!1}register(t,e){let s="binder_"+a();for(;void 0!==this.binders[s];)s="binder_"+a();this.binders[s]=t,e&&this._is_bound&&t()}bind(t){this._is_bound=!0;let e=new Y({dispatcher:this.dispatcher,form:this._form});t.each((function(){e.walk(this)}));for(let e in this.binders)try{this.binders[e](t)}catch(t){console.log(t)}return t}attach(t,s){if(s instanceof e){if(1!=s.length)throw"Instance can be attached to exactly one DOM element";s=s[0]}void 0===s._ajax_attached&&(s._ajax_attached=[]),s._ajax_attached.push(t)}path(t){this._path.execute(t)}action(t){this._action.execute(t)}trigger(t){arguments.length>1&&(s("Calling Ajax.event with positional arguments","opts","1.0"),t={name:arguments[0],selector:arguments[1],target:arguments[2],data:arguments[3]}),this._event.execute(t)}overlay(t){return this._overlay.execute(t)}form(t){this._form.render(t)}parseurl(t){return s("ts.ajax.parseurl","ts.parse_url","1.0"),h(t)}parsequery(t,e){return s("ts.ajax.parsequery","ts.parse_query","1.0"),c(t,e)}parsepath(t,e){return s("ts.ajax.parsepath","ts.parse_path","1.0"),d(t,e)}parsetarget(t){return s("ts.ajax.parsetarget","ts.ajax.parse_target","1.0"),this.parse_target(t)}message(t,e=""){s("ts.ajax.message","ts.show_message","1.0"),O({message:t,flavor:e})}info(t){s("ts.ajax.info","ts.show_info","1.0"),q(t)}warning(t){s("ts.ajax.warning","ts.show_warning","1.0"),N(t)}error(t){s("ts.ajax.error","ts.show_error","1.0"),P(t)}dialog(t,e){s("ts.ajax.dialog","ts.show_dialog","1.0"),D({message:t.message,on_confirm:function(){e(t)}})}request(t){s("ts.ajax.request","ts.http_request","1.0"),W(t)}}let Z=new Q;e.fn.tsajax=function(){return Z.bind(this),this};class tt{constructor(t,...e){this._request_id=window.requestAnimationFrame((s=>{t(s,...e)}))}cancel(){null!==this._request_id&&(window.cancelAnimationFrame(this._request_id),this._request_id=null)}}class et{constructor(t,e,...s){this._timeout_id=window.setTimeout((()=>{t(document.timeline.currentTime,...s)}),e)}cancel(){null!==this._timeout_id&&(window.clearTimeout(this._timeout_id),this._timeout_id=null)}}class st{constructor(t,e,...s){this._interval_id=window.setInterval((()=>{t(document.timeline.currentTime,this,...s)}),e)}cancel(){null!==this._interval_id&&(window.clearInterval(this._interval_id),this._interval_id=null)}}class it{schedule_frame(t,...e){return new tt(t,...e)}schedule_timeout(t,e,...s){return new et(t,e,...s)}schedule_interval(t,e,...s){return new st(t,e,...s)}}let nt=new it;function rt(t,e=null){if(!((e=e||A)===A||e.prototype instanceof A))throw"Base class must be subclass of or Events";return class extends e{constructor(s){e===A?super():super(s);let i=this.elem;if(i||void 0===s||(i=this.elem=s.elem),!i)throw"No element found";i.on(t,(e=>{this.trigger(`on_${t}`,e)}))}}}let at=rt("click"),ot=rt("change"),lt=t=>rt("change",t);class ht extends A{constructor(){super(),this._down_handle=null,this._down_scope=null,this._move_scope=null}reset_state(){this._move_handle=null,this._up_handle=null,this._prev_pos=null,this._motion=null}set_scope(t,s){if(this._up_handle)throw"Attempt to set motion scope while handling";this.reset_state(),this._down_handle&&e(this._down_scope).off("mousedown",this._down_handle),this._down_handle=this._mousedown.bind(this),this._down_scope=t,e(t).on("mousedown",this._down_handle),this._move_scope=s||null}_mousedown(t){t.stopPropagation(),this._motion=!1,this._prev_pos={x:t.pageX,y:t.pageY},this._move_scope&&(this._move_handle=this._mousemove.bind(this),e(this._move_scope).on("mousemove",this._move_handle)),this._up_handle=this._mouseup.bind(this),e(document).on("mouseup",this._up_handle),this.trigger("down",t)}_mousemove(t){t.stopPropagation(),this._motion=!0,t.motion=this._motion,t.prev_pos=this._prev_pos,this.trigger("move",t),this._prev_pos.x=t.pageX,this._prev_pos.y=t.pageY}_mouseup(t){t.stopPropagation(),this._move_scope&&e(this._move_scope).off("mousemove",this._move_handle),e(document).off("mouseup",this._up_handle),t.motion=this._motion,this.trigger("up",t),this.reset_state()}}class ct extends ht{constructor(t){super(),this.children=[],new g(this,"parent"),this.parent=t.parent||null}add_widget(t){t.parent=this,this.children.push(t)}remove_widget(t){t.parent=null,this.children.splice(this.children.indexOf(t),1)}acquire(t){let e=this.parent;for(;e&&e&&!(e instanceof t);)e=e.parent;return e}}class dt extends ct{constructor(t){super(t),this.elem=t.elem,new v(this,"x",{tgt:"left"}),new v(this,"y",{tgt:"top"}),new v(this,"width"),new v(this,"height")}get offset(){return e(this.elem).offset()}}class ut extends A{constructor(t){if(!t.elem)throw"No element given";super(),this.elem=t.elem}get visible(){return!this.elem.hasClass("hidden")}set visible(t){let e=t!==!this.elem.hasClass("hidden");r(this.elem,t),e&&this.trigger("on_visible",t)}get hidden(){return!this.visible}set hidden(t){this.visible=!t}}function _t(t,e){if(t.elem)return t.elem;let s=t.form,i=t.name;return n(`${e}-${s.name}-${i}`,s.elem,!0)}class pt extends A{constructor(t){super(),this.form=t.form,this.name=t.name,this.elem=_t(t,"#input")}get value(){return this.elem.val()}set value(t){this.elem.val(t)}get disabled(){return this.elem.prop("disabled")}set disabled(t){this.elem.prop("disabled",t)}}class mt extends(lt(pt)){constructor(t){t.elem=_t(t,"#input"),super(t)}get options(){return this.elem.prop("options")}set options(t){this.clear();let e=this.elem[0];for(let s of t)s instanceof Option?e.add(s):e.add(new Option(s[1],s[0]))}clear(){this.elem.empty()}}class gt extends(lt(pt)){constructor(t){t.elem=_t(t,"#input"),super(t)}get checked(){return this.elem.is(":checked")}set checked(t){return this.elem.prop("checked",t)}}return e((function(){Z.spinner.hide(),e(document).tsajax()})),t.Ajax=Q,t.AjaxAction=V,t.AjaxDestroy=K,t.AjaxDispatcher=U,t.AjaxEvent=B,t.AjaxForm=J,t.AjaxHandle=X,t.AjaxOperation=H,t.AjaxOverlay=z,t.AjaxParser=Y,t.AjaxPath=R,t.AjaxUtil=G,t.AttrProperty=class extends f{set(t){this.ctx.attr(this.tgt,t),super.set(t)}},t.BoundProperty=f,t.Button=class extends at{constructor(t){super(t),this.unselected_class="btn-default",this.selected_class="btn-success"}get selected(){return this.elem.hasClass(this.selected_class)}set selected(t){t?this.elem.removeClass(this.unselected_class).addClass(this.selected_class):this.elem.removeClass(this.selected_class).addClass(this.unselected_class)}},t.ButtonProperty=w,t.CSSProperty=v,t.ChangeListener=ot,t.ClickListener=at,t.Clock=it,t.ClockFrameEvent=tt,t.ClockIntervalEvent=st,t.ClockTimeoutEvent=et,t.Collapsible=class{constructor(t){if(!t.elem)throw"No element given";this.elem=t.elem}get collapsed(){return!this.elem.hasClass("in")}set collapsed(t){t?this.elem.collapse("hide"):this.elem.collapse("show")}},t.DataProperty=class extends f{constructor(t,e,s){s?s.ctx=void 0!==s.ctx?s.ctx:t.data:s={ctx:t.data},s.ctxa="data",super(t,e,s)}set(t){this.ctx[this.tgt]=t,super.set(t)}},t.Dialog=L,t.Events=A,t.Form=class{static initialize(t,e,s){let n=i(`#form-${s}`,t,!0);if(!n)return;let r=new e({name:s,elem:n});n.data(s,r)}static instance(t){return e(`#form-${t}`).data(t)}constructor(t){this.name=t.name,this.elem=t.elem}set_field_visibility(t,e){for(let s of t)s.visible=e}},t.FormCheckbox=gt,t.FormField=class extends ut{constructor(t){t.elem=_t(t,"#field"),super(t),this.form=t.form,this.name=t.name;let e=t.input;!e||e instanceof pt||(e=new e({form:this.form,name:this.name})),this.input=e}get has_error(){return this.elem.hasClass("has-error")}set has_error(t){let e=this.elem;t?e.addClass("has-error"):e.removeClass("has-error")}reset(t=""){this.input.value=t,this.has_error=!1,e(".help-block",this.elem).remove()}},t.FormInput=pt,t.FormRemoteSelect=class extends mt{constructor(t){super(t),this.vocab=t.vocab}fetch(t){W({type:"json",url:this.vocab,params:t,success:function(t,e,s){this.options=t}.bind(this)})}},t.FormSelect=mt,t.HTMLParser=k,t.HTMLWidget=dt,t.HTTPRequest=I,t.InputProperty=x,t.KeyState=class extends A{constructor(t){super(),this.filter_keyevent=t,this._keys=[],this._add_key("ctrl",17),this._add_key("shift",16),this._add_key("alt",18),this._add_key("enter",13),this._add_key("esc",27),this._add_key("delete",46),this.bind()}unload(){e(window).off("keydown",this._on_dom_keydown).off("keyup",this._on_dom_keyup)}bind(){this._on_dom_keydown=this._on_dom_keydown.bind(this),this._on_dom_keyup=this._on_dom_keyup.bind(this),e(window).on("keydown",this._on_dom_keydown).on("keyup",this._on_dom_keyup)}_add_key(t,e){this._keys.push(t),this[`_${t}`]=!1,Object.defineProperty(this,t,{get:function(){return this[`_${t}`]},set:function(s){let i=this[`_${t}`];"keydown"==s.type?i||s.keyCode!=e||(this[`_${t}`]=!0):i&&s.keyCode==e&&(this[`_${t}`]=!1)}})}_set_keys(t){for(let e of this._keys)this[e]=t}_filter_event(t){return this.filter_keyevent&&this.filter_keyevent(t)}_on_dom_keydown(t){this._set_keys(t),this._filter_event(t)||this.trigger("keydown",t)}_on_dom_keyup(t){this._set_keys(t),this._filter_event(t)||this.trigger("keyup",t)}},t.LoadingSpinner=M,t.Message=T,t.Motion=ht,t.Overlay=E,t.Parser=b,t.Property=g,t.SVGContext=class extends dt{constructor(t){let e=t.parent.elem.get(0);t.elem=p("svg",{class:t.name},e),super(t),this.svg_ns=u,this.xyz={x:0,y:0,z:1}}svg_attrs(t,e){_(t,e)}svg_elem(t,e,s){return p(t,e,s)}},t.SVGParser=$,t.SVGProperty=class extends f{set(t){let e={};e[this._name]=t,_(this.ctx,e),super.set(t)}},t.TemplateParser=y,t.TextProperty=class extends f{set(t){this.ctx.text(t),super.set(t)}},t.Visibility=ut,t.WS_STATE_CLOSED=3,t.WS_STATE_CLOSING=2,t.WS_STATE_CONNECTING=0,t.WS_STATE_OPEN=1,t.Websocket=class extends A{constructor(t,e=WebSocket){super(),this._ws_factory=e,this.path=t,this.on_open=this.on_open.bind(this),this.on_close=this.on_close.bind(this),this.on_error=this.on_error.bind(this),this.on_message=this.on_message.bind(this),this.on_raw_message=this.on_raw_message.bind(this),this.sock=null}get uri(){let t;return t="http:"==window.location.protocol?"ws://":"wss://",t+window.location.hostname+this.path}get state(){return this.sock.readyState}open(){null!==this.sock&&this.sock.close();let t=this.sock=new this._ws_factory(this.uri);t.onopen=function(){this.trigger("on_open")}.bind(this),t.onclose=function(t){this.trigger("on_close",t)}.bind(this),t.onerror=function(){this.trigger("on_error")}.bind(this),t.onmessage=function(t){this.trigger("on_raw_message",t)}.bind(this)}send(t){this.sock.send(t)}send_json(t){this.sock.send(JSON.stringify(t))}close(){null!==this.sock&&(this.sock.close(),this.sock=null)}on_open(){}on_close(t){}on_error(){}on_message(t){}on_raw_message(t){let e=JSON.parse(t.data);void 0===e.HEARTBEAT&&this.trigger("on_message",e)}},t.Widget=ct,t.ajax=Z,t.changeListener=lt,t.clickListener=t=>rt("click",t),t.clock=nt,t.compile_svg=function(t,e,s){let i=m(e,s),n=new $(t);return i.forEach((function(t,e){n.walk(t)})),i},t.compile_template=C,t.create_cookie=function(t,e,s){var i,n;s?((i=new Date).setTime(i.getTime()+24*s*60*60*1e3),n="; expires="+i.toGMTString()):n="",document.cookie=t+"="+escape(e)+n+"; path=/;"},t.create_listener=rt,t.create_svg_elem=p,t.deprecate=s,t.extract_number=j,t.get_elem=n,t.get_overlay=S,t.http_request=W,t.json_merge=function(t,e){let s={};for(let i of[t,e])for(let t in i)s[t]=i[t];return s},t.load_svg=function(t,s){e.get(t,function(t){let i=e(t).find("svg");i.removeAttr("xmlns:a"),s(i)}.bind(this),"xml")},t.lookup_form_elem=_t,t.object_by_path=function(t){if(!t)return null;let e=window;for(const s of t.split("."))if(e=e[s],void 0===e)throw`Object by path not exists: ${t}`;return e},t.parse_path=d,t.parse_query=c,t.parse_svg=m,t.parse_url=h,t.query_elem=i,t.read_cookie=function(t){var e,s,i=t+"=",n=document.cookie.split(";");for(e=0;e\n \n
\n \n \n
\n \n Loading...\n
\n ')}show(){this._count++,this._count>1||(this.compile(),e("body").append(this.elem))}hide(t){if(this._count--,t)return this._count=0,this.elem&&this.elem.remove(),void(this.elem=null);this._count<=0&&(this._count=0,this.elem&&this.elem.remove(),this.elem=null)}}const R=new G;class H{constructor(t){this.spinner=o(t,"spinner",null),this.default_403=o(t,"default_403","/login"),this._win=o(t,"win",window)}execute(t){if(-1!==t.url.indexOf("?")){let e=t.params;t.params=c(t.url),t.url=h(t.url);for(let s in e)t.params[s]=e[s]}else o(t,"params",{});o(t,"error",(t,e,s)=>{403!==parseInt(e,10)?F(`${e}${s}`):this.redirect(this.default_403)}),this.show_spinner(),e.ajax({url:t.url,dataType:o(t,"type","html"),data:t.params,method:o(t,"method","GET"),success:(e,s,i)=>{this.hide_spinner(),t.success(e,s,i)},error:(e,s,i)=>{0!==e.status?(s=e.status||s,i=e.statusText||i,this.hide_spinner(!0),t.error(e,s,i)):this.hide_spinner(!0)},cache:o(t,"cache",!1)})}redirect(t){const e=this._win.location;e.hash="",e.pathname=t}show_spinner(){null!==this.spinner&&this.spinner.show()}hide_spinner(t){null!==this.spinner&&this.spinner.hide(t)}}function V(t){new H({spinner:o(t,"spinner",R),win:o(t,"win",window),default_403:o(t,"default_403","/login")}).execute(t)}class B extends A{parse_target(t){return{url:t?h(t):void 0,params:t?c(t):{},path:t?d(t):void 0,query:t?c(t,!0):void 0}}parse_definition(t){return t.replace(/\s+/g," ").split(" ")}action_target(t,e){return e.ajaxtarget?e.ajaxtarget:this.parse_target(t.attr("ajax:target"))}}class z extends B{constructor(t){super(),this.event=t.event,this.dispatcher=t.dispatcher,this.dispatcher.on(this.event,this.handle.bind(this))}execute(t){throw"Abstract AjaxOperation does not implement execute"}handle(t,e){throw"Abstract AjaxOperation does not implement handle"}}class U extends B{bind(t,s){e(t).off(s).on(s,this.dispatch_handle.bind(this))}dispatch_handle(t){t.preventDefault(),t.stopPropagation();let s=e(t.currentTarget),i={elem:s,event:t};s.attr("ajax:confirm")?W({message:s.attr("ajax:confirm"),on_confirm:function(t){this.dispatch(i)}.bind(this)}):this.dispatch(i)}dispatch(t){let e=t.elem,s=t.event;e.attr("ajax:action")&&this.trigger("on_action",{target:this.action_target(e,s),action:e.attr("ajax:action")}),e.attr("ajax:event")&&this.trigger("on_event",{target:e.attr("ajax:target"),event:e.attr("ajax:event")}),e.attr("ajax:overlay")&&this.trigger("on_overlay",{target:this.action_target(e,s),overlay:e.attr("ajax:overlay"),css:e.attr("ajax:overlay-css"),uid:e.attr("ajax:overlay-uid"),title:e.attr("ajax:overlay-title")}),e.attr("ajax:path")&&this.trigger("on_path",{elem:e,event:s})}}class J extends z{constructor(t){o(t,"event","on_action"),super(t),this.spinner=t.spinner,this._handle=t.handle,this._request=t.request}execute(t){t.success=this.complete.bind(this),this.request(t)}request(t){t.params["ajax.action"]=t.name,t.params["ajax.mode"]=t.mode,t.params["ajax.selector"]=t.selector,this._request.execute({url:h(t.url)+"/ajaxaction",type:"json",params:t.params,success:t.success})}complete(t){t?(this._handle.update(t),this._handle.next(t.continuation)):(F("Empty Response"),this.spinner.hide())}handle(t,e){let s=e.target,i=e.action;for(let t of this.parse_definition(i)){let e=t.split(":");this.execute({name:e[0],selector:e[1],mode:e[2],url:s.url,params:s.params})}}}class K extends J{constructor(t){t.event="on_overlay",super(t),this.overlay_content_sel=".modal-body"}execute(t){let e,s,i;if(t.close)return e=N(t.uid),e&&e.close(),e;if(t.target){let e=t.target;e.url||(e=this.parse_target(e)),s=e.url,i=e.params}else s=t.url,i=t.params;let n=t.uid?t.uid:a();return i["ajax.overlay-uid"]=n,e=new q({uid:n,css:t.css,title:t.title,on_close:t.on_close}),this.request({name:t.action,selector:`#${n} ${this.overlay_content_sel}`,mode:"inner",url:s,params:i,success:function(t){t.payload?(e.open(),this.complete(t)):this.complete(t)}.bind(this)}),e}handle(t,e){let s=e.target,i=e.overlay;i.indexOf("CLOSE")>-1?this.execute({close:!0,uid:i.indexOf(":")>-1?i.split(":")[1]:e.uid}):this.execute({action:i,url:s.url,params:s.params,css:e.css,uid:e.uid,title:e.title})}}class X{constructor(t){this.handle=t.handle,this.spinner=t.spinner,this.afr=null}bind(t){this.afr||C(this,'\n \n ',e("body")),e(t).append('').attr("target","ajaxformresponse").off().on("submit",function(t){this.spinner.show()}.bind(this))}render(t){this.spinner.hide(),t.error||(this.afr.remove(),this.afr=null),t.payload&&this.handle.update(t),this.handle.next(t.next)}}class Y extends z{constructor(t){t.event="on_path",super(t),this.win=t.win,e(this.win).on("popstate",this.state_handle.bind(this))}execute(t){let e=this.win.history;if(void 0===e.pushState)return;let s="/"!==t.path.charAt(0)?`/${t.path}`:t.path;o(t,"target",this.win.location.origin+s),o(t,"replace",!1);let i=t.replace;delete t.path,delete t.replace,t._t_ajax=!0,i?e.replaceState(t,"",s):e.pushState(t,"",s)}state_handle(t){let e,s=t.originalEvent.state;s&&s._t_ajax&&(t.preventDefault(),e=s.target.url?s.target:this.parse_target(s.target),e.params.popstate="1",s.action&&this.dispatcher.trigger("on_action",{target:e,action:s.action}),s.event&&this.dispatcher.trigger("on_event",{target:e,event:s.event}),s.overlay&&this.dispatcher.trigger("on_overlay",{target:e,overlay:s.overlay,css:s.overlay_css,uid:s.overlay_uid,title:s.overlay_title}),s.action||s.event||s.overlay||(this.win.location=e.url))}handle(t,e){let s,i=e.elem,n=e.event,r=i.attr("ajax:path");if("href"===r){r=d(i.attr("href"),!0)}else if("target"===r){let t=this.action_target(i,n);r=t.path+t.query}if(this.has_attr(i,"ajax:path-target")){let t=i.attr("ajax:path-target");t&&(s=this.parse_target(t))}else s=this.action_target(i,n);let a={path:r,target:s};a.action=this.attr_val(i,"ajax:path-action","ajax:action"),a.event=this.attr_val(i,"ajax:path-event","ajax:event"),a.overlay=this.attr_val(i,"ajax:path-overlay","ajax:overlay"),a.overlay&&(a.overlay_css=this.attr_val(i,"ajax:path-overlay-css","ajax:overlay-css"),a.overlay_uid=this.attr_val(i,"ajax:path-overlay-uid","ajax:overlay-uid"),a.overlay_title=this.attr_val(i,"ajax:path-overlay-title","ajax:overlay-title")),this.execute(a)}has_attr(t,e){let s=t.attr(e);return void 0!==s&&!1!==s}attr_val(t,e,s){return this.has_attr(t,e)?t.attr(e):t.attr(s)}}class Q extends z{constructor(t){t.event="on_event",super(t)}execute(t){let s=this.create_event.bind(this);e(t.selector).each(function(){e(this).trigger(s(t.name,t.target,t.data))})}create_event(t,s,i){let n=e.Event(t);return s.url?n.ajaxtarget=s:n.ajaxtarget=this.parse_target(s),n.ajaxdata=i,n}handle(t,e){let s=e.target,i=e.event;for(let t of this.parse_definition(i)){let e=t.split(":");this.execute({name:e[0],selector:e[1],target:s})}}}class Z extends B{constructor(t){super(),this.ajax=t,this.spinner=t.spinner}destroy(t){let e=new E;t.each(function(){e.walk(this)})}update(t){let s,i=t.payload,n=t.selector,r=t.mode;if("replace"===r){let t=e(n);this.destroy(t),t.replaceWith(i),s=e(n),s.length?this.ajax.bind(s.parent()):this.ajax.bind(e(document))}else"inner"===r&&(s=e(n),this.destroy(s.children()),s.html(i),this.ajax.bind(s))}next(t){if(t&&t.length){this.spinner.hide();for(let s of t){let t=s.type;if(delete s.type,"path"===t)this.ajax.path(s);else if("action"===t){let t=this.parse_target(s.target);s.url=t.url,s.params=t.params,this.ajax.action(s)}else if("event"===t)this.ajax.trigger(s);else if("overlay"===t){let t=this.parse_target(s.target);s.url=t.url,s.params=t.params,this.ajax.overlay(s)}else"message"===t&&(s.flavor?I({message:s.payload,flavor:s.flavor}):e(s.selector).html(s.payload))}}}}class tt extends b{constructor(t){super(),this.dispatcher=t.dispatcher,this.form=t.form}parse(t){let e=this.node_attrs(t);if(e["ajax:bind"]&&(e["ajax:action"]||e["ajax:event"]||e["ajax:overlay"])){let s=e["ajax:bind"];this.dispatcher.bind(t,s)}e["ajax:form"]&&this.form.bind(t),"form"===t.tagName.toLowerCase()&&t.className.split(" ").includes("ajax")&&this.form.bind(t)}}class et extends B{constructor(t=window){super(),this.win=t,this.binders={};let e=this.spinner=R,s=this.dispatcher=new U,i=this._request=new H({win:t});this._path=new Y({dispatcher:s,win:t}),this._event=new Q({dispatcher:s});let n=new Z(this),r={dispatcher:s,win:t,handle:n,spinner:e,request:i};this._action=new J(r),this._overlay=new K(r),this._form=new X({handle:n,spinner:e}),this._is_bound=!1}register(t,e){let s="binder_"+a();for(;void 0!==this.binders[s];)s="binder_"+a();this.binders[s]=t,e&&this._is_bound&&t()}bind(t){this._is_bound=!0;let e=new tt({dispatcher:this.dispatcher,form:this._form});t.each(function(){e.walk(this)});for(let e in this.binders)try{this.binders[e](t)}catch(t){console.log(t)}return t}attach(t,s){if(s instanceof e){if(1!=s.length)throw`${t.constructor.name}: Instance can be attached to exactly one DOM element`;s=s[0]}void 0===s._ajax_attached&&(s._ajax_attached=[]),s._ajax_attached.push(t)}path(t){this._path.execute(t)}action(t){this._action.execute(t)}trigger(t){arguments.length>1&&(s("Calling Ajax.event with positional arguments","opts","1.0"),t={name:arguments[0],selector:arguments[1],target:arguments[2],data:arguments[3]}),this._event.execute(t)}overlay(t){return this._overlay.execute(t)}form(t){this._form.render(t)}parseurl(t){return s("ts.ajax.parseurl","ts.parse_url","1.0"),h(t)}parsequery(t,e){return s("ts.ajax.parsequery","ts.parse_query","1.0"),c(t,e)}parsepath(t,e){return s("ts.ajax.parsepath","ts.parse_path","1.0"),d(t,e)}parsetarget(t){return s("ts.ajax.parsetarget","ts.ajax.parse_target","1.0"),this.parse_target(t)}message(t,e=""){s("ts.ajax.message","ts.show_message","1.0"),I({message:t,flavor:e})}info(t){s("ts.ajax.info","ts.show_info","1.0"),L(t)}warning(t){s("ts.ajax.warning","ts.show_warning","1.0"),D(t)}error(t){s("ts.ajax.error","ts.show_error","1.0"),F(t)}dialog(t,e){s("ts.ajax.dialog","ts.show_dialog","1.0"),W({message:t.message,on_confirm:function(){e(t)}})}request(t){s("ts.ajax.request","ts.http_request","1.0"),V(t)}}let st=new et;function it(t){let e=window.bootstrap.Dropdown.getInstance(t),s=window.bootstrap.Tooltip.getInstance(t);e&&e.dispose(),s&&s.dispose(),e=null,s=null}e.fn.tsajax=function(){return st.bind(this),this},e(function(){void 0!==window.bootstrap&&O(it)});class nt{constructor(t,...e){this._request_id=window.requestAnimationFrame(s=>{t(s,...e)})}cancel(){null!==this._request_id&&(window.cancelAnimationFrame(this._request_id),this._request_id=null)}}class rt{constructor(t,e,...s){this._timeout_id=window.setTimeout(()=>{t(document.timeline.currentTime,...s)},e)}cancel(){null!==this._timeout_id&&(window.clearTimeout(this._timeout_id),this._timeout_id=null)}}class at{constructor(t,e,...s){this._interval_id=window.setInterval(()=>{t(document.timeline.currentTime,this,...s)},e)}cancel(){null!==this._interval_id&&(window.clearInterval(this._interval_id),this._interval_id=null)}}class ot{schedule_frame(t,...e){return new nt(t,...e)}schedule_timeout(t,e,...s){return new rt(t,e,...s)}schedule_interval(t,e,...s){return new at(t,e,...s)}}let lt=new ot;function ht(t,e=null){if(!((e=e||A)===A||e.prototype instanceof A))throw"Base class must be subclass of or Events";return class extends e{constructor(s){e===A?super():super(s);let i=this.elem;if(i||void 0===s||(i=this.elem=s.elem),!i)throw"No element found";this.event=t,this.trigger_event=this.trigger_event.bind(this),this.elem.on(this.event,this.trigger_event),st.attach(this,this.elem)}trigger_event(e){this.trigger(`on_${t}`,e)}destroy(){this.elem.off(this.event,this.trigger_event)}}}let ct=ht("click"),dt=ht("change"),ut=t=>ht("change",t);class _t extends A{constructor(){super(),this._down_handle=null,this._down_scope=null,this._move_scope=null}reset_state(){this._move_handle=null,this._up_handle=null,this._prev_pos=null,this._motion=null}set_scope(t,s){if(this._up_handle)throw"Attempt to set motion scope while handling";this.reset_state(),this._down_handle&&e(this._down_scope).off("mousedown",this._down_handle),this._down_handle=this._mousedown.bind(this),this._down_scope=t,e(t).on("mousedown",this._down_handle),this._move_scope=s||null}_mousedown(t){t.stopPropagation(),this._motion=!1,this._prev_pos={x:t.pageX,y:t.pageY},this._move_scope&&(this._move_handle=this._mousemove.bind(this),e(this._move_scope).on("mousemove",this._move_handle)),this._up_handle=this._mouseup.bind(this),e(document).on("mouseup",this._up_handle),this.trigger("down",t)}_mousemove(t){t.stopPropagation(),this._motion=!0,t.motion=this._motion,t.prev_pos=this._prev_pos,this.trigger("move",t),this._prev_pos.x=t.pageX,this._prev_pos.y=t.pageY}_mouseup(t){t.stopPropagation(),this._move_scope&&e(this._move_scope).off("mousemove",this._move_handle),e(document).off("mouseup",this._up_handle),t.motion=this._motion,this.trigger("up",t),this.reset_state()}}class pt extends _t{constructor(t){super(),this.children=[],new g(this,"parent"),this.parent=t.parent||null}add_widget(t){t.parent=this,this.children.push(t)}remove_widget(t){t.parent=null,this.children.splice(this.children.indexOf(t),1)}acquire(t){let e=this.parent;for(;e&&e&&!(e instanceof t);)e=e.parent;return e}}class mt extends pt{constructor(t){super(t),this.elem=t.elem,new v(this,"x",{tgt:"left"}),new v(this,"y",{tgt:"top"}),new v(this,"width"),new v(this,"height")}get offset(){return e(this.elem).offset()}}class gt extends A{constructor(t){if(!t.elem)throw"No element given";super(),this.elem=t.elem}get visible(){return!this.elem.hasClass("hidden")}set visible(t){let e=t!==!this.elem.hasClass("hidden");r(this.elem,t),e&&this.trigger("on_visible",t)}get hidden(){return!this.visible}set hidden(t){this.visible=!t}}function ft(t,e){if(t.elem)return t.elem;let s=t.form,i=t.name;return n(`${e}-${s.name}-${i}`,s.elem,!0)}class vt extends A{constructor(t){super(),this.form=t.form,this.name=t.name,this.elem=ft(t,"#input")}get value(){return this.elem.val()}set value(t){this.elem.val(t)}get disabled(){return this.elem.prop("disabled")}set disabled(t){this.elem.prop("disabled",t)}}class xt extends(ut(vt)){constructor(t){t.elem=ft(t,"#input"),super(t)}get options(){return this.elem.prop("options")}set options(t){this.clear();let e=this.elem[0];for(let s of t)s instanceof Option?e.add(s):e.add(new Option(s[1],s[0]))}clear(){this.elem.empty()}}class wt extends(ut(vt)){constructor(t){t.elem=ft(t,"#input"),super(t)}get checked(){return this.elem.is(":checked")}set checked(t){return this.elem.prop("checked",t)}}return e(function(){st.spinner.hide(),e(document).tsajax()}),t.Ajax=et,t.AjaxAction=J,t.AjaxDestroy=E,t.AjaxDispatcher=U,t.AjaxEvent=Q,t.AjaxForm=X,t.AjaxHandle=Z,t.AjaxOperation=z,t.AjaxOverlay=K,t.AjaxParser=tt,t.AjaxPath=Y,t.AjaxUtil=B,t.AttrProperty=class extends f{set(t){this.ctx.attr(this.tgt,t),super.set(t)}},t.BoundProperty=f,t.Button=class extends ct{constructor(t){super(t),this.unselected_class=t.unselected_class??"btn-primary",this.selected_class=t.selected_class??"btn-success"}get selected(){return this.elem.hasClass(this.selected_class)}set selected(t){t?this.elem.removeClass(this.unselected_class).addClass(this.selected_class):this.elem.removeClass(this.selected_class).addClass(this.unselected_class)}},t.ButtonProperty=w,t.CSSProperty=v,t.ChangeListener=dt,t.ClickListener=ct,t.Clock=ot,t.ClockFrameEvent=nt,t.ClockIntervalEvent=at,t.ClockTimeoutEvent=rt,t.Collapsible=class{constructor(t){if(!t.elem)throw"No element given";this.elem=t.elem}get collapsed(){return!this.elem.hasClass("show")}set collapsed(t){t?this.elem.collapse("hide"):this.elem.collapse("show")}},t.DataProperty=class extends f{constructor(t,e,s){s?s.ctx=void 0!==s.ctx?s.ctx:t.data:s={ctx:t.data},s.ctxa="data",super(t,e,s)}set(t){this.ctx[this.tgt]=t,super.set(t)}},t.Dialog=M,t.Events=A,t.Form=class{static initialize(t,e,s){let n=i(`#form-${s}`,t,!0);if(!n)return;let r=new e({name:s,elem:n});n.data(s,r)}static instance(t){return e(`#form-${t}`).data(t)}constructor(t){this.name=t.name,this.elem=t.elem}set_field_visibility(t,e){for(let s of t)s.visible=e}},t.FormCheckbox=wt,t.FormField=class extends gt{constructor(t){t.elem=ft(t,"#field"),super(t),this.form=t.form,this.name=t.name;let e=t.input;!e||e instanceof vt||(e=new e({form:this.form,name:this.name})),this.input=e}get has_error(){return this.elem.hasClass("has-error")}set has_error(t){let e=this.elem;t?e.addClass("has-error"):e.removeClass("has-error")}reset(t=""){this.input.value=t,this.has_error=!1,e(".help-block",this.elem).remove()}},t.FormInput=vt,t.FormRemoteSelect=class extends xt{constructor(t){super(t),this.vocab=t.vocab}fetch(t){V({type:"json",url:this.vocab,params:t,success:function(t,e,s){this.options=t}.bind(this)})}},t.FormSelect=xt,t.HTMLParser=k,t.HTMLWidget=mt,t.HTTPRequest=H,t.InputProperty=x,t.KeyState=class extends A{constructor(t){super(),this.filter_keyevent=t,this._keys=[],this._add_key("ctrl",17),this._add_key("shift",16),this._add_key("alt",18),this._add_key("enter",13),this._add_key("esc",27),this._add_key("delete",46),this.bind()}unload(){e(window).off("keydown",this._on_dom_keydown).off("keyup",this._on_dom_keyup)}bind(){this._on_dom_keydown=this._on_dom_keydown.bind(this),this._on_dom_keyup=this._on_dom_keyup.bind(this),e(window).on("keydown",this._on_dom_keydown).on("keyup",this._on_dom_keyup)}_add_key(t,e){this._keys.push(t),this[`_${t}`]=!1,Object.defineProperty(this,t,{get:function(){return this[`_${t}`]},set:function(s){let i=this[`_${t}`];"keydown"==s.type?i||s.keyCode!=e||(this[`_${t}`]=!0):i&&s.keyCode==e&&(this[`_${t}`]=!1)}})}_set_keys(t){for(let e of this._keys)this[e]=t}_filter_event(t){return this.filter_keyevent&&this.filter_keyevent(t)}_on_dom_keydown(t){this._set_keys(t),this._filter_event(t)||this.trigger("keydown",t)}_on_dom_keyup(t){this._set_keys(t),this._filter_event(t)||this.trigger("keyup",t)}},t.LoadingSpinner=G,t.Message=P,t.Motion=_t,t.Overlay=q,t.Parser=b,t.Property=g,t.SVGContext=class extends mt{constructor(t){let e=t.parent.elem.get(0);t.elem=p("svg",{class:t.name},e),super(t),this.svg_ns=u,this.xyz={x:0,y:0,z:1}}svg_attrs(t,e){_(t,e)}svg_elem(t,e,s){return p(t,e,s)}},t.SVGParser=$,t.SVGProperty=class extends f{set(t){let e={};e[this._name]=t,_(this.ctx,e),super.set(t)}},t.TemplateParser=y,t.TextProperty=class extends f{set(t){this.ctx.text(t),super.set(t)}},t.Visibility=gt,t.WS_STATE_CLOSED=3,t.WS_STATE_CLOSING=2,t.WS_STATE_CONNECTING=0,t.WS_STATE_OPEN=1,t.Websocket=class extends A{constructor(t,e=WebSocket){super(),this._ws_factory=e,this.path=t,this.on_open=this.on_open.bind(this),this.on_close=this.on_close.bind(this),this.on_error=this.on_error.bind(this),this.on_message=this.on_message.bind(this),this.on_raw_message=this.on_raw_message.bind(this),this.sock=null}get uri(){let t;return t="http:"==window.location.protocol?"ws://":"wss://",t+window.location.hostname+this.path}get state(){return this.sock.readyState}open(){null!==this.sock&&this.sock.close();let t=this.sock=new this._ws_factory(this.uri);t.onopen=function(){this.trigger("on_open")}.bind(this),t.onclose=function(t){this.trigger("on_close",t)}.bind(this),t.onerror=function(){this.trigger("on_error")}.bind(this),t.onmessage=function(t){this.trigger("on_raw_message",t)}.bind(this)}send(t){this.sock.send(t)}send_json(t){this.sock.send(JSON.stringify(t))}close(){null!==this.sock&&(this.sock.close(),this.sock=null)}on_open(){}on_close(t){}on_error(){}on_message(t){}on_raw_message(t){let e=JSON.parse(t.data);void 0===e.HEARTBEAT&&this.trigger("on_message",e)}},t.Widget=pt,t.ajax=st,t.ajax_destroy=T,t.changeListener=ut,t.clickListener=t=>ht("click",t),t.clock=lt,t.compile_svg=function(t,e,s){let i=m(e,s),n=new $(t);return i.forEach(function(t,e){n.walk(t)}),i},t.compile_template=C,t.create_cookie=function(t,e,s){let i,n;s?(i=new Date,i.setTime(i.getTime()+24*s*60*60*1e3),n="; expires="+i.toGMTString()):n="",document.cookie=t+"="+escape(e)+n+"; path=/;"},t.create_listener=ht,t.create_svg_elem=p,t.deprecate=s,t.extract_number=j,t.get_elem=n,t.get_overlay=N,t.http_request=V,t.json_merge=function(t,e){let s={};for(let i of[t,e])for(let t in i)s[t]=i[t];return s},t.load_svg=function(t,s){e.get(t,function(t){let i=e(t).find("svg");i.removeAttr("xmlns:a"),s(i)}.bind(this),"xml")},t.lookup_form_elem=ft,t.object_by_path=function(t){if(!t)return null;let e=window;for(const s of t.split("."))if(e=e[s],void 0===e)throw`Object by path not exists: ${t}`;return e},t.parse_path=d,t.parse_query=c,t.parse_svg=m,t.parse_url=h,t.query_elem=i,t.read_cookie=function(t){let e,s,i=t+"=",n=document.cookie.split(";");for(e=0;e