You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@myfaces.apache.org by lo...@apache.org on 2019/09/04 12:10:55 UTC

[myfaces-tobago] branch master updated: update demo to ES6

This is an automated email from the ASF dual-hosted git repository.

lofwyr pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/myfaces-tobago.git


The following commit(s) were added to refs/heads/master by this push:
     new 344b14f  update demo to ES6
344b14f is described below

commit 344b14f203c170926b0ccc370f6c0cabdda07094
Author: Udo Schnurpfeil <lo...@apache.org>
AuthorDate: Wed Sep 4 13:54:20 2019 +0200

    update demo to ES6
    
    issue: TOBAGO-1633: TS refactoring
---
 .../90-release-checklist/Release_Checklist.xhtml   |  15 ++
 .../tobago-example-demo/src/main/webapp/main.xhtml |   2 +-
 .../src/main/webapp/script/demo.js                 | 199 ++++++++++-----------
 3 files changed, 109 insertions(+), 107 deletions(-)

diff --git a/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/90-release-checklist/Release_Checklist.xhtml b/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/90-release-checklist/Release_Checklist.xhtml
index a9a7c64..d0d6e82 100644
--- a/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/90-release-checklist/Release_Checklist.xhtml
+++ b/tobago-example/tobago-example-demo/src/main/webapp/content/10-intro/90-release-checklist/Release_Checklist.xhtml
@@ -62,6 +62,11 @@
             and ask for problems with the release candidate.
             <tc:popup markup="large" collapsedMode="hidden" id="preparation-email">
               <tc:box label="Preparation email">
+                <f:facet name="bar">
+                  <tc:button image="fa-close" omit="true">
+                    <tc:operation name="hide" for="preparation-email"/>
+                  </tc:button>
+                </f:facet>
                 <i>Replace the variable part &lt;sender-name></i>.
                 <tc:separator/>
                 <c:set var="subject" value="[Tobago] Preparation for the #{apiController.releases[0].version} release"/>
@@ -201,6 +206,11 @@ $ mvn release:perform
             </tc:link> with the staging location.
             <tc:popup markup="large" collapsedMode="hidden" id="vote-email">
               <tc:box label="Voting email">
+                <f:facet name="bar">
+                  <tc:button image="fa-close" omit="true">
+                    <tc:operation name="hide" for="vote-email"/>
+                  </tc:button>
+                </f:facet>
                 <i>Replace the variable part &lt;sender-name>, &lt;insert-list>, &lt;use-one-of>, &lt;a>, &lt;b>or, &lt;c>, &lt;id-from-nexus></i>.
                 <tc:separator/>
                 <c:set var="subject" value="[VOTE] Release Tobago #{apiController.releases[0].version}"/>
@@ -338,6 +348,11 @@ $ mvn site:stage -DstagingDirectory=$TOBAGO_SITE/tobago-publish</code></pre>
             </tc:link>.
             <tc:popup markup="large" collapsedMode="hidden" id="announcement-email">
               <tc:box label="Announcement email">
+                <f:facet name="bar">
+                  <tc:button image="fa-close" omit="true">
+                    <tc:operation name="hide" for="announcement-email"/>
+                  </tc:button>
+                </f:facet>
                 <i>Replace the variable parts &lt;edit-me></i>.
                 <tc:separator/>
                 <c:set var="subject" value="[ANNOUNCE] Apache Tobago #{apiController.releases[0].version} released"/>
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/main.xhtml b/tobago-example/tobago-example-demo/src/main/webapp/main.xhtml
index 5b52325..a26cb95 100644
--- a/tobago-example/tobago-example-demo/src/main/webapp/main.xhtml
+++ b/tobago-example/tobago-example-demo/src/main/webapp/main.xhtml
@@ -31,7 +31,7 @@
             <tc:dataAttribute name="tobago-log-level" value="DEBUG"/>
       -->
 
-      <tc:script file="#{request.contextPath}/script/demo.js"/>
+      <tc:script file="#{request.contextPath}/script/demo.js" type="module"/>
       <tc:script file="#{request.contextPath}/script/prism-1.14.0.js"/>
       <tc:style file="#{request.contextPath}/style/demo.css"/>
       <tc:style file="#{request.contextPath}/style/prism-1.14.0.css"/>
