jpf-mobx 1.0.6

package/src/utilities/htmlElement/htmlElement.ts

@@ -0,0 +1,15 @@
+export function setScale(htmlElement: HTMLElement, scale: number) {
+    htmlElement.style.transformOrigin = "center";
+
+    const scaleValue = " scale(" + scale + ")";
+    const transform = htmlElement.style.transform;
+    if (transform) {
+        if (transform.indexOf("scale") > -1) {
+            htmlElement.style.transform = transform.replace(/scale\(.*\)/, scaleValue);
+        } else {
+            htmlElement.style.transform += scaleValue;
+        }
+    } else {
+        htmlElement.style.transform = scaleValue;
+    }
+}

package/src/utilities/image/image.ts

@@ -0,0 +1 @@
+export const blankGif = "data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=";

package/src/utilities/index.ts

@@ -0,0 +1,37 @@
+import * as blob from "./blob/blob";
+import * as cookie from "./cookie/cookie";
+import * as dataReaderTable from "./dataReaderTable/dataReaderTable";
+import * as fetch from "./fetch/fetch";
+import * as float from "./float/float";
+import * as formData from "./formData/formData";
+import * as html from "./html/html";
+import * as htmlElement from "./htmlElement/htmlElement";
+import * as image from "./image/image";
+import * as integer from "./integer/integer";
+import * as key from "./key/key";
+import * as navigator from "./navigator/navigator";
+import * as notification from "./notification/notification";
+import * as querystring from "./querystring/querystring";
+import * as router from "./router/router";
+import * as stylesheet from "./stylesheet/stylesheet";
+import * as uniqueId from "./uniqueId/uniqueId";
+import * as webSocket from "./webSocket/webSocket";
+
+export { blob };
+export { cookie };
+export { dataReaderTable };
+export { fetch };
+export { float };
+export { formData };
+export { html };
+export { htmlElement };
+export { image };
+export { integer };
+export { key };
+export { navigator };
+export { notification };
+export { querystring };
+export { router };
+export { stylesheet };
+export { uniqueId };
+export { webSocket };

package/src/utilities/integer/integer.ts

@@ -0,0 +1,31 @@
+export function isInteger(text: string): boolean {
+    if (!text) {
+        throw "parameter text not provided";
+    }
+    return text.match(/\D/) === null;
+}
+
+export function isIntegerOrNull(text: string): boolean {
+    if (text) {
+        return isInteger(text);
+    }
+    return true;
+}
+
+export function convertToInt(text: any) {
+    if (typeof text === "string") {
+        if (isInteger(text)) {
+            const intValue = Number.parseInt(text);
+            if (Number.isNaN(intValue)) {
+                return null;
+            }
+            return intValue;
+        }
+    }
+
+    if (typeof text === "number") {
+        return Math.trunc(text);
+    }
+
+    return null;
+}

package/src/utilities/key/key.ts

@@ -0,0 +1,7 @@
+export function getKeys<TObject>() {
+    return (key: keyof TObject) => key.toString();
+}
+
+export function getKey<TObject>(name: keyof TObject) {
+    return name;
+}

package/src/utilities/navigator/navigator.ts

@@ -0,0 +1,7 @@
+export function getLanguage() {
+    if (window.navigator.languages) {
+        return window.navigator.languages[0];
+    } else {
+        return window.navigator["userLanguage"] || window.navigator.language;
+    }
+}

package/src/utilities/notification/notification.ts

