pixl-xyapp 2.1.5 → 2.1.7

package/README.md

@@ -355,7 +355,7 @@ The pagination links work by constructing self-referencing URL to the current pa
 
 Since the `limit` is set to 5 items per page, and `offset` starts at `0`, then the next page (page 2) will be at offset `5`.  This link is simply a hashtag anchor tag, which doesn't reload the browser page, but will instead be caught by the navigation system, and call your page's `onDeactivate()` then its `onActivate()` with the new values.  It is up to your page code to redraw the table with the new data chunk and new `offset` value.
 
-Instead of generating hashtag anchor links, you can optionally provide a custom JavaScript function in a `pagination_link` property, which will be written into the HTML as an `onMouseUp` handler on each link, and called instead of a standard link.  Note that it must be a string and globally accessible, so remember the `$P()` shortcut to get access to the current page.  Example:
+Instead of generating hashtag anchor links, you can optionally provide a custom JavaScript function in a `pagination_link` property, which will be written into the HTML as an `onClick` handler on each link, and called instead of a standard link.  Note that it must be a string and globally accessible, so remember the `$P()` shortcut to get access to the current page.  Example:
 
 ```javascript
 	pagination_link: '$P().tableNavClick'
@@ -370,7 +370,7 @@ Notification messages are shown in a fixed bar at the top of the screen, regardl
 To use the notification system in your app, make sure this markup is in your main HTML page:
 
 ```html
