j1-template 2020.0.10 → 2020.0.15

data/lib/starter_web/pages/public/blog/navigator/archive/dateview.html

@@ -1,8 +1,9 @@
 ---
 layout:                                 page
 
-title:                                  Date
+title:                                  Creators Blog
 tagline:                                posts by date
+description:                            Browse articles by date
 
 #permalink:                             /pages/private/blog/navigator/archive/dateview/
 noindex:                                true
@@ -14,9 +15,9 @@ resource_options:
   - attic:
       padding_top:                      400
       padding_bottom:                   50
-      opacity:                          0.5 
+      opacity:                          0.5
       slides:
-        - url:                          /assets/images/modules/attics/matthaeus-1920x1280.jpg
+        - url:                          /assets/images/modules/attics/matthaeus-1920x1280.webp
           alt:                          Photo by Matthaeus
           alignY:                       top
           badge:
@@ -37,13 +38,13 @@ resource_options:
 {% assign view_description    = view_config.description %}
 
 {% if site.permalink == 'none' %}
-  {% capture browser_page_url %}{{ page.url }}.html{% endcapture %}
+  {% capture browser_page_url %}{{page.url}}.html{% endcapture %}
 {% else %}
-  {% capture browser_page_url %}{{ page.url }}{% endcapture %}
+  {% capture browser_page_url %}{{page.url}}{% endcapture %}
 {% endif %}
 
-{% include {{get_page_path}} mode='absolute' %} 
-{% assign navigator_path = page_path | remove_first:'archive' %}
+{% include {{get_page_path}} mode='absolute' %}
+{% assign navigator_path = page_path|remove_first:'archive' %}
 
 {% capture navigator %}{{navigator_path}}{% endcapture %}
 {% capture date_view %}{{page_path}}/dateview/{% endcapture %}
@@ -54,64 +55,76 @@ resource_options:
 {% comment %} Main
 -------------------------------------------------------------------------------- {% endcomment %}
 <!-- [INFO   ] [ {{page.url}} ] [Generate HTML}] -->
-<div class="post-headline"> <h2 id="post-headline" class="mt-2">Posts By Date</h2></div> 
 <div class="paginator ml-3">
   <ul class="pagination raised-z0">
-    <li class="page-item"><a class="page-link" href="{{navigator     | prepend: site.baseurl}}" title="Blog View">Navigator</a></li>
-    <li class="page-item"><a class="page-link" href="{{category_view | prepend: site.baseurl}}" title="View by Category">By Category</a></li>
-    <!-- li class="page-item"><a class="page-link" href="{{tag_view      | prepend: site.baseurl}}" title="View by Tag">By Tag</a></li -->
-    <li class="page-item"><a class="page-link" href="{{all_view      | prepend: site.baseurl}}" title="View All">All Posts</a></li>
+    <li class="page-item"><a class="page-link" href="{{navigator|prepend: site.baseurl}}" title="Blog View">Navigator</a></li>
+    <li class="page-item"><a class="page-link" href="{{category_view|prepend: site.baseurl}}" title="View by Category">By Category</a></li>
+    <li class="page-item"><a class="page-link" href="{{all_view|prepend: site.baseurl}}" title="View All">All Posts</a></li>
   </ul>
 </div>
 
 <div id="index" class="post-search-results col-md-10 col-sm-10 col-xs-11">
 
   <div class="view-description">{{view_description}}</div>
-
+  <div class="post-headline">
+    <h2 id="post-headline" class="mt-5">Posts by Date</h2>
+  </div>
   {% assign openList = '<ul class="list-unstyled link-news">' %}
   {% assign closeList = '</ul>' %}
 
   {% for post in site.posts %}
 
-    {% capture month %}{{ post.date | date: '%m%Y' }}{% endcapture %}
-    {% capture nmonth %}{{ post.next.date | date: '%m%Y' }}{% endcapture %}
+    {% capture month %}{{post.date|date:'%m%Y'}}{% endcapture %}
+    {% capture nmonth %}{{post.next.date|date:'%m%Y'}}{% endcapture %}
     {% capture monthHead %}
       {% if month != nmonth %}