@@ -0,0 +1,88 @@
+import * as toastr from "toastr";
+import { extend } from "jquery";
+
+//Set toastr options
+toastr.options.closeButton = true;
+toastr.options.positionClass = "toast-bottom-full-width";
+toastr.options.hideDuration = 1000;
+toastr.options.timeOut = 6000;
+toastr.options.extendedTimeOut = 2000;
+toastr.options.progressBar = true;
+
+//Define the default logging options
+const defaults: INotificationOptions = {
+    title: "",
+    message: "no message provided",
+    data: "",
+    showToast: true,
+    type: "info"
+};
+
+interface INotificationOptions {
+    source?: string;
+    title?: string;
+    message: string;
+    data?: any;
+    showToast: boolean;
+    type: string;
+    timeOut?: number;
+}
+
+function show(options: INotificationOptions) {
+    let extendedOptions = extend({}, defaults);
+    if (options) {
+        extendedOptions = extend(extendedOptions, options);
+    }
+    console.log("Notification " + extendedOptions.type + ": " + extendedOptions.message + " " + extendedOptions.data + " ");
+
+    if (extendedOptions.showToast) {
+        if (options.timeOut) {
+            toastr[extendedOptions.type](extendedOptions.message, extendedOptions.title, { timeOut: options.timeOut });
+        } else {
+            toastr[extendedOptions.type](extendedOptions.message, extendedOptions.title);
+        }
+    }
+}
+
+export type MessageType = "error" | "info" | "success" | "warning";
+
+export function showError(error: string, title: string, autoHideAfter?: number): void {
+    show({
+        title: title,
+        message: error,
+        type: "error",
+        showToast: true,
+        timeOut: autoHideAfter
+    });
+}
+
+export function showInfo(info: string, title: string, autoHideAfter?: number): void {
+    show({
+        title: title,
+        message: info,
+        type: "info",
+        showToast: true,
+        timeOut: autoHideAfter
+    });
+}
+
+export function showSuccess(success: string, title: string, autoHideAfter?: number): void {
+    show({
+        title: title,
+        message: success,
+        type: "success",
+        showToast: true,
+        timeOut: autoHideAfter
+    });
+}
+
+export function showWarning(warning: string, title: string, autoHideAfter?: number): void {
+    show({
+        title: title,
+        message: warning,
+        type: "warning",
+        showToast: true,
+        timeOut: autoHideAfter
+    });
+}
+

package/src/utilities/querystring/querystring.ts

@@ -0,0 +1,61 @@
+export function parameterExists(name: string): boolean {
+    return window.location.search.indexOf(name) >= 0;
+}
+
+export function getParameter(name: string): string {
+    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
+    const regex = new RegExp("[\\?&]" + name + "=([^&#]*)", "i");
+    const results = regex.exec(location.search);
+    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
+};
+
+export function objectToQueryString(object: object): string {
+    if (object && Object.keys(object).length > 0) {
+        const parametersArray = new Array<string>();
+
+        Object.keys(object).forEach((key) => {
+            const value = object[key];
+            parametersArray.push(encodeURIComponent(key) + "=" + encodeURIComponent(value));
+        });
+
+        if (parametersArray.length === 0) {
+            return null;
+        }
+        return parametersArray.join("&");
+    }
+    return null;
+}
+
+export function getObjectFromQueryString(): object {
+    const result = {};
+
+    const search = (window as Window).location.search;
+    if (search && search.length > 2) {
+        const parameters = search.split("&");
+        if (parameters) {
+            parameters.forEach((parameter) => {
+                const nameValuePair = parameter.split("=");
+                result[decodeURIComponent(nameValuePair[0])] = JSON.parse(decodeURIComponent(nameValuePair[1]));
+            });
+        }
+    }
+
+    return result;
+}
+
+export function objectToBase64SQueryString(object: object, parameterName: string): string {
+    if (object && Object.keys(object).length > 0) {
+        const stateJson = JSON.stringify(object);
+        return parameterName + "=" + btoa(stateJson);
+    }
+    return null;
+}
+
+export function getObjectFromBase64QueryString(parameterName: string): object {
+    const serializedBase64ParameterValue = getParameter(parameterName);
+    if (serializedBase64ParameterValue) {
+        const objectJson = atob(serializedBase64ParameterValue);
+        return JSON.parse(objectJson);
+    }
+    return null;
+}

