j1-template 2022.0.9 → 2022.0.13

data/lib/starter_web/pages/_test_pages/attribute-changes-01-tester.adoc

@@ -1,226 +0,0 @@
----
-title:                                  Tester
-tagline:                                listen attribute changes
-date:                                   2021-10-18 00:00:00 +100
-description: >
-                                        A simple example to demonstrate how the attrchange handler
-                                        function is triggered when a style attribute is changed.
-
-categories:                             [ Tester ]
-tags:                                   [ listen, attribute, changes ]
-
-comments:                               false
-fab_menu_id:                            default
-
-permalink:                              /pages/public/learn/attr_change/
-regenerate:                             false
-
-resources:                              []
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-      slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
-          alt:                          Photo by Ricardo Gomez Angel on Unsplash
-          badge:
-            type:                       unsplash
-            author:                     Ricardo Gomez Angel
-            href:                       https://unsplash.com/@ripato/portfolio
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// 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="none" %}
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-// https://github.com/meetselva/attrchange
-// http://meetselva.github.io/
-// https://codepen.io/meetselva/pen/EVaLmP
-
-// Include sub-documents (if any)
-// -----------------------------------------------------------------------------
-== Tester
-
-.Usage
-[source, js]
-----
-$([selector]).attrchange({
-  trackValues: true,
-  callback: function (event) {
-  	//event.attributeName - Attribute Name
-  	//event.oldValue - Prev Value
-  	//event.newValue - New Value
-    console.log("attr changed: " +event.newValue);
-  }
-});
-----
-
-++++
-<section class="row ml-0">
-
-  <p>
-    A simple example to demonstrate how the attrchange handler
-    function is triggered when a style attribute is changed.
-    Click the buttons below to move the blue box left/right 10px.
-  </p>
-
-  <div>
-    <h3 class="notoc">Demonstration Highlights</h3>
-    <ul>
-      <li>Uses the supported browser specific method to detect attribute changes.</li>
-      <li>Does not use polling to detect an attribute change</li>
-      <li>Detected DOM change: <span id="attrchange-demo-attrchange-method"></span> </li>
-    </ul>
-  </div>
-
-  <div class="container mb-3">
-
-    <div id="attrchange-demobox">
-      <div id="attrchange-buttons">
-        <div class="attrchange-demo-liner">Live Demo <span class="demo-value-name">( Event Count: <span id="attrchange-demo-event-count" class="demo-value">0</span> )</span></div>
-        <button class="attrchange-demo-button left">&lt;&lt;</button>
-        <button class="attrchange-demo-button right">&gt;&gt;</button>
-      </div>
-      <div id="attrchange-demo" class="attrchange-demo">
-        Click the buttons above to move this box left/right '10px'
-      </div>
-    </div>
-
-    <div id="attrchange-demo-logger">
-      <div class="attrchange-demo-liner">Logs</div>
-      <div id="attrchange-demo-logs"></div>
-    </div>
-
-  </div>
-</section>
-++++
-
-++++
-<script>
-  $(function () {
-    var eventCount = 0;                                                         //event counter
-    var $attrchange_logger = $('#attrchange-demo-logs');                        //cached logger
-
-    $('.attrchange-demo').attrchange({
-      trackValues: true,                                                        // enables tracking old and new values
-      callback: function (e) {                                                  //callback handler on DOM changes
-        // log the events in the panel
-        var $logs = $attrchange_logger.prepend('<p>Attribute <b>' + e.attributeName +
-            '</b> changed from <b>' + e.oldValue +
-            '</b> to <b>' + e.newValue +
-            '</b></p>')
-          .find('p');
-
-        //remove old logs, lets just keep the last 5 events
-        $logs.filter(':gt(4)').remove();
-        // highlight the last log in #333 and rest in #999
-        $logs.css('color', '#777').first().css('color', '#333');
-        //show the method used for detecting DOM changes
-        $("#attrchange-demo-attrchange-method").text($(this).attrchange("getProperties")["method"]);
-        //show the event count
-        $('#attrchange-demo-event-count').text(++eventCount);
-      }
-    });
-
-    $('.attrchange-demo-button').on('click', function () {
-      $('#attrchange-demo').css('left', ($(this).hasClass('left') ? "-=10px" : "+=10px"));
-    });
-
-  });
-</script>
-++++
-
-++++
-<style>
-#attrchange-demobox {
-  height: 230px;
-  float: left;
-  width: 33%;
-  background-color: #f2f2f2;
-  position: relative;
-}
-
-#attrchange-buttons {
-  margin: 0;
-  padding: 0;
-}
-
-.attrchange-demo-button {
-  margin: 0 5px;
-}
-
-#attrchange-demo {
-  width: 200px;
-  height: 40px;
-  overflow: hidden;
-  padding: 10px;
-  border: 1px solid #d2d2d2;
-  background-color: #C2D9EC;
-  font-size: 0.9em;
-  position: absolute;
-  top: 95px;
-  left: 5px;
-}
-
-#attrchange-demo-logger {
-  height: 230px;
-  float: left;
-  width: 33%;
-  background-color: #f2f2f2;
-  overflow: auto;
-}
-
-#attrchange-demo-logs p {
-  padding-left: 10px;
-}
-
-.attrchange-demo-liner {
-  margin: 0 0 15px;
-  font-weight: bold;
-  background-color: #d2d2d2;
-  padding: 5px;
-}
-
-.attrchange-demo-liner span {
-  font-weight: normal;
-  font-size: 0.9em;
-}
-
-.attrchange-demo-liner span.demo-value {
-  color: #7E0136;
-}
-
-#attrchange-demo-highlight {
-  float: left;
-  width: 33%;
-  background-color: #d2d2d2;
-  height: 230px;
-}
-
-#attrchange-demo-highlight ul li {
-  margin-top: 10px;
-}
-
-#attrchange-demo-attrchange-method {
-  color: #7E0136;
-  font-weight: bold;
-}
-
-</style>
-++++

