qcobjects-sdk 2.4.64 → 2.5.105-beta

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

@@ -1,7 +1,5 @@
-import { Package, Component, ComponentParams } from "qcobjects";
-
 /**
- * QCObjects SDK 2.4
+ * QCObjects SDK 2.5
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -24,72 +22,47 @@ import { Package, Component, ComponentParams } from "qcobjects";
  * Everyone is permitted to copy and distribute verbatim copies of this
  * license document, but changing it is not allowed.
  */
-const _top = (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) {
-  "use strict";
+"use strict";
+import { Package, Component } from "qcobjects";
 
-  class GridItemComponent extends Component {
-    name = "grid-item";
-    shadowed= true;
-    tplsource= "inline";
-    template= `
+export class GridItemComponent extends Component {
+  name = "grid-item";
+  shadowed = true;
+  tplsource = "inline";
+  template = `
 <img src="{{image}}" />
 <p>{{description}}</p>
 `;
 
-    cached= false;
-
-  }
-
-  class GridComponent extends Component {
-    name= "grid";
-    cached= false;
-    view= null;
-    shadowed= true;
-    rows= 3;
-    cols= 3;
-    templateURI= "";
-    data= {};
-    tplsource= "inline";
-    template= "<p>Loading...</p>";
+  cached = false;
 
-    constructor (o:ComponentParams){
-      super(o);
-      this.body.setAttribute("controllerClass", "DataGridController");
-      const subcomponentClass = (this.body.getAttribute("subcomponentClass") !== null) ? (this.body.getAttribute("subcomponentClass")) : ("GridItemComponent");
-      this.body.setAttribute("subcomponentClass", subcomponentClass as string);
+}
 
-    }
+export class GridComponent extends Component {
+  name = "grid";
+  cached = false;
+  view = null;
+  shadowed = true;
+  rows = 3;
+  cols = 3;
+  templateURI = "";
+  data = {};
+  tplsource = "inline";
+  template = "<p>Loading...</p>";
+  body: any;
 
+  constructor(o: any) {
+    super(o);
+    this.body.setAttribute("controllerClass", "DataGridController");
+    const subcomponentClass = (this.body.getAttribute("subcomponentClass") !== null) ? (this.body.getAttribute("subcomponentClass")) : ("GridItemComponent");
+    this.body.setAttribute("subcomponentClass", subcomponentClass as string);
 
   }
 
-  Package("org.qcobjects.components.grid", [
-    GridComponent,
-    GridItemComponent
-  ]);
-
-  global.GridComponent = GridComponent;
-  global.GridItemComponent = GridItemComponent;
-
-})(_top);
 
-const GridComponent = (_top as any).GridComponent;
-const GridItemComponent = (_top as any).GridItemComponent;
+}
 
-export {
-  GridComponent, 
+Package("org.qcobjects.components.grid", [
+  GridComponent,
   GridItemComponent
-};
+]);

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

@@ -1,7 +1,5 @@
-import { Component, ComponentParams, Package } from "qcobjects";
-
 /**
- * QCObjects SDK 2.4
+ * QCObjects SDK 2.5
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -24,40 +22,36 @@ import { Component, ComponentParams, Package } from "qcobjects";
  * Everyone is permitted to copy and distribute verbatim copies of this
  * license document, but changing it is not allowed.
 */
-const _top = (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) {
 "use strict";
-class ListItemComponent extends Component {
+import { Component, Package } from "qcobjects";
+
+
+export class ListItemComponent extends Component {
   shadowed= false;
   tplsource= "inline";
   template="<a href=\"{{value}}\">{{label}}</a>";
   cached= false;
 
-  constructor (o:ComponentParams){
+  constructor (o:any){
     o.name="list-item";
     super(o);
   }
 
 }
 
-class ListComponent extends Component {
+export class ListComponent extends Component {
+  data!:any;
   shadowed= true;
   tplsource= "inline";
   template= "<p>Loading...</p>";
+  body: any;
+  shadowRoot: HTMLElement | undefined;
+  rows!: string | number | null;
+  subcomponents!: never[];
+  done: any;
+  serviceData: any;
 
-  constructor (o:ComponentParams){
+  constructor (o:any){
     o.name = "list";
     super(o);
     this.body.setAttribute("controllerClass","ListController");
@@ -71,13 +65,3 @@ Package("org.qcobjects.components.list",[
   ListItemComponent,
   ListComponent
 ]);
-
-global.ListComponent = ListComponent;
-global.ListItemComponent = ListItemComponent;
-
-})(_top);
-
-const ListComponent = (_top as any).ListComponent;
-const ListItemComponent = (_top as any).ListItemComponent;
-
-export {ListComponent, ListItemComponent};

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

@@ -1,8 +1,5 @@
-import { Package, Component, _DOMCreateElement, New, _super_, ComponentParams, QCObjectsElement } from "qcobjects";
-import { Fade, Move } from "./org.qcobjects.effects";
-
 /**
- * QCObjects SDK 2.4
+ * QCObjects SDK 2.5
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -25,17 +22,21 @@ import { Fade, Move } from "./org.qcobjects.effects";
  * Everyone is permitted to copy and distribute verbatim copies of this
  * license document, but changing it is not allowed.
 */
-(function() {
 "use strict";
-class NotificationComponent extends Component {
+import { Package, Component, _DOMCreateElement, New, _super_ } from "qcobjects";
+import { Fade, Move } from "./org.qcobjects.effects";
+
+
+export class NotificationComponent extends Component {
   cached= false;
   tplsource= "inline";
   shadowed= false;
   kinds:string[];
+  template: string;
 
-  constructor (o:ComponentParams){
+  constructor (o:any){
     o.name= "notification";
-    o.body = _DOMCreateElement("div") as QCObjectsElement;
+    o.body = _DOMCreateElement("div") as HTMLElement;
     super(o);
 
     this.template= `
@@ -110,8 +111,9 @@ class NotificationComponent extends Component {
         disappearEffect.apply(element);
       },2000);
     };