package/src/utilities/router/router.ts

@@ -0,0 +1,124 @@
+import { getObjectFromQueryString, getObjectFromBase64QueryString , objectToQueryString, objectToBase64SQueryString} from "../querystring/querystring";
+
+
+
+function getStateFromQueryString(stateReadable: boolean): Object {
+    if (stateReadable) {
+        return getObjectFromQueryString();
+    }
+    return getObjectFromBase64QueryString("s");
+}
+
+function getSerializeState(object : object,stateReadable: boolean): string {
+    if (stateReadable) {
+        return objectToQueryString(object);
+    }
+    return objectToBase64SQueryString(object, "s");
+}
+
+export interface RouterOptions<TRoute> {
+    //List of routes to be registered on the router
+    routes?: Array<TRoute>;
+
+    //Function to resolve a url from a TRoute object
+    urlFunction: (route: TRoute) => string;
+
+    //Handler to be called when the route changes
+    change: (route: TRoute, state: object) => void;
+
+    //Handler to be called when the router does not have a handler for the given route
+    routeMissing: (pathname: string, state: object) => void;
+
+    routeReadable: boolean;
+
+    //The root path of the router
+    root?: string;
+}
+
+export class Router<TRoute>
+{
+    constructor(options: RouterOptions<TRoute>) {
+        this.options = options;
+
+        if (options.routes) {
+            this.setRoutes(options.routes);
+        }
+    }
+
+    private routeDictionary: { [url: string]: TRoute } = {};
+
+    private popstateHandler(event: PopStateEvent) {
+        const pathname = window.location.pathname;
+        const state = event.state || getStateFromQueryString(this.options.routeReadable);
+
+        const route = this.routeDictionary[pathname];
+        if (route) {
+            this.options.change(route, state);
+        } else {
+            this.options.routeMissing(pathname, state);
+        }
+    }
+
+    options: RouterOptions<TRoute>;
+
+    start() {
+        //Start listening to url changes
+        (window as Window).addEventListener("popstate", (event: PopStateEvent) => { this.popstateHandler(event); });
+
+        //Trigger the popstate event so the initial page is loaded
+        (window as Window).dispatchEvent(new Event("popstate"));
+    }
+
+    setRoutes(routes: Array<TRoute>, replace = false) {
+        if (replace) {
+            this.routeDictionary = {};
+        }
+
+        if (routes) {
+            routes.forEach((route) => {
+                this.addRoute(route);
+            });
+        }
+    }
+
+    destroy() {
+        //Stop listening to url changes
+        (window as Window).removeEventListener("popstate", this.popstateHandler);
+    }
+
+    addRoute(route: TRoute) {
+        let url = this.options.urlFunction(route);
+        if (this.options.root) {
+            url = this.options.root + url;
+        }
+        if (url[0] !== "/") {
+            url = "/" + url;
+        }
+        this.routeDictionary[url] = route;
+    }
+
+    navigate(route: string, state?: object, addStateToQueryString: boolean = true, triggerChange = true) {
+        let url = route;
+        if (state && addStateToQueryString) {
+            const serializedState = getSerializeState(state, this.options.routeReadable);
+            //Find out if the url already contains a querystring
+            if (url.indexOf("?") > -1) {
+                //Add the serialized state to the existing querystring
+                url = url + "&" + serializedState;
+            } else {
+                //Add the serialized state as querystring
+                url = url + "?" + serializedState;
+            }
+        }
+        if (!state) {
+            state = {};
+        }
+
+        history.pushState(state, "", url);
+
+        if (triggerChange) {
+            //Trigger the popstate event on the window object
+            (window as Window).dispatchEvent(new PopStateEvent("popstate", { state: state }));
+        }
+    }
+}

package/src/utilities/stylesheet/stylesheet.ts