-	<div id="d_message" class="message" style="display:none" onMouseUp="app.hideMessage(250)">
+	<div id="d_message" class="message" style="display:none" onClick="app.hideMessage(250)">
 		<div id="d_message_inner" class="message_inner"></div>
 	</div>
 ```

package/css/base.css

@@ -1,5 +1,5 @@
-/* Orchestra Base Theme */
-/* Copyright (c) 2019 Joseph Huckaby - Sustainable Use License */
+/* xyOps Base Theme */
+/* Copyright (c) 2019 Joseph Huckaby - MIT License */
 
 * {
 	box-sizing: border-box;
@@ -112,22 +112,22 @@ body.dark {
 	--gray: rgb(98, 107, 115);
 	--gray-highlight: color-mix(in srgb, rgb(98, 107, 115) 80%, white);
 	
-	--border-color: rgb(50, 54, 58);
+	--border-color: rgb(50, 50, 58);
 	--shadow-color: rgba(0, 0, 0, 0.0);
-	--background-color: rgb(24, 28, 32);
-	--header-background-color: rgb(32, 34, 38);
-	--header-text-color: rgb(125, 135, 150);
-	--box-background-color: rgb(32, 34, 38);
-	--form-background-color: rgb(40, 44, 48);
+	--background-color: rgb(24, 24, 32);
+	--header-background-color: rgb(32, 32, 38);
+	--header-text-color: rgb(125, 125, 150);
+	--box-background-color: rgb(32, 32, 38);
+	--form-background-color: rgb(40, 40, 48);
 	--table-header-background-color: rgba(200, 225, 255, 0.03);
 	
-	--sidebar-background-color: rgb(32, 34, 38);
-	--sidebar-text-color: rgb(125, 135, 150);
+	--sidebar-background-color: rgb(32, 32, 38);
+	--sidebar-text-color: rgb(125, 125, 150);
 	
-	--body-text-color: rgb(170, 180, 200);
-	--link-color: rgb(145, 155, 170);
-	--label-color: rgb(145, 155, 170);
-	--alt-label-color: rgb(120, 125, 130);
+	--body-text-color: rgb(170, 170, 200);
+	--link-color: rgb(145, 145, 170);
+	--label-color: rgb(145, 145, 170);
+	--alt-label-color: rgb(120, 120, 130);
 	--icon-color: rgb(115, 115, 130);
 	--icon-color-half: rgba(115, 115, 130, 0.5);
 }
@@ -695,17 +695,12 @@ div.toast > span {
 	word-break: break-word;
 }
 
-div.toast.success { background: #44bb44; }
-div.toast.warning { background: #bbbb44; }
+div.toast.success { background: var(--green); }
+div.toast.warning { background: var(--yellow); }
 div.toast.error { background: var(--red); }
-div.toast.critical { background: #bb44bb; }
-div.toast.info { background: #5890db; }
-
-body.dark div.toast.success { background: rgb(20, 128, 20); }
-body.dark div.toast.warning { background: rgb(128, 128, 20); }
-body.dark div.toast.error { background-color:var(--red); }
-body.dark div.toast.critical { background: rgb(128, 20, 128); }
-body.dark div.toast.info { background: rgb(28, 84, 160); }
+div.toast.critical { background: var(--purple); }
+div.toast.info { background: var(--theme-color); }
+div.toast.suspended { background: var(--orange); }
 
 div.toast.channel { 
 	background: var(--box-background-color); 
@@ -787,6 +782,7 @@ div.message.error { background: var(--red); }
 div.message.critical { background: var(--purple); }
 div.message.abort { background: var(--red); }
 div.message.info { background: var(--blue); }
+div.message.suspended { background: var(--orange); }
 
 /* body.dark div.message.success { background: rgb(20, 128, 20); }
 body.dark div.message.warning { background: rgb(128, 128, 20); }
@@ -1911,6 +1907,10 @@ div.progress_bar_label.second_half {
 	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
 }
 
+.progress_bar_label i.mdi:before {
+	transform: scale(1.5);
+}
+
 div.progress_bar_container.indeterminate div.progress_bar_label {
 	display: none;
 }
@@ -2587,6 +2587,10 @@ body.dark .data_grid > ul.grid_row_header > div {
 	padding-right: 1px;
 }
 
+.data_grid > ul > div .progress_bar_container {
+	margin: 1px 0 2px 0; /* Nudge height from 18px to 21px to match std grid units */
+}
+
 .data_grid ul.disabled div {
 	opacity: 0.6;
 }
@@ -2642,6 +2646,7 @@ body.dark .color_label {
 .color_label.green { background: var(--green); }
 .color_label.yellow { background: var(--yellow); text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.75); }
 .color_label.red { background: var(--red); }
+.color_label.orange { background: var(--orange); }
 .color_label.purple { background: var(--purple); }
 .color_label.gray { background: var(--gray); }
 

package/css/normalize.css

@@ -157,7 +157,6 @@ img {
  * 2. Remove the margin in Firefox and Safari.
  */
 
-button,
 input,
 optgroup,
 select,
@@ -173,7 +172,6 @@ textarea {
  * 1. Show the overflow in Edge.
  */
 
-button,
 input { /* 1 */
   overflow: visible;
 }
@@ -183,7 +181,6 @@ input { /* 1 */
  * 1. Remove the inheritance of text transform in Firefox.
  */
 
-button,
 select { /* 1 */
   text-transform: none;
 }
@@ -192,18 +189,17 @@ select { /* 1 */
  * Correct the inability to style clickable types in iOS and Safari.
  */
 
-button,
 [type="button"],
 [type="reset"],
 [type="submit"] {
   -webkit-appearance: button;
+  appearance: button;
 }
 
 /**
  * Remove the inner border and padding in Firefox.
  */
 
-button::-moz-focus-inner,
 [type="button"]::-moz-focus-inner,
 [type="reset"]::-moz-focus-inner,
 [type="submit"]::-moz-focus-inner {
@@ -215,7 +211,6 @@ button::-moz-focus-inner,
  * Restore the focus styles unset by the previous rule.
  */
 
-button:-moz-focusring,
 [type="button"]:-moz-focusring,
 [type="reset"]:-moz-focusring,
 [type="submit"]:-moz-focusring {
@@ -289,6 +284,7 @@ textarea {
 
 [type="search"] {
   -webkit-appearance: textfield; /* 1 */
+  appearance: textfield;
   outline-offset: -2px; /* 2 */
 }
 
@@ -300,16 +296,6 @@ textarea {
   -webkit-appearance: none;
 }
 
-/**
- * 1. Correct the inability to style clickable types in iOS and Safari.
- * 2. Change font properties to `inherit` in Safari.
- */
-
-::-webkit-file-upload-button {
-  -webkit-appearance: button; /* 1 */
-  font: inherit; /* 2 */
-}
-
 /* Interactive
    ========================================================================== */
 

package/js/base.js

@@ -199,9 +199,15 @@ var app = {
 		if (msg && args) msg = substitute(msg, args);
 		
 		if (id.match(/^\w+$/)) id = '#' + id;
-		$(id).removeClass('invalid').width(); // trigger reflow to reset css animation
-		$(id).addClass('invalid');
-		try { $(id).focus(); } catch (e) {;}
+		var $elem = $(id);
+		
+		if ($elem[0] && ($elem[0].nodeName == 'SELECT') && $elem.next().hasClass('multiselect')) {
+			$elem = $elem.next();
+		}
+		
+		$elem.removeClass('invalid').width(); // trigger reflow to reset css animation
+		$elem.addClass('invalid');
+		try { $elem.focus(); } catch (e) {;}
 		
 		if (msg) return this.doError(msg);
 		else return false;
@@ -219,9 +225,11 @@ var app = {
 		var icon = '';
 		switch (type) {
 			case 'success': icon = 'check-circle'; break;
-			case 'warning': icon = 'alert-circle'; break;
+			case 'warning': icon = 'alert-rhombus'; break;
 			case 'error': icon = 'alert-decagram'; break;
 			case 'info': icon = 'information-outline'; break;
+			case 'critical': icon = 'fire-alert'; break;
+			case 'suspended': icon = 'motion-pause-outline'; break;
 			
 			default:
 				if (type.match(/^(\w+)\/(.+)$/)) { type = RegExp.$1; icon = RegExp.$2; }
@@ -253,7 +261,11 @@ var app = {
 		$toast.on('click', function() {
 			if (timer) clearTimeout(timer);
 			$toast.fadeOut( 250, function() { $(this).remove(); } );
-			if (loc) Nav.go(loc);
+			if (loc) {
+				$toast.addClass('clicky');
+				if (typeof(loc) == 'function') loc();
+				else if (typeof(loc) == 'string') Nav.go(loc);
+			}
 		} );
 		
 		if ((type == 'success') || (type == 'info') || lifetime) {
@@ -265,9 +277,7 @@ var app = {
 	},
 	
 	hideMessage: function(animate) {
-		// if (animate) $('#d_message').hide(animate);
-		// else $('#d_message').hide();
-		
+		// hide all toasts
 		if (animate) $('div.toast').fadeOut( animate, function() { $(this).remove(); } );
 		else $('div.toast').remove();
 	},

package/js/calendar.js

@@ -46,9 +46,9 @@ var Calendar = {
 		
 		html += '<div class="calendar">';
 			html += '<div class="cal_header">';
-				html += '<div class="ch_nav ch_prev" onMouseUp="Calendar.prevMonth()" title="Previous Month"><i class="mdi mdi-chevron-double-left"></i></div>';
+				html += '<div class="ch_nav ch_prev" onClick="Calendar.prevMonth()" title="Previous Month"><i class="mdi mdi-chevron-double-left"></i></div>';
 				html += '<div class="ch_title"></div>';
-				html += '<div class="ch_nav ch_next" onMouseUp="Calendar.nextMonth()" title="Next Month"><i class="mdi mdi-chevron-double-right"></i></div>';
+				html += '<div class="ch_nav ch_next" onClick="Calendar.nextMonth()" title="Next Month"><i class="mdi mdi-chevron-double-right"></i></div>';
 			html += '</div>';
 			html += '<div class="cal_days">';
 				_short_day_names.forEach( function(ddd) {

package/js/datetime.js

@@ -1,6 +1,6 @@
 // Joe's Date/Time Tools
 // Copyright (c) 2004 - 2025 Joseph Huckaby
-// Released under the Sustainable Use License
+// Released under the MIT License
 
 var _months = [
 	[ 1, 'January' ], [ 2, 'February' ], [ 3, 'March' ], [ 4, 'April' ],
@@ -29,14 +29,12 @@ var _hour_names = ['12am', '1am', '2am', '3am', '4am', '5am', '6am', '7am', '8am
 
 function time_now() {
 	// return the Epoch seconds for like right now
-	var now = new Date();
-	return Math.floor( now.getTime() / 1000 );
+	return Math.floor( Date.now() / 1000 );
 }
 
 function hires_time_now() {
 	// return the Epoch seconds for like right now
-	var now = new Date();
-	return ( now.getTime() / 1000 );
+	return Date.now() / 1000;
 }
 
 function format_date(thingy, template) {

package/js/misc.js

@@ -1,4 +1,4 @@
-// Misc 3rd party utilities for Orchestra
+// Misc 3rd party utilities for xyOps
 
 $.fn.innerBounds = function() {
 	// compute outer bounds of child elements

package/js/page.js

@@ -557,7 +557,7 @@ window.Page = class Page {
 			// html += 'Page: ';
 			if (current_page > 1) {
 				if (cpl) {
-					html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((current_page - 2) * results.limit)+')">&laquo; Prev</span>';
+					html += '<span class="link" onClick="'+cpl+'('+Math.floor((current_page - 2) * results.limit)+')">&laquo; Prev</span>';
 				}
 				else {
 					html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {
@@ -587,7 +587,7 @@ window.Page = class Page {
 				}
 				else {
 					if (cpl) {
-						html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((idx - 1) * results.limit)+')">' + commify(idx) + '</span>';
+						html += '<span class="link" onClick="'+cpl+'('+Math.floor((idx - 1) * results.limit)+')">' + commify(idx) + '</span>';
 					}
 					else {
 						html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {
@@ -601,7 +601,7 @@ window.Page = class Page {
 			html += '&nbsp;&nbsp;';
 			if (current_page < num_pages) {
 				if (cpl) {
-					html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((current_page + 0) * results.limit)+')">Next &raquo;</span>';
+					html += '<span class="link" onClick="'+cpl+'('+Math.floor((current_page + 0) * results.limit)+')">Next &raquo;</span>';
 				}
 				else {
 					html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {
@@ -717,7 +717,7 @@ window.Page = class Page {
 			// html += 'Page: ';
 			if (current_page > 1) {
 				if (cpl) {
-					html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((current_page - 2) * results.limit)+')">&laquo; Prev</span>';
+					html += '<span class="link" onClick="'+cpl+'('+Math.floor((current_page - 2) * results.limit)+')">&laquo; Prev</span>';
 				}
 				else {
 					html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {
@@ -748,7 +748,7 @@ window.Page = class Page {
 				}
 				else {
 					if (cpl) {
-						html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((idx - 1) * results.limit)+')">' + commify(idx) + '</span>';
+						html += '<span class="link" onClick="'+cpl+'('+Math.floor((idx - 1) * results.limit)+')">' + commify(idx) + '</span>';
 					}
 					else {
 						html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {
@@ -763,7 +763,7 @@ window.Page = class Page {
 			
 			if (current_page < num_pages) {
 				if (cpl) {
-					html += '<span class="link" onMouseUp="'+cpl+'('+Math.floor((current_page + 0) * results.limit)+')">Next &raquo;</span>';
+					html += '<span class="link" onClick="'+cpl+'('+Math.floor((current_page + 0) * results.limit)+')">Next &raquo;</span>';
 				}
 				else {
 					html += '<a href="#' + this.ID + compose_query_string(merge_objects(this.args, {

package/js/tools.js

@@ -1,7 +1,7 @@
 ////
 // Joe's Misc JavaScript Tools
 // Copyright (c) 2004 - 2025 Joseph Huckaby
-// Released under the Sustainable Use License
+// Released under the MIT License
 ////
 
 var months = [
@@ -306,12 +306,6 @@ function get_scroll_max(dom) {
 	return { width: myWidth, height: myHeight };
 }
 
-function hires_time_now() {
-	// return the Epoch seconds for like right now
-	var now = new Date();
-	return ( now.getTime() / 1000 );
-}
-
 function str_value(str) {
 	// Get friendly string value for display purposes.
 	if (typeof(str) == 'undefined') str = '';
@@ -566,7 +560,7 @@ function expando_text(text, max, link) {
 	var after = text.substring(max);
 	
 	return before + 
-		'<span>... <a href="javascript:void(0)" onMouseUp="$(this).parent().hide().next().show()">'+link+'</a></span>' + 
+		'<span>... <a href="javascript:void(0)" onClick="$(this).parent().hide().next().show()">'+link+'</a></span>' + 
 		'<span style="display:none">' + after + '</span>';
 };
 

package/package.json

@@ -1,13 +1,13 @@
 {
 	"name": "pixl-xyapp",
-	"version": "2.1.5",
+	"version": "2.1.7",
 	"description": "A theme for xyOps.",
 	"author": "Joseph Huckaby <jhuckaby@pixlcore.com>",
 	"homepage": "https://github.com/pixlcore/pixl-xyapp",
 	"license": "MIT",
 	"repository": {
 		"type": "git",
-		"url": "https://github.com/pixlcore/pixl-xyapp"
+		"url": "git+https://github.com/pixlcore/pixl-xyapp.git"
 	},
 	"bugs": {
 		"url": "https://github.com/pixlcore/pixl-xyapp/issues"