-      {% if  forloop.index != 1  %}{{ closeList }}{%endif %}
-      <h3 id="{{ 100000 | rand }}" class="toc-link mt-5 mb-0">{% if year != nyear %}<a id="{{ post.date | date: '%Y' }}"></a>{% endif %}<a id="{{ post.date | date:  '%Y-%m'  }}"></a><a title="Back to top" href="#"><i class="fa fa-calendar mr-3"></i></a>{{ post.date | date: '%B %Y' }}</h3>
-      {{ openList }}
+      {% if  forloop.index != 1  %}{{closeList}}{%endif %}
+      <h3 id="{{100000|rand}}"
+        class="toc-link mt-5 mb-2">
+        {% if year != nyear %}
+        <a id="{{post.date|date:'%Y'}}"></a>
+        {% endif %}<a id="{{post.date|date:'%Y-%m' }}">
+        </a>
+        <a> <i class="mdi mdi-calendar-blank"></i></a>
+        {{post.date|date:'%B %Y'}}
+      </h3>
+      {{openList}}
       {% endif %}
     {% endcapture %}
 
     {% capture link %}
-      {% assign excerpt = post.excerpt | truncatewords: 50 | strip_html | strip_newlines | strip %}
+      {% assign excerpt = post.excerpt|truncatewords:50|strip_html|strip_newlines|strip %}
       <li>
-        <div class="card card-flat mb-4">        
+        <div class="card card-flat mb-4" style="background-color: #fafafa">
           <div class="card-body">
-            <!-- <span class="post-meta">{{post.date|date: "%B %d, %Y"}}</span> -->
-            <h4 id="{{ 100000 | rand }}" class="card-title">{{ post.title }}</h4>
-            <h5 class="notoc card-subtitle text-muted mb-2">{{ post.tagline }}</h5>
-            <div class="card-text"><p>{{ excerpt }}</p></div>
+            <!-- <span class="post-meta">{{post.date|date:'%B %d, %Y'}}</span> -->
+            <h4 id="{{100000|rand}}" class="card-title">{{post.title}}</h4>
+            <h5 class="notoc card-subtitle text-muted mb-2">{{post.tagline}}</h5>
+            <div class="card-text"><p>{{excerpt}}</p></div>
+            <span class="d-block text-muted text-uppercase g-font-weight-600 g-font-size-12">
+              <i class="mdi mdi-calendar-blank"></i>
+              {{post.date|date:'%Y %B, %e'}}
+            </span>
           </div>
-          <div class="card-footer">
+          <div class="card-footer" style="background-color: #fafafa">
             <!-- <a class="card-link" href="{{post.url}}#readmore" target="_blank">Read more ..</a> -->
             <a class="btn btn-primary btn-raised btn-flex" href="{{post.url}}#readmore">
-              <i class="fa fa-eye fa-lg" style="color:#FFFFFF;"></i>
-              Read more
+              <i class="mdi mdi-eye mdi-lg mr-2" style="color:#FFFFFF;"></i>
+              Read · {{post.tagline}}
             </a>
           </div>
         </div>
       </li>
     {% endcapture %}
 
-    {{ monthHead }}{{ link }}
+    {{monthHead}}{{link}}
 
   {% endfor %}
   {{closeList}}
 
 </div>
 
-<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current page to cookieUserState cookie: {{ browser_page_url }}] -->
+<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current page to cookieUserState cookie: {{browser_page_url}}] -->
 {% comment %} Update cookie for lastpage
 -------------------------------------------------------------------------------- {% endcomment %}
 <script type="text/javascript">
@@ -124,7 +137,7 @@ resource_options:
     user_state.last_page            = user_state_last_page;
 //  j1.setUserState( {last_page:user_state_last_page} );
     j1.writeCookie({
-      name: user_state_cookie_name, 
+      name: user_state_cookie_name,
       data: user_state
     });
     logger.info('Saved current Post Browser page to cookie: {{browser_page_url}}');

data/lib/starter_web/pages/public/blog/navigator/archive/tagview.html

@@ -1,8 +1,10 @@
 ---
 layout:                                 page
 