@@ -0,0 +1,58 @@
+const dynamicKey = "dynamic";
+const groupKey = "group";
+
+let styleSheet: CSSStyleSheet;
+
+function get(): CSSStyleSheet {
+    if (!styleSheet) {
+        if (document.styleSheets.length > 0) {
+            styleSheet = document.styleSheets.item(0) as CSSStyleSheet;
+        } else {
+            throw "No stylesheets loaded";
+        }
+    }
+
+    return styleSheet;
+}
+//Insert a dynamic Css rule
+export function insertRule(selector: string, style: string, markAsDynamic: boolean, index?: number, group?: string): void {
+    const styleSheet = get();
+
+    if (typeof styleSheet.insertRule === "function") {
+        const ruleExpression = selector + " {" + style + "}";
+        if (!index) {
+            index = styleSheet.cssRules.length;
+        }
+        const ruleIndex = styleSheet.insertRule(ruleExpression, index);
+
+        if (markAsDynamic) {
+            const rule = styleSheet.cssRules.item(ruleIndex);
+
+
+            //Add the property "dynamic" so the rule can be distinguished from already existing ones
+            rule[dynamicKey] = true;
+            if (group) {
+                rule[groupKey] = group;
+            }
+        }
+    }
+}
+
+export function removeDynamicRules(group?: string) {
+    const styleSheet = get();
+
+    for (let ruleIndex = styleSheet.cssRules.length - 1; ruleIndex >= 0; ruleIndex--) {
+        const rule = styleSheet.cssRules[ruleIndex];
+
+        //Find out if this rule has been added dynamically
+        if (rule[dynamicKey]) {
+            if (group) {
+                if (rule[groupKey] === group) {
+                    styleSheet.deleteRule(ruleIndex);
+                }
+            } else {
+                styleSheet.deleteRule(ruleIndex);
+            }
+        }
+    }
+}

package/src/utilities/uniqueId/uniqueId.ts

@@ -0,0 +1,5 @@
+import { v4 } from "uuid";
+
+export function newGuid(): string {
+    return v4();
+}

package/src/utilities/webSocket/webSocket.ts

@@ -0,0 +1,72 @@
+const reopenDelay = 10000;
+var webSocket: WebSocket;
+var webSocketProtocol: string;
+if (location.protocol === "http:") {
+    webSocketProtocol = "ws";
+} else {
+    webSocketProtocol = "wss";
+}
+
+document.addEventListener("visibilitychange", () => {
+    if (document.visibilityState === 'visible') {
+        if (!webSocket || webSocket.readyState === WebSocket.CLOSED) {
+            open();
+        }
+    }
+});
+
+var webSocketUrl: string;
+var onMessageHandler: (websocketMessage) => void;
+
+function open() {
+    if (webSocketUrl && onMessageHandler) {
+        webSocket = new WebSocket(webSocketProtocol + "://" + location.host + "/" + webSocketUrl);
+
+        webSocket.onopen = () => {
+            console.log("Websocket opened");
+        }
+
+        webSocket.onclose = () => {
+            console.log("Websocket closed");
+            webSocket = null;
+
+            setTimeout(
+                () => {
+                    open();
+                },
+                reopenDelay
+            );
+        }
+
+        webSocket.onerror = (error) => {
+            try {
+                console.log("Websocket error" + JSON.stringify(error));
+                webSocket.close();
+                webSocket = null;
+
+                setTimeout(
+                    () => {
+                        open();
+                    },
+                    reopenDelay
+                );
+            } catch (e) {
+                //Ignore the exception
+            }
+        }
+
+        webSocket.onmessage = (messageEvent: MessageEvent) => {
+            //Get the typed message
+            var webSocketMessage = JSON.parse(messageEvent.data);
+
+            //Call the handler
+            onMessageHandler(webSocketMessage);
+        };
+    }
+}
+
+export function initializeWebSocket(url: string, handler: (websocketMessage) => void) {
+    webSocketUrl = url;
+    onMessageHandler = handler;
+    open();
+}