appscms-tools-theme 2.5.8 → 2.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 235ec4173f520f3409bab1e2c89d1ec65fdd52e824d1f793bf74c029e8452608
-  data.tar.gz: 60febb002f750dcd0c73e92dfb649e8cb34ced7389c98cad79ef6adaa38dc30e
+  metadata.gz: 30d957c8873b6d2852b0a3632235ac8d76ea4c90a4c3f69416bdd0cd644170c3
+  data.tar.gz: 8628a9dcb87e275ac8ed515f6f47a2f8d8d90ead50cf0bbf335c48dc68d6d1d7
 SHA512:
-  metadata.gz: e4634aa810117bc3b7fb5e3ff545cd0fb07f0100eabc3403f586af3ea19b95a121ee19d7a3e84073cfd10b80c7002f521632037afb74b11364d96829b08852f3
-  data.tar.gz: 109912e06964b9289b3490a96eb3c3dd2070c05d949c8400c614ad7f49c88f06a3acb1932298b55890973b91d157ec7794dc2fd5a8173fac8d9b8f08883e9cb3
+  metadata.gz: f50252598fd44fbfd95ec94a682cf7d654ccdb464c23bb275c89d60a66a2773cfd69866da42913f9b6729ff0f08cbca4b4f5322af1af87b8483120daca466151
+  data.tar.gz: 4f74b60d77819c9767bea36f2476b2951d7e64a45a26746cc4c523bbcb8bbac2db601f2fea16730af0c58a8065a8a7d3777707aae8d1e95cf378b3c193d126a6

data/_data/feature/en/theframe.json

@@ -20,6 +20,7 @@
     ],
     "jsfilepaths": [
         "/assets/js/googledrive.js",
+        "/assets/js/perspective.min.js",
         "https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.12/cropper.min.js",
         "/assets/js/frame.js"
     ],

data/_layouts/feature.html

@@ -255,7 +255,6 @@
 	{%- endif -%}
 	{% include footer/index.html %}
 	{% include script.html %}
-	<script defer src="/app.js"></script>
 </body>
 
 </html>

data/assets/js/frame.js

@@ -70,20 +70,33 @@ const drawInputImage = (ctx, item, indexValue) => {
       if (item.rotate) {
         ctx.rotate((item.rotate * Math.PI) / 180)
       }
-
-      ctx.drawImage(
-        image,
-        Number(item.x),
-        Number(item.y),
-        image.width,
-        image.height
-      )
+      let perspectiveKey = 'perspective' in item
+      if (!perspectiveKey) {
+        ctx.drawImage(
+          image,
+          Number(item.x),
+          Number(item.y),
+          image.width,
+          image.height
+        )
+      }
       if (item.translate) {
         ctx.translate(item.translate.x, item.translate.y)
       }
+      if (perspectiveKey) {
+        let p = new Perspective(ctx, image)
+        p.draw([
+          [item.perspective.topLeft.x, item.perspective.topLeft.y],
+          [item.perspective.topRight.x, item.perspective.topRight.y],
+          [item.perspective.bottomRight.x, item.perspective.bottomRight.y],
+          [item.perspective.bottomLeft.x, item.perspective.bottomLeft.y],
+        ])
+      }
+
       if (item.skew) {
         ctx.setTransform(1, item.skew.x, item.skew.y, 1, 0, 0)
       }
+
       ctx.restore()
       resolve()
     }
@@ -247,13 +260,3 @@ download.addEventListener('click', () => {
     window.location.href = `/${lang}/download?tool=${pageTool}`
   }
 })
-
-//
-// fonts
-// font rotation
-// font position
-// font transform
-
-//images
-//image rotation
-// image rectangle with text

data/assets/js/perspective.min.js