-title:                                  Tags
+title:                                  Creators Blog
 tagline:                                blog posts by tag
+description:                            Browse articles by tag
+
 #permalink:                             /pages/private/blog/navigator/archive/tagview/
 
 skip_words:                             [ posts ]
@@ -14,7 +16,7 @@ resource_options:
   - attic:
       opacity:                          0.5
       slides:
-        - url:                          /assets/images/modules/attics/library-1920x1280-bw.jpg
+        - url:                          /assets/images/modules/attics/library-1920x1280-bw.webp
           alt:                          library-1920x1280-bw
 ---
 
@@ -35,9 +37,9 @@ resource_options:
 {% assign view_description      = view_config.description %}
 
 {% if site.permalink == 'none' %}
-  {% capture browser_page_url %}{{ page.url }}.html{% endcapture %}
+  {% capture browser_page_url %}{{page.url}}.html{% endcapture %}
 {% else %}
-  {% capture browser_page_url %}{{ page.url }}{% endcapture %}
+  {% capture browser_page_url %}{{page.url}}{% endcapture %}
 {% endif %}
 
 {% comment %} jadams: skip_words needs to be configured by yaml data file
@@ -48,7 +50,7 @@ resource_options:
 {% assign letter_group_counter  = 0 %}
 {% assign letter_group_written  = false %}
 
-{% include {{get_page_path}} mode='absolute' %} 
+{% include {{get_page_path}} mode='absolute' %}
 {% assign navigator_path = page_path | remove_first:'archive' %}
 
 {% capture navigator %}{{navigator_path}}{% endcapture %}
@@ -61,18 +63,18 @@ resource_options:
 {% comment %} TODO: skip_words should configured by yaml data file?
 -------------------------------------------------------------------------------- {% endcomment %}
 {% assign tags = site.tags | sort %}
-{% capture site_tag_word_list %}{% for tag in site.tags %}{{ tag | first }}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
+{% capture site_tag_word_list %}{% for tag in site.tags %}{{tag | first}}{% unless forloop.last %},{% endunless %}{% endfor %}{% endcapture %}
 {% assign tags = site_tag_word_list | split:',' %}
 
 {% for tag in tags %}
   {% if page.skip_words contains tag %} {% continue %} {% endif %}
-  {% capture tag_list %}{{ tag_list | append: tag }}{% unless forloop.last %},{% endunless %}{% endcapture %} 
+  {% capture tag_list %}{{tag_list | append: tag}}{% unless forloop.last %},{% endunless %}{% endcapture %}
 {% endfor %}
 
 
-{% comment %} Main 
--------------------------------------------------------------------------------- {% endcomment %}  
-<!-- [INFO   ] [ {{page.url}} ] [Generate HTML}] --> 
+{% comment %} Main
+-------------------------------------------------------------------------------- {% endcomment %}
+<!-- [INFO   ] [ {{page.url}} ] [Generate HTML}] -->
 {% include {{create_word_cloud}} word_list=tag_list source="tags" %}
 
 <div class="paginator ml-3">
@@ -90,7 +92,7 @@ resource_options:
   {% assign letter_group = letter_group_array[letter_group_counter] %}
 
   {% for item in (0..site.tags.size) %}{% unless forloop.last %}
-    {% capture this_word %}{{ word_array[item] | strip_newlines }}{% endcapture %}
+    {% capture this_word %}{{word_array[item] | strip_newlines}}{% endcapture %}
 
     {% for skip_word in skip_word_array %}
       {% if skip_word contains this_word %} {% assign skip = true %} {% else %} {% assign skip = false %} {% endif %}
@@ -107,7 +109,7 @@ resource_options:
       --------------------------------------------------------------------------
       <!-- jadams, 2018-01-17: logic seems NOT work. Disabled. -->
       {% if letter_group_written == false %}