data/lib/starter_web/pages/_test_pages/backdrop-tester.adoc

@@ -1,109 +0,0 @@
----
-title:                                  Tester
-tagline:                                backdrop
-date:                                   2020-11-03 00:00:00 +100
-description: >
-                                        Welcome to the preview page focussing on the image module. This page
-                                        shows some valuable features of the J1 Template to manage your image-based
-                                        content using lightboxes, carousels (slider), and galleries.
-
-categories:                             [ Testpages ]
-tags:                                   [ Example ]
-
-comments:                               false
-fab_menu_id:                            page_ctrl_simple
-
-permalink:                              /pages/public/learn/bd_tester/
-regenerate:                             false
-
-resources:                              [
-                                          clipboard, rouge, carousel, lightbox,
-                                          justifiedGallery, lightGallery
-                                        ]
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-      slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
-          alt:                          Photo by Ricardo Gomez Angel on Unsplash
-          badge:
-            type:                       unsplash
-            author:                     Ricardo Gomez Angel
-            href:                       https://unsplash.com/@ripato/portfolio
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set (local) page attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-:images-dir:                            {imagesdir}/pages/roundtrip/100_present_images
-
-//  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
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-// Include sub-documents (if any)
-// -----------------------------------------------------------------------------
-
-++++
-<div class="row mt-3 mr-3 mb-5 ml-3">
-  <!-- Heading -->
-  <div class="row">
-    <div class="animated fadeInUp">
-      <h2 class="g-font-weight-500 mb-0">Jekyll One Template</h2>
-      <p class="tagline mb-0"><b>powerful modern static websites</b></p>
-      <div class="d-inline-block g-width-50 g-height-2 bg-primary mb-2"></div>
-    </div>
-  </div>
-  <!-- End Heading -->
-  <!-- Body -->
-  <div class="row animated fadeInUp">
-    <div class="mr-3 mb-3">
-      <p class="dropcap">
-        Jekyll One Template is the first toolbox to create modern webs and a  learning platform to experience what is behind current Internet  Technologies for the World Wide Web. J1 provides creative people  with both: a rich toolset to build websites and the knowledge  needed to learn what's all  about.
-      </p>
-      <p>  J1 meets Jekyll and Bootstrap and makes a lot of friends.  The template system combines the best free software for the Web.  Jekyll One Template is OpenSource and the modules included are free  to use as well. No license issues for private or professional use.</p>
-      <p>  Explore what's possible if you go for static websites.</p>
-    </div>
-    <!-- Footer|Button row -->
-    <div class="mt-1 text-center">
-      <a href="/pages/public/learn/roundtrip/present_images/" class="btn btn-xl btn-primary text-uppercase text-left mr-2 mb-2" style="min-width: 250px">
-        <i class="mdi mdi-briefcase-search-outline mdi-3x mdi- mr-3"></i>
-        <span class="float-right text-left mt-2">
-          Roundtrip
-          <span class="d-block r-text-200 text-lowercase">learn top features</span>
-        </span>
-      </a>
-      <a href="https://rubygems.org/gems/j1-template" target="blank" rel="noopener" class="btn btn-xl btn-primary text-uppercase text-left mr-2 mb-2" style="min-width: 250px">
-        <i class="mdi mdi-briefcase-download-outline mdi-3x mdi- mr-3"></i>
-        <span class="float-right text-left mt-2">
-          Download
-          <span class="d-block r-text-200 text-lowercase">get on rubygems</span>
-        </span>
-      </a>
-      <a href="https://jekyll.one/pages/public/learn/quickstart/" target="blank" rel="noopener" class="btn btn-xl btn-primary text-uppercase text-left mr-2 mb-2" style="min-width: 250px">
-        <i class="mdi mdi-briefcase-check-outline mdi-3x mdi- mr-3"></i>
-        <span class="float-right text-left mt-2">
-          Quickstart
-          <span class="d-block r-text-200 text-lowercase">finished in 15 minutes</span>
-        </span>
-      </a>
-    </div>
-  </div>
-  <!-- END Body -->
-  <!-- End Card -->
-</div>
-++++

