@awesomeness-js/server 1.1.6 → 1.1.8

package/ui/core/css/dynamic/grid.js

@@ -1,185 +0,0 @@
-export default function({
-	sizes = [
-		'xl',
-		'd',
-		't',
-		'p'
-	],
-	pixels = 126
-} = {}) {
-
-	let data = ` `;
-
-	const grids = 12;
-
-	data += `.grid { display: grid; grid-template-columns: auto auto; } `;
-	
-	// justify
-	data += `.justify-center { justify-content: center; } `;
-	data += `.justify-start { justify-content: start; } `;
-	data += `.justify-end { justify-content: end; } `;
-	data += `.justify-between { justify-content: space-between; } `;
-	data += `.justify-around { justify-content: space-around; } `;
-	data += `.justify-evenly { justify-content: space-evenly; } `;
-
-	// align
-	data += `.align-center { align-items: center; } `;
-	data += `.align-start { align-items: start; } `;
-	data += `.align-end { align-items: end; } `;
-	data += `.align-baseline { align-items: baseline; } `;
-	data += `.align-stretch { align-items: stretch; } `;
-
-	// justify-items
-	data += `.justify-items-start { justify-items: start; } `;
-	data += `.justify-items-center { justify-items: center; } `;
-	data += `.justify-items-end { justify-items: end; } `;
-	data += `.justify-items-stretch { justify-items: stretch; } `;
-
-	// justify
-	data += `.grid.center { justify-self: center; } `;
-	data += `.grid.left { justify-self: start; } `;
-	data += `.grid.right { justify-self: end; } `;
-
-	data += `.justify-self-center { justify-self: center; } `;
-	data += `.justify-self-left { justify-self: start; } `;
-	data += `.justify-self-right { justify-self: end; } `;
-
-
-	data += `.span-full { grid-column: 1 / -1; } `;
-	data += `.row-span-full { grid-row: 1 / -1; } `;
-
-	sizes.forEach((s) => {
-
-		data += `.app-size-${s} .grid.center-${s} { justify-self: center; } `;
-		data += `.app-size-${s} .grid.left-${s} { justify-self: start; } `;
-		data += `.app-size-${s} .grid.right-${s} { justify-self: end; } `;
-
-		data += `.app-size-${s} .justify-self-center-${s} { justify-self: center; } `;
-		data += `.app-size-${s} .justify-self-start-${s} { justify-self: start; } `;
-		data += `.app-size-${s} .justify-self-end-${s} { justify-self: end; } `;
-
-		data += `.app-size-${s} .span-full-${s} { grid-column: 1 / -1; } `;
-		data += `.app-size-${s} .row-span-full-${s} { grid-row: 1 / -1; } `;
-
-		// justify
-		data += `.app-size-${s} .justify-center-${s} { justify-content: center; } `;
-		data += `.app-size-${s} .justify-start-${s} { justify-content: start; } `;
-		data += `.app-size-${s} .justify-end-${s} { justify-content: end; } `;
-		data += `.app-size-${s} .justify-between-${s} { justify-content: space-between; } `;
-		data += `.app-size-${s} .justify-around-${s} { justify-content: space-around; } `;
-		data += `.app-size-${s} .justify-evenly-${s} { justify-content: space-evenly; } `;
-
-		// justify-items
-		data += `.app-size-${s} .justify-items-start-${s} { justify-items: start; } `;
-		data += `.app-size-${s} .justify-items-center-${s} { justify-items: center; } `;
-		data += `.app-size-${s} .justify-items-end-${s} { justify-items: end; } `;
-		data += `.app-size-${s} .justify-items-stretch-${s} { justify-items: stretch; } `;
-
-		// align
-		data += `.app-size-${s} .align-center-${s} { align-items: center; } `;
-		data += `.app-size-${s} .align-start-${s} { align-items: start; } `;
-		data += `.app-size-${s} .align-end-${s} { align-items: end; } `;
-		data += `.app-size-${s} .align-baseline-${s} { align-items: baseline; } `;
-		data += `.app-size-${s} .align-stretch-${s} { align-items: stretch; } `;
-
-	});
-	
-	
-	for (let i = 1; i <= grids; i++) {
-		
-		// cols
-		data += `.grid-${i} { display: grid; grid-template-columns: repeat(${i}, 1fr); } `;
-
-		// spans 
-		data += `.span-${i} { grid-column: span ${i} / span ${i}; } `;
-
-		// start
-		data += `.start-${i} { grid-column-start: ${i}; } `;
-
-		// end
-		data += `.end-${i} { grid-column-end: ${i}; } `;
-
-		// rows
-		data += `.grid-rows-${i} { grid-template-rows: repeat(${i}, 1fr); } `;
-
-		// spans
-		data += `.row-span-${i} { grid-row: span ${i} / span ${i}; } `;
-
-		// start
-		data += `.row-start-${i} { grid-row-start: ${i}; } `;
-
-		// end
-		data += `.row-end-${i} { grid-row-end: ${i}; } `;
-		
-		// order
-		data += `.order-${i} { order: ${i}; } `;
-
-		
-		sizes.forEach((s) => {
-
-			// cols
-			data += `.app-size-${s} .grid-${i}-${s} { display: grid; grid-template-columns: repeat(${i}, 1fr); } `;
-			
-			// spans 
-			data += `.app-size-${s} .span-${i}-${s} { grid-column: span ${i} / span ${i}; } `;
-
-			// start
-			data += `.app-size-${s} .start-${i}-${s} { grid-column-start: ${i}; } `;
-
-			// end
-			data += `.app-size-${s} .end-${i}-${s} { grid-column-end: ${i}; } `;
-
-			// rows
-			data += `.app-size-${s} .grid-rows-${i}-${s} { grid-template-rows: repeat(${i}, 1fr); } `;
-
-			// spans
-			data += `.app-size-${s} .row-span-${i}-${s} { grid-row: span ${i} / span ${i}; } `;
-
-			// start
-			data += `.app-size-${s} .row-start-${i}-${s} { grid-row-start: ${i}; } `;
-
-			// end
-			data += `.app-size-${s} .row-end-${i}-${s} { grid-row-end: ${i}; } `;
-
-			// order
-			data += `.app-size-${s} .order-${i}-${s} { order: ${i}; } `;
-
-		});
-	
-	}
-
-	// add and extra for start and end for both col and row
-	data += `.start-${grids +1} { grid-column-start: ${grids +1}; } `;
-	data += `.end-${grids +1} { grid-column-end: ${grids +1}; } `;
-
-	sizes.forEach((s) => {
-
-		data += `.app-size-${s} .start-${grids +1}-${s} { grid-column-start: ${grids +1}; } `;
-		data += `.app-size-${s} .end-${grids +1}-${s} { grid-column-end: ${grids +1}; } `;
-	
-	});
-
-
-	// gap
-	for(let i = 1; i <= pixels; i++) {
-
-		data += `.gap-${i} { gap: ${i}px; } `;
-		data += `.gap-x-${i} { column-gap: ${i}px; } `;
-		data += `.gap-y-${i} { row-gap: ${i}px; } `;
-
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .gap-${i}-${s} { gap: ${i}px; } `;
-			data += `.app-size-${s} .gap-x-${i}-${s} { column-gap: ${i}px; } `;
-			data += `.app-size-${s} .gap-y-${i}-${s} { row-gap: ${i}px; } `;
-		
-		});
-
-	}
-
-
-	data += ` `;
-
-	return data;
-
-}

package/ui/core/css/dynamic/shortcuts.js

@@ -1,48 +0,0 @@
-export default function(sizes = [
-	'xl',
-	'd',
-	't',
-	'p'
-]) {
-
-	let data = ` `;
-
-	// dynamic display
-	data += ".hidden {display: none !important;} ";
-	data += ".fl{float:left !important;} ";
-	data += ".fr{float:right !important;} ";
-	data += ".m0a{margin: 0 auto;} ";
-
-	// cursor pointer
-	data += ".cursor-pointer {cursor: pointer !important;} ";
-	data += ".cursor-default {cursor: default !important;} ";
-
-	// position
-	data += ".absolute {position:absolute !important;} ";
-	data += ".relative {position:relative !important;} ";
-	data += ".fixed {position:fixed !important;} ";
-	data += ".sticky {position:sticky !important;} ";
-
-	
-	sizes.forEach((s) => {
-
-		data += `.app-size-${s} .hidden-${s} {display: none !important;} `;
-
-		data += `.app-size-${s} .cursor-pointer-${s} {cursor: pointer !important;} `;
-		data += `.app-size-${s} .cursor-default${s} {cursor: default !important;} `;
-
-		data += `.app-size-${s} .fl {float:left !important;} `;
-		data += `.app-size-${s} .fr {float:right !important;} `;
-
-		data += `.app-size-${s} .absolute {position:absolute !important;} `;
-		data += `.app-size-${s} .relative {position:relative !important;} `;
-		data += `.app-size-${s} .fixed {position:fixed !important;} `;
-		data += `.app-size-${s} .sticky {position:sticky !important;} `;
-
-
-	});
-	
-
-	return data;
-
-}

package/ui/core/css/dynamic/spacing.js

@@ -1,61 +0,0 @@
-export default function({
-	sizes = [
-		'xl',
-		'd',
-		't',
-		'p'
-	],
-	pixels = 126
-} = {}) {
-
-	let data = ` `;
-
-	// dynamic margin
-	for( let i = 0; i < pixels; i += 5 ){
-
-		data += `.gap-${i} { gap:${i}px; } `;
-
-		data += `.m${i} { margin:${i}px; } `;
-		data += `.mt${i} { margin-top:${i}px; } `;
-		data += `.mb${i} { margin-bottom:${i}px; } `;
-		data += `.ml${i} { margin-left:${i}px; } `;
-		data += `.mr${i} { margin-right:${i}px; } `;
-		data += `.mtb${i} { margin-top:${i}px; margin-bottom:${i}px; } `;
-		data += `.mlr${i} { margin-left:${i}px; margin-right:${i}px; } `;
-
-		data += `.p${i} { padding:${i}px; } `;
-		data += `.pt${i} { padding-top:${i}px; } `;
-		data += `.pb${i} { padding-bottom:${i}px; } `;
-		data += `.pl${i} { padding-left:${i}px; } `;
-		data += `.pr${i} { padding-right:${i}px; } `;
-		data += `.ptb${i} { padding-top:${i}px; padding-bottom:${i}px; } `;
-		data += `.plr${i} { padding-left:${i}px; padding-right:${i}px; } `;
-
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .gap-${i}-${s} { gap:${i}px; } `;
-
-			data += `.app-size-${s} .m${i}-${s} { margin:${i}px; } `;
-			data += `.app-size-${s} .mt${i}-${s} { margin-top:${i}px; } `;
-			data += `.app-size-${s} .mr${i}-${s} { margin-right:${i}px; } `;
-			data += `.app-size-${s} .mb${i}-${s} { margin-bottom:${i}px; } `;
-			data += `.app-size-${s} .ml${i}-${s} { margin-left:${i}px; } `;
-			data += `.app-size-${s} .mtb${i}-${s} { margin-top:${i}px; margin-bottom:${i}px; } `;
-			data += `.app-size-${s} .mlr${i}-${s} { margin-left:${i}px; margin-right:${i}px; } `;
-
-
-			data += `.app-size-${s} .p${i}-${s} { padding:${i}px; } `;
-			data += `.app-size-${s} .pt${i}-${s} { padding-top:${i}px; } `;
-			data += `.app-size-${s} .pr${i}-${s} { padding-right:${i}px; } `;
-			data += `.app-size-${s} .pb${i}-${s} { padding-bottom:${i}px; } `;
-			data += `.app-size-${s} .pl${i}-${s} { padding-left:${i}px; } `;
-			data += `.app-size-${s} .ptb${i}-${s} { padding-top:${i}px; padding-bottom:${i}px; } `;
-			data += `.app-size-${s} .plr${i}-${s} { padding-left:${i}px; padding-right:${i}px; } `;
-		
-		});
-
-	}
-
-	return data;
-
-}