-        <h3 id="id_{{letter_group}}" class="toc-link mt-5 mb-5"><a title="Back to top" href="#"><i class="fa fa-tags mr-2"></i></a>{{ letter_group | upcase }}</h3>
+        <h3 id="id_{{letter_group}}" class="toc-link mt-5 mb-5"><a title="Back to top" href="#"><i class="fa fa-tags mr-2"></i></a>{{letter_group | upcase}}</h3>
         {% assign letter_group_written = true %}
       {% endif %}
       -------------------------------------------------------------------------- {% endcomment %}
@@ -115,26 +117,26 @@ resource_options:
       {% assign letter_group_counter = letter_group_counter | plus:1 %}
       {% assign letter_group = letter_group_array[letter_group_counter] %}
 
-      {% comment %} jadams, 2018-01-17: logic seems NOT work. 
-                    Added workaround by checking if letter_group has a value 
+      {% comment %} jadams, 2018-01-17: logic seems NOT work.
+                    Added workaround by checking if letter_group has a value
       -------------------------------------------------------------------------- {% endcomment %}
       {% if letter_group %}
       <h3 id="id_{{letter_group}}" class="toc-link mb-3">
         <a title="Back to top" href="#">
           <i class="fa fa-tags mr-2"></i>
-        </a>{{ letter_group | upcase }}
+        </a>{{letter_group | upcase}}
       </h3>
       {% endif %}
       {% assign letter_group_written = true %}
     {% endif %}
 
     {% comment %}
-    letter_group: {{ letter_group | debug }}
-    this_word: {{ this_word | debug }}
-    first_letter: {{ first_letter | debug }}
+    letter_group: {{letter_group | debug}}
+    this_word: {{this_word | debug}}
+    first_letter: {{first_letter | debug}}
     {% endcomment %}
 
-    <h4 id="{{this_word | replace: '+','_' | replace: ' ','_' | downcase }}" class="toc-link"><a title="Back to top" href="#"><i class="fa fa-tag mr-2"></i></a>{{ this_word }}</h4>
+    <h4 id="{{this_word | replace: '+','_' | replace: ' ','_' | downcase}}" class="toc-link"><a title="Back to top" href="#"><i class="fa fa-tag mr-2"></i></a>{{this_word}}</h4>
 
     {% for post in site.tags[this_word] %}{% if post.title != null %}
       {% include {{get_category}} post=post %}
@@ -147,18 +149,17 @@ resource_options:
       {% assign excerpt = post.excerpt | truncatewords: 50 | strip_html | strip_newlines | strip %}
 
       <!-- place post  -->
-      <div class="card card-flat mb-4">        
+      <div class="card card-flat mb-4">
         <div class="card-body">
           <!-- <span class="post-meta">{{post.date|date: "%B %d, %Y"}}</span> -->
-          <h5 id="{{ 100000 | rand }}" class="card-title">{{ post.title }}</h5>
-          <h6 class="notoc card-subtitle text-muted mb-2">{{ post.tagline }}</h6>
-          <div class="card-text"><p>{{ excerpt }}</p></div>
+          <h5 id="{{100000 | rand}}" class="card-title">{{post.title}}</h5>
+          <h6 class="notoc card-subtitle text-muted mb-2">{{post.tagline}}</h6>
+          <div class="card-text"><p>{{excerpt}}</p></div>
         </div>
         <div class="card-footer">
-          <!-- <a class="card-link" href="{{post.url}}#readmore" target="_blank">Read more ..</a> -->
           <a class="btn btn-primary btn-raised btn-flex" href="{{post.url}}#readmore">
-            <i class="fa fa-eye fa-lg" style="color:#FFFFFF;"></i>
-            Read more
+            <i class="mdi mdi-eye mdi-lg mr-2" style="color:#FFFFFF;"></i>
+            Read · {{post.tagline}}
           </a>
         </div>
       </div>
@@ -166,7 +167,7 @@ resource_options:
   {% endunless %}{% endfor %}
 </div>
 
