Merge branch 'master' into release

electric-eloquence · May 11, 2020 · 16b29e1 · 16b29e1
2 parents 99a1d0a + 6571280
commit 16b29e1
Show file tree

Hide file tree

Showing 18 changed files with 266 additions and 232 deletions.
diff --git a/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.html b/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.html
@@ -38,6 +38,7 @@ <h1 id="scraper-heading" class="scraper-heading" style="display: block;">Fepper
     <div class="cf" style="padding-top: 10px;">
       <input name="url-form" type="submit" value="Submit" style="float: left;">
       <button id="help-button" style="float: right;">Help</button>
+      <button id="hide-button" style="float: right;display: none;">Hide</button>
     </div>
   </form>
   <script src="../../scripts/pattern/html-scraper-dhtml.js"></script>

diff --git a/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.markup-only.html b/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.markup-only.html
@@ -14,6 +14,7 @@ <h1 id="scraper-heading" class="scraper-heading" style="display: block;">Fepper
     <div class="cf" style="padding-top: 10px;">
       <input name="url-form" type="submit" value="Submit" style="float: left;">
       <button id="help-button" style="float: right;">Help</button>
+      <button id="hide-button" style="float: right;display: none;">Hide</button>
     </div>
   </form>
   <script src="../../scripts/pattern/html-scraper-dhtml.js"></script>

diff --git a/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.mustache b/patterns/98-scrape-00-html-scraper/98-scrape-00-html-scraper.mustache
@@ -14,6 +14,7 @@
     <div class="cf" style="padding-top: 10px;">
       <input name="url-form" type="submit" value="Submit" style="float: left;">
       <button id="help-button" style="float: right;">Help</button>
+      <button id="hide-button" style="float: right;display: none;">Hide</button>
     </div>
   </form>
   <script src="../../scripts/pattern/html-scraper-dhtml.js"></script>

diff --git a/scripts/classes/patternlab-viewer.js b/scripts/classes/patternlab-viewer.js
@@ -219,22 +219,37 @@ export default function (fepperUiInst, root) {
         patternPartial = 'viewall';
       }
 