package/ui/core/css/dynamic/text.js

@@ -1,80 +0,0 @@
-export default function(sizes = [
-	'xl',
-	'd',
-	't',
-	'p'
-]) {
-
-	let data = ` `;
-
-	data += `.text-center {text-align:center !important;} `;
-	data += `.text-left {text-align:left !important;} `;
-	data += `.text-right {text-align:right !important;} `;
-
-	data += `.text-300 {font-weight:300 !important;} `;
-	data += `.text-400 {font-weight:400 !important;} `;
-	data += `.text-500 {font-weight:500 !important;} `;
-	data += `.text-600 {font-weight:600 !important;} `;
-	data += `.text-700 {font-weight:700 !important;} `;
-	data += `.text-800 {font-weight:800 !important;} `;
-	data += `.text-900 {font-weight:900 !important;} `;
-
-	data += `.text-300--hover:hover{font-weight:300 !important;} `;
-	data += `.text-400--hover:hover{font-weight:400 !important;} `;
-	data += `.text-500--hover:hover{font-weight:500 !important;} `;
-	data += `.text-600--hover:hover{font-weight:600 !important;} `;
-	data += `.text-700--hover:hover{font-weight:700 !important;} `;
-	data += `.text-800--hover:hover{font-weight:800 !important;} `;
-	data += `.text-900--hover:hover{font-weight:900 !important;} `;
-
-	data += `.text-xxs {font-size:.70em !important;} `;
-	data += `.text-xs {font-size:.83em !important;} `;
-	data += `.text-s {font-size:.9em !important;} `;
-	data += `.text-m {font-size:1.1em !important;} `;
-	data += `.text-l {font-size:1.2em !important;} `;
-	data += `.text-xl {font-size:1.4em !important;} `;
-	data += `.text-xxl {font-size:1.6em !important;} `;
-	data += `.text-xxxl {font-size:2em !important;} `;
-
-	data += `.text-i {font-style:italic !important;} `;
-
-
-	sizes.forEach((s) => {
-
-		data += `.app-size-${s} .text-center-${s}{text-align:center !important;} `;
-		data += `.app-size-${s} .text-left-${s}{text-align:left !important;} `;
-		data += `.app-size-${s} .text-right-${s}{text-align:right !important;} `;
-
-		data += `.app-size-${s} .text-300-${s}{font-weight:300 !important;} `;
-		data += `.app-size-${s} .text-400-${s}{font-weight:400 !important;} `;
-		data += `.app-size-${s} .text-500-${s}{font-weight:500 !important;} `;
-		data += `.app-size-${s} .text-600-${s}{font-weight:600 !important;} `;
-		data += `.app-size-${s} .text-700-${s}{font-weight:700 !important;} `;
-		data += `.app-size-${s} .text-800-${s}{font-weight:800 !important;} `;
-		data += `.app-size-${s} .text-900-${s}{font-weight:900 !important;} `;
-
-		data += `.app-size-${s} .text-300-${s}--hover:hover{font-weight:300 !important;} `;
-		data += `.app-size-${s} .text-400-${s}--hover:hover{font-weight:400 !important;} `;
-		data += `.app-size-${s} .text-500-${s}--hover:hover{font-weight:500 !important;} `;
-		data += `.app-size-${s} .text-600-${s}--hover:hover{font-weight:600 !important;} `;
-		data += `.app-size-${s} .text-700-${s}--hover:hover{font-weight:700 !important;} `;
-		data += `.app-size-${s} .text-800-${s}--hover:hover{font-weight:800 !important;} `;
-		data += `.app-size-${s} .text-900-${s}--hover:hover{font-weight:900 !important;} `;
-
-
-		data += `.app-size-${s} .text-xxs-${s}{font-size:.70em !important;} `;
-		data += `.app-size-${s} .text-xs-${s}{font-size:.83em !important;} `;
-		data += `.app-size-${s} .text-s-${s}{font-size:.9em !important;} `;
-		data += `.app-size-${s} .text-m-${s}{font-size:1.1em !important;} `;
-		data += `.app-size-${s} .text-l-${s}{font-size:1.2em !important;} `;
-		data += `.app-size-${s} .text-xl-${s}{font-size:1.4em !important;} `;
-		data += `.app-size-${s} .text-xxl-${s}{font-size:1.6em !important;} `;
-		data += `.app-size-${s} .text-xxxl-${s}{font-size:2em !important;} `;
-
-		data += `.app-size-${s} .i-${s}{font-style:italic !important;} `;
-
-	});
-
-	return data;
-
-}