-    (element as QCObjectsElement).subelements("div.notification_background").map(element=>New(Fade,{duration:500}).apply(element,0,1));
-    (element as QCObjectsElement).subelements("div.notification").map(element=>_display_(element));
+     
+    (element as any).subelements("div.notification_background").map((element:HTMLElement):any=> {return (new Fade ({duration:500})).apply(element,0,1);} );
+    (element as any).subelements("div.notification").map((element:any)=>_display_(element));
     setTimeout(function (){
       element.remove();
     },2200);
@@ -187,5 +189,3 @@ class NotificationComponent extends Component {
 Package("org.quickcorp.components.notifications", [
   NotificationComponent
 ]);
-
-})();

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

@@ -1,7 +1,5 @@
-import { Package, Component, ComponentParams } from "qcobjects";
-
 /**
- * QCObjects SDK 2.4
+ * QCObjects SDK 2.5
  * ________________
  *
  * Author: Jean Machuca <correojean@gmail.com>
@@ -24,182 +22,195 @@ import { Package, Component, ComponentParams } from "qcobjects";
  * Everyone is permitted to copy and distribute verbatim copies of this
  * license document, but changing it is not allowed.
 */
-(function() {
 "use strict";
-Package("org.qcobjects.components.slider",[
-
-  class SlideListComponent extends Component {
-    tplsource="inline";
-    template="<p>Loading...</p>";
-    name = "slidelist";
-
-    constructor (o:ComponentParams){
-      super(o);
-      this.body.setAttribute("controllerClass","DataGridController");
-      const subcomponentClass = (this.body.getAttribute("subcomponentClass") !== null)?(this.body.getAttribute("subcomponentClass")):("GridItemComponent");
-      this.body.setAttribute("subcomponentClass",subcomponentClass as string);
-    }
+import { Package, Component } from "qcobjects";
+
+export class SlideListComponent extends Component {
+  tplsource = "inline";
+  template = "<p>Loading...</p>";
+  name = "slidelist";
+  body: any;
+
+  constructor(o: any) {
+    super(o);
+    this.body.setAttribute("controllerClass", "DataGridController");
+    const subcomponentClass = (this.body.getAttribute("subcomponentClass") !== null) ? (this.body.getAttribute("subcomponentClass")) : ("GridItemComponent");
+    this.body.setAttribute("subcomponentClass", subcomponentClass as string);
+  }
+
+}
 
-  },
-
-  class SlideItemComponent extends Component {
-    effectClass = "Fade";
-    name = "slider_item";
-
-    constructor (o:ComponentParams) {
-      super(o);
-      this.data.slideNumber = this.data.__dataIndex+1;
-      this.template= `
-      <div class="qcoSlides" style="display:none">
-        <div class="qco-slider__numbertext">{{slideNumber}} / {{__dataLength}}</div>
-        <img src="{{image}}" alt="{{title}}"/>
-        <div class="qco-slider__text">
-          <p>{{label}} <a href="{{link}}">{{category}}</a></p>
-        </div>
+export class SlideItemComponent extends Component {
+  effectClass = "Fade";
+  name = "slider_item";
+  data: any;
+  template: string;
+  tplsource: string;
+
+  constructor(o: any) {
+    super(o);
+    this.data.slideNumber = this.data.__dataIndex + 1;
+    this.template = `
+    <div class="qcoSlides" style="display:none">
+      <div class="qco-slider__numbertext">{{slideNumber}} / {{__dataLength}}</div>
+      <img src="{{image}}" alt="{{title}}"/>
+      <div class="qco-slider__text">
+        <p>{{label}} <a href="{{link}}">{{category}}</a></p>
       </div>
-      `;
-      this.tplsource= "inline";
-  
+    </div>
+    `;
+    this.tplsource = "inline";
+
+  }
+
+}
+
+export class SliderComponent extends Component {
+  name = "slider";
+  template: string;
+  tplsource: string;
+  shadowed: boolean;
+  data: any;
+  body: any;
+  __instanceID: any;
+
+  constructor(o: any) {
+    super(o);
+    this.template = `
+    <style>
+    /* Slideshow container */
+
+    :host a:hover,
+    :host a:active,
+    :host a:visited {
+      color: #ffffff;
     }
 
-  },
-
-  class SliderComponent extends Component {
-    name = "slider";
-
-    constructor (o:ComponentParams) {
-      super(o);
-      this.template= `
-      <style>
-      /* Slideshow container */
-  
-      :host a:hover,
-      :host a:active,
-      :host a:visited {
-        color: #ffffff;
-      }
-  
-       {
-        color: #ffffff;
-      }
-  
-      :host .prev {left:0;}
-      .qco-slider__container {
-        max-width: 100%;
-        position: relative;
-        margin: auto;
-        height: 300px;
-      }
-      :host .qco-slider__container .qcoSlides img {
-        object-fit: cover;
-        width: 100%;
-        height: 300px;
-      }
-  
-      /* Next & previous buttons */
-      :host .prev,
-      :host .next {
-        cursor: pointer;
-        position: absolute;
-        top: 50%;
-        width: auto;
-        margin-top: -22px;
-        padding: 16px;
-        color: white;
-        font-weight: bold;
-        font-size: 18px;
-        transition: 0.6s ease;
-        border-radius: 0 3px 3px 0;
-        background-color: rgba(1, 1, 1, 0.1);
-      }
-  
-      /* Position the "next button" to the right */
-      :host .next {
-        right: 0;
-        border-radius: 3px 0 0 3px;
-      }
-  
-      /* On hover, add a black background color with a little bit see-through */
-      :host .prev:hover,
-      :host .next:hover {
-        background-color: rgba(0, 0, 0, 0.8);
-      }
-  
-      /* Caption text */
-      :host .qco-slider__text {
-        color: #f2f2f2;
-        font-size: 15px;
-  /*      padding: 8px 12px;*/
-        position: absolute;
-        bottom: 8px;
-        width: 100%;
-        text-align: center;
-        text-shadow: -1px 1px 3px #111111;
-        background-color: rgba(1,1,1,0.7);
-      }
-  
-      /* Number text (1/3 etc) */
-      :host .qco-slider__numbertext {
-        color: #f2f2f2;
-        text-shadow: 0px 2px 3px #111111;
-        font-size: 12px;
-        padding: 8px 12px;
-        position: absolute;
-        top: 0;
-        padding-top: 0;
-        margin-top: 10px;
-      }
-  
-      /* The dots/bullets/indicators */
-      :host .qcoSlider__dots {
-        text-align: center;
-        margin: 0 auto;
-        padding: 0;
-      }
-      :host .qcoSlider__dots--dot {
-        cursor: pointer;
-        height: 10px;
-        width: 10px;
-        margin: 0 2px;
-        background-color: #bbb;
-        border-radius: 50%;
-        display: inline-block;
-        transition: background-color 0.6s ease;
-      }
-  
-      :host .active,
-      :host .qcoSlider__dots--dot:hover {
-        background-color: #717171;
-      }
-  
-      :host .qco-slider__container .qcoSlides img {
-        border-radius: 30px 30px 0px 0px;
-      }
-  
-      </style>
-  
-      <div class="qco-slider__container">
-        <component name="slidelist" componentClass="SlideListComponent" subcomponentClass="SlideItemComponent" serviceClass="{{SERVICE_CLASS}}" ></component>
-  
-        <a class="prev" onclick="global.get('{{sliderHandler}}').plusSlidesAndStop(-1)">&#10094;</a>
-        <a class="next" onclick="global.get('{{sliderHandler}}').plusSlidesAndStop(1)">&#10095;</a>
-      </div>
-      <br>
-  
-      <div class="qcoSlider__dots" style="text-align:center">
-      </div>
-  
-      `;
-      this.tplsource= "inline";
-      this.shadowed= true;
-      this.data.SERVICE_CLASS = this.body.getAttribute("serviceClass");
-      this.data.sliderHandler = "slider_"+this.__instanceID.toString();
-      this.body.setAttribute("controllerClass","SliderController");
+     {
+      color: #ffffff;
+    }
 
+    :host .prev {left:0;}
+    .qco-slider__container {
+      max-width: 100%;
+      position: relative;
+      margin: auto;
+      height: 300px;
+    }
+    :host .qco-slider__container .qcoSlides img {
+      object-fit: cover;
+      width: 100%;
+      height: 300px;
     }
 
+    /* Next & previous buttons */
+    :host .prev,
+    :host .next {
+      cursor: pointer;
+      position: absolute;
+      top: 50%;
+      width: auto;
+      margin-top: -22px;
+      padding: 16px;
+      color: white;
+      font-weight: bold;
+      font-size: 18px;
+      transition: 0.6s ease;
+      border-radius: 0 3px 3px 0;
+      background-color: rgba(1, 1, 1, 0.1);
+    }
+
+    /* Position the "next button" to the right */
+    :host .next {
+      right: 0;
+      border-radius: 3px 0 0 3px;
+    }
+
+    /* On hover, add a black background color with a little bit see-through */
+    :host .prev:hover,
+    :host .next:hover {
+      background-color: rgba(0, 0, 0, 0.8);
+    }
+
+    /* Caption text */
+    :host .qco-slider__text {
+      color: #f2f2f2;
+      font-size: 15px;
+/*      padding: 8px 12px;*/
+      position: absolute;
+      bottom: 8px;
+      width: 100%;
+      text-align: center;
+      text-shadow: -1px 1px 3px #111111;
+      background-color: rgba(1,1,1,0.7);
+    }
+
+    /* Number text (1/3 etc) */
+    :host .qco-slider__numbertext {
+      color: #f2f2f2;
+      text-shadow: 0px 2px 3px #111111;
+      font-size: 12px;
+      padding: 8px 12px;
+      position: absolute;
+      top: 0;
+      padding-top: 0;
+      margin-top: 10px;
+    }
+
+    /* The dots/bullets/indicators */
+    :host .qcoSlider__dots {
+      text-align: center;
+      margin: 0 auto;
+      padding: 0;
+    }
+    :host .qcoSlider__dots--dot {
+      cursor: pointer;
+      height: 10px;
+      width: 10px;
+      margin: 0 2px;
+      background-color: #bbb;
+      border-radius: 50%;
+      display: inline-block;
+      transition: background-color 0.6s ease;
+    }
+
+    :host .active,
+    :host .qcoSlider__dots--dot:hover {
+      background-color: #717171;
+    }
+
+    :host .qco-slider__container .qcoSlides img {
+      border-radius: 30px 30px 0px 0px;
+    }
+
+    </style>
+
+    <div class="qco-slider__container">
+      <component name="slidelist" componentClass="SlideListComponent" subcomponentClass="SlideItemComponent" serviceClass="{{SERVICE_CLASS}}" ></component>
+
+      <a class="prev" onclick="global.get('{{sliderHandler}}').plusSlidesAndStop(-1)">&#10094;</a>
+      <a class="next" onclick="global.get('{{sliderHandler}}').plusSlidesAndStop(1)">&#10095;</a>
+    </div>
+    <br>
+
+    <div class="qcoSlider__dots" style="text-align:center">
+    </div>
+
+    `;
+    this.tplsource = "inline";
+    this.shadowed = true;
+    this.data.SERVICE_CLASS = this.body.getAttribute("serviceClass");
+    this.data.sliderHandler = "slider_" + this.__instanceID.toString();
+    this.body.setAttribute("controllerClass", "SliderController");
+
   }
 
-]);
+}
+
 
-})();
+Package("org.qcobjects.components.slider", [
+  SlideListComponent,
+  SlideItemComponent,
+  SliderComponent
+
+]);