From 07bcf5a4fca1591cf620b559792caa6ec73c5b96 Mon Sep 17 00:00:00 2001 From: Avior Date: Wed, 13 Nov 2019 12:08:56 +0100 Subject: [PATCH] Added Attributes Classes --- src/FMAttribute.ts | 45 ++++++++++++++++ src/attributes/FMAutosetAttribute.ts | 59 ++++++++++++++++++++ src/attributes/FMDefaultAttribute.ts | 81 ++++++++++++++++++++++++++++ src/attributes/FMIgnoreAttribute.ts | 43 +++++++++++++++ src/attributes/FMRegexAttribute.ts | 22 ++++++++ 5 files changed, 250 insertions(+) create mode 100644 src/FMAttribute.ts create mode 100644 src/attributes/FMAutosetAttribute.ts create mode 100644 src/attributes/FMDefaultAttribute.ts create mode 100644 src/attributes/FMIgnoreAttribute.ts create mode 100644 src/attributes/FMRegexAttribute.ts diff --git a/src/FMAttribute.ts b/src/FMAttribute.ts new file mode 100644 index 0000000..0fe8fa0 --- /dev/null +++ b/src/FMAttribute.ts @@ -0,0 +1,45 @@ +import FMInput from "./FMInput"; + + +export default class FMAttribute { + + public input: FMInput + + public static listeners: FMAttributeListeners[] = [] + + constructor(input: FMInput) { + this.input = input + } + + /** + * Function launched on Listener trigger + * it MUST be implemented and SHOULD return boolean + * + * @param ev Attribue triggered + */ + public trigger(ev: FMAttributeListeners, datas?: any): TriggerCallback|boolean|void { + return true + } +} + +// list of listeners +export enum FMAttributeListeners { + PRE_CLEAR, // Event run before clearing the form + POST_CLEAR, // Event run after learing the form + CHANGE, // Event runs on Form Change (datas wil be filled with the FMInput element) + FORM_INIT, // Event runs on form init + FORM_SUBMIT, // Event run before submitting (datas is filled with the datas that will be submitted, MUST return TriggerCallback) + VERIFY, // Event run on element verification (return true or false only) + FORM_FILL, // Event run after the form was filled +} + + +export interface FMAttributeAssignment { + attribute: typeof FMAttribute, + dataElement: string +} + +export interface TriggerCallback { + result: boolean, + datas?: any +} diff --git a/src/attributes/FMAutosetAttribute.ts b/src/attributes/FMAutosetAttribute.ts new file mode 100644 index 0000000..b3c74b9 --- /dev/null +++ b/src/attributes/FMAutosetAttribute.ts @@ -0,0 +1,59 @@ +import FMAttribute, { FMAttributeListeners, FMAttributeAssignment, TriggerCallback } from "../FMAttribute"; +import { evalF } from "../Functions"; + +/** + * elements + * if input has type and type == type time week + * then it will set the value to a new date of the value + * + * + * ex: + * "child:value:queryselector" + * or + * "child:text:queryselector" + * or + * "child:attributeName:queryselector" + * + * + * @export + * @class FMDefaultAttribute + * @extends {FMAttribute} + * @implements {FMAClearInterface} + * @implements {FMAFormInitInterface} + */ +export default class FMAutosetAttribute +extends FMAttribute { + public trigger(ev: FMAttributeListeners, datas?: any): void { + console.log("pouet") + let str = this.input.element.getAttribute("data-autoset") || "" + if (evalF(str, (ster) => {this.input.setValue(ster)})) return + this.normal(str) + // console.log(p) + } + + private normal(str: string) { + const regexp = new RegExp("{([a-zA-Z0-9]+)}") + let loopMax = 0 + while (regexp.test(str) && loopMax++ < 10) { + const el = regexp.exec(str || "") + if (el === null) { + break + } + str = str.replace(new RegExp(el[0], "g"), this.input.form.getJSON()[el[1]]) + } + this.input.setValue(str) + if (loopMax >= 10) { + throw new Error("Error, too many differents variables"); + } + } + + public static listeners: FMAttributeListeners[] = [ + FMAttributeListeners.CHANGE, + FMAttributeListeners.FORM_FILL + ] +} + +export const FMAutosetAttributeAssignment: FMAttributeAssignment = { + attribute: FMAutosetAttribute, + dataElement: "data-autoset" +} diff --git a/src/attributes/FMDefaultAttribute.ts b/src/attributes/FMDefaultAttribute.ts new file mode 100644 index 0000000..7f2d5b8 --- /dev/null +++ b/src/attributes/FMDefaultAttribute.ts @@ -0,0 +1,81 @@ +import FMAttribute, { FMAttributeListeners, FMAttributeAssignment } from "../FMAttribute"; +import { evalF } from "../Functions"; + +/** + * elements + * if input has type and type == type time week + * then it will set the value to a new date of the value + * + * + * ex: + * "child:value:queryselector" + * or + * "child:text:queryselector" + * or + * "child:attributeName:queryselector" + * + * + * @export + * @class FMDefaultAttribute + * @extends {FMAttribute} + * @implements {FMAClearInterface} + * @implements {FMAFormInitInterface} + */ +export default class FMDefaultAttribute +extends FMAttribute { + public trigger(ev: FMAttributeListeners): boolean | void { + this.run() + return true + } + + private run() { + let attrVal = this.input.element.getAttribute("data-default") + + // if element has a date,time,week type + let type = this.input.element.getAttribute("type") || "" + if (type === "date" || type === "time" || type === "week") { + this.input.setValue(attrVal !== "" && attrVal !== null ? new Date(attrVal): new Date()) + return + } + + if (!attrVal) { + this.input.setValue(attrVal) + return + } + + if (evalF(attrVal, (str) => this.input.setValue(str))) { + return + } + + // rest + if (attrVal && attrVal.startsWith("child:")) { + let splitted = attrVal.split(":", 3) + if (splitted.length !== 3) throw Error(`Error: "${this.input.getName()}" data-default starts with child: but is not a three part sequence!`) + + // get child + let el = this.input.element.querySelector(splitted[2]) + if (!el) throw Error(`Error: "${this.input.getName()}" child not found!`) + + // if default is a text + if (splitted[1] === "text") return this.input.setValue(el.textContent) + + // if default is a value + if (splitted[1] === "value") return this.input.setValue((el as HTMLInputElement).value) + + // if default is an attribute value + if (!el.hasAttribute(splitted[1])) throw Error(`Error: "${this.input.getName()}" element don't have the attribute "${splitted[1]}"`) + return this.input.setValue(el.getAttribute(splitted[1])) + } + this.input.setValue(attrVal) + } + + public static listeners: FMAttributeListeners[] = [ + FMAttributeListeners.POST_CLEAR, + FMAttributeListeners.FORM_INIT + ] +} + +export const FMDefaultAttributeAssignment: FMAttributeAssignment = { + attribute: FMDefaultAttribute, + dataElement: "data-default" +} diff --git a/src/attributes/FMIgnoreAttribute.ts b/src/attributes/FMIgnoreAttribute.ts new file mode 100644 index 0000000..e5730cb --- /dev/null +++ b/src/attributes/FMIgnoreAttribute.ts @@ -0,0 +1,43 @@ +import FMAttribute, { FMAttributeListeners, FMAttributeAssignment, TriggerCallback } from "../FMAttribute"; + +/** + * elements + * if input has type and type == type time week + * then it will set the value to a new date of the value + * + * + * ex: + * "child:value:queryselector" + * or + * "child:text:queryselector" + * or + * "child:attributeName:queryselector" + * + * + * @export + * @class FMDefaultAttribute + * @extends {FMAttribute} + * @implements {FMAClearInterface} + * @implements {FMAFormInitInterface} + */ +export default class FMIgnoreAttribute +extends FMAttribute { + public trigger(ev: FMAttributeListeners, datas?: any): TriggerCallback { + console.log("pouetemon") + datas[this.input.getName()] = undefined + console.log(datas) + return { + datas, + result: true + } + } + + public static listeners: FMAttributeListeners[] = [ + FMAttributeListeners.FORM_SUBMIT + ] +} + +export const FMIgnoreAttributeAssignment: FMAttributeAssignment = { + attribute: FMIgnoreAttribute, + dataElement: "data-ignore" +} diff --git a/src/attributes/FMRegexAttribute.ts b/src/attributes/FMRegexAttribute.ts new file mode 100644 index 0000000..60e12f0 --- /dev/null +++ b/src/attributes/FMRegexAttribute.ts @@ -0,0 +1,22 @@ +import FMAttribute, { FMAttributeListeners, FMAttributeAssignment } from "../FMAttribute"; + +export default class FMRegexAttribute +extends FMAttribute { + public trigger(): boolean { + const regStr = this.input.element.dataset.regex + if (!regStr) return true + const regex = new RegExp(regStr, "g") + const test = this.input.getValue() + "" + console.log(test) + return regex.test(test) + } + + public static listeners: FMAttributeListeners[] = [ + FMAttributeListeners.VERIFY + ] +} + +export const FMRegexAttributeAssignment: FMAttributeAssignment = { + attribute: FMRegexAttribute, + dataElement: "data-regex" +}