Removing jQuery altogether

src/scripts/app.js

@@ -1,14 +1,3 @@
-//jQuery
-import './jquery.helpers.js';
-
-//Common
-import * as common from './common.js';
-window.copyArray = common.copyArray;
-window.getElem = common.getElem;
-window.setElem = common.setElem;
-window.getDragPosition = common.getDragPosition;
-window.copyTextToClipboard = common.copyTextToClipboard;
-window.getOuterWidth = common.getOuterWidth;
 import Css from './../styles/spot.scss';
 
 //Masks

src/scripts/jquery.helpers.js

@@ -1,30 +1,4 @@
-$.prototype.addInput = function(sType, sName, sValue, aoEvents) {
-	aoEvents = aoEvents || [];
-	let $Input = $('<input>', {type: sType, name: sName, value: sValue}).data('old_value', sValue);
-	$.each(aoEvents, (iIndex, aoEvent) => {
-		$Input.on(aoEvent.on, aoEvent.callback);
-	});
-	return $(this).append($Input);
-};
-
-$.prototype.addButton = function(sIcon, sText, sName, fOnClick, sClass)
-{
-	sText = sText || '';
-	sClass = sClass || '';
-	var $Btn = $('<button>', {name: sName, 'class':sClass})
-		.addIcon('fa-'+sIcon, (sText != ''))
-		.append(sText)
-		.click(fOnClick);
-
-	return $(this).append($Btn);
-};
-
-$.prototype.addIcon = function(sIcon, bMargin, sStyle)
-{
-	bMargin = bMargin || false;
-	sStyle = sStyle || '';
-	return $(this).append($('<i>', {'class':'fa'+sStyle+' '+sIcon+(bMargin?' push':'')}));
-};
+import { getDragPosition } from './common.js';
 
 $.prototype.defaultVal = function(sDefaultValue)
 {
@@ -57,31 +31,6 @@ $.prototype.checkForm = function(sSelector)
 	return bOk;
 };
 
-$.prototype.cascadingDown = function(sDuration)
-{
-	return $(this).slideDown(sDuration, function(){$(this).next().cascadingDown(sDuration);});
-};
-
-$.prototype.hoverSwap = function(sDefault, sHover)
-{
-	return $(this)
-		.data('default', sDefault)
-		.data('hover', sHover)
-		.hover(function(){
-			var	$This = $(this),
-				sHover = $This.data('hover');
-				sDefault = $This.data('default');
-
-			if(sDefault!='' && sHover != '') {
-				$This.fadeOut('fast', function() {
-					var $This = $(this);
-					$This.text((sDefault==$This.text())?sHover:sDefault).fadeIn('fast');
-			    });
-			}
-		})
-		.text(sDefault);
-};
-
 $.prototype.onSwipe = function(fOnStart, fOnMove, fOnEnd){
 	return $(this)
 		.on('dragstart', (e) => {
@@ -126,4 +75,4 @@ $.prototype.onSwipe = function(fOnStart, fOnMove, fOnEnd){
 				});
 			}
 		});
-};
+};

src/scripts/lang.js

@@ -0,0 +1,31 @@
+export default class Lang {
+
+	constructor({ translations = {}, prefix = '' } = {}) {
+		this.translations = translations;
+		this.prefix = prefix;
+	}
+
+	lang(key = '', params = []) {
+		if(key === '') return '';
+
+		const normalizedParams = Array.isArray(params) ? params : [params];
+
+		if(Object.prototype.hasOwnProperty.call(this.translations, key)) {
+			let text = this.translations[key];
+			normalizedParams.forEach((param, index) => {
+				text = text.replace('$' + index, param);
+			});
+			return text;
+		}
+
+		console.warn('Missing translation:', key);
+		return key;
+	}
+
+	parse(message = '') {
+		if(this.prefix && typeof message === 'string' && message.startsWith(this.prefix)) {
+			return this.lang(message.slice(this.prefix.length));
+		}
+		return message;
+	}
+}

src/scripts/spot.js

@@ -1,3 +1,6 @@
+import { copyArray, getElem, setElem } from './common.js';
+import Lang from './lang.js';
+
 export default class Spot {
 
 	constructor(asGlobals) {
@@ -6,6 +9,11 @@ export default class Spot {
 		this.consts.title = 'Spotty';
 		this.consts.default_page = 'project';
 		//this.consts.timezone = Intl.DateTimeFormat().resolvedOptions().timeZone || this.consts.default_timezone;
+		
+		this.translator = new Lang({
+			translations: this.consts.lang || {},
+			prefix: this.consts.lang_prefix || ''
+		});
 
 		this.pages = {};
 
@@ -104,9 +112,7 @@ export default class Spot {
 			else {
 				let oResponse = await oRequest.json();
 				bLoading = false;
-				if(oResponse.desc.substr(0, this.consts.lang_prefix.length)==this.consts.lang_prefix) {
-					oResponse.desc = this.lang(oResponse.desc.substr(this.consts.lang_prefix.length));
-				}
+				oResponse.desc = this.translator.parse(oResponse.desc);
 
 				if(oResponse.result == this.consts.error) return Promise.reject(oResponse.desc);
 				else return oResponse.data;
@@ -119,22 +125,7 @@ export default class Spot {
 	}
 
 	lang(sKey, asParams = []) {
-		if(sKey == '') return '';
-		if(typeof asParams !== 'object') asParams = [asParams];
-
-		var sLang = '';
-		if(sKey in this.consts.lang) {
-			sLang = this.consts.lang[sKey];
-			for(let i in asParams) {
-				sLang = sLang.replace('$'+i, asParams[i]);
-			}
-		}
-		else {
-			console.log('missing translation: '+sKey);
-			sLang = sKey;
-		}
-
-		return sLang;
+		return this.translator.lang(sKey, asParams);
 	}
 
 	isMobile() {
@@ -313,4 +304,4 @@ export default class Spot {
 	checkClearance(sClearance) {
 		return (this.vars(['user', 'clearance']) >= sClearance);
 	}
-}
+}