rejetto forum

Software => HFS ~ HTTP File Server => HTML & templates => Topic started by: D on September 11, 2021, 09:36:48 PM

Title: Custom folder previews
Post by: D on September 11, 2021, 09:36:48 PM
Let's say I have following folders

New folder
New folder 2
New folder 3

Each contains a "p.jpg", I want to use these as folder preview.

The code for diff template I'm currently using:
Code: [Select]
[+]
<script>
var list=document.querySelectorAll("table#files>tbody>tr");
function changepic(a1)
{
  var alink=a1.querySelector("a");
  var adress=alink.getAttribute("href");
  if(adress.endsWith("/"))
  {
  adress+="p.jpg";
  var img=document.createElement("img");
  img.setAttribute("src",adress);
  img.setAttribute("onerror","this.style.display='none'");
  a1.children[3].appendChild(img);
  }
}
list.forEach(changepic);
</script>
eats too much cpu if there are too many folders. Because script doesn't check if p.jpg is actually present in folder

How can I fix it? Thanks in advance.
Title: Re: Custom folder previews
Post by: D on September 14, 2021, 04:48:30 PM
Okay, variant with images behind buttons:
Code: [Select]
[+]
<script>
var list=document.querySelectorAll("table#files>tbody>tr");
function changepic(a1)
{
  var alink=a1.querySelector("a");
  var adress=alink.getAttribute("href");
  if(adress.endsWith("/"))
  {
  adress+="p.jpg";
  var button=document.createElement("button");
  button.setAttribute("onclick","showPreview(this)");
  button.setAttribute("link",adress);
  button.setAttribute("type","button");
  a1.children[3].setAttribute("style","text-align:center");
  a1.children[3].appendChild(button);
  button.appendChild(document.createTextNode("Preview"));
  } 
}
list.forEach(changepic);
function showPreview(butt)
{
  butt.setAttribute("style","display:none");
  var par=butt.parentElement;
  var img=document.createElement("img");
  img.setAttribute("src",butt.getAttribute("link"));
  par.appendChild(img);
}
</script>
Title: Re: Custom folder previews
Post by: dj on September 15, 2021, 07:41:42 AM
for hfs2.4

Code: [Select]
[+]
<script>
function folderth(){
 [...document.querySelectorAll('#files a[href$="/"]')].forEach(item =>
 item.insertAdjacentHTML('afterend', '<img loading=lazy height=128 src='+item.href+'folder.jpg>')  //p.jpg
 )
}

if(!document.querySelector('main')) folderth()  //hfs2.4
else document.addEventListener('render', folderth)  //mobil-light_V5.6
</script>
Title: Re: Custom folder previews
Post by: D on September 15, 2021, 10:07:34 AM
for hfs2.4
Thanks. How can I move these images into Hits column?
Title: Re: Custom folder previews
Post by: D on October 28, 2021, 06:31:11 AM
The question is still relevant, can someone help, please?
Title: Re: Custom folder previews
Post by: Owais Baloch on November 25, 2021, 05:59:17 AM
Thanks. How can I move these images into Hits column?

[folder]
<div class="item folder {.if not|{.or|{.get|can archive.}|{.get|can delete.}.}| off .}"
    item-access="{.if|{.get|can access.}| You can access this item! | This item is protected. .}"
    item-added="%item-added%"
    item-dl-count="%item-dl-count%"
    item-comment="{.replace|>| &gt; |<| &lt; |"|"|%item-comment%.}">
   <a href="%item-url%" title="Click to Enter">

      <p align="center">

      <img src="%item-url%folder.png" style="width:256px;height:258px"/>
      </p>


      {.if|{.get|is new.}|<img class="new" src="/template/{.!theme.}/images/new.png" alt=""/>.}
   </a>
      <div><a href="%item-url%" title="Click to Enter"># %item-name% #</a>
<address>
&nbsp; </address>


   <address>Hit Count:<font color="#00bcd4"><b> %item-dl-count%  </b></font></address>


   Added: <span>
<font color="#FFF"><b> %item-modified% </b></font></span>


</div>
</div>

Title: Re: Custom folder previews
Post by: Owais Baloch on November 25, 2021, 06:00:30 AM
The question is still relevant, can someone help, please?

https://rejetto.com/forum/index.php?topic=13485.0 (https://rejetto.com/forum/index.php?topic=13485.0)