-<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current page to cookieUserState cookie: {{ browser_page_url }}] -->
+<!-- [INFO   ] [j1.page.{{page.title}}                   ] [Save the current page to cookieUserState cookie: {{browser_page_url}}] -->
 <script type="text/javascript">
   function setLastPage() {
     var logger = log4javascript.getLogger('j1.BlogNavigator');
@@ -177,11 +178,10 @@ resource_options:
     user_state.last_page            = user_state_last_page;
 //  j1.setUserState( {last_page:user_state_last_page} );
     j1.writeCookie({
-      name: user_state_cookie_name, 
+      name: user_state_cookie_name,
       data: user_state
     });
     logger.info('Saved current Post Browser page to cookie: {{browser_page_url}}');
   }
   window.onload = setLastPage();
 </script>
-

data/lib/starter_web/pages/public/blog/navigator/index.html

@@ -3,7 +3,7 @@ layout:                                 blog_archive
 
 title:                                  Creators Blog
 tagline:                                explore posts
-description:                            Page Generator
+description:                            Navigate  all articles
 
 tags:                                   [ Blog, Creator ]
 resources:                              []
@@ -21,9 +21,9 @@ resource_options:
   - attic:
       padding_top:                      400
       padding_bottom:                   50
-      opacity:                          0.5 
+      opacity:                          0.5
       slides:
-        - url:                          /assets/images/modules/attics/matthaeus-1920x1280.jpg
+        - url:                          /assets/images/modules/attics/matthaeus-1920x1280.webp
           alt:                          Photo by Matthaeus
           alignY:                       top
           badge:

data/lib/starter_web/pages/public/learn/examples/floating_ad.adoc

