Merge pull request #11 from ahmadfh/master

abuturla · web-flow · commit ff9434dfe6cc · 2017-10-18T14:01:03.000-07:00
prevent form from jumping to the top of page when the user submit
diff --git a/widget/app.js b/widget/app.js
@@ -1,4 +1,48 @@
-'use strict';
+function injectJotForm() {
+        var ifr = document.getElementById("JotFormIFrame");
+    if (window.location.href && window.location.href.indexOf("?") > -1) {
+        var get = window.location.href.substr(window.location.href.indexOf("?") + 1);
+        if (ifr && get.length > 0) {
+            var src = ifr.src;
+            src = src.indexOf("?") > -1 ? src + "&" + get : src + "?" + get;
+            ifr.src = src;
+        }
+    }
+    window.handleIFrameMessage = function (e) {
+        var args = e.data.split(":");
+
+        iframe = document.getElementById("JotFormIFrame");
+
+        if (!iframe) return;
+        switch (args[0]) {
+            case "scrollIntoView":
+                iframe.scrollIntoView();
+                break;
+            case "setHeight":
+                iframe.style.height = args[1] + "px";
+                break;
+            case "collapseErrorPage":
+                if (iframe.clientHeight > window.innerHeight) {
+                    iframe.style.height = window.innerHeight + "px";
+                }
+                break;
+            case "reloadPage":
+                window.location.reload();
+                break;
+        }
+        var isJotForm = (e.origin.indexOf("jotform") > -1) ? true : false;
+        if (isJotForm && "contentWindow" in iframe && "postMessage" in iframe.contentWindow) {
+            var urls = {"docurl": encodeURIComponent(document.URL), "referrer": encodeURIComponent(document.referrer)};
+            iframe.contentWindow.postMessage(JSON.stringify({"type": "urls", "value": urls}), "*");
+        }
+    };
+    if (window.addEventListener) {
+        window.addEventListener("message", handleIFrameMessage, false);
+    } else if (window.attachEvent) {
+        window.attachEvent("onmessage", handleIFrameMessage);
+    }
+}
+
 
 (function (angular) {
   angular.module('jotFormPluginWidget', ['ui.bootstrap'])
@@ -22,6 +66,7 @@
               var dummyData = {url: "https://form.jotform.me/60070086181448"};
               WidgetHome.data.content.url = dummyData.url;
             }
+              injectJotForm();
           };
           WidgetHome.error = function (err) {
             if (err && err.code !== STATUS_CODE.NOT_FOUND) {
diff --git a/widget/index.html b/widget/index.html
@@ -1,27 +1,27 @@
 <!DOCTYPE html>
-<html ng-app="jotFormPluginWidget">
+<html ng-app="jotFormPluginWidget" style="height: 100%; min-height:100%;">
 <head lang="en">
-  <meta charset="UTF-8">
-  <title>content</title>
-  <!-- CSS -->
-  <link href="../../../styles/helper.css" rel="stylesheet">
-  <link href="../../../styles/siteIcons.css" rel="stylesheet">
-
-  <!-- JS -->
-  <script src="../../../scripts/buildfire.js"></script>
-  <script src="../../../scripts/angular/angular.min.js"></script>
-  <script src="../../../scripts/angular/ui-bootstrap.min.js"></script>
-  <script src="app.js"></script>
-  <script src="enums.js"></script>
-  <script src="app.services.js"></script>
+    <meta charset="UTF-8">
+    <title>content</title>
+    <!-- CSS -->
+    <meta name="buildfire" content="disableTheme,disableFastClick">
+    <!-- JS -->
+    <script src="../../../scripts/buildfire.js"></script>
+    <script src="../../../scripts/angular/angular.min.js"></script>
+    <script src="../../../scripts/angular/ui-bootstrap.min.js"></script>
+    <script src="app.js"></script>
+    <script src="enums.js"></script>
+    <script src="app.services.js"></script>
 </head>
-<body>
+<body style="height: 100%; min-height:100%;margin: 0px">
 <div class="content"
-     style="-webkit-overflow-scrolling: touch !important;overflow: auto; height: 100%;"
+     style="-webkit-overflow-scrolling: touch !important;overflow: auto; height: 100%;min-height: 100%;min-width: 100%;"
      ng-controller="WidgetHomeCtrl as WidgetHome">
-  <iframe src="{{WidgetHome.data.content.url | returnUrl}}"
-          ng-if="WidgetHome.data.content.url"
-          style="height: 100%;position: relative"></iframe>
+    <iframe id="JotFormIFrame" allowtransparency="true"
+            ng-src="{{WidgetHome.data.content.url | returnUrl}}"
+            ng-if="WidgetHome.data.content.url" frameborder="0"
+            style="width: 1px; min-width: 100%;height: 100%; min-height: 100% ;border:none;" scrolling="no"></iframe>
+
 </div>
 </body>
 </html>
