jekyll-web-novel 0.1.8 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 27f7bdb99fdcea68ae850684c57b89fe4e0f184d9797280ebda14add3c4326b5
-  data.tar.gz: ba94c3657418d77b7ced99e28653ef9fe8f65bda6bcb619f42bb8a183e63a2ab
+  metadata.gz: bfd69738895f6a9f448a7a7f1d7051feb43cbc65343d59042ad4b8d4ae3ba4e9
+  data.tar.gz: cfc5bb72afe4e8279634c9d25155bce896011a3bb315b30b150bff1565d37fd7
 SHA512:
-  metadata.gz: 05f1f05492200f0632fa09b6d442ddcd138230f9ad2420c85807109d0cdf21d54a45451c1995694a7f0c1423ec1fa3ef5ba7329de6f79710f45101699636c47d
-  data.tar.gz: 4a885cd64fecc342394934ad1710f851320937b0b2ceedec163f11396e2878a34004a02f21c660d4c9fd2234033c099e115812ccd7733eb0b0e18e9f74a3b6aa
+  metadata.gz: 063da2bdcff1144efb9e56fb0044db4d4243c1eb219790f470a3152d3d55b3bc696245074328e2f4b138dcfd5242ca4310ef0c2454739ec3439942a5caecd6cd
+  data.tar.gz: f6e6908d27d5c9dbcc4250f6a7eea1e988a6b4feb4e09edc96903e5d633cdb753382ce9d7814fab668d89ce7a1e5e64ec112e03bb83e014c49130510ae8ebfa2

data/_boilerplates/chapter.md

@@ -3,7 +3,7 @@ _boilerplate:
   path: '_chapters'
   timestamp: false
   title: title
-  slug: "{{ vol }}-{{ cht }}-{{ title }}.md"
+  slug: "{{ vol }}-{{ cht }}-{{ title }}"
   vol: '01'
 
 title: {{ boilerplate.title }}

data/_boilerplates/preview.md

@@ -3,10 +3,8 @@ _boilerplate:
   path: '_previews'
   timestamp: false
   title: title
-  slug: "{{ vol }}-{{ cht }}-{{ title }}.md"
+  slug: "{{ vol }}-{{ cht }}-{{ title }}"
   vol: '01'
-  localhost: 
-  baseurl: 
 
 # http://localhost:4000/chapters/{{ boilerplate.random_url }}#reader
 # https://example.com/chapters/{{ boilerplate.random_url }}#reader

data/_boilerplates/{page.md → tab.md}

@@ -1,11 +1,12 @@
 ---
 _boilerplate:
-  path: pages
+  path: _tabs
+  order: 0
 
 title: {{ boilerplate.title }}
 created: {{ boilerplate.time }}
 permalink: {{ boilerplate.slug }}
-layout: default
+order: {{ boilerplate.order }}
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

data/_boilerplates/volume.md

@@ -4,7 +4,7 @@ _boilerplate:
   path: '_volumes'
   timestamp: false
   title: title
-  slug: "{{ vol }}-{{ title }}.md"
+  slug: "{{ vol }}-{{ title }}"
 
 title: {{ boilerplate.title }}
 created: {{ boilerplate.time }}

data/_config.yml

@@ -22,6 +22,7 @@ novel:
   title: "The Upper Crust"
   author: "John Doe"
   lang: en
+  start_chapter: 1
   copyright:
     short: >-
       **The Upper Crust, Vol 1**
@@ -44,10 +45,12 @@ collections:
   previews:
     sort_by: chapter
     output: true
-    layout: chapter
   volumes:
     sort_by: volume
     output: false
+  tabs:
+    sort_by: order
+    output: true
 
 
 defaults:
@@ -61,10 +64,12 @@ defaults:
     values:
       layout: "preview"
       type: 'previews'
+      published: false
   - scope:
-      path: "pages/*"
+      path: "_tabs/*"
     values:
       layout: "page"
+      type: 'tabs'
 
 plugins:
   - jekyll-feed

data/_includes/alerts.html

