RubyGems - j1-template - Versions diffs - 2023.10.2 → 2024.0.1 - Mend

j1-template 2023.10.2 → 2024.0.1

Files changed (629) hide show

data/lib/starter_web/pages/public/tools/previewer/_includes/documents/frame.textarea.html ADDED Viewed

@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>iFrame message passing test 5</title>
+    <meta name="description" content="iFrame message passing test 5">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="robots" content="noindex">
+    <meta name="robots" content="nofollow">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/themes/unolight/bootstrap.css">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/icon-fonts/mdib.css">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/vendor.css">
+    <script src="/assets/themes/j1/adapter/js/j1.js"></script>
+    <script src="/assets/themes/j1/modules/jquery/js/jquery.js"></script>
+    <script src="/assets/themes/j1/modules/popper/js/popper.js"></script>
+  </head>
+  <body>
+    <a href="my.content.html">Back to page</a>
+    <h2>iFrame TextArea Example</h2>
+    <p>
+      Resize the textarea element below.
+    </p>
+    <p id="callback"></p>
+    <textarea id="textArea">Resize me</textarea>
+    <!-- script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script -->
+    <script src="../js/client/iframeResizer.contentWindow.min.js"></script>
+    <script>
+      function store() {
+        this.x = this.offsetWidth
+        this.y = this.offsetHeight
+      }
+      $('textarea')
+        .each(store)
+        .on('mouseover mouseout', function() {
+          if (this.offsetWidth !== this.x || this.offsetHeight !== this.y) {
+            if ('parentIFrame' in window) parentIFrame.size()
+            store.call(this)
+          }
+        })
+    </script>
+  </body>
+</html>

data/lib/starter_web/pages/public/tools/previewer/_includes/documents/my.content.html ADDED Viewed

@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>iFrame message passing test 1</title>
+  <meta name="description" content="iFrame message passing test 1">
+  <meta name="viewport" content="width=device-width">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="robots" content="noindex">
+  <meta name="robots" content="nofollow">
+  <link rel="stylesheet" href="/assets/themes/j1/core/css/themes/unolight/bootstrap.css">
+  <link rel="stylesheet" href="/assets/themes/j1/core/css/vendor.css">
+  <script src="/assets/themes/j1/modules/jquery/js/jquery.js"></script>
+  <script src="/assets/themes/j1/modules/popper/js/popper.js"></script>
+  <script src="/assets/themes/j1/modules/iframeResizer/js/client/iframeResizer.contentWindow.js"></script>
+</head>
+  <body class="r-text-200 js-toc-content">
+    <p id="callback"></p>
+    <b>iFrame options: </b>
+    &nbsp;
+    <a id="nested" href="frame.nested.html">Nested</a>
+    &nbsp;
+    <a href="frame.hover.html">Hover</a>
+    &nbsp;
+    <a href="frame.textarea.html">TextArea</a>
+    <div class="paragraph mt-3">
+      <p>
+        But I must explain to you how all this mistaken idea of denouncing
+        pleasure and praising pain was born and I will give you a complete account
+        of the system, and expound the actual teachings of the great explorer of
+        the truth, the master-builder of human happiness. No one rejects,
+        dislikes, or avoids pleasure itself, because it is pleasure, but because
+        those who do not know how to pursue pleasure rationally encounter
+        consequences that are extremely painful. Nor again is there anyone who
+        loves or pursues or desires to obtain pain of itself, because it is pain,
+        but because occasionally circumstances occur in which toil and pain can
+        procure him some great pleasure. To take a trivial example, which of us
+        ever undertakes laborious physical exercise, except to obtain some
+        advantage from it? But who has any right to find fault with a man who
+        chooses to enjoy a pleasure that has no annoying consequences, or one who
+        avoids a pain that produces no resultant pleasure?
+      </p>
+      <p>
+        On the other hand, we denounce with righteous indignation and dislike men
+        who are so beguiled and demoralized by the charms of pleasure of the
+        moment, so blinded by desire, that they cannot foresee the pain and
+        trouble that are bound to ensue; and equal blame belongs to those who fail
+        in their duty through weakness of will, which is the same as saying
+        through shrinking from toil and pain. These cases are perfectly simple and
+        easy to distinguish. In a free hour, when our power of choice is
+        untrammelled and when nothing prevents our being able to do what we like
+        best, every pleasure is to be welcomed and every pain avoided. But in
+        certain circumstances and owing to the claims of duty or the obligations
+        of business it will frequently occur that pleasures have to be repudiated
+        and annoyances accepted. The wise man therefore always holds in these
+        matters to this principle of selection: he rejects pleasures to secure
+        other greater pleasures, or else he endures pains to avoid worse pains.
+      </p>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
+        veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
+        commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
+        velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
+        cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
+        est laborum.
+      </p>
+      <p>
+        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi
+        ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
+        in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
+        sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
+        mollit anim id est laborum.
+      </p>
+    </div>
+    <script>
+      var iFrameResizer = {
+        onResized: function(messageData) {
+          $('p#callback').html (
+            '<b>Frame ID:</b> '    + messageData.iframe.id +
+            ' <b>Height:</b> '     + messageData.height +
+            ' <b>Width:</b> '      + messageData.width +
+            ' <b>Event type:</b> ' + messageData.type
+          );
+        },
+        onMessage: function(messageData) {
+          $('p#callback').html (
+            '<b>Frame ID:</b> '    + messageData.iframe.id +
+            ' <b>Message:</b> '    + messageData.message
+          );
+        }
+      }
+    </script>
+  </body>
+</html>