data/lib/starter_web/pages/_test_pages/button-tester-1.adoc

@@ -1,127 +0,0 @@
----
-title:                                  Tester
-tagline:                                button
-date:                                   2020-11-03 00:00:00 +100
-description: >
-                                        Welcome to the preview page focussing on the image module. This page
-                                        shows some valuable features of the J1 Template to manage your image-based
-                                        content using lightboxes, carousels (slider), and galleries.
-
-categories:                             [ Testpages ]
-tags:                                   [ Example ]
-
-comments:                               false
-fab_menu_id:                            page_ctrl_simple
-
-permalink:                              /pages/public/learn/button_tester/
-regenerate:                             false
-
-resources:                              [
-                                          clipboard, rouge, carousel, lightbox,
-                                          justifiedGallery, lightGallery
-                                        ]
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-      slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
-          alt:                          Photo by Ricardo Gomez Angel on Unsplash
-          badge:
-            type:                       unsplash
-            author:                     Ricardo Gomez Angel
-            href:                       https://unsplash.com/@ripato/portfolio
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set (local) page attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-:images-dir:                            {imagesdir}/pages/roundtrip/100_present_images
-
-//  Load Liquid procedures
-// -----------------------------------------------------------------------------
-{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
-
-// Load page attributes
-// -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="all" %}
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-// Include sub-documents (if any)
-// -----------------------------------------------------------------------------
-
-++++
-<div>
-
-  <a href="#void" class="btn btn-xl btn-primary text-uppercase mr-2 mb-2">
-  	<i class="mdi mdi-language-ruby mdi-3x mr-2"></i>
-  	<span class="float-right text-left mt-2">Let's Use this Button
-  		<span class="d-block r-text-200">30 days free for all users</span>
-  	</span>
-  </a>
-
-  <a href="#void" class="btn btn-xl btn-primary text-uppercase mr-2 mb-2">
-  	<i class="mdi mdi-language-ruby mdi-3x mr-2"></i>
-  	<span class="float-right text-left mt-2">Let's Use this Button
-  		<span class="d-block r-text-200">30 days free for all users</span>
-  	</span>
-  </a>
-
-</div>
-
-<style>
-
-/*
-.btn-xl {
-    line-height: 1.4;
-    padding: 0.92857rem 1.85714rem;
-    font-size: 1.28571rem;
-}
-
-.u-btn-content {
-    white-space: normal;
-}
-
-.g-font-weight-600 {
-    font-weight: 600 !important;
-}
-
-.g-letter-spacing-0_5 {
-    letter-spacing: 0.03571rem;
-}
-
-.g-brd-2 {
-    border-width: 2px !important;
-}
-
-.g-mr-10 {
-    margin-right: 0.71429rem !important;
-}
-
-.g-mb-15 {
-    margin-bottom: 1.07143rem !important;
-}
-
-.g-font-size-11 {
-    font-size: 0.78571rem !important;
-}
-
-.g-font-size-42 {
-    font-size: 3rem !important;
-}
-
-.pull-left {
-    float: left;
-}
-*/
-
-</style>
-++++

data/lib/starter_web/pages/_test_pages/card-tester.adoc

@@ -1,128 +0,0 @@
----
-title:                                  Tester
-tagline:                                button
-date:                                   2020-11-03 00:00:00 +100
-description: >
-                                        Welcome to the preview page focussing on the image module. This page
-                                        shows some valuable features of the J1 Template to manage your image-based
-                                        content using lightboxes, carousels (slider), and galleries.
-
-categories:                             [ Testpages ]
-tags:                                   [ Example ]
-
-comments:                               false
-fab_menu_id:                            page_ctrl_simple
-
-permalink:                              /pages/public/learn/card_tester/
-regenerate:                             false
-
-resources:                              [
-                                          clipboard, rouge, carousel, lightbox,
-                                          justifiedGallery, lightGallery
-                                        ]
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-      slides:
-        - url:                          /assets/images/pages/roundtrip/images-1920x1280-bw.jpg
-          alt:                          Photo by Ricardo Gomez Angel on Unsplash
-          badge:
-            type:                       unsplash
-            author:                     Ricardo Gomez Angel
-            href:                       https://unsplash.com/@ripato/portfolio
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set (local) page attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-:images-dir:                            {imagesdir}/pages/roundtrip/100_present_images
-
-//  Load Liquid procedures
-// -----------------------------------------------------------------------------
-{% capture load_attributes %}themes/{{site.template.name}}/procedures/global/attributes_loader.proc{%endcapture%}
-
-// Load page attributes
-// -----------------------------------------------------------------------------
-{% include {{load_attributes}} scope="all" %}
-
-// Page content
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-// Include sub-documents (if any)
-// -----------------------------------------------------------------------------
-
-++++
-<div>
-
-  <article class="card raised-z3 mb-5">
-    <h3 id="35983" class="card-header bg-primary">Welcome</h3>
-    <!-- h5 class="notoc card-subtitle text-muted mb-2">jekyll for everyone</h5 -->
-
-    <div class="row mx-0">
-
-      <div class="col-md-6 img-bg--fill px-0"
-        style="border-right: 1px dotted rgba(0, 0, 0, 0.25); background-image: url(/assets/images/modules/attics/katie-moum-1920x1280.jpg);">
-      </div>
-
-      <!-- div class="col-md-6 px-0">
-        <img class="img__object--cover" src="/assets/images/modules/attics/katie-moum-1920x1280.jpg" alt="Welcome">
-      </div -->
-
-      <div class="col-md-6 p-0">
-        <div class="card-body r-text-300">All you’re doing at the end of the day is writing your content, and the J1 Template does all the tricky things: putting out HTML, Javascript, and CSS. As a result, the site creation process gets out of your way.   Sounds fun, isn’t it?  ...</div>
-        <div class="card-footer r-text-200">
-          
-          <div class="card-footer-text">
-            <i class="mdi mdi-calendar-blank mdi-md-grey mr-1"></i> 2021 March, 28
-          </div>
-          <a class="card-link text-muted text-lowercase" href="/posts/public/featured/2021/03/28/welcome-to-j1/#readmore">
-          Read · jekyll for everyone
-          </a>
-        </div>
-      </div>
-
-  </div>
-
-  </article>
-
-
-  <article class="card raised-z5 mb-5">
-    <h3 id="35983" class="card-header bg-primary">Welcome</h3>
-    <!-- h5 class="notoc card-subtitle text-muted mb-2">jekyll for everyone</h5 -->
-    <div class="card-body r-text-300">All you’re doing at the end of the day is writing your content, and the J1 Template does all the tricky things: putting out HTML, Javascript, and CSS. As a result, the site creation process gets out of your way.   Sounds fun, isn’t it?  ...</div>
-    <div class="card-footer r-text-200">
-      <div class="card-footer-text">
-        <i class="mdi mdi-calendar-blank mr-1"></i> 2021 March, 28
-      </div>
-      <a class="card-link md-grey-800 font-weight-bold g-font-size-12 text-uppercase" href="/posts/public/featured/2021/03/28/welcome-to-j1/#readmore">
-      Read · jekyll for everyone
-      </a>
-    </div>
-  </article>
-
-</div>
-
-<style>
-
-
-.g-bg-img-hero {
-    background-size: cover;
-    background-repeat: no-repeat;
-    background-position: center;
-}
-
-.g-px-0 {
-    padding-left: 0 !important;
-    padding-right: 0 !important;
-}
-
-</style>
-
-++++

data/lib/starter_web/pages/_test_pages/cookieConsent.adoc

@@ -1,96 +0,0 @@
----
-title:                                  J1
-tagline:                                Cookie Consent
-date:                                   2021-06-24 00:00:00 +100
-description: >
-                                        Bootstrap Cookie Consent Module
-                                        for J1 Template
-
-categories:                             [ Testpages ]
-tags:                                   [ Example ]
-
-scrollbar:                              false
-fab_menu_id:                            default
-
-advertising:                            false
-comments:                               false
-
-permalink:                              /pages/public/cookieConsent/
-regenerate:                             true
-
-resources:                              [ bsCookieConsent ]
-resource_options:
-  - attic:
-      padding_top:                      400
-      padding_bottom:                   50
-      opacity:                          0.5
-      slides:
-        - url:                          /assets/images/modules/attics/cookies-1920x1200.jpg
----
-
-// Page Initializer
-// =============================================================================
-// Enable the Liquid Preprocessor
-:page-liquid:
-
-// Set (local) page attributes here
-// -----------------------------------------------------------------------------
-// :page--attr:                         <attr-value>
-:badges-enabled:                        false
-
-//  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
-// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-++++
-<div class="container">
-  <h2>Usage</h2>
-  <p>Initialize the cookie consent framework with the constructor</p>
-  <p><code>var cookieSettings = new BootstrapCookieConsent()</code></p>
-  <h3>Show the Dialog</h3>
-  <p>
-    On a new visit the dialog is shown automatically. For reconfiguration
-    show the Dialog again with <code>cookieSettings.showDialog()</code>.
-  </p>
-  <p>
-    <a href="javascript:showSettingsDialog()" class="btn btn-primary">Cookie Settings</a>
-  </p>
-  <h2>Read the settings</h2>
-  <p>Read all cookie settings with <code>cookieSettings.getSettings()</code></p>
-  <div class="card mb-4">
-    <div class="card-body">
-      <pre class="mb-0" id="settingsOutput"></pre>
-    </div>
-  </div>
-  <p>Read a specific cookie setting with <code>cookieSettings.getSettings('analyses')</code></p>
-  <div class="card">
-    <div class="card-body">
-      <pre class="mb-0" id="settingsAnalysisOutput"></pre>
-    </div>
-  </div>
-</div>
-
-<script>
-
-    function showSettingsDialog() {
-      j1.cookieConsent.showDialog();
-    }
-
-    var dependencies_met_cookie_consent_ready = setInterval (function (options) {
-      if ( typeof j1.cookieConsent !== 'undefined' ) {
-        $("#settingsOutput").text(JSON.stringify(j1.cookieConsent.getSettings()))
-        $("#settingsAnalysisOutput").text(j1.cookieConsent.getSettings('analyses'))
-        clearInterval(dependencies_met_cookie_consent_ready);
-      }
-    });
-
-</script>
-++++