fixed include static files, fixed string format in TableAjax

SE/se-lib/TableAjax.php

@@ -449,11 +449,11 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 			props = $.extend({}, defaultsProps, props);
 			funcNode = $('<a href="#" style="margin:0 2px;"></a>')
 	;
-	if ('href' in funObj) funcNode.attr('href', funObj.href.f(rowPK));
+	if ('href' in funObj) funcNode.attr('href', p5Utils__format(funObj.href, [rowPK]));
 	if (props.ico) {
 		if ('ico' in funObj) funcNode.append('<span class="' + funObj.ico + '"></span>');
 	}
-	if ('onclick' in funObj) funcNode.attr('onclick', funObj.onclick.f(rowPK));
+	if ('onclick' in funObj) funcNode.attr('onclick', p5Utils__format(funObj.onclick, [rowPK]));
 	if ('title' in funObj) funcNode.attr('title', funObj.title);
 	if ('target' in funObj) funcNode.attr('target', funObj.target);
 
@@ -952,7 +952,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 						// console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
 						return function(val, fieldPK, row) {
 							// console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
-							return _format.f(val);
+							return p5Utils__format(_format, [val]);
 						}
 					}(fldName, fieldProps));
 					break;
@@ -964,7 +964,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 						// console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
 						return function(val, fieldPK, row) {
 							// console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
-							return _format.f(val);
+							return p5Utils__format(_format, [val]);
 						}
 					}(fldName, fieldProps));
 					break;
@@ -975,7 +975,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 								_formatByValue = _.get(_fieldProps, 'formatByValue', null);
 						return function(val, fieldPK, row) {
 							if (_formatByValue && val in _formatByValue) {
-								return _formatByValue[val].f(val)
+								return p5Utils__format(_formatByValue[val], [val])
 							}
 							return val;
 						}
@@ -1023,7 +1023,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 						// console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
 						return function(val, fieldPK, row) {
 							// console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
-							return _format.f(val);
+							return p5Utils__format(_format, [val]);
 						}
 					}(fldName, fieldProps));
 					break;
@@ -1047,7 +1047,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 									}
 								});
 							}
-							return _format.f(valLink);
+							return p5Utils__format(_format, [valLink]);
 						}
 					}(fldName, fieldProps));
 					break;
@@ -1176,7 +1176,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				var check = _uniqueCols[props[_state.uniqueCol]] != undefined ? 'checked' : '';
 				var checkable = props['checkable'] === false ? 'disabled' : '';
 				cellNode = $('<td></td>').appendTo(rowNode);
-				$('<input class="unique" {0} {1} type="checkbox" />'.f(check, checkable)).appendTo(cellNode);
+				$(p5Utils__format('<input class="unique" {0} {1} type="checkbox" />', [check, checkable])).appendTo(cellNode);
 			}
 
 			if (uniqueColName) rowNode.data('unique', rowPK);
@@ -1217,7 +1217,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				if (columnProps._tsRetId) {
 					showTooltip = false;
 					if (columnProps._tsRetId > 0) {
-						cellCnt.on('click', {id:rowPK, col:columnName, friendly:columnProps.friendly, value:format.f(val)}, priv.popoverCellTypeSpecial);
+						cellCnt.on('click', {id:rowPK, col:columnName, friendly:columnProps.friendly, value:p5Utils__format(format, [val])}, priv.popoverCellTypeSpecial);
 					}
 				}
 
@@ -1472,7 +1472,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 			if (_state.uniqueCol && priv.options.checkboxes) {
 				var checked = _checkToggleChecked ? 'checked' : '';
 				var headCell = $('<th></th>').appendTo(node);
-				var elem = $('<input {0} class="checkToggle" type="checkbox" />'.f(checked)).appendTo(headCell);
+				var elem = $(p5Utils__format('<input {0} class="checkToggle" type="checkbox" />', [checked])).appendTo(headCell);
 				elem.on('change', priv.checkToggleChanged);
 			}
 
@@ -1484,38 +1484,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 					var headCell = $('<th class="ta-ordering"></th>').appendTo(node);
 					if (i == 1) headCell.addClass('stickyCol2');
 
-					if (false) {// TODO: old way
-						var link = $('<a class="pull-left" href="#">{0}</a>'.f(props.friendly || column));
-						link.on('click', {column: column}, priv.columnClicked).appendTo(headCell);
-
-						if (props.tooltip) {
-							$('<i class="glyphicon glyphicon-info-sign"></i>').tooltip({
-								title: props.tooltip.trim(),
-								html: true,
-								container: 'body',
-								placement: "top",
-								delay: {
-									show: 500,
-									hide: 100
-								}
-							}).appendTo(link);
-						}
-
-						//Add sort arrow
-						if (column == _state.filters.currSortCol) {
-							if (_state.filters.currSortFlip) $('<i class="glyphicon glyphicon-chevron-down pull-right"></i>').appendTo(headCell);
-							else $('<i class="glyphicon glyphicon-chevron-up pull-right"></i>').appendTo(headCell);
-						}
-
-						//Add hide btn
-						if (column != 'ID') {
-							var hideColBtn = $('<i class="glyphicon glyphicon-remove pull-right hover-show"></i>');
-							hideColBtn.on('click', {column: column},  priv.columnHideClicked);
-							hideColBtn.appendTo(headCell);
-						}
-					}
-
-					if (props.type != 'special' && props.type != 'geom') {
+					if (props.type != 'special' && props.type != 'geom') { // TODO: props.isSortable
 						headCell.on('click', {column: column}, priv.columnClicked);
 					}
 					var colTitle = column;
@@ -1528,9 +1497,9 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 					}
 
 					if (props.friendly) {
-						var headCnt = $('<span class="pull-left" title="{1}">{0}</span>'.f(props.friendly, colTitle));
+						var headCnt = $(p5Utils__format('<span class="pull-left" title="{1}">{0}</span>', [props.friendly, colTitle]));
 					} else {
-						var headCnt = $('<span class="pull-left" title="{1}">{0}</span>'.f(column, colTitle));
+						var headCnt = $(p5Utils__format('<span class="pull-left" title="{1}">{0}</span>', [column, colTitle]));
 					}
 					headCnt.appendTo(headCell);
 
@@ -1658,7 +1627,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 								placeHolder = (placeHolder === true || placeHolder == undefined) ? '' : placeHolder === false ? '' : placeHolder;
 								if (tooltip == undefined) tooltip = priv.options.types.number.filterTooltip;
 								tooltip = (tooltip === true || tooltip == undefined) ? '' : tooltip === false ? '' : tooltip;
-								elem = $('<input placeholder="{0}" class="filter" type="text" />'.f(placeHolder));
+								elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" />', [placeHolder]));
 								elem.on('keyup', {column: column}, priv.filterChanged);
 								break;
 						case "date":
@@ -1666,7 +1635,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 								placeHolder = (placeHolder === true || placeHolder == undefined) ? '' : placeHolder === false ? '' : placeHolder;
 								if (tooltip == undefined) tooltip = priv.options.types.date.filterTooltip;
 								tooltip = (tooltip === true || tooltip == undefined) ? '' : tooltip === false ? '' : tooltip;