-      const iframePath = this.uiData.patternPaths[patternPartial];
+      try {
+        /* istanbul ignore if */
+        if (Object.keys(this.uiData.patternPaths).length <= 1) {
+          this.$orgs['#sg-nav-message'].dispatchAction('removeClass', 'is-vishidden');
 
-      /* istanbul ignore if */
-      if (!iframePath) {
+          // Returning instead of throwing because #sg-nav-message tells to check the console for errors.
+          // Throwing an explicit error here would likely be a red herring.
+          return;
+        }
+      }
+      catch (err) /* istanbul ignore next */ {
         this.$orgs['#sg-nav-message'].dispatchAction('removeClass', 'is-vishidden');
 
-        throw new Error(`${patternPartial} undefined`);
+        throw err;
       }
 
-      this.urlHandler.skipBack = true;
+      let iframePath = this.uiData.patternPaths[patternPartial];
+
+      /* istanbul ignore else */
+      if (iframePath) {
+        this.urlHandler.skipBack = true;
 
-      // Update DOM with pattern info.
-      this.uiFns.updatePatternInfo(patternPartial, iframePath);
+        // Update DOM with pattern info.
+        this.uiFns.updatePatternInfo(patternPartial, iframePath);
 
-      // Update history. Need to do this so urlHandler.popPattern has an Event.state.pattern to work with.
-      root.history.replaceState({pattern: patternPartial}, null, null);
+        // Update history. Need to do this so urlHandler.popPattern has an Event.state.pattern to work with.
+        root.history.replaceState({pattern: patternPartial}, null, null);
+      }
+      else {
+        iframePath = `&quest;p=${patternPartial}`;
+      }
 
       // Render Feplet templates.
       try {

diff --git a/scripts/listeners/patternlab-viewer.js b/scripts/listeners/patternlab-viewer.js
@@ -32,6 +32,10 @@ export default function (fepperUiInst) {
 
         // Click handlers for viewport resize buttons.
         for (let bp of Object.keys(fepperUiInst.uiProps.bpObj)) {
+          if (!this.$orgs['#sg-size-' + bp]) {
+            continue;
+          }
+
           this.$orgs['#sg-size-' + bp].on('click', (e) => {
             e.preventDefault();
 

diff --git a/scripts/pattern/html-scraper-ajax.js b/scripts/pattern/html-scraper-ajax.js
@@ -119,22 +119,23 @@
         // Parse xhr.responseText into DOM object.
         const parser = new DOMParser();
         const doc = parser.parseFromString(xhr.responseText, 'text/html');
+        const heading = doc.getElementById('scraper-heading');
         const helpText = doc.getElementById('help-text');
-        const messageToRender = doc.getElementById('message');
+        const message = doc.getElementById('message');
         // Get last form on page. Older Fepper versions didn't identify it by name.
-        const scraperTargeter = doc.forms[doc.forms.length - 1];
+        const targeter = doc.forms[doc.forms.length - 1];
 
-        // Write out any messaging.
-        const messageSlug = d.getElementById('message');
+        // Write out main content.
+        const main = d.getElementsByTagName('main')[0];
+
+        main.appendChild(message);
 
-        if (messageSlug && messageToRender.innerHTML) {
-          messageSlug.outerHTML = messageToRender.outerHTML;
+        if (!main.getElementsByClassName('scraper-heading').length) {
+          main.appendChild(heading);
         }
 
-        // Append targeter form and help text.
-        const main = d.getElementsByTagName('main')[0];
-        main.innerHTML += scraperTargeter.outerHTML;
-        main.innerHTML += helpText.outerHTML;
+        main.appendChild(targeter);
+        main.appendChild(helpText);
 
         // Insert new script element such that it fires on load.
         const node4insert = d.getElementById('help-text');
@@ -154,17 +155,17 @@
 
   .then(() => {
     // Get last form on page. Older Fepper versions didn't identify it by name.
-    const scraperTargeter = d.forms[d.forms.length - 1];
+    const targeter = d.forms[d.forms.length - 1];
 
-    scraperTargeter.addEventListener(
+    targeter.addEventListener(
       'submit',
       function (e) {
         e.preventDefault();
 
         const message = d.getElementById('message');
         const xhr = new XMLHttpRequest();
-        const selectorRaw = scraperTargeter.selector.value;
-        let url = scraperTargeter.url.value;
+        const selectorRaw = targeter.selector.value;
+        let url = targeter.url.value;
 
         if (url[0] === '/') {
           url = baseUrl + url;
@@ -178,7 +179,7 @@
 
             if (!selectorName) {
               message.className = 'message error';
-              message.innerHTML = 'Error! Please enter correctly syntaxed selector.';
+              message.innerHTML = 'ERROR! Please enter correctly syntaxed selector.';
               d.body.scrollTop = d.documentElement.scrollTop = 0;
 
               return;
@@ -198,12 +199,12 @@
             message.className = 'message';
             message.innerHTML = '';
 
-            scraperTargeter.html2json.value = JSON.stringify(html2json);
-            scraperTargeter.submit();
+            targeter.html2json.value = JSON.stringify(html2json);
+            targeter.submit();
           }
           else {
             message.className = 'message error';
-            message.innerHTML = 'Error! Please enter a valid, reachable URL.';
+            message.innerHTML = 'ERROR! Please enter a valid, reachable URL.';
             d.body.scrollTop = d.documentElement.scrollTop = 0;
           }
         };

diff --git a/scripts/pattern/html-scraper-dhtml.js b/scripts/pattern/html-scraper-dhtml.js
@@ -21,20 +21,25 @@
 
   // Show/hide help text.
   const helpButton = d.getElementById('help-button');
+  const hideButton = d.getElementById('hide-button');
+  let helpText;
 
   helpButton.addEventListener('click', (e) => {
     e.preventDefault();
 
-    const helpText = d.getElementById('help-text');
+    helpText = helpText || d.getElementById('help-text');
+    helpText.style.visibility = 'visible';
+    helpButton.style.display = 'none';
+    hideButton.style.display = 'block';
+  });
 
-    if (helpButton.innerHTML === 'Help') {
-      helpButton.innerHTML = 'Hide';
-      helpText.style.visibility = 'visible';
-    }
-    else {
-      helpButton.innerHTML = 'Help';
-      helpText.style.visibility = 'hidden';
-    }
+  hideButton.addEventListener('click', (e) => {
+    e.preventDefault();
+
+    helpText = helpText || d.getElementById('help-text');
+    helpText.style.visibility = 'hidden';
+    hideButton.style.display = 'none';
+    helpButton.style.display = 'block';
   });
 
   // Validate importer form.
@@ -50,7 +55,7 @@
 
         const message = d.getElementById('message');
         message.className = 'message error';
-        message.innerHTML = 'Error! Please enter a valid filename.';
+        message.innerHTML = 'ERROR! Please enter a valid filename.';
         d.body.scrollTop = d.documentElement.scrollTop = 0;
       }
     });