data/lib/starter_web/pages/public/tools/previewer/iframer_documents/iframe.content.html ADDED Viewed

@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/themes/unolight/bootstrap.css">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/vendor.css">
+  </head>
+  <body class="r-text-300">
+    <p>
+      <b>Source</b>: iframe.content.html
+    </p>
+    <h3 style="font-size: 150% !important;">The Extremes of Good and Evil</h3>
+    <p class="small notoc text-gray mb-4">Cicero, Paragraph 1.10.32 · Translation by H. Rackham, Issue 1914 - De Finibus</p>
+    <p>
+      But I must explain to you how all this mistaken idea of denouncing
+      pleasure and praising pain was born and I will give you a complete account
+      of the system, and expound the actual teachings of the great explorer of
+      the truth, the master-builder of human happiness. No one rejects,
+      dislikes, or avoids pleasure itself, because it is pleasure, but because
+      those who do not know how to pursue pleasure rationally encounter
+      consequences that are extremely painful. Nor again is there anyone who
+      loves or pursues or desires to obtain pain of itself, because it is pain,
+      but because occasionally circumstances occur in which toil and pain can
+      procure him some great pleasure. To take a trivial example, which of us
+      ever undertakes laborious physical exercise, except to obtain some
+      advantage from it? But who has any right to find fault with a man who
+      chooses to enjoy a pleasure that has no annoying consequences, or one who
+      avoids a pain that produces no resultant pleasure?
+    </p>
+    <p>
+      On the other hand, we denounce with righteous indignation and dislike men
+      who are so beguiled and demoralized by the charms of pleasure of the
+      moment, so blinded by desire, that they cannot foresee the pain and
+      trouble that are bound to ensue; and equal blame belongs to those who fail
+      in their duty through weakness of will, which is the same as saying
+      through shrinking from toil and pain. These cases are perfectly simple and
+      easy to distinguish. In a free hour, when our power of choice is
+      untrammelled and when nothing prevents our being able to do what we like
+      best, every pleasure is to be welcomed and every pain avoided. But in
+      certain circumstances and owing to the claims of duty or the obligations
+      of business it will frequently occur that pleasures have to be repudiated
+      and annoyances accepted. The wise man therefore always holds in these
+      matters to this principle of selection: he rejects pleasures to secure
+      other greater pleasures, or else he endures pains to avoid worse pains.
+    </p>
+  </body>
+</html>

data/lib/starter_web/pages/public/tools/previewer/iframer_documents/iframe.docsearch.info.html ADDED Viewed