@@ -0,0 +1,182 @@
+!(function (t) {
+  'object' == typeof exports && 'undefined' != typeof module
+    ? (module.exports = t())
+    : 'function' == typeof define && define.amd
+    ? define([], t)
+    : (('undefined' != typeof window
+        ? window
+        : 'undefined' != typeof global
+        ? global
+        : 'undefined' != typeof self
+        ? self
+        : this
+      ).Perspective = t())
+})(function () {
+  return (function o(n, r, i) {
+    function s(e, t) {
+      if (!r[e]) {
+        if (!n[e]) {
+          var a = 'function' == typeof require && require
+          if (!t && a) return a(e, !0)
+          if (c) return c(e, !0)
+          throw (
+            (((a = new Error("Cannot find module '" + e + "'")).code =
+              'MODULE_NOT_FOUND'),
+            a)
+          )
+        }
+        ;(a = r[e] = { exports: {} }),
+          n[e][0].call(
+            a.exports,
+            function (t) {
+              return s(n[e][1][t] || t)
+            },
+            a,
+            a.exports,
+            o,
+            n,
+            r,
+            i
+          )
+      }
+      return r[e].exports
+    }
+    for (
+      var c = 'function' == typeof require && require, t = 0;
+      t < i.length;
+      t++
+    )
+      s(i[t])
+    return s
+  })(
+    {
+      1: [
+        function (t, e, a) {
+          var o = window.html5jp || {}
+          !(function () {
+            o.perspective = function (t, e) {
+              var a, o
+              t &&
+                t.strokeStyle &&
+                e &&
+                e.width &&
+                e.height &&
+                (((a = document.createElement('canvas')).width = parseInt(
+                  e.width
+                )),
+                (a.height = parseInt(e.height)),
+                (o = a.getContext('2d')).drawImage(e, 0, 0, a.width, a.height),
+                ((e = document.createElement('canvas')).width = t.canvas.width),
+                (e.height = t.canvas.height),
+                (e = e.getContext('2d')),
+                (this.p = { ctxd: t, cvso: a, ctxo: o, ctxt: e }))
+            }
+            var t = o.perspective.prototype
+            ;(t.draw = function (t) {
+              for (
+                var e = t[0][0],
+                  a = t[0][1],
+                  o = t[1][0],
+                  n = t[1][1],
+                  r = t[2][0],
+                  i = t[2][1],
+                  s = t[3][0],
+                  c = t[3][1],
+                  h = [
+                    Math.sqrt(Math.pow(e - o, 2) + Math.pow(a - n, 2)),
+                    Math.sqrt(Math.pow(o - r, 2) + Math.pow(n - i, 2)),
+                    Math.sqrt(Math.pow(r - s, 2) + Math.pow(i - c, 2)),
+                    Math.sqrt(Math.pow(s - e, 2) + Math.pow(c - a, 2)),
+                  ],
+                  p = this.p.cvso.width,
+                  f = this.p.cvso.height,
+                  d = 0,
+                  v = 0,
+                  w = 0,
+                  l = 0;
+                l < 4;
+                l++
+              ) {
+                var u = 0
+                v < (u = l % 2 ? h[l] / p : h[l] / f) && ((d = l), (v = u)),
+                  0 == h[l] && w++
+              }
+              if (!(1 < w)) {
+                var g,
+                  m = this.p.ctxo,
+                  x = this.p.ctxt
+                if (
+                  (x.clearRect(0, 0, x.canvas.width, x.canvas.height),
+                  d % 2 == 0)
+                ) {
+                  ;(g = this.create_canvas_context(
+                    p,
+                    10
+                  )).globalCompositeOperation = 'copy'
+                  for (var M = g.canvas, y = 0; y < f; y += 2) {
+                    var q = e + (s - e) * (O = y / f),
+                      _ = a + (c - a) * O,
+                      C = o + (r - o) * O,
+                      I = n + (i - n) * O,
+                      T = Math.atan((I - _) / (C - q)),
+                      b = Math.sqrt(Math.pow(C - q, 2) + Math.pow(I - _, 2)) / p
+                    g.setTransform(1, 0, 0, 1, 0, -y),
+                      g.drawImage(m.canvas, 0, 0),
+                      x.translate(q, _),
+                      x.rotate(T),
+                      x.scale(b, b),
+                      x.drawImage(M, 0, 0),
+                      x.setTransform(1, 0, 0, 1, 0, 0)
+                  }
+                } else if (d % 2 == 1) {
+                  ;(g = this.create_canvas_context(
+                    10,
+                    f
+                  )).globalCompositeOperation = 'copy'
+                  for (var M = g.canvas, E = 0; E < p; E += 2) {
+                    var O,
+                      q = e + (o - e) * (O = E / p),
+                      _ = a + (n - a) * O,
+                      C = s + (r - s) * O,
+                      I = c + (i - c) * O,
+                      T = Math.atan((q - C) / (I - _)),
+                      b = Math.sqrt(Math.pow(C - q, 2) + Math.pow(I - _, 2)) / f
+                    g.setTransform(1, 0, 0, 1, -E, 0),
+                      g.drawImage(m.canvas, 0, 0),
+                      x.translate(q, _),
+                      x.rotate(T),
+                      x.scale(b, b),
+                      x.drawImage(M, 0, 0),
+                      x.setTransform(1, 0, 0, 1, 0, 0)
+                  }
+                }
+                this.p.ctxd.save(),
+                  this._applyClipPath(this.p.ctxd, [
+                    [e, a],
+                    [o, n],
+                    [r, i],
+                    [s, c],
+                  ]),
+                  this.p.ctxd.drawImage(x.canvas, 0, 0),
+                  this.p.ctxd.restore()
+              }
+            }),
+              (t.create_canvas_context = function (t, e) {
+                var a = document.createElement('canvas')
+                return (a.width = t), (a.height = e), a.getContext('2d')
+              }),
+              (t._applyClipPath = function (t, e) {
+                t.beginPath(), t.moveTo(e[0][0], e[0][1])
+                for (var a = 1; a < e.length; a++) t.lineTo(e[a][0], e[a][1])
+                t.closePath(), t.clip()
+              })
+          })(),
+            (e.exports = o.perspective)
+        },
+        {},
+      ],
+    },
+    {},
+    [1]
+  )(1)
+})