-								elem = $('<div><input placeholder="{0}" class="filter" type="text" /></div>'.f(placeHolder));
+								elem = $(p5Utils__format('<div><input placeholder="{0}" class="filter" type="text" /></div>', [placeHolder]));
 
 								if (priv.options.types.date.datePicker === true || priv.options.types.date.datePicker == undefined)
 								{
@@ -1674,7 +1643,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 										{
 												elem.addClass('date-wrap');
 												var today = 0;//new priv.ext.XDate(false).setHours(0, 0, 0, 0).toString('yyyy-MM-dd');
-												var dp = $('<div style="float:right" class="date" data-date="{0}" data-date-format="{1}" />'.f(today, 'yyyy-mm-dd')).appendTo(elem);
+												var dp = $(p5Utils__format('<div style="float:right" class="date" data-date="{0}" data-date-format="{1}" />', [today, 'yyyy-mm-dd'])).appendTo(elem);
 												$('<input style="display:none" type="text"  />').appendTo(dp);
 												$('<span class="add-on"><i class="glyphicon glyphicon-chevron-right"></i></span>').on('click', {op: "l"}, priv.dpOpChanged).appendTo(dp);
 												$('<span class="add-on"><i class="glyphicon glyphicon-chevron-left"></i></span>').on('click', {op: "r"}, priv.dpOpChanged).appendTo(dp);
@@ -1700,7 +1669,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 								placeHolder = (placeHolder === true || placeHolder == undefined) ? '%' : placeHolder === false ? '' : placeHolder;
 								if (tooltip == undefined) tooltip = priv.options.types.string.filterTooltip;
 								tooltip = (tooltip === true || tooltip == undefined) ? 'Find str: str<br/>Find all but str: !str<br/>Find str inside: %str%' : tooltip === false ? '' : tooltip;
-								elem = $('<input placeholder="{0}" class="filter" type="text" size="8" />'.f(placeHolder));
+								elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" size="8" />', [placeHolder]));
 								elem.on('keyup', {column: column}, priv.filterChanged);
 								break;
 						case "special":
@@ -1712,7 +1681,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 						case "geom":
 								if (placeHolder == undefined) placeHolder = priv.options.types.string.placeHolder;
 								placeHolder = (placeHolder === true || placeHolder == undefined) ? '%' : placeHolder === false ? '' : placeHolder;
-								elem = $('<input placeholder="{0}" class="filter" type="text" size="8" />'.f(placeHolder));
+								elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" size="8" />', [placeHolder]));
 								elem.on('keyup', {column: column}, priv.filterChanged);
 								break;
 						case "none":
@@ -1790,7 +1759,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 			var total = _data.total;
 			var toRow = Math.min(fromRow + _state.pageSize, total);
 			if (_data.total > 0) {
-				$('<p>Wiersze od {0} do {1} z {2}</p>'.f(fromRow + 1, toRow, total)).appendTo(node);
+				$(p5Utils__format('<p>Wiersze od {0} do {1} z {2}</p>', [fromRow + 1, toRow, total])).appendTo(node);
 			} else {
 				$('<p>Brak wierszy pasujących do kryteriów wyszukiwania</p>').appendTo(node);
 			}
@@ -1817,33 +1786,33 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				if (lowerPage < 1) lowerPage = 1;
 				if (upperPage < 5) upperPage = 5;
 
-				//$('<li class="{0}"><a href="#">&lt;&lt;</a></li>'.f(currPage == 1 ? 'disabled' : ''))
-				$('<button type="button" class="btn btn-default{0}">&lt;&lt;</button>'.f(currPage == 1 ? ' disabled' : ''))
+				//$(p5Utils__format('<li class="{0}"><a href="#">&lt;&lt;</a></li>', [currPage == 1 ? 'disabled' : '']))
+				$(p5Utils__format('<button type="button" class="btn btn-default{0}">&lt;&lt;</button>', [currPage == 1 ? ' disabled' : '']))
 					.on('click', {pageIndex: 1}, priv.pageChanged)
 					.appendTo(node);
-				//$('<li class="{0}"><a href="#">&lt;</a></li>'.f(currPage == 1 ? 'disabled' : ''))
-				$('<button type="button" class="btn btn-default{0}">&lt;</button>'.f(currPage == 1 ? ' disabled' : ''))
+				//$(p5Utils__format('<li class="{0}"><a href="#">&lt;</a></li>', [currPage == 1 ? 'disabled' : '']))
+				$(p5Utils__format('<button type="button" class="btn btn-default{0}">&lt;</button>', [currPage == 1 ? ' disabled' : '']))
 					.on('click', {pageIndex: currPage - 1}, priv.pageChanged)
 					.appendTo(node);
 
 				for (var i = lowerPage; i <= upperPage; i++) {
 					var link;
-					//if (i != currPage) link = $('<li class="{1}"><a href="#">{0}</a></li>'.f(i, i > totalPages ? 'disabled' : ''));
-					if (i != currPage) link = $('<button type="button" class="btn btn-default{1}">{0}</button>'.f(i, i > totalPages ? 'disabled' : ''));
-					//if (i == currPage) link = $('<li class="active"><a href="#">{0}</a></li>'.f(i));
-					if (i == currPage) link = $('<button type="button" class="btn btn-default active">{0}</button>'.f(i));
+					//if (i != currPage) link = $(p5Utils__format('<li class="{1}"><a href="#">{0}</a></li>', [i, i > totalPages ? 'disabled' : '']));
+					if (i != currPage) link = $(p5Utils__format('<button type="button" class="btn btn-default{1}">{0}</button>', [i, i > totalPages ? 'disabled' : '']));
+					//if (i == currPage) link = $(p5Utils__format('<li class="active"><a href="#">{0}</a></li>', [i]));
+					if (i == currPage) link = $(p5Utils__format('<button type="button" class="btn btn-default active">{0}</button>', [i]));
 
 					if (link) {
 						link.on('click', {pageIndex: i}, priv.pageChanged);
 						link.appendTo(node);
 					}
 				}
-				//$('<li class="{0}"><a href="#">&gt;</a></li>'.f(currPage == totalPages ? 'disabled' : ''))
-				$('<button type="button" class="btn btn-default{0}">&gt;</button>'.f(currPage == totalPages ? ' disabled' : ''))
+				//$(p5Utils__format('<li class="{0}"><a href="#">&gt;</a></li>', [currPage == totalPages ? 'disabled' : '']))
+				$(p5Utils__format('<button type="button" class="btn btn-default{0}">&gt;</button>', [currPage == totalPages ? ' disabled' : '']))
 					.on('click', {pageIndex: currPage + 1}, priv.pageChanged)
 					.appendTo(node);
-				//$('<li class="{0}"><a href="#">&gt;&gt;</a></li>'.f(currPage == totalPages ? 'disabled' : ''))
-				$('<button type="button" class="btn btn-default{0}">&gt;&gt;</button>'.f(currPage == totalPages ? ' disabled' : ''))
+				//$(p5Utils__format('<li class="{0}"><a href="#">&gt;&gt;</a></li>', [currPage == totalPages ? 'disabled' : '']))
+				$(p5Utils__format('<button type="button" class="btn btn-default{0}">&gt;&gt;</button>', [currPage == totalPages ? ' disabled' : '']))
 					.on('click', {pageIndex: totalPages}, priv.pageChanged)
 					.appendTo(node);
 			} else {
@@ -1865,9 +1834,9 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				$.each(priv.options.pageSizes, function(index, val) {
 					var li = $('<li></li>').appendTo(ul);
 					if (val == priv.options.pageSize) {
-						$('<a style="color:#337AB7;">{0}</a>'.f(val)).appendTo(li);
+						$(p5Utils__format('<a style="color:#337AB7;">{0}</a>', [val])).appendTo(li);
 					} else {
-						$('<a href="#">{0}</a>'.f(val)).appendTo(li);
+						$(p5Utils__format('<a href="#">{0}</a>', [val])).appendTo(li);
 					}
 				});
 				node.on('click', 'a', priv.pageSizeChanged);
@@ -1909,7 +1878,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 					if (props.type != "unique" && col != 'ID') {
 						var li = $('<li></li>').appendTo(ul),
 								label = (props.friendly || col).replace(/<br\/?>/g, ' '),
-								input = '<input {0} type="checkbox" title="{1}" value="{1}" style="margin:0"/>&nbsp;{2}'.f((props.hidden) ? '' : 'checked', col, label),
+								input = p5Utils__format('<input {0} type="checkbox" title="{1}" value="{1}" style="margin:0"/>&nbsp;{2}', [(props.hidden) ? '' : 'checked', col, label]),
 								a = $('<a href="#" style="padding:0px 20px;">' + input + '</a>').appendTo(li);
 					}
 				});
@@ -1959,7 +1928,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				$.each(_data.cols, function(col, props) {
 					if (-1 !== priv.options.exportFields.indexOf(col)) {
 						var li = $('<li></li>').appendTo(ul);
-						$('<input {0} type="checkbox" title="{1}" value="{1}" >&nbsp;{2}</input>'.f((_exportFieldsSelect[col])? 'checked' : '', col, props.friendly || col)).appendTo(li);
+						$(p5Utils__format('<input {0} type="checkbox" title="{1}" value="{1}" >&nbsp;{2}</input>', [(_exportFieldsSelect[col])? 'checked' : '', col, props.friendly || col])).appendTo(li);
 						li.on('click', 'input', priv.exportFieldChanged);
 					}
 				});