@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/themes/unolight/bootstrap.css">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/vendor.css">
+    <link rel="stylesheet" href="/assets/themes/j1/modules/rouge/css/uno.light/theme.min.css">
+    <link rel="stylesheet" href="/assets/themes/j1/core/css/icon-fonts/fontawesome.min.css">
+  </head>
+  <body class="r-text-300">
+    <h3 style="font-size: 150% !important;">Setting up DocSearch</h3>
+    <p>
+      To setup the module <b>DocSeach</b> with your own set of documents,
+      your need an account at <b>Documind AI</b> and then train your bot
+      with the documents to be searched for your website.
+    </p>
+    <div class="admonitionblock tip">
+      <table style="background: rgb(250, 250, 250);">
+        <tbody>
+          <tr>
+            <td class="icon">
+              <i class="fa icon-tip" title="Tip"></i>
+            </td>
+            <td class="content">
+              <div class="paragraph">
+                <p>
+                  Say goodbye to the hassle of scrolling lengthy documents endlessly
+                  to find the information your vistors need. Try yourselves
+                  <a href="https://documind.chat/" target="_blank" rel="noopener">Documind AI</a>
+                  for <b>free</b>.
+                </p>
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <p>
+      An example setup for the <b>iframe</b> is available with the connfiguration
+      for the module <b>iFramer</b> at <i>_data/modules/iframer.yml</i>. Modify
+      the config data for the Documind iframe as shown below.
+    </p>
+    <div class="listingblock mt-4 mb-4">
+      <div class="title">Example Setup</div>
+      <div class="content">
+        <pre class="rouge highlight notranslate"><code data-lang="yaml">
+          <span class="c1"># ------------------------------------------------------------------------</span>
+          <span class="c1"># Documind iframe</span>
+          <span class="c1">#</span>
+          <span class="pi">-</span> <span class="na">iframe</span><span class="pi">:</span>
+            <span class="na">enabled</span><span class="pi">:</span>                          <span class="kc">true</span>
+            <span class="na">id</span><span class="pi">:</span>                               <span class="s">documind</span>
+            <span class="na">inject_contentWindowScript</span><span class="pi">:</span>       <span class="kc">false</span>
+            <span class="c1"># ------------------------------------------------------------------------</span>
+            <span class="c1"># iframe (HTML) attributes</span>
+            <span class="c1"># ------------------------------------------------------------------------</span>
+            <span class="c1">#</span>
+            <span class="na">attributes</span><span class="pi">:</span>
+              <span class="na">loading</span><span class="pi">:</span>                        <span class="s">lazy</span>
+              <span class="na">src</span><span class="pi">:</span>                            <span class="s">&lt;your-bot-source-link&gt;</span>
+              <span class="na">title</span><span class="pi">:</span>                          <span class="s2">"</span><span class="s">"</span>
+              <span class="na">allowtransparency</span><span class="pi">:</span>              <span class="kc">true</span>
+              <span class="na">style</span><span class="pi">:</span>                          <span class="s2">"</span><span class="s">background:</span><span class="nv"> </span><span class="s">#FAFAFA;"</span>
+              <span class="na">height</span><span class="pi">:</span>                         <span class="m">600</span>
+              <span class="na">width</span><span class="pi">:</span>                          <span class="s">100%</span>
+            <span class="c1"># ------------------------------------------------------------------------</span>
+            <span class="c1"># iFramer (module) options</span>
+            <span class="c1"># ------------------------------------------------------------------------</span>
+            <span class="na">options</span><span class="pi">:</span>
+              <span class="na">checkOrigin</span><span class="pi">:</span>                    <span class="kc">false</span></code>
+          </pre>
+      </div>
+    </div>
+  </body>
+</html>

data/lib/starter_web/pages/public/tools/previewer/preview_bootstrap_theme.adoc CHANGED Viewed

@@ -30,7 +30,7 @@ comments:                               false
 regenerate:                             false
 permalink:                              /pages/public/tools/previewer/current_theme/
-resources:                              [ animate, bmd, clipboard, rouge ]
+resources:                              [ animate, bmd, rouge ]
 resource_options:
   - toccer:
       collapseDepth:                    4
@@ -2170,7 +2170,7 @@ For the following flavours are implemented.
 </div>
 <!-- script>
-NOTE: $.browser.webkit does NOT exists !!!
+<!-- NOTE: $.browser.webkit does NOT exists !!! -->
 if (!$.browser.webkit) {
   $('.wrapper').html('<p>Sorry! Non webkit browser detected. Scrollbars <b>not</b> displayed :</p>');
 }

data/lib/starter_web/pages/public/tools/previewer/preview_docsearch.adoc ADDED Viewed

