qcobjects-sdk 2.4.64 → 2.5.105-beta

package/src/js/org.qcobjects.components.splashscreen.ts

@@ -1,5 +1,5 @@
 /**
- * QCObjects SDK 2.4.0
+ * QCObjects SDK 2.5.0
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -23,39 +23,35 @@
  * license document, but changing it is not allowed.
 */
 
-import { Package, Component, CONFIG, logger, ComponentParams, QCObjectsElement } from "qcobjects";
+"use strict";
+import { Package, Component, CONFIG, logger, global } from "qcobjects";
 import { Resize, Fade } from "./org.qcobjects.effects";
 
-const _top: any = (typeof module === "object" && typeof module.exports === "object") ? (
-  module.exports = (typeof globalThis !== "undefined"
-    ? globalThis
-    : typeof self !== "undefined"
-      ? self
-      : typeof window !== "undefined"
-        ? window
-        : typeof global !== "undefined"
-          ? global
-          : {})
-) : ((typeof global === "object") ? (global) : (
-  (typeof window === "object") ? (window) : ({})
-));
-
-// eslint-disable-next-line camelcase
-(function __splash_screen__(global) {
-  "use strict";
-  type SplashScreenParams = ComponentParams & {
+  type SplashScreenParams = {
+    name:string;
     basePath: string;
-  }
-  type MainSplashComponent = Component & {
+    data:any;
+    body:any;
+  }
+  type MainSplashComponent = {
+    body: any;
+    splashScreenComponent: any;
+    shadowed: any;
+    shadowRoot: any;
+    // eslint-disable-next-line no-unused-vars
+    addComponentHelper(arg0: () => void): unknown;
+    name:string;
     _mainPosition: string;
     _mainOpacity: string;
   }
 
-  class SplashScreenComponent extends Component {
+export class SplashScreenComponent extends Component {
     _enabled_: boolean;
     _bgcolor: string;
     cached = false;
     shadowed = true;
+    body: any;
+    shadowRoot: any;
 
     constructor(component: SplashScreenParams) {
       component.name = (typeof component.name === "undefined") ? ("splashscreen") : (component.name);
@@ -98,6 +94,7 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
             if (!_helper_.executed) {
               const _componentRoot = (this.shadowed) ? (this.shadowRoot?.host as HTMLElement) : (this.body as HTMLElement);
               if (typeof global.componentsStack !== "undefined") {
+                 
                 global.componentsStack.filter((c: MainSplashComponent) => c.body.hasAttribute("splashscreen")).map(
                   (mainComponent: MainSplashComponent) => {
                     logger.debug(`Splash Screen of Main Component: ${mainComponent.name}`);
@@ -106,11 +103,11 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
                       if (!(SplashScreenHandler as any).executed) {
                         const component = mainComponent.splashScreenComponent as SplashScreenComponent;
                         const mainElement = (mainComponent.shadowed) ? (mainComponent.shadowRoot?.host as HTMLElement) : (mainComponent.body as HTMLElement);
-                        mainComponent._mainPosition = (mainElement as HTMLElement).style.position;
+                        mainComponent._mainPosition = mainElement.style.position;
                         if (typeof mainElement !== "undefined") {
                           mainElement.style.position = "fixed";
                         }
-                        mainComponent._mainOpacity = (mainElement as HTMLElement).style.opacity;
+                        mainComponent._mainOpacity = mainElement.style.opacity;
                         _componentRoot.style.width = "100%";
                         _componentRoot.style.height = "100%";
                         document.body.style.backgroundColor = "#111111";
@@ -118,9 +115,10 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
                         setTimeout(function () {
                           if (typeof _componentRoot !== "undefined") {
                             document.body.style.backgroundColor = component?._bgcolor;
-                            (_componentRoot as QCObjectsElement).subelements("#slot-logo").map((slotlogo) => {
+                            (_componentRoot as any).subelements("#slot-logo").map((slotlogo:any) => {
                               slotlogo.style.display = "block";
                               slotlogo.style.transformOrigin = "center";
+                               
                               return (new Resize()).apply(slotlogo, 1, 0);
                             });
                             (new Fade()).apply(_componentRoot, 1, 0);
@@ -151,6 +149,10 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
       }
 
     }
+    // eslint-disable-next-line no-unused-vars
+    addComponentHelper(arg0: { (): void; executed: boolean; }) {
+      throw new Error("Method not implemented.");
+    }
 
 
   }
@@ -160,7 +162,7 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
     SplashScreenComponent
   ]);
 
-  class VideoSplashScreenComponent extends SplashScreenComponent {
+  export class VideoSplashScreenComponent extends SplashScreenComponent {
     cached = false;
     shadowed = true;
     tplsource = "inline";
@@ -336,7 +338,7 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
     }
   }
 
-  class CubeSplashScreenComponent extends SplashScreenComponent {
+  export class CubeSplashScreenComponent extends SplashScreenComponent {
     cached = false;
     shadowed = true;
     tplsource = "inline";
@@ -663,18 +665,8 @@ const _top: any = (typeof module === "object" && typeof module.exports === "obje
 
 
   Package("org.qcobjects.components.splashscreen", [
+    SplashScreenComponent,
     VideoSplashScreenComponent,
     CubeSplashScreenComponent
   ]);
 
-})(_top);
-
-const SplashScreenComponent = _top.SplashScreenComponent;
-const VideoSplashScreenComponent = _top.VideoSplashScreenComponent;
-const CubeSplashScreenComponent = _top.CubeSplashScreenComponent;
-
-export {
-  SplashScreenComponent,
-  VideoSplashScreenComponent,
-  CubeSplashScreenComponent
-};

package/src/js/org.qcobjects.components.ts

@@ -1,5 +1,5 @@
 /**
- * QCObjects SDK 2.4
+ * QCObjects SDK 2.5
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -24,153 +24,64 @@
  */
 "use strict";
 
-import { Package, Component, logger, _DOMCreateElement, CONFIG, New, ClassFactory, Tag, ComponentURI, QCObjectsElement, ComponentDoneResponse, ComponentParams } from "qcobjects";
+import { Package, Component, _DOMCreateElement, CONFIG, New, ClassFactory, Tag, ComponentURI } from "qcobjects";
 import { ModalFade, ModalMoveDown, ModalMoveUp } from "./org.qcobjects.effects";
-const _top:any = (typeof module === "object" && typeof module.exports === "object") ? (
-  module.exports = (typeof globalThis !== "undefined"
-  ? globalThis
-  : typeof self !== "undefined"
-  ? self
-  : typeof window !== "undefined"
-  ? window
-  : typeof global !== "undefined"
-  ? global
-  : {})
-) : ((typeof global === "object") ? (global) : (
-  (typeof window === "object") ? (window) : ({})
-));
-(function (global:any) {
-
-  type FieldComponentParams = ComponentParams & {
-    basePath?:string;
-    fieldType:string;
+import {FormField, FieldComponentParams} from "./org.qcobjects.base.components";
+export {FormField};
+
+export class ShadowedComponent extends Component {
+  container = null;
+  shadowed = true;
+  cached = false;
+  controller = null;
+  view = null;
+  data = {};
+
+  constructor(o: FieldComponentParams) {
+    o.body = _DOMCreateElement("div");
+    super(o);
   }
-  class FormField extends Component {
-    fieldType!:string;
-    cached = false;
-    reload = true;
-    constructor (o:FieldComponentParams){
-      o.name = (typeof o.name !== "undefined")?(o.name):("form-field");
-      super(o);
-    }
-
-    createBindingEvents() {
-      let _objList;
-      if (typeof this.fieldType === "undefined" || this.fieldType == null) {
-        _objList = (this.body as QCObjectsElement).subelements("*[data-field]"); // every child with data-field set
-      } else {
-        _objList = (this.body as QCObjectsElement).subelements(this.fieldType + "[data-field]"); // every child with data-field set and tagname is equal to fieldType property
-      }
-      for (let _datak = 0; _datak < _objList.length; _datak++) {
-        const _obj = _objList[_datak];
-        _obj.addEventListener("change",  () => {
-          logger.debug("Executing change event binding");
-          this.executeBindings();
-        });
-        _obj.addEventListener("blur", () => {
-          logger.debug("Executing change event binding");
-          this.executeBindings();
-        });
-        _obj.addEventListener("focus", () => {
-          logger.debug("Executing change event binding");
-          this.executeBindings();
-        });
-        _obj.addEventListener("keydown", () =>{
-          logger.debug("Executing keydown event binding");
-          this.executeBindings();
-        });
-      }
-    }
-
-    executeBinding(_obj:HTMLElement & {value:any}) {
-      const _datamodel = _obj.getAttribute("data-field");
-      logger.debug("Binding " + _datamodel + " for " + this.name);
-      this.data[_datamodel as keyof typeof this.data] = _obj.value;
-    }
 
-    executeBindings() {
-      let _objList;
-      if (typeof this.fieldType === "undefined" || this.fieldType == null) {
-        _objList = (this.body as QCObjectsElement).subelements("*[data-field]"); // every child with data-field set
-      } else {
-        _objList = (this.body as QCObjectsElement).subelements(this.fieldType + "[data-field]"); // every child with data-field set and tagname is equal to fieldType property
-      }
-      for (let _datak = 0; _datak < _objList.length; _datak++) {
-        const _obj = _objList[_datak] as HTMLElement & {value:any};
-        const _datamodel = _obj.getAttribute("data-field");
-        logger.debug("Binding " + _datamodel + " for " + this.name);
-        this.data[_datamodel as keyof typeof this.data] = _obj.value;
-      }
-    }
-
-    done(standardResponse:ComponentDoneResponse):Promise<ComponentDoneResponse> {
-      const _ret_ = super.done(standardResponse);
-      this.executeBindings();
-      this.createBindingEvents();
-      logger.debug("Field loaded: " + this.fieldType + "[name=" + this.name + "]");
-      return _ret_;
-    }
 
+}
 
+export class ButtonField extends FormField {
+  constructor(o: FieldComponentParams) {
+    o.fieldType = "button";
+    super(o);
   }
+}
 
-  Package("org.qcobjects.base.components", [
-    FormField
-  ]);
-
-  class ShadowedComponent extends Component {
-    container = null;
-    shadowed = true;
-    cached = false;
-    controller = null;
-    view = null;
-    data = {};
-
-    constructor (o:FieldComponentParams){
-      o.body = _DOMCreateElement("div") as QCObjectsElement;
-      super(o);
-    }
-
-
+export class InputField extends FormField {
+  constructor(o: FieldComponentParams) {
+    o.fieldType = "input";
+    super(o);
   }
 
-  class ButtonField extends FormField {
-    constructor(o:FieldComponentParams) {
-      o.fieldType = "button";
-      super(o);
-    }
-  }
-
-  class InputField extends FormField {
-    constructor(o:FieldComponentParams) {
-      o.fieldType = "input";
-      super(o);
-    }
+}
 
+export class TextField extends FormField {
+  constructor(o: FieldComponentParams) {
+    o.fieldType = "textarea";
+    super(o);
   }
 
-  class TextField extends FormField {
-    constructor(o:FieldComponentParams) {
-      o.fieldType = "textarea";
-      super(o);
-    }
+}
 
+export class EmailField extends FormField {
+  constructor(o: FieldComponentParams) {
+    o.fieldType = "input";
+    super(o);
   }
 
-  class EmailField extends FormField {
-    constructor(o:FieldComponentParams) {
-      o.fieldType = "input";
-      super(o);
-    }
-
-  }
+}
 
-  class ModalEnclosureComponent extends Component {
-    name = "modalenclosure";
-    tplsource = "inline";
-    cached = false;
-    basePath = CONFIG.get("modalBasePath", CONFIG.get("remoteSDKPath", ""));
-    template = `
+export class ModalEnclosureComponent extends Component {
+  name = "modalenclosure";
+  tplsource = "inline";
+  cached = false;
+  basePath = CONFIG.get("modalBasePath", CONFIG.get("remoteSDKPath", ""));
+  template = `
 <!-- The Modal -->
 <style>
 @import url('https://sdk.qcobjects.dev/css/modal.css');
@@ -186,151 +97,130 @@ const _top:any = (typeof module === "object" && typeof module.exports === "objec
 </div>
 `;
 
-    data = {};
-    constructor(o:FieldComponentParams) {
-      o.body = _DOMCreateElement("div") as QCObjectsElement;
-      super(o);
+  data = {};
+  constructor(o: FieldComponentParams) {
+    o.body = _DOMCreateElement("div");
+    super(o);
+  }
+
+}
+
+export class ModalComponent extends Component {
+  name = "modal";
+  cached = false;
+  modalEnclosureComponentClass = "ModalEnclosureComponent";
+  controller = null;
+  view = null;
+  tplsource = "none";
+  closeOnClickOutside = false;
+  data = {
+    content: "",
+    modalId: 0
+  };
+
+  submodal = null;
+  __instanceID!: number;
+  basePath: any;
+  subcomponents: any;
+  body: any;
+  templateURI: any;
+
+  constructor(o: FieldComponentParams) {
+    o.basePath = CONFIG.get("modalBasePath", CONFIG.get("remoteSDKPath", ""));
+    super(o);
+    this.data.modalId = this.__instanceID;
+    const submodal = New(ClassFactory(this.modalEnclosureComponentClass), {
+      name: this.name,
+      basePath: this.basePath,
+      data: this.data
+    });
+    this.subcomponents.push(submodal);
+    this.submodal = submodal;
+    if (submodal.tplsource === "none") {
+      this.body.innerHTML = submodal.parsedAssignmentText;
+    } else {
+      this.body.append(submodal.body);
     }
 
   }
 
-  class ModalComponent extends Component {
-    name = "modal";
-    cached = false;
-    modalEnclosureComponentClass = "ModalEnclosureComponent";
-    controller = null;
-    view = null;
-    tplsource = "none";
-    closeOnClickOutside = false;
-    data = {
-      content: "",
-      modalId: 0
-    };
-
-    submodal = null;
-
-    constructor(o:FieldComponentParams) {
-      o.basePath = CONFIG.get("modalBasePath", CONFIG.get("remoteSDKPath", ""));
-      super(o);
-      this.data.modalId = this.__instanceID;
-      const submodal = New(ClassFactory(this.modalEnclosureComponentClass), {
-        name: this.name,
-        basePath: this.basePath,
-        data: this.data
-      });
-      this.subcomponents.push(submodal);
-      this.submodal = submodal;
-      if (submodal.tplsource === "none") {
-        this.body.innerHTML = submodal.parsedAssignmentText;
-      } else {
-        this.body.append(submodal.body);
-      }
+  modal() {
+    const modalId = this.data.modalId;
 
-    }
+    Tag("#modalInstance_" + modalId + ".modal").map((modal: any) => {
+      modal.style.display = "block";
 
-    modal() {
-      const modalId = this.data.modalId;
+      return (new ModalFade()).apply(modal, 0, 1);
+    });
+    Tag("#modalInstance_" + modalId + ".modal .modal-content").map((modalcontent: any) => {
 
-      Tag("#modalInstance_" + modalId + ".modal").map( (modal) => {
-        modal.style.display = "block";
-        return (new ModalFade({})).apply(modal, 0, 1);
-      });
-      Tag("#modalInstance_" + modalId + ".modal .modal-content").map( (modalcontent) => {
-        return (new ModalMoveDown({})).apply(modalcontent, 0, -document.body.clientHeight, 0, 0);
-      });
-      Tag("#modalInstance_" + modalId + ".modal .modal-content .close").map( (closebtn) => {
-        return closebtn.addEventListener("click",  () => {
-          this.close();
-        }, false);
-      });
-      if (this.closeOnClickOutside) {
-        window.addEventListener("click",  () => {
-          this.close();
-        }, false);
-      }
-    }
+      return ModalMoveDown.apply(modalcontent, 0, -document.body.clientHeight, 0, 0);
+    });
+    Tag("#modalInstance_" + modalId + ".modal .modal-content .close").map((closebtn: any) => {
 
-    close() {
-      const modalId = this.data.modalId;
-      Tag("#modalInstance_" + modalId + ".modal").map( (modal) => {
-        modal.style.display = "block";
-        return (new ModalFade({})).apply(modal, 1, 0);
-      });
-      Tag("#modalInstance_" + modalId + ".modal .modal-content").map(function (modalcontent) {
-        return (new ModalMoveUp({})).apply(modalcontent, 0, 0, 0, -document.body.clientHeight);
-      });
-      setTimeout(function () {
-        Tag("#modalInstance_" + modalId + ".modal").map((modal) => {
-          modal.style.display = "none";
-          return true;
-        });
-      }, 900);
+      return closebtn.addEventListener("click", () => {
+        this.close();
+      }, false);
+    });
+    if (this.closeOnClickOutside) {
+      window.addEventListener("click", () => {
+        this.close();
+      }, false);
     }
+  }
 
-    rebuild() {
-      const _ret_ = super.rebuild();
-      this.templateURI = ComponentURI({
-        "COMPONENTS_BASE_PATH": CONFIG.get("componentsBasePath", ""),
-        "COMPONENT_NAME": "modal",
-        "TPLEXTENSION": CONFIG.get("tplextension", ""),
-        "TPL_SOURCE": "default" // here is always default in order to get the right uri
+  close() {
+    const modalId = this.data.modalId;
+    Tag("#modalInstance_" + modalId + ".modal").map((modal: any) => {
+      modal.style.display = "block";
+
+      return (new ModalFade({ duration: 3000 })).apply(modal, 1, 0);
+    });
+    Tag("#modalInstance_" + modalId + ".modal .modal-content").map(function (modalcontent: any) {
+
+      return ModalMoveUp.apply(modalcontent, 0, 0, 0, -document.body.clientHeight);
+    });
+    setTimeout(function () {
+      Tag("#modalInstance_" + modalId + ".modal").map((modal: any) => {
+        modal.style.display = "none";
+        return true;
       });
-      return _ret_; // parent call
-    }
+    }, 900);
+  }
 
+  rebuild() {
+    const _ret_ = super.rebuild();
+    this.templateURI = ComponentURI({
+      "COMPONENTS_BASE_PATH": CONFIG.get("componentsBasePath", ""),
+      "COMPONENT_NAME": "modal",
+      "TPLEXTENSION": CONFIG.get("tplextension", ""),
+      "TPL_SOURCE": "default" // here is always default in order to get the right uri
+    });
 
+    return _ret_; // parent call
   }
 
-  class SwaggerUIComponent extends Component {
-    cached = false;
-    basePath = CONFIG.get("remoteSDKPath", "");
-    tplextension = "tpl.html";
-    name = "swagger-ui";
 
-  }
+}
 
+export class SwaggerUIComponent extends Component {
+  cached = false;
+  basePath = CONFIG.get("remoteSDKPath", "");
+  tplextension = "tpl.html";
+  name = "swagger-ui";
 
-  Package("org.qcobjects.form.components", [
-    ShadowedComponent,
-    ButtonField,
-    InputField,
-    TextField,
-    EmailField,
-    ModalEnclosureComponent,
-    ModalComponent,
-    SwaggerUIComponent
-  ]);
-
-  global.FormField = FormField;
-  global.ShadowedComponent = ShadowedComponent;
-  global.ButtonField = ButtonField;
-  global.InputField = InputField;
-  global.TextField = TextField;
-  global.EmailField = EmailField;
-  global.ModalEnclosureComponent = ModalEnclosureComponent;
-  global.ModalComponent = ModalComponent;
-  global.SwaggerUIComponent = SwaggerUIComponent;    
-
-})(_top);
-
-const FormField = _top.FormField;
-const ShadowedComponent = _top.ShadowedComponent;
-const ButtonField = _top.ButtonField;
-const InputField = _top.InputField;
-const TextField = _top.TextField;
-const EmailField = _top.EmailField;
-const ModalEnclosureComponent = _top.ModalEnclosureComponent;
-const ModalComponent = _top.ModalComponent;
-const SwaggerUIComponent = _top.SwaggerUIComponent;
-
-export {
-  FormField,
-  ShadowedComponent, 
-  ButtonField, 
-  InputField, 
-  TextField, 
-  EmailField, 
-  ModalComponent, 
-  ModalEnclosureComponent, 
+}
+
+
+Package("org.qcobjects.form.components", [
+  ShadowedComponent,
+  ButtonField,
+  InputField,
+  TextField,
+  EmailField,
+  ModalEnclosureComponent,
+  ModalComponent,
   SwaggerUIComponent
-};
+]);
+
+