live-guide - npm Package Compare versions

Comparing version 0.8.0 to 0.9.0

assets/js/app.js

 (function() {
+  window.$ = window.$ || function(query) { return [].concat.apply([], document.querySelectorAll(query)); }
+
   window.addEventListener('message', function(event) {
@@ -7,3 +9,29 @@ var element = document.getElementById(event.data.id);
     element.style.height = event.data.height + 'px';
+
+    if (event.data.height === 0) {
+      element.className += ' hidden';
+      element.nextElementSibling.className += ' hidden';
+      element.nextElementSibling.nextElementSibling.className = element.nextElementSibling.nextElementSibling.className.replace('hidden', '').trim();
+    }
   }, false)
+
+  document.addEventListener('DOMContentLoaded', function() {
+    $('.js-showsource').forEach(function(node) {
+      /**
+       * add click listener if iframe is shown
+       */
+      node.addEventListener('click', function(event) {
+        var code = node.nextElementSibling,
+          addClass = 'hidden';
+
+        if(new RegExp(addClass).test(code.className)) {
+          code.className = code.className.replace(addClass, '').trim();
+          node.innerHTML = node.innerHTML.replace('show', 'hide');
+        } else {
+          code.className += ' ' + addClass;
+          node.innerHTML = node.innerHTML.replace('hide', 'show');
+        }
+      }, false);
+    });
+  });
 })();

lib/markdown-render/index.js

@@ -32,3 +32,13 @@ 'use strict';
         <iframe class="code-sample" id="${frameId}" src="${fileName}"></iframe>
-        <code language='${language}' class="hljs" >${highlighted}</code>
+        <button class="btn js-showsource">
+          <svg viewbox="0 0 32 22" class="icon eye">
+            <polygon points="0,11 9,2.5 9,19.5" class="lid-shape left" />
+            <polygon points="32,11 23,2.5 23,19.5" class="lid-shape right" />
+
+            <circle r="9" cy="11" cx="16" stroke-width="4" class="outer-eye" />
+            <circle r="2" cy="11" cx="16" class="inner-eye" />
+          </svg>
+          show source
+        </button>
+        <code language='${language}' class="hljs hidden" >${highlighted}</code>
       </section>`;
@@ -35,0 +45,0 @@

package.json

 {
   "name": "live-guide",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "description": "Generate style guides based on commented style sheets.",
@@ -5,0 +5,0 @@ "author": {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

37665

increased by14.18%

Number of package files

38

increased by2.7%

Lines of code

956

increased by23.83%

No dependency changes