data/assets/js/photo-effects.json

@@ -5,13 +5,29 @@
         "elements": [
             {
                 "type": "image",
-                "filter": "",
-                "perspective": "",
-                "height": 300,
-                "width": 300,
+                "height": 308,
+                "width": 210,
+                "perspective": {
+                    "topLeft": {
+                        "x": 0,
+                        "y": 0
+                    },
+                    "topRight": {
+                        "x": 210,
+                        "y": 0
+                    },
+                    "bottomLeft": {
+                        "x": 0,
+                        "y": 308
+                    },
+                    "bottomRight": {
+                        "x": 210,
+                        "y": 308
+                    }
+                },
                 "translate": {
-                    "x": -5,
-                    "y": -10
+                    "x": 150,
+                    "y": 250
                 },
                 "x": 100,
                 "y": 100,

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: appscms-tools-theme
 version: !ruby/object:Gem::Version
-  version: 2.5.8
+  version: 2.6.0
 platform: ruby
 authors:
 - vivek-appscms
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2022-10-19 00:00:00.000000000 Z
+date: 2022-10-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -2599,6 +2599,7 @@ files:
 - assets/images/balark.jpeg
 - assets/images/bulb.png
 - assets/images/bulb.svg
+- assets/images/bunnies.png
 - assets/images/cloud-computing.png
 - assets/images/cloud_new.svg
 - assets/images/convert.png
@@ -2626,6 +2627,7 @@ files:
 - assets/images/sona.jpeg
 - assets/images/spinner.gif
 - assets/images/target.svg
+- assets/images/together_foreve.png
 - assets/images/together_forever.png
 - assets/images/trust.svg
 - assets/images/udit.jpeg
@@ -2645,6 +2647,7 @@ files:
 - assets/js/homeResult.js
 - assets/js/manifest.json
 - assets/js/multiselect.js
+- assets/js/perspective.min.js
 - assets/js/photo-effects.json
 - assets/js/redirectResult.js
 - assets/js/testing-batch.js