@@ -2148,7 +2117,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 				return;
 			}
 
-			if (priv.options.debug) console.log('requesting data from url:{0} data:{1} L.<?php echo __LINE__; ?>'.f(priv.options.url, JSON.stringify(priv.options.urlData) || ''));
+			if (priv.options.debug) console.log(p5Utils__format('requesting data from url:{0} data:{1} L.<?php echo __LINE__; ?>', [priv.options.url, JSON.stringify(priv.options.urlData) || '']));
 
 			var initUrlAdd = '',
 				filtersInitSet = false;
@@ -2761,7 +2730,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 		priv.pageSizeChanged = function(e) {
 			e.preventDefault();
 			var val = $(this).text();
-			if (priv.options.debug) console.log('pagesize changed to:{0}'.f(val));
+			if (priv.options.debug) console.log(p5Utils__format('pagesize changed to:{0}', [val]));
 
 			if (parseInt(val) == priv.options.pageSize) {
 				return false;
@@ -2781,7 +2750,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 		 */
 		priv.columnClicked = function(e) {
 			e.preventDefault();
-			if (priv.options.debug) console.log('col:{0} clicked'.f(e.data.column));
+			if (priv.options.debug) console.log(p5Utils__format('col:{0} clicked', [e.data.column]));
 
 			//set the new sorting column
 			if (_state.filters.currSortCol == e.data.column) _state.filters.currSortFlip = !_state.filters.currSortFlip;
@@ -3149,7 +3118,7 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 
 			//get the row's unique value
 			var unique = elem.closest('tr').data('unique');
-			if (priv.options.debug) console.log('row({0}) {1}'.f(unique, elem.is(':checked') ? 'checked' : 'unchecked'));
+			if (priv.options.debug) console.log(p5Utils__format('row({0}) {1}', [unique, elem.is(':checked') ? 'checked' : 'unchecked']));
 
 			//store the row in checked array
 			if (elem.is(':checked')) _uniqueCols[unique] = priv.getRow(unique);
@@ -3517,14 +3486,6 @@ var p5UI_TableAjax_generateFunctionNode = function(funObj, rowPK, props) {
 			if (tblAjax) tblAjax.refresh();
 		});
 	};
-
-	String.prototype.format = String.prototype.f = function() {
-		var s = this;
-		i = arguments.length;
-		while (i--) s = s.replace(new RegExp('\\{' + i + '\\}', 'gm'), arguments[i]);
-		return s;
-	};
-
 })(jQuery);
 		</script>
 <?php
@@ -3803,7 +3764,7 @@ jQuery(document).ready(function(){
 						},
 						error: function(err) {
 							taskCnt.removeClass('AjaxTable-loading');
-							//console.log('request error: {0}'.f(err));
+							//console.log(p5Utils__format('request error: {0}', [err]));
 						}
 					});
 
@@ -3901,7 +3862,7 @@ jQuery(document).ready(function(){
 						},
 						error: function(err) {
 							taskCnt.removeClass('AjaxTable-loading');
-							//console.log('request error: {0}'.f(err));
+							//console.log(p5Utils__format('request error: {0}', [err]));
 						}
 					});
 					//return false;

SE/se-lib/UI.php

@@ -272,6 +272,19 @@ class UI {
 		UI::endTag('script', "\n");
 	}
 
