From e2f3477d25ab82faab2427a33b4cbce0f89d1655 Mon Sep 17 00:00:00 2001
From: bihlink <95501288+bihlink@users.noreply.github.com>
Date: Fri, 15 Jul 2022 16:56:39 +0200
Subject: [PATCH] Create templatev3.ejs

---
 lib/templatev3.ejs | 218 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 218 insertions(+)
 create mode 100644 lib/templatev3.ejs

diff --git a/lib/templatev3.ejs b/lib/templatev3.ejs
new file mode 100644
index 0000000..988a6ba
--- /dev/null
+++ b/lib/templatev3.ejs
@@ -0,0 +1,218 @@
+	<style>
+	    @import url("https://maplefeed.bihlink.com/modern-light-min.css");
+	</style>
+  
+  <% if (opts.theme && opts.theme.toLowerCase() == 'modern-light-min'){ %>
+<div class="container-fluid mt-2">
+    <% if (opts.header !== false){ %>
+    <div class="card position-relative">
+      <img src="<%= meta.headerImage %>" class="card-img-top headerimg">
+      <span class="position-absolute top-0 end-0 px-1 bg-danger m-2 follow"><a href="<%= meta.link %>" target="_top">Follow</a></span>
+      <div class="card-body">
+            <a class="header-left" target="_top" href="<%= meta.link %>">
+                <img class="avatar rounded-circle shadow" src="<%= meta.avatar %>"></img>
+            </a>
+        <h4 class="card-title" style="margin-left:120px;"><%= meta.title %></h4>
+        <p class="card-text"><%- meta.description %></p>
+      </div>
+    </div>
+    <% } %>
+  
+  <% var filtered = items.filter(function(item){return !((item.isBoost && !opts.boosts) || (item.isReply && !opts.replies))  })%>
+  <% filtered.forEach(function(item){ %>
+    <div class="card">
+    <% if (item.isBoost) { %>
+    <div class="item-title card-header"><%- item.title %></div>
+    <% } %>
+          <div class="author mb-2 card-header">
+          	<a target="_top" href="<%- item.author.uri %>">
+        	<img class="avatar-item rounded-circle shadow" src="<%- item.author.avatar %>"/>
+            	</a>
+          	<div class="author-info">
+          		<a target="_top" class="author-displayname" href="<%- item.author.uri %>"> <%= item.author.displayName %> </a>
+          		<div class="author-fullname"> <%= item.author.fullName %> <a class="date position-absolute top-0 end-0" href="<%= item.permalink %>"><%= item.stringDate %></a></div>
+          	</div>
+          </div>
+      <div class="card-body">
+            <% if (item.hasCw){ %>
+              <% var cwId = (item.cw+item.atomHref).replace(/\W+/g,'') %>
+              <span class="cw"><%- item.cw %></span>
+              <input type="checkbox" class="showmore" id="<%- cwId %>">
+              <label class="button" for="<%- cwId %>">Show</label>
+            <% } %>
+	    
+        <span class="card-text"><%- item.content %></span>
+	
+	   <% if (item.enclosures.length > 0){ %>
+              <div class="enclosures">
+                <% for (var i = 0; i < item.enclosures.length; i ++){ %>
+                  <% var e = item.enclosures[i] %>
+                  <% if (e.type.indexOf('audio') > -1) {%>
+                    <audio class="enclosure" controls loop src="<%= e.url %>"/>
+                  <% }else if (e.type.indexOf('video') > -1){ %>
+                    <video class="enclosure" controls loop src="<%= e.url %>"/>
+                  <% } else { %>
+                    <a target="_top" class="enclosure" href="<%= e.url %>" >
+                      <% if (e.type.indexOf('image') > -1){ %>
+                        <img src="<%= e.url %>" alt="<%= e.name %>" title="<%= e.name %>"/>
+                      <% } else { %>
+                        <%= e.url %>
+                      <% } %>
+                    </a>
+                  <% } %>
+                <% } %>
+              </div>
+           <% } %>
+	   
+      </div>
+      <% }); %>
+    </div>
+      <% if (nextPageLink){ %>
+      <div class="item hidden">
+        <a class="hacky_link" href="<%- nextPageLink %>">More</a>
+      </div>
+      <% } %>
+</div><!-- container -->
+    
+    <% if ( isIndex ){ %>
+      <script src="/infinite-scroll.js"></script>
+      <script type="text/javascript">
+        var lastPageLoaded = null;
+        var infScroll = new InfiniteScroll( '.container-fluid', {
+          // options
+          hideNav:'.pagination',
+          append: '.card',
+          history:false,
+          prefill:true,
+          path: function(){
+            // need to query this DOM my damn self
+            var pageLinks = document.querySelectorAll('.hacky_link');
+            if (!pageLinks || pageLinks.length == 0){
+              console.log ('next page link could not be found');
+              return false;
+            }else{
+              var finalLink = pageLinks[pageLinks.length-1].href;
+              // make sure we don't load the same page twice
+              if (!finalLink || finalLink == window.location.href || finalLink == lastPageLoaded){
+                console.log('this was the last page');
+                return false;
+              }else{
+                return finalLink;
+              }
+            }
+          }
+        });
+      </script>
+    <% } %>
+<% } else { %>
+<!-- Old theme -->
+    <% if (opts.header !== false){ %>
+      <div class="meta">
+        <div class="header" style="<%= meta.headerImage?`background-image:url(${meta.headerImage})`:'' %>">
+          <a class="header-left" target="_top" href="<%= meta.link %>">
+            <% if (meta.avatar){ %>
+              <img class="avatar circular" src="<%= meta.avatar %>"></img>
+            <% } %>
+          </a>
+          <div class="description header-right">
+            <a class="header-title" target="_top" href="<%= meta.link %>">
+              <%= meta.title %>
+            </a>
+            <br><br>
+            <%- meta.description %>
+          </div>
+        </div>
+      </div>
+    <% } %>
+    <div class="container">
+      <% var filtered = items.filter(function(item){return !((item.isBoost && !opts.boosts) || (item.isReply && !opts.replies))  })%>
+      <% filtered.forEach(function(item){ %>
+          <div class="item">
+            <% if (item.isBoost) { %>
+              <div class="item-title"> <%- item.title %> </div>
+            <% } %>
+      		  <div class="author">
+      		    <a target="_top" class="avatar" href="<%- item.author.uri %>">
+    			      <img class="avatar" src="<%- item.author.avatar %>"/>
+        			</a>
+      			  <div class="author-info">
+      				  <a target="_top" class="author-displayname" href="<%- item.author.uri %>"> <%= item.author.displayName %> </a>
+      				  <div class="author-fullname"> <%= item.author.fullName %> </div>
+      			  </div>
+      		  </div>
+            <% if (item.hasCw){ %>
+              <% var cwId = (item.cw+item.atomHref).replace(/\W+/g,'') %>
+              <span class="cw"><%- item.cw %></span>
+              <input type="checkbox" class="showmore" id="<%- cwId %>">
+              <label class="button" for="<%- cwId %>">Show</label>
+            <% } %>
+            
+            <div class="item-content">
+              <%- item.content %>
+            </div>
+            <% if (item.enclosures.length > 0){ %>
+              <div class="enclosures">
+                <% for (var i = 0; i < item.enclosures.length; i ++){ %>
+                  <% var e = item.enclosures[i] %>
+                  <% if (e.type.indexOf('audio') > -1) {%>
+                    <audio class="enclosure" controls loop src="<%= e.url %>"/>
+                  <% }else if (e.type.indexOf('video') > -1){ %>
+                    <video class="enclosure" controls loop src="<%= e.url %>"/>
+                  <% } else { %>
+                    <a target="_top" class="enclosure" href="<%= e.url %>" >
+                      <% if (e.type.indexOf('image') > -1){ %>
+                        <img src="<%= e.url %>" alt="<%= e.name %>" title="<%= e.name %>"/>
+                      <% } else { %>
+                        <%= e.url %>
+                      <% } %>
+                    </a>
+                  <% } %>
+                <% } %>
+              </div>
+           <% } %>
+          <a class="date" href="<%= item.permalink %>"><%= item.stringDate %></a>
+        </div>
+      <% }); %>
+      <% if (nextPageLink){ %>
+      <div class="item hidden">
+        <a class="hacky_link" href="<%- nextPageLink %>">More</a>
+      </div>
+      <% } %>
+    </div> <!-- end item container -->
+    <% if (nextPageLink){ %>
+    <div class="pagination">
+      <a class="button" href="<%- nextPageLink %>">Load More</a>
+    </div>
+    <% } %>
+    <% if ( isIndex ){ %>
+      <script src="/infinite-scroll.js"></script>
+      <script type="text/javascript">
+        var lastPageLoaded = null;
+        var infScroll = new InfiniteScroll( '.container', {
+          // options
+          hideNav:'.pagination',
+          append: '.item',
+          history:false,
+          prefill:true,
+          path: function(){
+            // need to query this DOM my damn self
+            var pageLinks = document.querySelectorAll('.hacky_link');
+            if (!pageLinks || pageLinks.length == 0){
+              console.log ('next page link could not be found');
+              return false;
+            }else{
+              var finalLink = pageLinks[pageLinks.length-1].href;
+              // make sure we don't load the same page twice
+              if (!finalLink || finalLink == window.location.href || finalLink == lastPageLoaded){
+                console.log('this was the last page');
+                return false;
+              }else{
+                return finalLink;
+              }
+            }
+          }
+        });
+      </script>
+    <% } %>
+ <!-- End Old theme -->
+   <% } %>