qcobjects-sdk 2.3.24

package/js/org.qcobjects.controllers.list.js

@@ -0,0 +1,229 @@
+/**
+ * QCObjects SDK 2.3
+ * ________________
+ *
+ * Author: Jean Machuca <correojean@gmail.com>
+ *
+ * Cross Browser Javascript Framework for MVC Patterns
+ * QuickCorp/QCObjects is licensed under the
+ * GNU Lesser General Public License v3.0
+ * [LICENSE] (https://github.com/QuickCorp/QCObjects/blob/master/LICENSE.txt)
+ *
+ * Permissions of this copyleft license are conditioned on making available
+ * complete source code of licensed works and modifications under the same
+ * license or the GNU GPLv3. Copyright and license notices must be preserved.
+ * Contributors provide an express grant of patent rights. However, a larger
+ * work using the licensed work through interfaces provided by the licensed
+ * work may be distributed under different terms and without source code for
+ * the larger work.
+ *
+ * Copyright (C) 2015 Jean Machuca,<correojean@gmail.com>
+ *
+ * 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.controllers.list",[
+  Class("ListController",Controller,{
+    dependencies:[],
+    component:null,
+    _new_:function (o){
+      this.__new__(o);
+      var controller=this;
+      controller._componentRoot = (controller.component.shadowed)?(controller.component.shadowRoot):(controller.component.body);
+
+      controller.labelField = controller.component.body.getAttribute("label-field");
+      controller.valueField = controller.component.body.getAttribute("value-field");
+      controller.rows=controller.component.body.getAttribute("rows");
+      controller.rows=(controller.rows !== null)?(controller.rows):(controller.component.rows);
+      controller.cols=1;
+      logger.debug("ListController INIT");
+    },
+    getPageIndex: function (page, totalPage, totalElements) {
+      page = new Number(page);
+      page = (page>0)?(page-1):(0);
+      totalPage = new Number(totalPage);
+      totalElements = new Number(totalElements);
+      return [totalElements*page/ totalPage, (totalElements*page/ totalPage) + totalElements/totalPage];
+    },
+    addSubcomponents:function (){
+      var controller = this;
+      controller.component.subcomponents = [];
+      var layout = controller.component.body.getAttribute("layout");
+      var basePath = CONFIG.get("listBasePath",CONFIG.get("remoteSDKPath"));
+      var cssLayout = "";
+      if (layout === "horizontal"){
+        cssLayout = `@import url("${basePath}css/components/horizontal-list.css");`;
+      } else {
+        cssLayout = `@import url("${basePath}css/components/list.css");`;
+      }
+      controller._componentRoot.innerHTML = `<style>${cssLayout}</style><ul></ul>`;
+      logger.debug(_DataStringify(controller.component.data));
+      try {
+        var subcomponentClass = controller.component.body.getAttribute("subcomponentClass");
+        if (subcomponentClass != null){
+          var offset;
+          var limit;
+          var pagesNumber;
+          var list = [...controller.component.data];
+          var paginateIn = controller.component.body.getAttribute("paginate-in");
+          paginateIn = (paginateIn !== null)?(paginateIn):("client");
+          if (paginateIn === "client"){
+            var page = controller.component.body.getAttribute("page-number");
+            page = (isNaN(page) || page === null)?(-1):(page);
+            if (page !== -1){
+              pagesNumber = controller.component.body.getAttribute("total-pages");
+              pagesNumber = (isNaN(pagesNumber))?(1):(pagesNumber);
+              offset = controller.getPageIndex(page, pagesNumber, list.length)[0];
+              limit = controller.getPageIndex(page, pagesNumber, list.length)[1];
+            } else {
+              offset = 0;
+              limit = list.length;
+              pagesNumber = 1;
+            }
+            list = list.slice(offset,limit);
+          } else {
+            offset = 0;
+            limit = list.length;
+            pagesNumber = 1;
+          }
+          list.map(
+            function (record,dataIndex){
+                try {
+                  var _body = _DOMCreateElement("li");
+                  record.label = record[controller.labelField];
+                  record.value = record[controller.valueField];
+                  var subcomponent = New(ClassFactory(subcomponentClass),{
+                    data:{
+                      label:record[controller.labelField],
+                      value:record[controller.valueField],
+                      __dataIndex:dataIndex,
+                      __page:page,
+                      __totalPages:pagesNumber,
+                      __limit:limit,
+                      __offset:offset
+                    },
+                    templateURI:ComponentURI({
+                      "COMPONENTS_BASE_PATH":CONFIG.get("componentsBasePath"),
+                      "COMPONENT_NAME":ClassFactory(subcomponentClass).name,
+                      "TPLEXTENSION":CONFIG.get("tplextension"),
+                      "TPL_SOURCE":ClassFactory(subcomponentClass).tplsource
+                    }),
+                    body:_body,
+                    template:ClassFactory(subcomponentClass).template
+                  });
+                  subcomponent.done = controller.component.done.bind(subcomponent);
+                  try {
+                    if (subcomponent){
+                      subcomponent.data.__dataIndex = dataIndex;
+                      if (controller.component.data.hasOwnProperty.call(controller.component.data,"length")){
+                        subcomponent.data.__dataLength = controller.component.data.length;
+                      }
+                      logger.debug("adding subcomponent to body");
+                      controller._componentRoot.subelements("ul").map(ul=>ul.append(subcomponent));
+                      try {
+                        controller.component.subcomponents.push(subcomponent);
+                      }catch (e){
+                        logger.debug("ERROR LOADING SUBCOMPONENT IN DATAGRID");
+                      }
+                    } else {
+                      logger.debug("ERROR LOADING SUBCOMPONENT IN DATAGRID");
+                    }
+                  }catch (e){
+                    logger.debug("ERROR LOADING SUBCOMPONENT IN DATAGRID");
+                  }
+
+                } catch (e) {
+                  logger.debug("ERROR LOADING SUBCOMPONENT IN DATAGRID");
+                }
+            }
+          );
+        } else {
+          logger.debug("NO SUBCOMPONENT CLASS IN COMPONENT");
+        }
+
+      } catch (e){
+        logger.debug("No data for component");
+      }
+    },
+    cssGrid: function (){
+      var controller=this;
+      var component = controller.component;
+      var _componentRoot = (component.shadowed)?(component.shadowRoot):(component.body);
+      if (typeof controller.rows !== "undefined" && typeof controller.cols !== "undefined"){
+        var s = _DOMCreateElement("style");
+        var templateRows = "auto ".repeat(controller.rows);
+        var templateCols = "auto ".repeat(controller.cols);
+        var className = "grid"+this.__instanceID.toString();
+        s.innerHTML = "."+className+" { \
+                          display: grid; \
+                          grid-template-rows: "+templateRows+"; \
+                          grid-template-columns: "+templateCols+"; \
+                          margin:0 auto; \
+                      }";
+        _componentRoot.append(s);
+        _componentRoot.classList.add(className);
+      }
+    },
+    done:function (){
+      var controller = this;
+      controller.cssGrid();
+
+      var componentInstance = controller.component;
+      logger.debug("ListController DONE");
+      var serviceClass = controller.component.body.getAttribute("serviceClass");
+      if (serviceClass != null){
+        var offset;
+        var limit;
+        var paginateIn = componentInstance.body.getAttribute("paginate-in");
+        paginateIn = (paginateIn !== null)?(paginateIn):("client");
+        if (paginateIn === "server"){
+          var page = componentInstance.body.getAttribute("page-number");
+          page = (isNaN(page) || page === null)?(-1):(page);
+          var pagesNumber;
+          if (page !== -1){
+            var serverDataCount = (controller.component.body.getAttribute("server-data-count")!==null)?(controller.component.body.getAttribute("server-data-count")):(1);
+            pagesNumber = controller.component.body.getAttribute("total-pages");
+            pagesNumber = (isNaN(pagesNumber))?(1):(pagesNumber);
+            offset = controller.getPageIndex(page, pagesNumber, serverDataCount)[0];
+            limit = controller.getPageIndex(page, pagesNumber, serverDataCount)[1];
+            // send params in jsonrpc 2.0 style
+            componentInstance.serviceData = (typeof componentInstance.serviceData !== "undefined")?(componentInstance.serviceData):({});
+            componentInstance.serviceData.params = (typeof componentInstance.serviceData.params !== "undefined")?(componentInstance.serviceData.params):({});
+            componentInstance.serviceData.params.offset = offset;
+            componentInstance.serviceData.params.limit = limit;
+          }
+        }
+
+        serviceLoader(New(ClassFactory(serviceClass),{
+            data:componentInstance.serviceData
+        })).then(
+          (successfulResponse)=>{
+            // This will show the service response as a plain text
+            logger.debug("DONE SERVICE COMPONENT");
+            successfulResponse.service.JSONresponse = JSON.parse(successfulResponse.service.template);
+            if (typeof successfulResponse.service.JSONresponse.result !== "undefined"){
+              logger.debug(_DataStringify(successfulResponse.service.JSONresponse.result));
+              componentInstance.data = successfulResponse.service.JSONresponse.result;
+            } else {
+              componentInstance.data = successfulResponse.service.JSONresponse;
+            }
+            controller.addSubcomponents();
+
+          },
+          (failedResponse)=>{
+            logger.debug(failedResponse);
+          }).catch ((e)=>{
+            logger.debug("Something went wrong when calling the service from: "+serviceClass);
+            logger.debug(e.message);
+          });
+
+      }
+
+    }
+
+  })
+]);
+
+}).call(null);

package/js/org.qcobjects.controllers.slider.js

@@ -0,0 +1,132 @@
+/**
+ * QCObjects SDK 2.3
+ * ________________
+ *
+ * Author: Jean Machuca <correojean@gmail.com>
+ *
+ * Cross Browser Javascript Framework for MVC Patterns
+ * QuickCorp/QCObjects is licensed under the
+ * GNU Lesser General Public License v3.0
+ * [LICENSE] (https://github.com/QuickCorp/QCObjects/blob/master/LICENSE.txt)
+ *
+ * Permissions of this copyleft license are conditioned on making available
+ * complete source code of licensed works and modifications under the same
+ * license or the GNU GPLv3. Copyright and license notices must be preserved.
+ * Contributors provide an express grant of patent rights. However, a larger
+ * work using the licensed work through interfaces provided by the licensed
+ * work may be distributed under different terms and without source code for
+ * the larger work.
+ *
+ * Copyright (C) 2015 Jean Machuca,<correojean@gmail.com>
+ *
+ * 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.controllers.slider",[
+  Class("SliderController",Controller,{
+    dependencies:[],
+    component:null,
+    slideIndex:0,
+    duration:7100,
+    interval: null,
+    sliderHandlerName: null,
+    _new_:function (o){
+      this.__new__(o);
+      var controller=this;
+      var component = controller.component;
+      controller._componentRoot = (component.shadowed)?(component.shadowRoot):(component.body);
+      //TODO: Implement
+      controller.sliderHandlerName = "slider_"+controller.component.__instanceID.toString();
+      global.set(controller.sliderHandlerName,this);
+    },
+    stop: function (){
+      if (this.interval != null){
+        clearInterval(this.interval);
+      }
+    },
+    plusSlidesAndStop: function (n){
+      this.stop();
+      this.plusSlides(n);
+    },
+    plusSlides: function (n) {
+      this.showSlides(this.slideIndex += n);
+    },
+    currentSlide: function (n) {
+      this.stop();
+      this.showSlides(this.slideIndex = n);
+    },
+    automate: function (){
+      var controller = this;
+      controller.interval = setInterval(function (){
+        controller.plusSlides(1);
+      },controller.duration);
+    },
+    showSlides: function (n) {
+      var controller = this;
+      var slides = controller._componentRoot.subelements(".qcoSlides");
+      var dots = controller._componentRoot.subelements(".qcoSlider__dots--dot");
+
+      if (n > (slides.length-1)) {
+        controller.slideIndex = 0;
+      }
+      if (n < 0) {
+        controller.slideIndex = 0;
+      }
+      slides.map((slide)=>{
+        Fade.apply(slide,1,0);
+      });
+      dots.map((dot)=>{
+        dot.classList.remove("active");
+      });
+      try {
+        dots[controller.slideIndex].classList.add("active");
+      }catch (e){
+        logger.debug("Something went wrong when trying to activate a slide");
+        logger.debug(e.message);
+      }
+      setTimeout(function (){
+        slides.map((slide)=>{
+          slide.style.display="none";
+        });
+        try {
+          slides[controller.slideIndex].style.display = "block";
+          Fade.apply(slides[controller.slideIndex],0,1);
+
+        }catch (e){
+          logger.debug("Something went wrong when trying to show a slide");
+          logger.debug(e.message);
+        }
+      },700);
+    },
+    fillDots: function (){
+      var controller = this;
+      var slides = controller._componentRoot.subelements(".qcoSlides");
+      slides.map((slide,index)=>{
+        var dotHTML = document.createElement("span");
+        var dotContent = `<span class="qcoSlider__dots--dot" onclick="global.get('${controller.sliderHandlerName}').currentSlide(${index})"></span>`;
+        dotHTML.innerHTML = dotContent;
+        controller._componentRoot.subelements(".qcoSlider__dots")[0].append(dotHTML);
+      });
+
+    },
+    done: function (){
+      var controller = this;
+      var slides = controller._componentRoot.subelements(".qcoSlides");
+      slides.map((slide)=>{
+        slide.style.display="none";
+      });
+      setTimeout(function (){
+        controller.fillDots();
+        controller.slideIndex = 0;
+        controller.showSlides(this.slideIndex);
+        controller.automate();
+      },3000);
+
+    }
+  })
+
+]);
+
+}).call(null);

package/js/org.qcobjects.controllers.swagger.js

@@ -0,0 +1,77 @@
+/**
+ * QCObjects SDK 2.3
+ * ________________
+ *
+ * Author: Jean Machuca <correojean@gmail.com>
+ *
+ * Cross Browser Javascript Framework for MVC Patterns
+ * QuickCorp/QCObjects is licensed under the
+ * GNU Lesser General Public License v3.0
+ * [LICENSE] (https://github.com/QuickCorp/QCObjects/blob/master/LICENSE.txt)
+ *
+ * Permissions of this copyleft license are conditioned on making available
+ * complete source code of licensed works and modifications under the same
+ * license or the GNU GPLv3. Copyright and license notices must be preserved.
+ * Contributors provide an express grant of patent rights. However, a larger
+ * work using the licensed work through interfaces provided by the licensed
+ * work may be distributed under different terms and without source code for
+ * the larger work.
+ *
+ * Copyright (C) 2015 Jean Machuca,<correojean@gmail.com>
+ *
+ * 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.controllers.swagger",[
+  Class("SwaggerUIController",Controller,{
+    dependencies:[],
+    component:null,
+		startSwaggerUI: function (){
+      // Begin Swagger UI call region
+      if (typeof SwaggerUIBundle !== "undefined"){
+        /* eslint-disable no-undef */
+        const ui = SwaggerUIBundle({
+          url: CONFIG.get("swagger-ui-url","https://petstore.swagger.io/v2/swagger.json"),
+          dom_id: "#"+CONFIG.get("swagger-ui-dom_id","swagger-ui"),
+          deepLinking: true,
+          presets: [
+            SwaggerUIBundle.presets.apis,
+            SwaggerUIStandalonePreset
+          ],
+          plugins: [
+            SwaggerUIBundle.plugins.DownloadUrl
+          ],
+          layout: "StandaloneLayout"
+        });
+        // End Swagger UI call region
+        window.ui = ui;
+      }
+
+		},
+		done: function (){
+			var controller = this;
+      controller.component.body.innerHTML = "<div id=\""+CONFIG.get("swagger-ui-dom_id","swagger-ui")+"\"></div>";
+			var swaggerUIPackagePath = CONFIG.get("swagger-ui-package-path","node_modules/swagger-ui-dist/");
+
+			this.dependencies.push(New(SourceJS,{
+				url:swaggerUIPackagePath+"swagger-ui-standalone-preset.js",
+				external:CONFIG.get("swagger-ui-external",false)
+			}));
+			this.dependencies.push(New(SourceCSS,{
+				url:swaggerUIPackagePath+"swagger-ui.css",
+				external:CONFIG.get("swagger-ui-external",false)
+			}));
+			this.dependencies.push(New(SourceJS,{
+				url:swaggerUIPackagePath+"swagger-ui-bundle.js",
+				external:CONFIG.get("swagger-ui-external",false),
+				done:function (){
+					controller.startSwaggerUI();
+				}
+			}));
+		}
+	})
+]);
+
+}).call(null);