diff --git a/tobago-example/tobago-example-demo/src/main/webapp/script/demo.js b/tobago-example/tobago-example-demo/src/main/webapp/script/demo.js
index 319cb48..020f8b7 100644
--- a/tobago-example/tobago-example-demo/src/main/webapp/script/demo.js
+++ b/tobago-example/tobago-example-demo/src/main/webapp/script/demo.js
@@ -15,122 +15,109 @@
  * limitations under the License.
  */
 
-import {Tobago} from "../tobago/standard/tobago-bootstrap/5.0.0-SNAPSHOT/js/tobago-core";
 import {Listener, Phase} from "../tobago/standard/tobago-bootstrap/5.0.0-SNAPSHOT/js/tobago-listener";
-import {Tobago4Utils} from "../tobago/standard/tobago-bootstrap/5.0.0-SNAPSHOT/js/tobago-utils";
 
-const Demo = {};
+class Demo {
 
-var initAlert = function () {
-  document.querySelectorAll("[data-alert-text]").forEach(function (element) {
-    element.addEventListener("click", function(event) {
-      var text = event.currentTarget.dataset["alertText"];
-      alert(text);
-    });
-  });
-};
-
-// old
-Tobago.registerListener(initAlert, Phase.DOCUMENT_READY);
-Tobago.registerListener(initAlert, Phase.AFTER_UPDATE);
-
-// new
-// Listener.register(initAlert, Phase.DOCUMENT_READY);
-// Listener.register(initAlert, Phase.AFTER_UPDATE);
+  static init(element) {
+    Demo.initAlert(element);
+    Demo.initInspect(element);
+    Demo.initTestLinks(element);
+    Demo.initTestFrame(element);
+    Demo.initGoogleSearch(element);
+    Demo.initMailTo(element);
+  }
 
-var initInspect = function (elements) {
+  static initAlert(element) {
+    for (const e of element.querySelectorAll("[data-alert-text]")) {
+      e.addEventListener("click", function (event) {
+        alert(event.currentTarget.dataset["alertText"]);
+      });
+    }
+  }
 
-  jQuery("code").find("br").replaceWith("\n");
+  static initInspect(element) {
 
-  // var tobagoElements = Tobago.Utils.selectWithJQuery(elements, ".tobago-in,.tobago-out,.tobago-date");
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var tobagoElements = Tobago4Utils.selectWithJQuery(elements, ".tobago-flexLayout");
+    for (const code of element.querySelectorAll("code")) {
+      for (const br of code.querySelectorAll("br")) {
+        br.parentNode.insertBefore("\n", br);
+        br.parentNode.removeChild(br);
+      }
+    }
 
-  // do highlighting with hovering only in the content-area
-  tobagoElements = tobagoElements.filter(function () {
-    return jQuery(this).parents("#page\\:content").length === 1;
-  });
+    for (const e of element.querySelectorAll(".tobago-flexLayout")) {
+
+      // do highlighting with hovering only in the content-area
+      if (e.closest("#page\\:content")) {
+        e.addEventListener("hover", function (event) {
+
+          // clear old selections:
+          for (const selected of document.querySelectorAll(".demo-selected")) {
+            selected.classList.remove("demo-selected");
+          }
+
+          const element = event.currentTarget;
+          element.classList.add("demo-selected");
+          const clientId = element.closest("[id]").id;
+          const id = clientId.substr(clientId.lastIndexOf(":") + 1);
+          const source = document.getElementById("demo-view-source");
+
+          for (const span of source.querySelectorAll("span.token.attr-value")) {
+            if (span.textContent === 'id=' + '"' + id + '"') {
+              span.parentElement.classList.add("demo-selected");
+            }
+          }
+        });
+      }
+    }
+  }
 
-  tobagoElements.hover(function () {
+  static initTestLinks(element) {
+    const runLink = document.getElementById("page:header:runtest");
+    if (runLink && parent.document.getElementById("qunit")) {
+      runLink.classList.add("d-none");
+    }
+  }
 
-    // clear old selections:
-    jQuery(".demo-selected").removeClass("demo-selected");
+  static initTestFrame(element) {
+    const testFrame = document.getElementById("page:testframe");
+    if (testFrame) {
+      testFrame.addEventListener("onload", function () {
+        element.height = element.contentWindow.body.scrollHeight;
+      });
+    }
+  }
 
-    var element = jQuery(this);
-    element.addClass("demo-selected");
+  static initGoogleSearch(element) {
+    const input = document.getElementById("page:search:searchField");
+    const search = "+site%3Atobago-vm.apache.org+demo-4";
+    input.addEventListener("change", function (event) {
+      const input = event.currentTarget;
+      const button = document.getElementById("page:search:searchCommand");
+      button.setAttribute("href", "https://www.google.com/search?q=" + encodeURI(input.value) + search);
+    });
+    input.addEventListener("keypress", function (event) {
+      if (event.which === 13) {
+        console.log("ENTER");
+        window.location.href = "https://www.google.com/search?q=" + encodeURI(input.value()) + search;
+      }
+    });
+  };
+
+  static initMailTo(element) {
+    for (let link of document.querySelectorAll("[href^=mailto]")) {
+      // this is, to fix URL encoded spaces
+      const string = link.getAttribute("href");
+      const begin = string.indexOf("subject=");
+      const href = string.substring(0, begin) + string.substring(begin).replace(/\+/g, "%20");
+      link.setAttribute("href", href);
+    }
+  };
 
-    var clientId = element.closest("[id]").attr("id");
-    var id = clientId.substr(clientId.lastIndexOf(":") + 1);
+}
 
-    var source = jQuery("#demo-view-source");
+Listener.register(Demo.init, Phase.DOCUMENT_READY);
+Listener.register(Demo.init, Phase.AFTER_UPDATE);
 
-    var span = source.find("span.token.attr-value").filter(function () {
-      return jQuery(this).prev().text() + jQuery(this).text() === 'id=' + '"' + id + '"';
-    });
-    var tag = span.parent();
-    tag.addClass("demo-selected");
-  });
-};
-
-Listener.register(initInspect, Phase.DOCUMENT_READY);
-Listener.register(initInspect, Phase.AFTER_UPDATE);
-
-Demo.prismHighlight = function (elements) {
-  // call highlighting again. (is called for all, not only for the elements, because it's easier to implement.)
-  Prism.highlightAll();
-};
-
-Listener.register(Demo.prismHighlight, Phase.AFTER_UPDATE);
-
-var initTestLinks = function () {
-  var $runLink = jQuery("#page\\:header\\:runtest");
-  var $closeLink = jQuery("#page\\:header\\:closetest");
-
-  if (jQuery(parent.document.getElementById("qunit")).length) {
-    $runLink.hide();
-    $closeLink.attr("onclick", "window.top.location.href = location.href");
-  } else {
-    $closeLink.hide();
-  }
-};
-
-Listener.register(initTestLinks, Phase.DOCUMENT_READY);
-Listener.register(initTestLinks, Phase.AFTER_UPDATE);
-
-var initTestframe = function () {
-  jQuery("#page\\:testframe").attr("onload", "this.height = this.contentWindow.jQuery('body').prop('scrollHeight');");
-};
-
-Listener.register(initTestframe, Phase.DOCUMENT_READY);
-Listener.register(initTestframe, Phase.AFTER_UPDATE);
-
-Demo.initGoogleSearch = function () {
-  var $input = jQuery("#page\\:search\\:searchField");
-  var $button = jQuery("#page\\:search\\:searchCommand");
-
-  var search = "+site%3Atobago-vm.apache.org+demo-4";
-  $input.change(function () {
-    $button.attr("href", "https://www.google.com/search?q=" + encodeURI($input.val()) + search);
-  });
-  $input.keypress(function (e) {
-    if (e.which === 13) {
-      console.log("ENTER");
-      window.location.href = "https://www.google.com/search?q=" + encodeURI($input.val()) + search;
-    }
-  });
-};
-
-Listener.register(Demo.initGoogleSearch, Phase.DOCUMENT_READY);
-Listener.register(Demo.initGoogleSearch, Phase.AFTER_UPDATE);
-
-Demo.initMailTo = function () {
-  var $command = jQuery("[href^=mailto]");
-  $command.each(function() {
-    var $this = jQuery(this);
-    // this is, to fix URL encoded spaces
-    $this.attr("href", $this.attr("href").replace(/\+/g, "%20"));
-  });
-};
-
-Listener.register(Demo.initMailTo, Phase.DOCUMENT_READY);
-Listener.register(Demo.initMailTo, Phase.AFTER_UPDATE);
+// call highlighting again. (is called for all, not only for the elements, because it's easier to implement.)
+Listener.register(Prism.highlightAll, Phase.AFTER_UPDATE);