@@ -0,0 +1,221 @@
+---
+title:                                  CSS Examples
+tagline:                                floating ads
+description:                            floating ads
+
+tags:                                   [ Page, Roundtrip ]
+index:                                  [ Start, Template, Whats, Up, Readme, TL;DR ]
+categories:                             [ pages ]
+
+toc:                                    true
+advertising:                            true
+
+permalink:                              /pages/public/learn/fad/
+regenerate:                             false
+
+resources:                              [ lightbox ]
+resource_options:
+---
+
+// Enable the Liquid Preprocessor
+// -----------------------------------------------------------------------------
+:page-liquid:
+
+
+// Set other global page attributes here
+// -----------------------------------------------------------------------------
+//:my-asciidoc-attribute:
+
+//  Load Liquid procedures
+// -----------------------------------------------------------------------------
+{% capture set_env_entry_document %}themes/{{site.template.name}}/procedures/global/set_env_entry_document.proc{%endcapture%}
+
+
+// Initialize entry document environmental attributes
+// -----------------------------------------------------------------------------
+{% include {{set_env_entry_document}} %}
+
+// Load tag, url and data attributes
+// -----------------------------------------------------------------------------
+// include::{includedir}/attributes.asciidoc[tag=tags]
+// include::{includedir}/attributes.asciidoc[tag=urls]
+// include::{includedir}/attributes.asciidoc[tag=data]
+
+// Set local page attributes
+// -----------------------------------------------------------------------------
+// :images-dir:                         {imagesdir}/path/to/page/images
+
+// Page content
+// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+// Include sub-documents
+// -----------------------------------------------------------------------------
+
+Welcome to the pages of J1 Template. If your here first time,
+hopefully you get on that page first. For sure, there is no better
+place to step in.
+
+Having a menu system is great. We hope the the navigator module of J1 will
+support you to explore this site, find what your are looking for. The site
+of J1 has grown over the last month a lot. Many documents were seeking for
+a home. And we have really a bunch of them.
+
+== Orientation
+
+To get better orientated, the site is organized for *natural reading*. As we
+use the English language for our international vistors (we are German),
+*natural reading* means for a western language, reading from the left to the
+right (LTR), and from top to down a page. The same to all menus, sections
+and pages.
+
+Welcome to the pages of J1 Template. If your here first time,
+hopefully you get on that page first. For sure, there is no better
+place to step in.
+
+Having a menu system is great. We hope the the navigator module of J1 will
+support you to explore this site, find what your are looking for. The site
+of J1 has grown over the last month a lot. Many documents were seeking for
+a home. And we have really a bunch of them.
+
+To get better orientated, the site is organized for *natural reading*. As we
+use the English language for our international vistors (we are German),
+*natural reading* means for a western language, reading from the left to the
+right (LTR), and from top to down a page. The same to all menus, sections
+and pages.
+Welcome to the pages of J1 Template. If your here first time,
+hopefully you get on that page first. For sure, there is no better
+place to step in.
+
+Having a menu system is great. We hope the the navigator module of J1 will
+support you to explore this site, find what your are looking for. The site
+of J1 has grown over the last month a lot. Many documents were seeking for
+a home. And we have really a bunch of them.
+
+To get better orientated, the site is organized for *natural reading*. As we
+use the English language for our international vistors (we are German),
+*natural reading* means for a western language, reading from the left to the
+right (LTR), and from top to down a page. The same to all menus, sections
+and pages.
+
+
+++++
+<style>
+
+  .advertising {
+    display: none;
+  }
+
+  .adblock {
+  }
+
+  .adblock-fixed {
+    position: fixed;
+  }
+
+/* .sidebar {
+    width:33.33%;
+    float:left;
+    padding: 0 10px;
+} */
+
+/*
+  .floating-div {
+    background-color: #333;
+    padding: 10px 50px;
+    color:#EEE;
+    font-size: 20px;
+    margin-top:10px;
+    position: absolute;
+    right: -40px;
+  }
+*/
+  .floating-div {
+      background-color: #333;
+      /* padding: 10px 50px; */
+      color: #EEE;
+      font-size: 20px;
+      /* margin-top: 10px; */
+      /* position: absolute; */
+      /* right: -40px; */
+  }
+
+  .sticky {
+    position: fixed;
+    top: 150px;
+    right:-40px;
+    margin: 0;
+    width:calc(33.33% - 25px);
+  }
+
+  .abs {
+    position: absolute;
+    bottom: 10px;
+    right:10px;
+    width:calc(33.33% - 20px);
+  }
+</style>
+
+<script>
+  $(document).ready(function() {
+    var dependencies_met_core = setInterval(function() {
+      if (j1.getState() == 'finished') {
+        // variables
+        var logger = log4javascript.getLogger('fad.scrollSpy');
+
+        var $window             = $(window);
+        var $navbar             = $('nav.navbar');
+        var $attic              = $('.attic');
+        var $main_content       = $('.js-toc-content');
+        var $adblock            = $('#adblock');
+        var $footer             = $('#j1_footer');
+
+        var pageHeight          = $window.height();
+        var pageHeightOuter     = $window.outerHeight();
+
+        var atticHeight         = $attic.height();
+        var atticHeightOuter    = $attic.outerHeight()
+        var navbarHeight        = $navbar.height();
+        var navbarHeightOuter   = $navbar.outerHeight()
+
+        var footerHeight        = $footer.height();
+        var footerHeightOuter   = $footer.outerHeight();
+        var footerFromTop       = $footer.offset().top;
+
+        var adFromTop           = $adblock.offset().top;
+        var adblockHeight       = $adblock.height();
+        var adblockHeightOuter  = $adblock.outerHeight();
+
+        var a                   = $adblock.offset().top;
+        var m                   = $main_content.offset().top;
+        var h                   = $attic.length ? $attic.height() : 0;
+        var n                   = $navbar.length ? $navbar.height() : 0;
+
+        var fixPosition         = navbarHeight;
+        var absPosition         = fixPosition - 10;
+
+        $window.scroll(function() {
+          var scrollPos = $(document).scrollTop();
+
+          logger.info('document scroll pos detected as: ' + scrollPos + 'px');
+
+          if ($window.scrollTop() > fixPosition) {
+            $adblock.show();
+            $adblock.addClass('adblock-fixed');
+//          $adblock.css('top', 80);
+            $adblock.css('top', fixPosition);
+          } else if ($window.scrollTop() < absPosition) {
+            $adblock.removeClass('adblock-fixed');
+            $adblock.removeAttr('style');
+            $adblock.hide();
+          } else {
+            $adblock.removeClass('adblock-fixed');
+            $adblock.removeAttr('style');
+            $adblock.hide();
+          }
+        });
+        clearInterval(dependencies_met_core);
+      }
+    }, 25);
+  });
+</script>
+++++