@@ -0,0 +1,5 @@
+<div id="alerts" class="alerts vbox" alerts>
+
+
+</div>
+

data/_includes/header.html

@@ -1,16 +1,22 @@
 
 <header scroll-nav class="hbox nav hbox:long">
-    <h1>
-        <a href={{site.baseurl}}>
-            {{ site.title }}
-        </a>
-    </h1>
+  <h1>
+    <a href={{site.baseurl}}>
+      {{ site.title }}
+    </a>
+  </h1>
 
-    <div class="hbox nav">
-        <a href="{{'chapters' | relative_url }}">Index</a>
-        {% if page.start_chapter %}
-        {% assign cht1 = site.chapters | find: 'chapter', page.start_chapter %}
-        <a class="big-link" href="{{ cht1.url }}#reader">Read</a>
-        {% endif %}
-    </div>
+  <div class="hbox nav">
+
+    {% for tab in site.tabs %}
+      {% unless page.path == tab.path %}      
+        <a href="{{ tab.url }}">{{ tab.title }}</a>
+      {% endunless %}
+    {% endfor %}
+
+    {% if site.novel.start_chapter %}
+    {% assign cht1 = site.chapters | find: 'chapter', page.start_chapter %}
+      <a go-to-bookmark class="big-link" href="{{ cht1.url }}#reader">Read</a>
+    {% endif %}
+  </div>
 </header>

data/_includes/reader.html

@@ -1,8 +1,6 @@
 
-<div data-page="{{ page.chapter }}" class="reader" id="reader" lang="{{ site.novel.lang }}">
+<div data-page="{{ page.chapter }}" class="reader container" id="reader" lang="{{ site.novel.lang }}">
   <div class="chapter__content">
     {{ content }}
   </div>
 </div>
-  
-<script src="{{ '/assets/js/bookReader.js' | relative_url }}"></script>

data/_includes/toc.html

@@ -1,7 +1,7 @@
 
 <h1 id="#{{page.title | slugify }}">{{ page.title }}</h1> 
 
-{% assign volumes = site.chapters | group_by: 'volume' %}
+{% assign volumes = include.chapters | group_by: 'volume' %}
 {% for vol in volumes %}
 
 {% assign volume = site.volumes | find: 'volume', vol.name %}

data/_layouts/chapter.html

@@ -7,6 +7,6 @@ layout: root
 {% include reader.html %}
 
 
-<div class="max-width-1">
+<div class="container">
   {% include chapter_nav.html %}
 </div>

data/_layouts/home.html

@@ -2,7 +2,7 @@
 layout: default
 ---
 
-<div class="reader {{ page.title | slugify}}">
+<div class="reader container{{ page.title | slugify}}">
     {{ content }}
 </div>
 

data/_layouts/page.html

@@ -2,6 +2,6 @@
 layout: default
 ---
 
-<div class="reader {{ page.title | slugify}}">
+<div class="reader container {{ page.title | slugify}}">
     {{ content }}
 </div>

data/_layouts/preview.html

@@ -3,4 +3,12 @@ layout: root
 ---
 
 {% include header.html %}
+
+<div class="container mt">
+    
+    <button copy="{{ page.url | prepend: site.url }}">
+        Copy URL
+    </button>
+</div>
+
 {% include reader.html %}

data/_layouts/root.html

@@ -5,11 +5,16 @@
 </head>
 <body>
 
+  {% include alerts.html %}
  
   {{content}}
    
   {% include footer.html %}
 
+  
+  <script src="{{ '/assets/js/bookReader.js' | relative_url }}"></script>
   <script src="{{ '/assets/js/scrollNav.js' | relative_url }}"></script>
+  <!-- vvv keep as last script to run vvv -->
+  <script src="{{ '/assets/js/CopyBtn.js' | relative_url }}"></script>
 </body>
 </html>

data/_sass/jekyll-web-novel.sass

@@ -5,14 +5,11 @@
 @import 'web-novel/footer'
 @import 'web-novel/header'
 @import 'web-novel/scrollNav'
+@import 'web-novel/alerts'
 
 \:root
     font-size: 16px
 