package/ui/core/css/dynamic/width.js

@@ -1,75 +0,0 @@
-export default function(sizes = [
-	'xl',
-	'd',
-	't',
-	'p'
-]) {
-
-	let data = ` `;
-
-	// dynamic width
-	for (let i = 1; i <= 100; i++) {
-
-		// float
-		data += `.width${i} { width:${i}%; } `;
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .width${i}-${s} { width:${i}%; } `;
-		
-		});
-
-	}
-
-	// dynamic height
-	for (let i = 1; i <= 1000; i++) {
-
-		// float
-		data += `.height${i} { height:${i}%; } `;
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .height${i}-${s} { height:${i}%; } `;
-		
-		});
-
-	}
-
-
-	for (let i = 5; i <= 2000; i += 5) {
-		
-		// max width
-		data += `.width-${i} { width:${i}px; } `;
-		data += `.height-${i} { height:${i}px; } `;
-		data += `.max-width-${i} { max-width:${i}px; } `;
-		data += `.min-width-${i} { min-width:${i}px; } `;
-		data += `.max-height-${i} { max-height:${i}px; } `;
-		data += `.min-height-${i} { min-height:${i}px; } `;
-
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .width-${i}-${s} { width:${i}px; } `;
-			data += `.app-size-${s} .height-${i}-${s} { height:${i}px; } `;
-			data += `.app-size-${s} .max-width-${i}-${s} { max-width:${i}px; } `;
-			data += `.app-size-${s} .min-width-${i}-${s} { min-width:${i}px; } `;
-			data += `.app-size-${s} .max-height-${i}-${s} { max-height:${i}px; } `;
-			data += `.app-size-${s} .min-height-${i}-${s} { min-height:${i}px; } `;
-		
-		});
-
-	}
-
-
-	// span 1 - 12
-	for (let i = 1; i <= 12; i++) {
-
-		data += `.span${i} { width:${i / 12 * 100}%; } `;
-		sizes.forEach((s) => {
-
-			data += `.app-size-${s} .span${i}-${s} { width:${i / 12 * 100}%; } `;
-		
-		});
-	
-	}
-
-	return data;
-
-}

package/ui/core/css/dynamic.js

@@ -1,40 +0,0 @@
-import grid from './dynamic/grid.js';
-import text from './dynamic/text.js';
-import spacing from './dynamic/spacing.js';
-import shortcuts from './dynamic/shortcuts.js';
-import width from './dynamic/width.js';
-import flex from './dynamic/flex.js';
-
-function dynamicCSS() {
-
-	let sizes = [
-		'xl', // extra large
-		'd', // desktop
-		't', // tablet
-		'p' // phone
-	];
-		
-	let data = '';
-
-	const pixels = 126;
-
-	data += shortcuts(sizes);
-	data += text(sizes);
-	data += width(sizes);
-	data += flex(sizes);
-
-	data += spacing({
-		sizes,
-		pixels 
-	});
-	data += grid({
-		sizes,
-		pixels 
-	});
-	
-	return data;
-
-}
-
-
-export { dynamicCSS };

package/ui/core/js/app/api.js

@@ -1,143 +0,0 @@
-app.api = async function (route, data = {}) {
-
-	const time = Date.now();
-
-	if (!route) throw {
-		reason: 'route undefined',
-		route,
-		data 
-	};
-	if (route[0] === '/') route = route.substring(1);
-	if (route.match(/[^a-zA-Z0-9/_\-]/)) throw {
-		reason: 'route invalid',
-		route,
-		data 
-	};
-
-	const deviceInfo = {
-		device: 'web',
-		userAgent: window.navigator.userAgent 
-	};
-
-	let isFormData = false;
-	let body;
-
-	// Detect files
-	if (data && Object.values(data).some((v) => v instanceof File || v instanceof FileList || (Array.isArray(v) && v[0] instanceof File))) {
-
-		isFormData = true;
-		const formData = new FormData();
-
-		formData.append('awesomenessType', 'api');
-		formData.append('meta', JSON.stringify(app.meta));
-		formData.append('device', JSON.stringify(deviceInfo));
-
-
-		for (const key in data) {
-
-			const val = data[key];
-
-			if (val instanceof FileList) {
-
-				[ ...val ].forEach((f) => formData.append(key + '[]', f));
-			
-			} else if (Array.isArray(val) && val[0] instanceof File) {
-
-				val.forEach((f) => formData.append(key + '[]', f));
-			
-			} else {
-
-				formData.append(key, val);
-			
-			}
-		
-		}
-
-		body = formData;
-	
-	} else {
-
-		body = JSON.stringify({
-			awesomenessType: 'api',
-			meta: app.meta,
-			device: deviceInfo,
-			... data,
-		});
-	
-	}
-
-	let headers = {
-		'Authorization': 'Bearer ' + (app.session ?? ''),
-	};
-
-	if (!isFormData) headers['Content-Type'] = 'application/json';
-
-	let fetchOptions = {
-		method: 'POST',
-		headers,
-		body,
-		timeout: 5 * 60 * 1000,
-	};
-
-	try {
-
-		if (app.testing) {
-
-			console.log('%capi: ', 'color: blue; font-weight:bold;', route, isFormData ? body : JSON.parse(body));
-		
-		}
-
-
-		const response = await fetch(app.apiBaseURL + route, fetchOptions);
-
-		if (!response.ok) throw {
-			status: response.status,
-			...(await response.json()) 
-		};
-
-		const doneData = await response.json();
-
-		app.metaUpdates(doneData.meta);
-
-		if (app.testing) {
-
-			if (doneData.testing) {
-
-				if (doneData.testing.perf) doneData.testing.perf.xhr = Date.now() - time;
-				console.log('%ctesting: ', 'color: purple; font-weight:bold;', doneData.testing);
-			
-			}
-
-			delete doneData.testing;
-			console.log('%cmeta: ', 'color: #ff6f00; font-weight:bold;', doneData.meta ?? null);
-			delete doneData.meta;
-			console.log('%capi: ', 'color: green; font-weight:bold;', doneData);
-		
-		} else {
-
-			delete doneData.testing;
-			delete doneData.meta;
-		
-		}
-
-		
-		return doneData;
-	
-	} catch (errorData) {
-
-		if (app.testing) console.log('%capi: ', 'color: red; font-weight:bold;', errorData);
-
-		if (errorData.APP_SESSION) {
-
-			app.session = null;
-			app.user = null;
-			window.localStorage.removeItem('awesomeness-appSession');
-			location.reload();
-		
-		}
-
-		throw errorData;
-	
-	}
-
-};