package/js/org.qcobjects.effects.js

@@ -0,0 +1,262 @@
+/**
+ * QCObjects SDK 2.3
+ * ________________
+ *
+ * Author: Jean Machuca <correojean@gmail.com>
+ *
+ * Cross Browser Javascript Framework for MVC Patterns
+ * QuickCorp/QCObjects is licensed under the
+ * GNU Lesser General Public License v3.0
+ * [LICENSE] (https://github.com/QuickCorp/QCObjects/blob/master/LICENSE.txt)
+ *
+ * Permissions of this copyleft license are conditioned on making available
+ * complete source code of licensed works and modifications under the same
+ * license or the GNU GPLv3. Copyright and license notices must be preserved.
+ * Contributors provide an express grant of patent rights. However, a larger
+ * work using the licensed work through interfaces provided by the licensed
+ * work may be distributed under different terms and without source code for
+ * the larger work.
+ *
+ * Copyright (C) 2015 Jean Machuca,<correojean@gmail.com>
+ *
+ * Everyone is permitted to copy and distribute verbatim copies of this
+ * license document, but changing it is not allowed.
+*/
+"use strict";
+(function() {
+  Package("org.qcobjects.tools.effects",[
+
+    Class("Move",Effect,{
+      apply: function (element, xfrom, yfrom, xto, yto){
+        var dx = xto-xfrom;
+        var dy = yto-yfrom;
+        element.style.transform="translate("+xfrom+"px,"+yfrom+"px)";
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var y = yfrom + (progress*dy/100);
+            var x = xfrom + (progress*dx/100);
+            logger.debug("x: "+x.toString()+" y:"+y.toString());
+            element.style.transform="translate("+x+"px,"+y+"px)";
+          }
+        });
+      }
+    }),
+    Class("MoveXInFromRight",Move,{
+      apply: function (element){
+        _super_("Move","apply").call(this,element,element.width,0,0,0);
+      }
+    }),
+    Class("MoveXInFromLeft",Move,{
+      apply: function (element){
+        _super_("Move","apply").call(this,element,-element.width,0,0,0);
+      }
+    }),
+    Class("MoveYInFromBottom",Move,{
+      apply: function (element){
+        _super_("Move","apply").call(this,element,0,element.height,0,0);
+      }
+    }),
+    Class("MoveYInFromTop",Move,{
+      apply: function (element){
+        _super_("Move","apply").call(this,element,0,-element.height,0,0);
+      }
+    }),
+    Class("RotateX",Effect,{
+      apply: function (element, angleFrom,angleTo){
+        var da = angleTo-angleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var angle = Math.round(angleFrom + (progress*da/100));
+            logger.debug("angle: "+angle.toString());
+            element.style.transform= "rotate3d(1,0,0,"+angle.toString()+"deg)";
+          }
+        });
+      }
+    }),
+    Class("RotateY",Effect,{
+      apply: function (element, angleFrom,angleTo){
+        var da = angleTo-angleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var angle = Math.round(angleFrom + (progress*da/100));
+            logger.debug("angle: "+angle.toString());
+            element.style.transform= "rotate3d(0,1,0,"+angle.toString()+"deg)";
+          }
+        });
+      }
+    }),
+    Class("RotateZ",Effect,{
+      apply: function (element, angleFrom,angleTo){
+        var da = angleTo-angleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var angle = Math.round(angleFrom + (progress*da/100));
+            logger.debug("angle: "+angle.toString());
+            element.style.transform= "rotate3d(0,0,1,"+angle.toString()+"deg)";
+          }
+        });
+      }
+    }),
+    Class("Rotate",Effect,{
+      apply: function (element, angleFrom,angleTo){
+        var da = angleTo-angleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var angle = Math.round(angleFrom + (progress*da/100));
+            logger.debug("angle: "+angle.toString());
+            element.style.transform= "rotate3d(1,1,1,"+angle.toString()+"deg)";
+          }
+        });
+      }
+    }),
+    Class("Fade",Effect,{
+      apply: function (element, alphaFrom,alphaTo){
+        var da = alphaTo-alphaFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var alpha = alphaFrom + (progress*da/100);
+            logger.debug("alpha: "+alpha.toString());
+            element.style.opacity= alpha.toString();
+          }
+        });
+      }
+    }),
+    Class("Radius",Effect,{
+      apply: function (element, radiusFrom,radiusTo){
+        var dr = radiusTo-radiusFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var radius = radiusFrom + (progress*dr/100);
+            logger.debug("radius: "+radius.toString());
+            element.style.borderRadius= radius.toString()+"px";
+          }
+        });
+      }
+    }),
+    Class("Resize",Effect,{
+      apply: function (element, scaleFrom,scaleTo){
+        var ds = scaleTo-scaleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var scale = scaleFrom + (progress*ds/100);
+            logger.debug("resize: "+scale.toString());
+            element.style.transformOrigin="center";
+            element.style.transform= "scale("+scale+","+scale+")";
+          }
+        });
+      }
+    }),
+    Class("WipeLeft",Effect,{
+      apply: function (element, scaleFrom,scaleTo){
+        var ds = scaleTo-scaleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var scale = scaleFrom + (progress*ds/100);
+            logger.debug("wipe: "+scale.toString());
+            element.style.transformOrigin="right";
+            element.style.transform= "scaleX("+scale+")";
+          }
+        });
+      }
+    }),
+    Class("WipeRight",Effect,{
+      apply: function (element, scaleFrom,scaleTo){
+        var ds = scaleTo-scaleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var scale = scaleFrom + (progress*ds/100);
+            logger.debug("wipe: "+scale.toString());
+            element.style.transformOrigin="left";
+            element.style.transform= "scaleX("+scale+")";
+          }
+        });
+      }
+    }),
+    Class("WipeUp",Effect,{
+      apply: function (element, scaleFrom,scaleTo){
+        var ds = scaleTo-scaleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var scale = scaleFrom + (progress*ds/100);
+            logger.debug("wipe: "+scale.toString());
+            element.style.transformOrigin="bottom";
+            element.style.transform= "scaleY("+scale+")";
+          }
+        });
+      }
+    }),
+    Class("WipeDown",Effect,{
+      apply: function (element, scaleFrom,scaleTo){
+        var ds = scaleTo-scaleFrom;
+        this.animate({
+          duration: this.duration,
+          timing(timeFraction) {
+            return timeFraction;
+          },
+          draw(progress) {
+            logger.debug("animation progress: "+progress.toString());
+            var scale = scaleFrom + (progress*ds/100);
+            logger.debug("wipe: "+scale.toString());
+            element.style.transformOrigin="top";
+            element.style.transform= "scaleY("+scale+")";
+          }
+        });
+      }
+    })
+  ]);
+}).call(null);