-html
-    scroll-behavior: smooth
-
-
 .hbox
     display: grid
     grid-auto-flow: column
@@ -23,6 +20,9 @@ html
 .vbox > * + *
     margin-top: 2em
 
+.vbox > *
+    display: block
+
 h1 a
     color: var(--text-main)
     text-decoration: none
@@ -42,7 +42,7 @@ h1 a
 
     margin: 1em 0
 
-.max-width-1
+.container
     max-width: 35em
     margin: 0 auto
 
@@ -54,6 +54,11 @@ h1 a
     line-height: 1em
     margin: 1em 0
 
+.mt
+    margin-top: 2em
+
+button
+    border: solid 2px var(--text-muted, #888)
 
 
 @media only screen and (max-width: 40rem)

data/_sass/web-novel/alerts.sass

@@ -0,0 +1,45 @@
+
+.alerts
+    font-size: 1.4rem
+    position: fixed
+    color: var(--text-bright)
+    right: 0
+    left: 0
+    bottom: 0
+    margin: 3px
+    max-width: 100vw
+    pointer-events: none
+
+@keyframes slideOutRight
+    0%
+        transform: translateX(0) scaleY(100%)
+    90%   
+        transform: translateX(0) scaleY(100%)
+        opacity: 1
+    99%
+        transform: translateX(00%) scaleY(0%)
+        opacity: 0
+        margin-top: 2em
+    100% 
+        margin-top: 0
+
+.alerts > *
+    outline: solid 1px var(--selection)
+    box-shadow: 0 0 20px 5px var(--background-body)
+    background-color: var(--button-base)
+    padding: .2em .6em
+    border-radius: 6px
+    transform: translateX(200%)
+    animation: 2s ease-in 0s slideOutRight
+    // transform: translateX(0)
+    // transition: transform 150ms ease-in 1s
+    // transform: translateX(200%)
+
+@media only screen and (min-width: 40rem)
+    .alerts
+        padding-bottom: 5rem
+@media only screen and (min-width: 60rem)
+    .alerts
+        left: unset
+        max-width: 60%
+        padding-right: 5rem

data/_sass/web-novel/colors.sass

@@ -2,5 +2,6 @@
     body
         --background-body: #000
         --text-muted: #555
-        // color: red
-        // background-color: pinawk!important
+        --button-base: #1a2335
+ 
+ 

data/_sass/web-novel/reader.sass

@@ -14,10 +14,9 @@ p
     padding-left: 1rem
     font-size: 1.8rem
     offset-anchor: 10vh
+    cursor: pointer
     
 .reader
-    max-width: 35em
-    margin: 0 auto
     padding-top: 2em
     text-align: justify
     word-break: break-word

data/_sass/web-novel/scrollNav.sass

@@ -6,3 +6,6 @@
 
 [scroll-nav=up]
     top: 0em
+
+// html
+//     scroll-behavior: smooth

data/admin/config.yml

@@ -13,9 +13,9 @@ public_folder: "/assets/uploads"
 site_url: https://example.com
 
 collections:
-  - name: pages
+  - name: tabs
     label: 'Pages'
-    folder: 'pages/'
+    folder: '_tabs/'
     create: false
     slug: "{{slug}}"
     summery: "{{title}}"
@@ -23,6 +23,7 @@ collections:
       preview: false
     fields: 
       - { label: 'Title', name: "title", widget: 'string' }
+      - { label: 'Published', name: 'published', widget: 'boolean', default: true, required: false }
       - { label: 'Permalink', name: "permalink", widget: 'string', default: '/:basename/', required: false }
       - { label: 'Body', name: 'body', widget: 'markdown' }
 
@@ -36,6 +37,7 @@ collections:
       preview: false
     fields: 
       - { label: 'Title', name: "title", widget: 'string' }
+      - { label: 'Published', name: 'published', widget: 'boolean', default: true, required: false }
       - { label: 'Chapter', name: "chapter", widget: 'number', default: 01, value_type: 'int' }
       - { label: 'Volume', name: "volume", widget: 'number', default: 01, value_type: 'int' }
       - { label: 'Permalink', name: "permalink", widget: 'string', default: '/:basename/', required: false }
@@ -51,6 +53,7 @@ collections:
       preview: false
     fields: 
       - { label: 'Title', name: "title", widget: 'string' }
+      - { label: 'Published', name: 'published', widget: 'boolean', default: false, required: false }
       - { label: 'Chapter', name: "chapter", widget: 'number', default: 01, value_type: 'int' }
       - { label: 'Volume', name: "volume", widget: 'number', default: 01, value_type: 'int' }
       - { label: 'Permalink', name: "permalink", widget: 'string', default: '/:basename/', required: false }

data/assets/js/CopyBtn.js

@@ -0,0 +1,56 @@
+class CopyBtn {
+  constructor(
+    target = '[copy]', 
+    attr = 'copy', 
+    fun = (t) => {
+      alert(CopyBtn.copyMsg(t)); 
+      return(t);
+    }
+  ) {
+    this.target = target;
+    this.field = attr;
+    this.fun = fun;
+    this.activateButtons();
+  }
+
+  activateButtons() {
+    document.querySelectorAll(this.target).forEach((b)=>{
+      b.addEventListener('click', (e)=>{
+        this.copyElementText(b);
+      })
+    })
+  }
+
+  copyElementText(el) {
+    var text = el.getAttribute(this.field);
+    console.log(text)
+    navigator.clipboard.writeText(this.fun(text, el)); 
+  }
+
+  static copyMsg(m) {
+    return('Copied: <code>'+m+'</code>');
+  }
+}
+
+
+// TODO: figure out how to import this vv
+custom_alert_function = function(msg) {
+  var sp = document.createElement('span');
+  sp.innerHTML = msg;
+  document.querySelector('#alerts').appendChild(sp);
+};
+
+
+
+window.addEventListener('load', (e) => {
+  new CopyBtn('button[copy]', 'copy', (t) => {
+    custom_alert_function(CopyBtn.copyMsg(t));
+    return(t);
+  });
+  new CopyBtn('a[copy]', 'copy', (t)=>{
+    var cUrl = new URL(window.location);
+    cUrl.hash = t;
+    custom_alert_function(CopyBtn.copyMsg(cUrl));
+    return(cUrl);
+  });
+});

data/assets/js/bookReader.js

@@ -1,18 +1,24 @@
 class BookReader {
-  constructor (selector = '#reader', getCurrent = true) {
+  constructor (selector = '#reader', getCurrent = true, anchorTag = 'href') {
     this.pNodes = document.querySelectorAll(`${selector} p`);
     this.reader = document.querySelector(selector);
-    this.pSelected = null;
-    this.anchorParagraphs();
-    this.scrollToAnchor();
-    if(getCurrent){
-      this.tackSelectedParagraph();
-    };
+    this.setBookMarkLink();
+    if(this.reader) {
+      this.pSelected = null;
+      this.anchorTag = anchorTag;
+      this.anchorParagraphs();
+      this.scrollToAnchor();
+      if(getCurrent){
+        this.tackSelectedParagraph();
+      };
+    }
   }
 
   tackSelectedParagraph() {
     this.pNodes.forEach((p, i) => {
-      p.addEventListener('click',(e) => this.setCurrent(p));
+      p.addEventListener('click',(e) => {
+        this.setCurrent(p)    
+      });
       p.addEventListener('select',(e) => this.setCurrent(p));
     });
   }
@@ -33,11 +39,13 @@ class BookReader {
 
   anchorParagraphs() {
     var c = 0;
+    var anchorTag = this.anchorTag;
     this.pNodes.forEach(function(p){
       if(p.innerHTML.match('...')) {
         c = c+1;
-        var a = document.createElement('a')
-        a.setAttribute('href', `#p${c}`)
+        var a = document.createElement('a');
+        a.addEventListener('click',(e)=>{BookReader.saveBookMark(c)});
+        a.setAttribute(anchorTag, `#p${c}`)
         a.setAttribute('class', `anchor`)
         p.setAttribute('id', `p${c}`)
         a.innerHTML = String(c)
@@ -54,7 +62,32 @@ class BookReader {
       document.querySelector(hash).scrollIntoView()
     };
   }
+
+  static saveBookMark(id) {
+    var url = new URL(window.location);
+    url.hash = '#p'+String(id);
+    window.localStorage.setItem('bookmark', url.href)
+    custom_alert_function('Saved Bookmark')
+  }
+
+  setBookMarkLink() {
+    var bm = new URL(window.localStorage.getItem('bookmark'));
+    if(bm != undefined) {
+      document.querySelectorAll('[go-to-bookmark]').forEach((b)=>{
+        b.setAttribute('href', bm.href)
+        b.setAttribute('title', 'Bookmark: '+bm.pathname+bm.hash)
+      })
+    }
+  }
 }
+
+// TODO: figure out how to import this vv
+custom_alert_function = function(msg) {
+  var sp = document.createElement('span');
+  sp.innerHTML = msg;
+  document.querySelector('#alerts').appendChild(sp);
+};
+
 window.addEventListener('load', (e) => {
-  new BookReader('#reader', true);
+  new BookReader('#reader', true, 'copy');
 });

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-web-novel
 version: !ruby/object:Gem::Version
-  version: 0.1.8
+  version: 0.2.0
 platform: ruby
 authors:
 - opsaaaaa
 autorequire: 
 bindir: exe
 cert_chain: []
-date: 2022-05-13 00:00:00.000000000 Z
+date: 2022-05-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: webrick
@@ -36,20 +36,20 @@ dependencies:
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '4.2'
+        version: '4.3'
     - - ">="
       - !ruby/object:Gem::Version
-        version: 4.2.1
+        version: 4.3.0
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
     - - "~>"
       - !ruby/object:Gem::Version
-        version: '4.2'
+        version: '4.3'
     - - ">="
       - !ruby/object:Gem::Version
-        version: 4.2.1
+        version: 4.3.0
 - !ruby/object:Gem::Dependency
   name: jekyll
   requirement: !ruby/object:Gem::Requirement
@@ -103,10 +103,11 @@ files:
 - LICENSE.txt
 - README.md
 - _boilerplates/chapter.md
-- _boilerplates/page.md
 - _boilerplates/preview.md
+- _boilerplates/tab.md
 - _boilerplates/volume.md
 - _config.yml
+- _includes/alerts.html
 - _includes/chapter_header.html
 - _includes/chapter_list.html
 - _includes/chapter_nav.html
@@ -124,6 +125,7 @@ files:
 - _layouts/root.html
 - _layouts/volume.html
 - _sass/jekyll-web-novel.sass
+- _sass/web-novel/alerts.sass
 - _sass/web-novel/chapter.sass
 - _sass/web-novel/colors.sass
 - _sass/web-novel/footer.sass
@@ -134,12 +136,11 @@ files:
 - admin/index.html
 - assets/404.html
 - assets/css/style.sass
+- assets/js/CopyBtn.js
 - assets/js/bookReader.js
 - assets/js/forwardNetlifyIdentityToken.js
 - assets/js/scrollNav.js
 - exe/jekyll-web-novel
-- pages/chapters.md
-- pages/home.md
 homepage: https://github.com/opsaaaaa/web_novel_theme
 licenses:
 - MIT

data/pages/chapters.md

@@ -1,9 +0,0 @@
----
-title: Chapters
-layout: page
-permalink: chapters
-start_chapter: 1
----
-
-{% include toc.html %}
-

data/pages/home.md

@@ -1,16 +0,0 @@
----
-title: Web Novel Theme for Jekyll
-permalink: /
-layout: home
-start_chapter: 1
----
-
-# {{ site.novel.title }}
-
-Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Orci porta non pulvinar neque laoreet suspendisse interdum. Ut porttitor leo a diam sollicitudin tempor id eu nisl.  
-{: .big-text}
-
-
-{% assign cht1 = site.chapters | find: 'chapter', page.start_chapter %}
-[Read Now]({{ cht1.url | relative_url}}#reader){: .mega-link}
-