+	public static function inlineRawJS($jsFile) {
+		if (!file_exists($jsFile)) throw new Exception("js file '" . basename($jsFile) . "' not exists!");
+		UI::startTag('script', [], "\n");
+		include $jsFile;
+		UI::endTag('script', "\n");
+	}
+
+	public static function inlineCSS($cssFile) {
+		UI::startTag('style', ['type'=>"text/css"], "\n");
+		include $cssFile;
+		UI::endTag('style', "\n");
+	}
+
 	public static function includeView($viewPath, $data = array()) {
 		if (!file_exists($viewPath)) throw new Exception("view file '" . basename($viewPath) . "' not exists!");
 		if (false === strpos($viewPath, APP_PATH_ROOT)) throw new Exception("Access Denied to include view '" . basename($viewPath) . "'!");

SE/se-lib/tmpl/_layout_gora.php

@@ -12,60 +12,12 @@
 	<link rel="stylesheet" href="stuff/jquery.selectize/css/selectize.bootstrap3.css" type="text/css" />
 	<link rel="stylesheet" href="stuff/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" type="text/css" />
 	<link rel="stylesheet" href="stuff/jquery-ui-smoothness/jquery-ui-1.10.4.custom.min.css" type="text/css">
-	<style type="text/css">
-body { margin:0; font-size:12px; line-height:18px; }
-body { <?php echo UI::fixFooterPosition('body_style'); ?> }
-
-#SE-menu { font-size:13px }
-#SE-menu { min-height:36px }
-#SE-menu > .container-fluid { padding:0 }
-#SE-menu .navbar { margin-bottom:0 }
-#SE-menu .navbar-form { margin-top:0; margin-bottom:0 }
-#SE-menu .nav > li > a { padding: 8px 10px 8px }
-#SE-menu { -webkit-border-radius:0; -moz-border-radius:0; border-radius:0 }
-#SE-menu-sub { border-bottom:2px solid #C53000; background:#eee }
-#SE-menu-sub .btn { margin:4px 2px }
-
-#SE-menu .bookmark-item-rem { opacity:0.5 }
-#SE-menu .bookmark-item-add { opacity:0.5 }
-#SE-menu .bookmark-item-rem:hover { opacity:1 }
-#SE-menu .bookmark-item-add:hover { opacity:1 }
-
-.tbl-view td { border-color:#eee }
-.tbl-view thead td { background:#f3f3f3 }
-.tbl-view tbody tr:hover td { background:#E6FFE6 }
-.tbl-view tbody tr.tbl-row-0,
-.tbl-view tbody tr.row-0 { background:#f3f3f3 }
-.tbl-view tbody tr.tbl-row-1,
-.tbl-view tbody tr.row-1 { background:#fff }
-.tbl-view input[type=text] { margin:0; padding:0 }
-
-.se-main-menu {}
-.se-main-menu td:hover { background-color:#f3f3f3 }
-
-.red { color:#f00 }
-.green { color:#0f0 }
-.blue { color:#00f }
-
-.hover-gray { color:#d3d3d3 }
-.hover-gray:hover { color:#808080 }
-
-.dropdown-menu a em {font-size:0.9em; color:#bbb;}
-
-.label-A_STATUS-NORMAL   { background:#aeffae; color:#555;    text-align:center; text-shadow:none; }
-.label-A_STATUS-WAITING  { background:#ffd2ff; color:#555;    text-align:center; text-shadow:none; }
-.label-A_STATUS-MONITOR  { background:#cccaff; color:#555;    text-align:center; text-shadow:none; }
-.label-A_STATUS-WARNING  { background:#ffbaba; color:#555;    text-align:center; text-shadow:none; }
-.label-A_STATUS-DELETED  { background:#e0e0e0; color:#808080; text-align:center; text-shadow:none; }
-.label-A_STATUS-OFF_SOFT { background:#fce3b7; color:#808080; text-align:center; text-shadow:none; }
-.label-A_STATUS-OFF_HARD { background:#eee;    color:#808080; text-align:center; text-shadow:none; }
-
-caption { font-size:medium }
-	</style>
-
-	<script src="static/fetch-polyfill.min.js"></script>
-	<script src="static/promise-polyfill.min.js"></script>
-
+<?php
+	UI::inlineCSS(APP_PATH_WWW . '/static/p5UI/main.css');
+	UI::inlineRawJS(APP_PATH_WWW . '/static/object-assign-polyfill.js');
+	UI::inlineRawJS(APP_PATH_WWW . '/static/fetch-polyfill.min.js');
+	UI::inlineRawJS(APP_PATH_WWW . '/static/promise-polyfill.min.js');
+?>
 	<script src="stuff/jquery-2.1.0.min.js"></script>
 	<script src="stuff/jquery-plugins.js"></script>
 	<script src="stuff/jquery.form.js"></script>
@@ -82,41 +34,6 @@ caption { font-size:medium }
 	<script src="stuff/lodash.min.js?_v=4.6.1"></script>
 	<script src="stuff/superagent.js"></script>
 	<script src="stuff/validate.min.js"></script>
-	<style type="text/css">
-.typepsecial .selectize-input { width:366px; padding:4px 6px; }
-.typepsecial .selectize-control::before {
-	-moz-transition: opacity 0.2s;
-	-webkit-transition: opacity 0.2s;
-	transition: opacity 0.2s;
-	content: ' ';
-	z-index: 2;
-	position: absolute;
-	display: block;
-	top: 12px;
-	right: 34px;
-	width: 16px;
-	height: 16px;
-	background: url(stuff/i/loading.gif);
-	background-size: 16px 16px;
-	opacity: 0;
-}
-.typepsecial .selectize-control.loading::before {
-	opacity: 0.4;
-}
-.typepsecial .selectize-control.single .selectize-input {
-	color: #333;
-	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
-	background-color: #fff;
-	background-image: none;
-	background-repeat: none;
-	border-color: #ccc;
-	filter: none;
-	-webkit-box-shadow: none;
-	-moz-box-shadow: none;
-	box-shadow: none;
-}
-
-	</style>
 	<?php S::printTimeoutUpdateJs(); ?>
 	<?php if (DBG::isActive()) : ?>
 		<script>
@@ -125,404 +42,17 @@ caption { font-size:medium }
 			});
 		</script>
 	<?php endif; ?>
-<script>
-if (typeof Object.assign != 'function') {
-	(function () {
-	  Object.assign = function (target) {
-	    'use strict';
-	    // We must check against these specific cases.
-	    if (target === undefined || target === null) {
-	      throw new TypeError('Cannot convert undefined or null to object');
-	    }
-
-	    var output = Object(target);
-	    for (var index = 1; index < arguments.length; index++) {
-	      var source = arguments[index];
-	      if (source !== undefined && source !== null) {
-	        for (var nextKey in source) {
-	          if (source.hasOwnProperty(nextKey)) {
-	            output[nextKey] = source[nextKey];
-	          }
-	        }
-	      }
-	    }
-	    return output;
-	  };
-	})();
-}
-</script>
-<style type="text/css">
-	.p5UI__dropdown-wrap { display:inline-block; position:relative }
-	.p5UI__dropdown-btn { position:relative }
-	.p5UI__dropdown-btn:hover {  }
-	.p5UI__dropdown-content { display:none; position:absolute; overflow:auto; min-width:230px; z-index: 1 }
-	.p5UI__dropdown-show { display:block }
-	.p5UI__dropdown-input { border-box:box-sizing; width:100% }
-</style>
-<script>
-function p5UI__dropdown(e, n, position, render) {// @position = ('right top', 'left top', 'left bottom', 'right bottom')
-	// e.stopPropagation()
-	// e.preventDefault()
-	var btnNode = n
-	var node = n.nextSibling
-	node.classList.toggle('p5UI__dropdown-show')
-	// console.log('>>> p5UI__dropdown...', {btnNode: btnNode, node: node, 'has show class': node.classList.contains('p5UI__dropdown-show')})
-	var position = position
-	if (node.classList.contains('p5UI__dropdown-show')) {
-		switch (position) {
-			case 'right top': node.style.bottom = '50px'; node.style.right = '100px'; break; // TODO ...
-			case 'left top': node.style.top = 0; node.style.left = '100px'; break; // TODO ...
-			case 'right bottom': node.style.left = '' + btnNode.offsetWidth + 'px'; node.style.top = 0; break; // TODO ...
-			case 'left bottom': node.style.right = '' + btnNode.offsetWidth + 'px'; node.style.top = 0; break;
-		}
-		node.p5UI__onClickOutsideCallback = p5UI__dropdown__onClickOutsideCallback(node, btnNode)
-		node.p5UI__unbindClickOutsideCallback = p5UI__dropdown__unbindClickOutsideCallback(node)
-		if (!document.addEventListener && document.attachEvent) {
-			document.attachEvent('onclick', node.p5UI__onClickOutsideCallback);
-			// document.attachEvent('keydown', this._closeModalKorespInfoIfHitEscape);
-		} else {
-			document.addEventListener('click', node.p5UI__onClickOutsideCallback);
-			// document.addEventListener('keydown', this._closeModalKorespInfoIfHitEscape);
-		}
-		if ('function' === typeof render) render(n, node)
-		// node.firstChild.focus() // TODO: find input
-	} else {
-		if ('function' === typeof node.p5UI__unbindClickOutsideCallback) {
-			node.p5UI__unbindClickOutsideCallback()
-			delete node.p5UI__onClickOutsideCallback
-			delete node.p5UI__unbindClickOutsideCallback
-		}
-	}
-}
-function p5UI__dropdown__unbindClickOutsideCallback(n) {
-	var node = n
-	return function __p5UI__dropdown__unbindClickOutsideCallback(e) {
-		// console.log('p5UI__dropdown__unbindClickOutsideCallback', {
-		// 	'opened': node.classList.contains('p5UI__dropdown-show'),
-		// 	'node': node,
-		// 	'typeof node.p5UI__onClickOutsideCallback': typeof node.p5UI__onClickOutsideCallback
-		// })
-		// console.trace()
-		if (!document.removeEventListener && document.detachEvent) {
-			document.detachEvent('onclick', node.p5UI__onClickOutsideCallback)
-			// document.detachEvent('keydown', this._closeModalKorespInfoIfHitEscape)
-		} else {
-			document.removeEventListener('click', node.p5UI__onClickOutsideCallback)
-			// document.removeEventListener('keydown', this._closeModalKorespInfoIfHitEscape)
-		}
-	}
-}
-function p5UI__dropdown__onClickOutsideCallback(n, btn) {
-	var node = n
-	var btnNode = btn
-	// console.log('define p5UI__dropdown__onClickOutsideCallback...')
-	return function __p5UI__dropdown__onClickOutsideCallback(e) {
-		// console.log('p5UI__dropdown__onClickOutsideCallback', {
-		// 	'opened': node.classList.contains('p5UI__dropdown-show'),
-		// 	'clickedOutside(node)': p5UI__clickedOutsideElement(node, e),
-		// 	'clickedOutside(btnNode)': p5UI__clickedOutsideElement(btnNode, e),
-		// 	'typeof node.p5UI__onClickOutsideCallback': typeof node.p5UI__onClickOutsideCallback,
-		// 	'typeof node.p5UI__unbindClickOutsideCallback': typeof node.p5UI__unbindClickOutsideCallback,
-		// })
-		if (!node.classList.contains('p5UI__dropdown-show')) return
-		if (node.p5UI__unbindClickOutsideCallback && 'function' == typeof node.p5UI__unbindClickOutsideCallback) {
-			if (p5UI__clickedOutsideElement(node, e) && p5UI__clickedOutsideElement(btnNode, e)) {
-				node.classList.remove('p5UI__dropdown-show')
-				node.p5UI__unbindClickOutsideCallback()
-			}
-		}
-	}
-}
-</script>
-<script>
-function p5UI__Clickable(n, eventNamespace, props) {
-	var dbg = <?php echo (DBG::isActive())? 1 : 0; ?>;
-	var eventNamespace = eventNamespace || 'p5UI__Clickable';
-	var $n = jQuery(n);
-	var state = {
-		baseCssClassNames: n.className,
-		props: props
-	};
-	jQuery(document).trigger(eventNamespace+':click', [n, state]);
-}
-
-function p5UI__ButtonAjax(n, eventNamespace, props) {
-	var dbg = <?php echo (DBG::isActive())? 1 : 0; ?>;
-	var eventNamespace = eventNamespace || 'p5UI__ButtonAjax';
-	var $n = jQuery(n);
-	var state = {
-		baseCssClassNames: n.className,
-		href: props.href
-	};
-	jQuery(document).trigger(eventNamespace+':click', [n, state]);
-	if ($n.hasClass('disabled')) {// bootstrap already prevent this action
-		if(dbg)console.log('WARNING: btn disabled - waiting for response - Cancel?');
-		return false;
-	}
-	$n.removeClass('btn-primary').addClass('btn-default disabled btn-loading');
-
-	var req = superagent
-		.post(props.href)
-		.type('json') // header ĺapplication/x-www-form-urlencoded' requires type('form');
-		.send(props.data)
-		.set('Accept', 'application/json')
-		.end(function(err, res) {
-			if(dbg)console.log('DBG: res:', res, 'res.body:', res.body);
-			$n.removeClass('btn-default disabled btn-loading').addClass(state.baseCssClassNames);
-			var payload;
-			if (err || !res.ok || 'application/json' !== res.type) {
-				payload = {type: 'warning', msg: res.body.msg || 'Request error', body: res.body};
-			} else {
-				payload = {type: res.body.type || 'success', msg: res.body.msg || '', body: res.body};
-			}
-			jQuery(document).trigger('DBG:notify', payload);
-			jQuery(document).trigger(eventNamespace+':ajaxLoaded', [n, payload]);
-			req = null;
-		});
-
-	// setTimeout(function() {
-	// 	console.log('Test click p5UI__ButtonAjax - setTimeOut', $n, state);
-	// 	jQuery(document).trigger('p5UI__ButtonAjax:ajaxLoaded', [n, state]);
-	// 	$n.removeClass('btn-default disabled btn-loading').addClass(state.baseCssClassNames);
-	// }, 1000);
-	return false;
-}
-
-function p5UI__ajaxLinkClick(n, href, data) {
-	if (!n || !href) return true;
-
-	var dbg = <?php echo (DBG::isActive())? 1 : 0; ?>;
-	var $n = jQuery(n);
-	if ($n.hasClass('disabled')) {// bootstrap already prevent this action
-		if(dbg)console.log('WARNING: btn disabled - waiting for response - Cancel?');
-		return false;
-	}
-	$n.removeClass('btn-primary').addClass('disabled btn-loading');
-
-	var req = superagent
-		.post(href)
-		.type('json') // header ĺapplication/x-www-form-urlencoded' requires type('form');
-		.send(data)
-		.set('Accept', 'application/json')
-		.end(function(err, res) {
-			if(dbg)console.log('DBG: res:', res, 'res.body:', res.body);
-			$n.removeClass('disabled btn-loading').addClass(state.baseCssClassNames);
-			var payload;
-			if (err || !res.ok || 'application/json' !== res.type) {
-				payload = {type: 'warning', msg: res.body.msg || 'Request error', body: res.body};
-			} else {
-				payload = {type: 'success', msg: res.body.msg || '', body: res.body};
-			}
-			if(dbg)console.log('DBG: before p5UI__notifyAjaxCallback:', payload);
-			p5UI__notifyAjaxCallback(payload);
-			if(dbg)console.log('DBG: before actions:', payload.body.actions);
-			if (payload.body.actions) {
-				for (i in payload.body.actions) {
-					p5UI__execAction(payload.body.actions[i]);
-				}
-			}
-			req = null;
-		});
-	return false;
-}
-
-function p5UI__execAction(action) {
-	var dbg = <?php echo (DBG::isActive())? 1 : 0; ?>;
-	if(dbg)console.log('DBG: action:', action);
-	if ('jsFunction' in action) {
-		if (action['jsFunction'] in window) {
-			if(dbg)console.log('TODO: exec "window[\''+action['jsFunction']+'\']( '+action['args']+' )"');
-			window[ action['jsFunction'] ]( action['args'] );
-		}
-		else {
-			if(dbg)console.log('BUG: jsFunction not exists "'+action['jsFunction']+'"');
-		}
-	} else {
-		if(dbg)console.log('TODO: action', action);
-	}
-}
-
-function p5UI__notifyAjaxCallback(data) {
-	var notify = {};
-	notify.type = (data && data.type)? data.type : '';
-	notify.msg = (data && data.msg)? data.msg : '';
-	switch (notify.type) {
-		case 'success':
-			if (!notify.msg) notify.msg = 'OK';
-			break;
-		case 'info':
-			if (!notify.msg) notify.msg = '';
-			break;
-		case 'error':
-			if (!notify.msg) notify.msg = 'Wystąpiły błędy';
-			break;
-		case 'warning':
-			notify.type = 'warn';
-			if (!notify.msg) notify.msg = 'Wystąpiły błędy';
-			break;
-		default:
-			notify.msg = 'Nieznany błąd';
-			if (data && data.errorCode) notify.msg += ' ' + data.errorCode;
-			notify.type = '';
-	}
-	jQuery.notify(notify.msg, notify.type);
-}
-
-function p5UI__clickedOutsideElement(element, event) {
-	// offsetParent - first parentNode with position: (relative | absolute)
-	var eventTarget = (event.target)? event.target : event.srcElement;
-	while (eventTarget != null) {
-		// console.log('Outside:', {'eventTarget': eventTarget, 'eventTarget.offsetParent': eventTarget.offsetParent, 'eventTarget.parentNode': eventTarget.parentNode});
-		if (eventTarget === element) return false;
-		eventTarget = eventTarget.offsetParent;
-	}
-	return true;
-}
-
-
-function p5Utils__parseFloatOrZero(strToParse) {
-	if (!strToParse) return 0
-	if ("string" === typeof strToParse) {
-		strToParse = strToParse.replace(/,/g, '.')
-		strToParse = strToParse.replace(/ /g, '')
-	}
-	var floatVal = parseFloat(strToParse)
-	return (!isNaN(floatVal))? floatVal : 0
-}
-
-function p5Utils__pricePrint(value, defaultValue) {
-	return p5Utils__pricePrintFormat(value, defaultValue, '.', ',');
-}
-
-function p5Utils__pricePrintPL(value, defaultValue) {
-	return p5Utils__pricePrintFormat(value, defaultValue, ',', ' ');
-}
-
-function p5Utils__pricePrintFormat(value, defaultValue, decPoint, thousands_sep) {
-	if (undefined === defaultValue) defaultValue = '';
-	if (!value && value !== 0 && value !== '0') return defaultValue;
-	if ("number" === typeof value) {
-	} else if ("string" === typeof value) {
-		value = p5Utils__parseFloatOrZero(value);
-		if (isNaN(value)) {
-			return defaultValue;
-		}
-	} else {
-		return defaultValue;
-	}
-	var valueParts = value.toFixed(2).split('.'),
-			firstPart = valueParts[0],
-			secondPart = valueParts[1],
-			parts = [],
-			minus = ''
-	;
-	if ('-' === firstPart.substr(0, 1)) {
-		minus = '-';
-		firstPart = firstPart.substr(1);
-	}
-	var len = firstPart.length,
-			str = firstPart,
-			i = 0
-	;
-	//console.log('pricePrint(value:'+value+'). valueParts', valueParts, 'len', len);
-	//console.log('pricePrint(value:'+value+'). START parts', parts, 'len', len, 'str', str);
-	while (len > 3) {
-		parts.unshift(str.substr(-3));
-		len -= 3;
-		str = str.substr(0, len);
-		//console.log('pricePrint(value:'+value+'). LOOP-'+i+' parts', parts, 'len', len, 'str', str);
-		i++;
-	}
-	if (len > 0) {
-		//console.log('pricePrint(value:'+value+'). PRE END parts', parts, 'len', len, 'str', str);
-		parts.unshift(str);
-	}
-	//console.log('pricePrint(value:'+value+'). END parts', parts, 'len', len, 'str', str);
-	return '' + minus + parts.join(thousands_sep) + decPoint + secondPart;
-}
-
-function p5Utils__clearNode(node) {
-	if (!node || !node.lastChild) return;
-	var lastNode;
-	while (lastNode = node.lastChild) node.removeChild(lastNode);
-}
-
-function p5Utils__nodeStyle(node, style) {
-	if (!node || !style) return;
-	for (i in style) node.style[i] = style[i];
-}
-	</script>
-	<script>
-function initDateTimePicker(node) {
-	node.find('.se_type-date').parent().datetimepicker({
-		format: "YYYY-MM-DD"
-		, locale: 'pl'
-		, showTodayButton: true
-	});
-	node.find('.se_type-datetime').parent().datetimepicker({
-		format: 'YYYY-MM-DD HH:mm'
-		, locale: 'pl'
-	});
-	node.find('.se_type-time').parent().datetimepicker({
-		format: 'HH:mm:ss'
-		, locale: 'pl'
-	});
-}
-jQuery(document).ready(function(){
-	initDateTimePicker(jQuery(document));
-});
-
-function ClearAllFind() {
-	var ElementsObj=document.forms["FILTER_SEARCH"] ;
-	var ElementsArr=ElementsObj.elements ;
-
-	for (var myprop in ElementsArr){
-
-	     if(ElementsArr[myprop]) {
-		if((ElementsArr[myprop].type=="text")||(ElementsArr[myprop].type=="select-one")){
-			var MyEval="var My"+ElementsArr[myprop].name+"=document.getElementById('"+ElementsArr[myprop].name+"\');";
-			eval(MyEval);
-			var MyEval="My"+ElementsArr[myprop].name+".value=\"%\"";
-			eval(MyEval);
-		}
-	     }
-	}
-}
-
-function resetForm(n) {
-	for (i = 0; i < n.form.elements.length; i++) {
-		switch (n.form.elements[i].type.toLowerCase()){
-			case 'text':
-				n.form.elements[i].value='%';
-				break;
-			case 'select-one':
-//				n.form.elements[i].options[0].selected = true;
-//				break;
-			case 'select-multiple':
-				for (z = 0; z < n.form.elements[i].options.length; z++) {
-					n.form.elements[i].options[z].selected = false;
-					if (n.form.elements[i].options[z].hasAttribute('selected')) {
-						n.form.elements[i].options[z].removeAttribute('selected');
-					}
-				}
-				// select first element
-				n.form.elements[i].options[0].selected = true;
-				n.form.elements[i].options[0].setAttribute('selected', 'selected');
-				break;
-			default:
-
-		}
-	}
-	return false;
-}
-	</script>
-
-	<?php UI::hButtonAjaxJsFunction(); ?>
-
-	<style type="text/css">
-.hidden-dbg { display:none; color:silver; }
-.show-hidden-dbg .hidden-dbg { display:inline; }
-	</style>
+<?php
+	UI::inlineCSS(APP_PATH_WWW . '/static/p5UI/typespecial-fix.css');
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/utils.js');
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/clickedOutsideElement.js');
+	UI::inlineCSS(APP_PATH_WWW . '/static/p5UI/dropdown.css');
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/dropdown.js');
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/clickable.js'); // , [ 'DBG' => DBG::isActive() ]);
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/ajax.js');
+	UI::inlineJS(APP_PATH_WWW . '/static/p5UI/legacy.js');
+	UI::hButtonAjaxJsFunction();
+?>
 <?php if (User::hasAccess('dbg')) : ?>
 	<script>
 jQuery(document).bind('keydown', 'alt+shift+`', function(){
@@ -533,5 +63,4 @@ jQuery(document).bind('keyup', 'alt+shift+`', function(){
 });
 	</script>
 <?php endif; ?>
-
 </head><body>

SE/static/object-assign-polyfill.js

@@ -0,0 +1,23 @@
+if (typeof Object.assign != 'function') {
+	(function () {
+	  Object.assign = function (target) {
+	    'use strict';
+	    // We must check against these specific cases.
+	    if (target === undefined || target === null) {
+	      throw new TypeError('Cannot convert undefined or null to object');
+	    }
+	    var output = Object(target)
+	    for (var index = 1; index < arguments.length; index++) {
+	      var source = arguments[index]
+	      if (source !== undefined && source !== null) {
+	        for (var nextKey in source) {
+	          if (source.hasOwnProperty(nextKey)) {
+	            output[nextKey] = source[nextKey]
+	          }
+	        }
+	      }
+	    }
+	    return output
+	  }
+	})();
+}

SE/static/p5UI/ajax.js

@@ -0,0 +1,125 @@
+var DBG = DBG || false
+
+function p5UI__ButtonAjax(n, eventNamespace, props) {
+	var eventNamespace = eventNamespace || 'p5UI__ButtonAjax';
+	var $n = jQuery(n);
+	var state = {
+		baseCssClassNames: n.className,
+		href: props.href
+	};
+	jQuery(document).trigger(eventNamespace+':click', [n, state]);
+	if ($n.hasClass('disabled')) {// bootstrap already prevent this action
+		if(DBG)console.log('WARNING: btn disabled - waiting for response - Cancel?');
+		return false;
+	}
+	$n.removeClass('btn-primary').addClass('btn-default disabled btn-loading');
+
+	var req = superagent
+		.post(props.href)
+		.type('json') // header ĺapplication/x-www-form-urlencoded' requires type('form');
+		.send(props.data)
+		.set('Accept', 'application/json')
+		.end(function(err, res) {
+			if(DBG)console.log('DBG: res:', res, 'res.body:', res.body);
+			$n.removeClass('btn-default disabled btn-loading').addClass(state.baseCssClassNames);
+			var payload;
+			if (err || !res.ok || 'application/json' !== res.type) {
+				payload = {type: 'warning', msg: res.body.msg || 'Request error', body: res.body};
+			} else {
+				payload = {type: res.body.type || 'success', msg: res.body.msg || '', body: res.body};
+			}
+			jQuery(document).trigger('DBG:notify', payload);
+			jQuery(document).trigger(eventNamespace+':ajaxLoaded', [n, payload]);
+			req = null;
+		});
+
+	// setTimeout(function() {
+	// 	console.log('Test click p5UI__ButtonAjax - setTimeOut', $n, state);
+	// 	jQuery(document).trigger('p5UI__ButtonAjax:ajaxLoaded', [n, state]);
+	// 	$n.removeClass('btn-default disabled btn-loading').addClass(state.baseCssClassNames);
+	// }, 1000);
+	return false;
+}
+
+function p5UI__ajaxLinkClick(n, href, data) {
+	if (!n || !href) return true;
+
+	var $n = jQuery(n);
+	if ($n.hasClass('disabled')) {// bootstrap already prevent this action
+		if(DBG)console.log('WARNING: btn disabled - waiting for response - Cancel?');
+		return false;
+	}
+	$n.removeClass('btn-primary').addClass('disabled btn-loading');
+
+	var req = superagent
+		.post(href)
+		.type('json') // header ĺapplication/x-www-form-urlencoded' requires type('form');
+		.send(data)
+		.set('Accept', 'application/json')
+		.end(function(err, res) {
+			if(DBG)console.log('DBG: res:', res, 'res.body:', res.body);
+			$n.removeClass('disabled btn-loading').addClass(state.baseCssClassNames);
+			var payload;
+			if (err || !res.ok || 'application/json' !== res.type) {
+				payload = {type: 'warning', msg: res.body.msg || 'Request error', body: res.body};
+			} else {
+				payload = {type: 'success', msg: res.body.msg || '', body: res.body};
+			}
+			if(DBG)console.log('DBG: before p5UI__notifyAjaxCallback:', payload);
+			p5UI__notifyAjaxCallback(payload);
+			if(DBG)console.log('DBG: before actions:', payload.body.actions);
+			if (payload.body.actions) {
+				for (i in payload.body.actions) {
+					p5UI__execAction(payload.body.actions[i]);
+				}
+			}
+			req = null;
+		});
+	return false;
+}
+
+function p5UI__execAction(action) {
+	if(DBG)console.log('DBG: action:', action);
+	if ('jsFunction' in action) {
+		if (action['jsFunction'] in window) {
+			if(DBG)console.log('TODO: exec "window[\''+action['jsFunction']+'\']( '+action['args']+' )"');
+			window[ action['jsFunction'] ]( action['args'] );
+		}
+		else {
+			if(DBG)console.log('BUG: jsFunction not exists "'+action['jsFunction']+'"');
+		}
+	} else {
+		if(DBG)console.log('TODO: action', action);
+	}
+}
+
+function p5UI__notifyAjaxCallback(data) {
+	var notify = {};
+	notify.type = (data && data.type)? data.type : '';
+	notify.msg = (data && data.msg)? data.msg : '';
+	switch (notify.type) {
+		case 'success':
+			if (!notify.msg) notify.msg = 'OK';
+			break;
+		case 'info':
+			if (!notify.msg) notify.msg = '';
+			break;
+		case 'error':
+			if (!notify.msg) notify.msg = 'Wystąpiły błędy';
+			break;
+		case 'warning':
+			notify.type = 'warn';
+			if (!notify.msg) notify.msg = 'Wystąpiły błędy';
+			break;
+		default:
+			notify.msg = 'Nieznany błąd';
+			if (data && data.errorCode) notify.msg += ' ' + data.errorCode;
+			notify.type = '';
+	}
+	jQuery.notify(notify.msg, notify.type);
+}
+
+global.p5UI__ButtonAjax = p5UI__ButtonAjax
+global.p5UI__ajaxLinkClick = p5UI__ajaxLinkClick
+global.p5UI__execAction = p5UI__execAction
+global.p5UI__notifyAjaxCallback = p5UI__notifyAjaxCallback

SE/static/p5UI/clickable.js

@@ -0,0 +1,11 @@
+function p5UI__Clickable(n, eventNamespace, props) {
+	var eventNamespace = eventNamespace || 'p5UI__Clickable';
+	var $n = jQuery(n);
+	var state = {
+		baseCssClassNames: n.className,
+		props: props
+	};
+	jQuery(document).trigger(eventNamespace+':click', [n, state]);
+}
+
+global.p5UI__Clickable = p5UI__Clickable

SE/static/p5UI/clickedOutsideElement.js

@@ -0,0 +1,12 @@
+function p5UI__clickedOutsideElement(element, event) {
+	// offsetParent - first parentNode with position: (relative | absolute)
+	var eventTarget = (event.target)? event.target : event.srcElement;
+	while (eventTarget != null) {
+		// console.log('Outside:', {'eventTarget': eventTarget, 'eventTarget.offsetParent': eventTarget.offsetParent, 'eventTarget.parentNode': eventTarget.parentNode});
+		if (eventTarget === element) return false;
+		eventTarget = eventTarget.offsetParent;
+	}
+	return true;
+}
+
+global.p5UI__clickedOutsideElement = p5UI__clickedOutsideElement

SE/static/p5UI/dropdown.css

@@ -0,0 +1,6 @@
+.p5UI__dropdown-wrap { display:inline-block; position:relative }
+.p5UI__dropdown-btn { position:relative }
+.p5UI__dropdown-btn:hover {  }
+.p5UI__dropdown-content { display:none; position:absolute; overflow:auto; min-width:230px; z-index: 1 }
+.p5UI__dropdown-show { display:block }
+.p5UI__dropdown-input { border-box:box-sizing; width:100% }

SE/static/p5UI/dropdown.js

@@ -0,0 +1,77 @@
+function p5UI__dropdown(e, n, position, render) {// @position = ('right top', 'left top', 'left bottom', 'right bottom')
+	// e.stopPropagation()
+	// e.preventDefault()
+	var btnNode = n
+	var node = n.nextSibling
+	node.classList.toggle('p5UI__dropdown-show')
+	// console.log('>>> p5UI__dropdown...', {btnNode: btnNode, node: node, 'has show class': node.classList.contains('p5UI__dropdown-show')})
+	var position = position
+	if (node.classList.contains('p5UI__dropdown-show')) {
+		switch (position) {
+			case 'right top': node.style.bottom = '50px'; node.style.right = '100px'; break; // TODO ...
+			case 'left top': node.style.top = 0; node.style.left = '100px'; break; // TODO ...
+			case 'right bottom': node.style.left = '' + btnNode.offsetWidth + 'px'; node.style.top = 0; break; // TODO ...
+			case 'left bottom': node.style.right = '' + btnNode.offsetWidth + 'px'; node.style.top = 0; break;
+		}
+		node.p5UI__onClickOutsideCallback = p5UI__dropdown__onClickOutsideCallback(node, btnNode)
+		node.p5UI__unbindClickOutsideCallback = p5UI__dropdown__unbindClickOutsideCallback(node)
+		if (!document.addEventListener && document.attachEvent) {
+			document.attachEvent('onclick', node.p5UI__onClickOutsideCallback);
+			// document.attachEvent('keydown', this._closeModalKorespInfoIfHitEscape);
+		} else {
+			document.addEventListener('click', node.p5UI__onClickOutsideCallback);
+			// document.addEventListener('keydown', this._closeModalKorespInfoIfHitEscape);
+		}
+		if ('function' === typeof render) render(n, node)
+		// node.firstChild.focus() // TODO: find input
+	} else {
+		if ('function' === typeof node.p5UI__unbindClickOutsideCallback) {
+			node.p5UI__unbindClickOutsideCallback()
+			delete node.p5UI__onClickOutsideCallback
+			delete node.p5UI__unbindClickOutsideCallback
+		}
+	}
+}
+function p5UI__dropdown__unbindClickOutsideCallback(n) {
+	var node = n
+	return function __p5UI__dropdown__unbindClickOutsideCallback(e) {
+		// console.log('p5UI__dropdown__unbindClickOutsideCallback', {
+		// 	'opened': node.classList.contains('p5UI__dropdown-show'),
+		// 	'node': node,
+		// 	'typeof node.p5UI__onClickOutsideCallback': typeof node.p5UI__onClickOutsideCallback
+		// })
+		// console.trace()
+		if (!document.removeEventListener && document.detachEvent) {
+			document.detachEvent('onclick', node.p5UI__onClickOutsideCallback)
+			// document.detachEvent('keydown', this._closeModalKorespInfoIfHitEscape)
+		} else {
+			document.removeEventListener('click', node.p5UI__onClickOutsideCallback)
+			// document.removeEventListener('keydown', this._closeModalKorespInfoIfHitEscape)
+		}
+	}
+}
+function p5UI__dropdown__onClickOutsideCallback(n, btn) {
+	var node = n
+	var btnNode = btn
+	// console.log('define p5UI__dropdown__onClickOutsideCallback...')
+	return function __p5UI__dropdown__onClickOutsideCallback(e) {
+		// console.log('p5UI__dropdown__onClickOutsideCallback', {
+		// 	'opened': node.classList.contains('p5UI__dropdown-show'),
+		// 	'clickedOutside(node)': p5UI__clickedOutsideElement(node, e),
+		// 	'clickedOutside(btnNode)': p5UI__clickedOutsideElement(btnNode, e),
+		// 	'typeof node.p5UI__onClickOutsideCallback': typeof node.p5UI__onClickOutsideCallback,
+		// 	'typeof node.p5UI__unbindClickOutsideCallback': typeof node.p5UI__unbindClickOutsideCallback,
+		// })
+		if (!node.classList.contains('p5UI__dropdown-show')) return
+		if (node.p5UI__unbindClickOutsideCallback && 'function' == typeof node.p5UI__unbindClickOutsideCallback) {
+			if (p5UI__clickedOutsideElement(node, e) && p5UI__clickedOutsideElement(btnNode, e)) {
+				node.classList.remove('p5UI__dropdown-show')
+				node.p5UI__unbindClickOutsideCallback()
+			}
+		}
+	}
+}
+
+global.p5UI__dropdown = p5UI__dropdown
+global.p5UI__dropdown__unbindClickOutsideCallback = p5UI__dropdown__unbindClickOutsideCallback
+global.p5UI__dropdown__onClickOutsideCallback = p5UI__dropdown__onClickOutsideCallback

SE/static/p5UI/legacy.js

@@ -0,0 +1,66 @@
+function initDateTimePicker(node) {
+	node.find('.se_type-date').parent().datetimepicker({
+		format: "YYYY-MM-DD"
+		, locale: 'pl'
+		, showTodayButton: true
+	});
+	node.find('.se_type-datetime').parent().datetimepicker({
+		format: 'YYYY-MM-DD HH:mm'
+		, locale: 'pl'
+	});
+	node.find('.se_type-time').parent().datetimepicker({
+		format: 'HH:mm:ss'
+		, locale: 'pl'
+	});
+}
+jQuery(document).ready(function(){
+	initDateTimePicker(jQuery(document));
+});
+
+function ClearAllFind() {
+	var ElementsObj=document.forms["FILTER_SEARCH"] ;
+	var ElementsArr=ElementsObj.elements ;
+
+	for (var myprop in ElementsArr){
+
+	     if(ElementsArr[myprop]) {
+		if((ElementsArr[myprop].type=="text")||(ElementsArr[myprop].type=="select-one")){
+			var MyEval="var My"+ElementsArr[myprop].name+"=document.getElementById('"+ElementsArr[myprop].name+"\');";
+			eval(MyEval);
+			var MyEval="My"+ElementsArr[myprop].name+".value=\"%\"";
+			eval(MyEval);
+		}
+	     }
+	}
+}
+
+function resetForm(n) {
+	for (i = 0; i < n.form.elements.length; i++) {
+		switch (n.form.elements[i].type.toLowerCase()){
+			case 'text':
+				n.form.elements[i].value='%';
+				break;
+			case 'select-one':
+//				n.form.elements[i].options[0].selected = true;
+//				break;
+			case 'select-multiple':
+				for (z = 0; z < n.form.elements[i].options.length; z++) {
+					n.form.elements[i].options[z].selected = false;
+					if (n.form.elements[i].options[z].hasAttribute('selected')) {
+						n.form.elements[i].options[z].removeAttribute('selected');
+					}
+				}
+				// select first element
+				n.form.elements[i].options[0].selected = true;
+				n.form.elements[i].options[0].setAttribute('selected', 'selected');
+				break;
+			default:
+
+		}
+	}
+	return false;
+}
+
+global.initDateTimePicker = initDateTimePicker
+global.ClearAllFind = ClearAllFind
+global.resetForm = resetForm

SE/static/p5UI/main.css

@@ -0,0 +1,51 @@
+body { margin:0; font-size:12px; line-height:18px; }
+body { <?php echo UI::fixFooterPosition('body_style'); ?> }
+
+#SE-menu { font-size:13px }
+#SE-menu { min-height:36px }
+#SE-menu > .container-fluid { padding:0 }
+#SE-menu .navbar { margin-bottom:0 }
+#SE-menu .navbar-form { margin-top:0; margin-bottom:0 }
+#SE-menu .nav > li > a { padding: 8px 10px 8px }
+#SE-menu { -webkit-border-radius:0; -moz-border-radius:0; border-radius:0 }
+#SE-menu-sub { border-bottom:2px solid #C53000; background:#eee }
+#SE-menu-sub .btn { margin:4px 2px }
+
+#SE-menu .bookmark-item-rem { opacity:0.5 }
+#SE-menu .bookmark-item-add { opacity:0.5 }
+#SE-menu .bookmark-item-rem:hover { opacity:1 }
+#SE-menu .bookmark-item-add:hover { opacity:1 }
+
+.tbl-view td { border-color:#eee }
+.tbl-view thead td { background:#f3f3f3 }
+.tbl-view tbody tr:hover td { background:#E6FFE6 }
+.tbl-view tbody tr.tbl-row-0,
+.tbl-view tbody tr.row-0 { background:#f3f3f3 }
+.tbl-view tbody tr.tbl-row-1,
+.tbl-view tbody tr.row-1 { background:#fff }
+.tbl-view input[type=text] { margin:0; padding:0 }
+
+.se-main-menu {}
+.se-main-menu td:hover { background-color:#f3f3f3 }
+
+.red { color:#f00 }
+.green { color:#0f0 }
+.blue { color:#00f }
+
+.hover-gray { color:#d3d3d3 }
+.hover-gray:hover { color:#808080 }
+
+.dropdown-menu a em {font-size:0.9em; color:#bbb;}
+
+.label-A_STATUS-NORMAL   { background:#aeffae; color:#555;    text-align:center; text-shadow:none; }
+.label-A_STATUS-WAITING  { background:#ffd2ff; color:#555;    text-align:center; text-shadow:none; }
+.label-A_STATUS-MONITOR  { background:#cccaff; color:#555;    text-align:center; text-shadow:none; }
+.label-A_STATUS-WARNING  { background:#ffbaba; color:#555;    text-align:center; text-shadow:none; }
+.label-A_STATUS-DELETED  { background:#e0e0e0; color:#808080; text-align:center; text-shadow:none; }
+.label-A_STATUS-OFF_SOFT { background:#fce3b7; color:#808080; text-align:center; text-shadow:none; }
+.label-A_STATUS-OFF_HARD { background:#eee;    color:#808080; text-align:center; text-shadow:none; }
+
+caption { font-size:medium }
+
+.hidden-dbg { display:none; color:silver; }
+.show-hidden-dbg .hidden-dbg { display:inline; }

SE/static/p5UI/typespecial-fix.css

@@ -0,0 +1,32 @@
+.typepsecial .selectize-input { width:366px; padding:4px 6px; }
+.typepsecial .selectize-control::before {
+	-moz-transition: opacity 0.2s;
+	-webkit-transition: opacity 0.2s;
+	transition: opacity 0.2s;
+	content: ' ';
+	z-index: 2;
+	position: absolute;
+	display: block;
+	top: 12px;
+	right: 34px;
+	width: 16px;
+	height: 16px;
+	background: url(stuff/i/loading.gif);
+	background-size: 16px 16px;
+	opacity: 0;
+}
+.typepsecial .selectize-control.loading::before {
+	opacity: 0.4;
+}
+.typepsecial .selectize-control.single .selectize-input {
+	color: #333;
+	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
+	background-color: #fff;
+	background-image: none;
+	background-repeat: none;
+	border-color: #ccc;
+	filter: none;
+	-webkit-box-shadow: none;
+	-moz-box-shadow: none;
+	box-shadow: none;
+}

SE/static/p5UI/utils.js

@@ -0,0 +1,83 @@
+function p5Utils__format(str, args) {
+	return args.reduce(
+		function (ret, arg, idx) {
+			return ret.replace(new RegExp('\\{' + idx + '\\}', 'gm'), arg)
+		},
+		str
+	)
+}
+
+function p5Utils__parseFloatOrZero(strToParse) {
+	if (!strToParse) return 0
+	if ("string" === typeof strToParse) {
+		strToParse = strToParse.replace(/,/g, '.')
+		strToParse = strToParse.replace(/ /g, '')
+	}
+	var floatVal = parseFloat(strToParse)
+	return (!isNaN(floatVal))? floatVal : 0
+}
+
+function p5Utils__pricePrint(value, defaultValue) {
+	return p5Utils__pricePrintFormat(value, defaultValue, '.', ',');
+}
+
+function p5Utils__pricePrintPL(value, defaultValue) {
+	return p5Utils__pricePrintFormat(value, defaultValue, ',', ' ');
+}
+
+function p5Utils__pricePrintFormat(value, defaultValue, decPoint, thousands_sep) {
+	if (undefined === defaultValue) defaultValue = '';
+	if (!value && value !== 0 && value !== '0') return defaultValue;
+	if ("number" === typeof value) {
+	} else if ("string" === typeof value) {
+		value = p5Utils__parseFloatOrZero(value);
+		if (isNaN(value)) {
+			return defaultValue;
+		}
+	} else {
+		return defaultValue;
+	}
+	var valueParts = value.toFixed(2).split('.'),
+			firstPart = valueParts[0],
+			secondPart = valueParts[1],
+			parts = [],
+			minus = ''
+	;
+	if ('-' === firstPart.substr(0, 1)) {
+		minus = '-';
+		firstPart = firstPart.substr(1);
+	}
+	var len = firstPart.length,
+			str = firstPart,
+			i = 0
+	;
+	while (len > 3) {
+		parts.unshift(str.substr(-3));
+		len -= 3;
+		str = str.substr(0, len);
+		i++;
+	}
+	if (len > 0) {
+		parts.unshift(str);
+	}
+	return '' + minus + parts.join(thousands_sep) + decPoint + secondPart;
+}
+
+function p5Utils__clearNode(node) {
+	if (!node || !node.lastChild) return;
+	var lastNode;
+	while (lastNode = node.lastChild) node.removeChild(lastNode);
+}
+
+function p5Utils__nodeStyle(node, style) {
+	if (!node || !style) return;
+	for (i in style) node.style[i] = style[i];
+}
+
+global.p5Utils__format = p5Utils__format
+global.p5Utils__parseFloatOrZero = p5Utils__parseFloatOrZero
+global.p5Utils__pricePrint = p5Utils__pricePrint
+global.p5Utils__pricePrintPL = p5Utils__pricePrintPL
+global.p5Utils__pricePrintFormat = p5Utils__pricePrintFormat
+global.p5Utils__clearNode = p5Utils__clearNode
+global.p5Utils__nodeStyle = p5Utils__nodeStyle