@@ -0,0 +1,92 @@
+---
+title:                                  Preview DocSearch
+title_extention:                        Search Engine powered by AI
+tagline:                                Search Engine powered by AI
+date:                                   2023-11-02
+#last_modified:                         2023-01-01
+description: >
+                                        DocSearch is an AI-powered chatbot based on Documind AI that helps
+                                        visitors get the most out documents. With Documind, you can upload
+                                        entire documents, such as textbooks, research articles, and product
+                                        manuals, and then use GPT language models to ask questions and receive
+                                        human responses.
+keywords: >
+                                        Jekyll, Theme, JekyllOne, Info, Module, Preview, Ruby, Gem,
+                                        Documind, DocSearch
+categories:                             [ Previewer ]
+tags:                                   [ Module, DocSearch ]
+image:
+  path:                                 /assets/images/modules/attics/library-1920x1280.jpg
+  width:                                1920
+  height:                               1280
+personalization:                        true
+regenerate:                             false
+permalink:                              /pages/public/tools/previewer/docsearch/
+resources:                              [ animate, iframer, rouge ]
+resource_options:
+  - attic:
+      slides:
+        - url:                          /assets/images/modules/attics/library-1920x1280.jpg
+          alt:                          Library
+---
+// Page Initializer
+// =============================================================================
+// Enable the Liquid Preprocessor
+:page-liquid:
+:url-documind--home:                    https://documind.chat/
+// Set (local) page attributes here
+// -----------------------------------------------------------------------------
+// :page--attr:                         <attr-value>
+//  Load Liquid procedures
+// -----------------------------------------------------------------------------
+{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
+// Load page attributes
+// -----------------------------------------------------------------------------
+{% include {{load_attributes}} scope="global" %}
+// Page content
+// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+[role="dropcap"]
+DocSearch is a AI-powered chatbot based on Documind AI that uses natural
+language processing (NLP) and machine learning algorithms to support your
+vistors by instant answers on their questions.
+[CAUTION]
+====
+The service *DocSearch* is only available, when you have agreed on
+*Personalization* with your *Privacy Settings* using Cookies.
+====
+mdi:clock-time-five-outline[24px, md-gray mt-5 mr-2]
+*2 Minutes* to read
+// Include sub-documents (if any)
+// -----------------------------------------------------------------------------
+[role="mt-5"]
+== Searching in Documents
+The template system link:{url-j1--home}[JekyllOne, {browser-window--new}] for
+the static website generator (SSG) link:{url-jekyll--home}[Jekyll, {browser-window--new}]
+supports your vistors in finding answers to what *your project* can do.
+[role="mt-4"]
+Setup *your* example question to provide an answer in *seconds*.
+.Example Question
+[source, apib, role="mt-4 mb-4"]
+----
+What is J1 Template?
+----
+iframe::documind[role="mt-5 mb-7"]

data/lib/starter_web/pages/public/tools/previewer/preview_iframer.adoc ADDED Viewed

@@ -0,0 +1,106 @@
+---
+title:                                  iFramer Preview
+title_extention:                        Magic HTML iFrames
+tagline:                                Magic iFrames
+date:                                   2023-10-31
+#last_modified:                         2023-01-01
+description: >
+                                        The iframeResizer library enables the automatic resizing of the height
+                                        and width of both same and cross domain iFrames to fit their
+                                        contained content. It provides a wide range of features to address
+                                        the most common issues with using iFrames.
+keywords: >
+                                        open source, free, template, jekyll, jekyllone, web,
+                                        sites, static, jamstack, bootstrap,
+                                        html, iframe
+categories:                             [ Previewer ]
+tags:                                   [ Module, iFramer ]
+image:
+  path:                                 /assets/images/modules/attics/jessica-ruscello-1920x1280.jpg
+  width:                                1920
+  height:                               1280
+toc:                                    true
+tts:                                    false
+comments:                               false
+regenerate:                             false
+permalink:                              /pages/public/tools/previewer/iframer/
+resources:                              [ animate, iframer, rouge ]
+resource_options:
+  - attic:
+      padding_top:                      600
+      padding_bottom:                   50
+      opacity:                          0.5
+      slides:
+        - url:                          /assets/images/modules/attics/jessica-ruscello-1920x1280.jpg
+          alt:                          Photo by Jessica Ruscello Unsplash
+          badge:
+            type:                       unsplash
+            author:                     Jessica Ruscello
+            href:                       https://unsplash.com/@jruscello
+---
+// Page Initializer
+// =============================================================================
+// Enable the Liquid Preprocessor
+:page-liquid:
+:url-viewerjs--home:                    https://viewerjs.org/
+//  Load Liquid procedures
+// -----------------------------------------------------------------------------
+{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
+// Load page attributes
+// -----------------------------------------------------------------------------
+{% include {{load_attributes}} scope="global" %}
+// Page content
+// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+[role="dropcap"]
+The iframeResizer library enables automatic resizing of HTML iFrames of the
+height, the width or both to fit their contained content on same and cross
+domain.
+mdi:clock-time-five-outline[24px, md-gray mt-4 mr-2]
+*2 Minutes* to read
+// Include sub-documents (if any)
+// -----------------------------------------------------------------------------
+[role="mt-4"]
+The library provides a wide range of features to address the most common
+issues using HTML iFrames on webpages which includes:
+* Height and width resizing of an iFrame for the content size
+* Works with multiple and nested iFrames
+* Domain authentication for cross domain iFrames
+* Provides a range of page size calculation methods to support
+  complex CSS layouts
+* Detects changes to the DOM that can cause the page to resize using
+  a MutationObserver
+* Detects events that can cause the page to resize (Window Resize,
+  CSS Animation and Transition, Orientation Change and Mouse events)
+* Simplified messaging between the iFrame and the page via postMessages
+* Fixes in-page links in an iFrame and supports links between the iFrame
+  and the parent page
+* Provides custom sizing and scrolling methods
+* Exposes parent position and viewport size to the iFrame
+* Provides onMouseEnter and onMouseLeave events for the iFrame
+* Supports link:{url-viewerjs--home}[ViewerJS, {browser-window--new}]
+  to use PDF and ODF documents for HTML iFrame sources
+[role="mt-5"]
+== iFrame Example
+[role="mb-4"]
+Resize the browser window in *width* to see how the HTML iframe
+follow your changes and behave fully reponsive for the document source within
+the page.
+iframe::magic_iframe[role="mt-4 mb-7"]