rejetto forum

Some mixed ideas - Almost new template....rsrsrsr

ledufe · 26 · 13144

0 Members and 1 Guest are viewing this topic.

Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
well, since there is no big new on the hfs update, i guess that the people are a little slow on template creation, but im here again to post another one, no big news too, but i take the idea of the layout of the HFS-Clean Template, and the floating menu of the A'la damn.to HFS Template and also i got the color of the css of traxxus mod of the clean template, inserted the status and server information of the server copied and translated os the section [not found] on the template of the Internetgnm 2006, and fixed the upload+progress looks more cool now ;) , also update the links inside upload and reinserted the lines to separate the folders and files, and inserted a pop-up server info window.

well, hope you like.
UPDATED july-17-2006 22:54
Code: [Select]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<meta name="generator" content="HFS%version% (+ HFS-Clean[EN] template by Chionsas)" />
<meta name="uptime" content="%uptime%" />
<link rel="shortcut icon" href="/~img_folder" />
<!--  code for popHTMLwith_embed_player from some scratches of a friend of mine Thanks Leandro Cavalheiro!!! -->
<script language="javascript">
function popUp(){
window.open("http://%host%/~progress",null,
    "height=400,width=280,status=no,toolbar=no,menubar=no,location=no");
}
</script>
<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<a name="top">
</a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
<ul>
<li><label title="Go To Root"><a href="http://%host%" class=button><img border=0 align=absbottom src="/~img1"> Home</a></label></li>
<li><label title="Go Up one Folder"><a href="%parent-folder%" id="title" class=button><img border=0 align=absbottom src="/~img8"> %folder%</a></label></li>
<li><label title="▲Top of This Dir▲"><a href="#top" class=button><img border=0 align=absbottom src="/~img32"> Top</a></label></li>
<li><label title="▼Bottom of This Dir▼"><a href="#bottom" class=button><img border=0 align=absbottom src="/~img33"> Bottom</a></label></li>
<li><label title="User Logged Now">%loggedin%</label></li>      
<li><label title="Please Login Here">%login-link%</label></li>            
<li><label title="Click Here To Upload a File">%upload-link%</label></li>  
<li>
<label title="SERVER INFO">
<a href="javascript:popUp();" id="info" class=button><img border=0 align=absbottom src="/~img3"></a></label>
<img src="/~img_graph200x20" style="border:white outset 2px;"></li>      
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- *** END   - the floating layer, make is as fancy as you like *** --->
<script type="text/javascript">
function JSFX_FloatTopLeft()
{
   var startX = 0, startY = 9;
   var ns = (navigator.appName.indexOf("Netscape") != -1);
   var d = document;
   var px = document.layers ? "" : "px";
   function ml(id)
   {
      var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
      if(d.layers)el.style=el;
      el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};
      el.x = startX; el.y = startY;
      return el;
   }
   window.stayTopLeft=function()
   {
      var pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
      var dY = (pY > startY) ? pY : startY;
      ftlObj.y += (dY - ftlObj.y)/8;
      ftlObj.sP(ftlObj.x, ftlObj.y);
      setTimeout("stayTopLeft()", 20);
   }
   ftlObj = ml("divStayTopLeft");
   stayTopLeft();
}
JSFX_FloatTopLeft();
</script>
<!-- ********************************************************* -->
<br>
<br>
<br>
<br>
<div id="heading">
<h1>
<a href="%parent-folder%" id="title">
<img src="/~img14">
 %folder%
</a>
</h1>
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</div>
<div class="grid">
%folder-comment%
%files%
</div>
<!-- generated in %build-time%s -->
<!-- ********************************************************* -->
<a name="bottom">.
</a>
</body>
</html>

[style]
body {font-size: 70%;font-family: Verdana, Arial, Tahoma, sans;margin:0px;background-color: White;color: black;padding: 0px;}
div#divStayTopLeft {position: absolute; left: 0; right: 0px; top: 9px; width: 100%;}
table#menu {background-color:#336699;border:2px;width:100%}
#menu ul {padding:0px;margin:0px;float: left;width: 100%;background-color:#EDEDED;list-style:none;font:80% Tahoma;}
#menu ul li { display: inline; }
#menu ul li a {background-color:#EDEDED;color: #333;text-decoration: none;border-bottom:3px solid #EDEDED;padding: 2px 10px;float:left;}
#menu ul li a:hover {background-color:#D6D6D6;color: #6D6D6D;border-bottom:3px solid #EA0000;}
#filelist {border-collapse: collapse;table-layout: fixed;width:60em; font: bold;}
#filelist td, #filelist th {vertical-align: middle;border-bottom: 1px solid Teal;overflow: hidden;white-space: nowrap; font: bold;}
#filelist th {padding-bottom: 0.2em;padding-top:0.2em;font-size: 1.1em;}#filelist th a {color: black;height:16px; font: bold;}
#filelist th a:hover {text-decoration: underline;color: black; font: bold;}
#filelist { border-collapse: collapse; table-layout: fixed; width:60em; }
#filelist td, #filelist th { vertical-align: middle; border-bottom: 1px solid #EFEFEF; overflow: hidden; white-space: nowrap;}
#filelist th { padding-bottom: 0.2em; padding-top:0.2em; font-size: 1.1em;}
#filelist th { color: #436976; height:1.5em;}
#up { display: block; text-align: left; padding-left: 7px; padding-top: 0.2em; padding-bottom: 0.2em;}
.file { font-weight: bold; padding: 0.3em; font-size: medium; text-indent: 22px; background-repeat: no-repeat; background-position: 1% 50%;}
.filestatus { text-align: center; padding-right: 0.5em;  font: bold;}
.filename { font-weight: bold; font-size:1.1em; color:black;}
.bytes { font-size:7pt; }
.perc { font-size:0.8em; }
.out_bar { width:100px; height:10px; margin-right:5px; float:left; }
.in_bar { height:10px; background:white; color:white;  }
div.body { margin-left:0; margin-right:0; }
#up {display: block;text-align: left;padding-left: 7px;padding-top: 0.2em;padding-bottom: 0.2em;}
#upbtn { font-family: Verdana, Arial, sans; }
.file a, .folder a, .link a {display: block;width: 100%;height: 100%;padding: 0.3em 0.3em;background-repeat: no-repeat;background-position: 1% 50%;text-indent: 22px;font-weight: normal;font-size: medium;}
.file_input { display: block; margin-bottom: 0.4em; font-family: Arial, sans; font-size: 1em; }
.new {color: red;}
.folder a {background-position: 1% 60%; font: bold;}
.file a  span, .folder a span, .link a span {display: block; font: normal bold;}
.filehits {text-align: right;padding-right: 0.5em;}
#heading {padding:1em;background-color: #3366CC}
h1 {font-size:2em;font-weight:bold;font-family: "Trebuchet MS";color: white;padding: 0px;text-align: center}
h1 a {color: white;text-decoration: none;}
a {color: black;text-decoration:none;}
a:hover {color: #FFCC33}
img {border:none;}
.little {font-size: 0.8em;}
.right {text-align: right;}
.center {text-align: center;}
.grid {padding:15px;margin:15px;text-align: center; font: bold;}
.button {float:right;padding:1px;font-weight:bold;background-repeat: no-repeat;background-position: 0% 50%;margin-right: 0.5em;color: grey;}
.error {margin: 2em;text-align: center}
.error_timestamp { float: right; margin-right: 1.5em; margin-top: 0.7em; }
.big {margin: 2em;text-align: center}
.flag{font-weight: bold;font-size:8pt;background: White;color: Red;text-align center;border: 2px double Red;position:absolute;left:10px;}

[login-link]
<div style="float:right; padding:1px;"><a href="%encoded-folder%~login" class=button><img border=0 align=absbottom src="/~img28"> LOGIN</a></div>

[loggedin]
<div style="float:right; padding:1px;"><a><b><class=button><img border=0 align=absbottom src="/~img27"> USER: %user%</a></b></div>

[upload-link]
<div style="float:right; padding:1px;"><a href="%encoded-folder%~upload" class=button><img border=0 align=absbottom src="/~img31"> UPLOAD</a></div>

[up]
<a class=big href="%parent-folder%"><img src="/~img14"> UP</a>

[nofiles]
<div class=big><img src="/~img9">  No Files Here <img src="/~img9"></div>

[files]
<table id="filelist">
<thead>
<tr>
<th style="width:6%; padding:0px;">%up%</th>
<th style="width:51%;"><a href="%encoded-folder%?sort=n">Filename</a></th>
<th style="width:11%"><a href="%encoded-folder%?sort=s">Size</a></th>
<th style="width:23%"><a href="%encoded-folder%?sort=t">Date</a></th>
<th style="9%; text-align:right"><label title="number of times a file has been downloaded">Hits</label></th>
</tr>
</thead>
<tbody>
%list%
</tbody>
</table>
<p class="right" style="width:60em">
<span class="little">%number-folders% folders,  <a href="%encoded-folder%~files.lst">%number-files% files</a> &ndash; %total-size%</span>
</p>

[file]
<tr><td class="file" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_file')"%new%>%item-name%</a></td><td class="right">%item-size%</td><td class="right">%item-modified%</td><td class="filehits">%item-dl-count%</td></tr>

[folder]
<tr><td class="folder" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_folder')"%new%>%item-name%</a></td><td class="center">&ndash;</td><td class="right">%item-modified%</td><td class="filehits">%item-dl-count%</td></tr>
[link]
<tr><td class="link" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_link')"%new%>%item-name%</a></td><td colspan="3" style="padding-left:1em"><i title="%item-url%">%item-url%</i></td></tr>
[comment]
 title="%item-comment%"
[newfile]
 class="new"
[folder-comment]
<div style='background: #FFFFEF; color: black; width: 100%.5em; margin-bottom: 0.8em; padding:0.6em; border:1px solid orange;'>%item-comment%</div>

[error-page]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img11" />
<title>Error</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<div id="heading">
<div class="error_timestamp">%timestamp%</div>
%content%
</body>
</html>

[not found]
<h1>404 - Not found..</h1>
</div>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[overload]
<h1>Server overload</h1>
</div>
<p class="error">
Come back later.
</p>

[max contemp downloads]
<h1>No more downloads alowed</h1>
</div>
<p class="error">
You have reached the limit of maximum contemporary downloads.
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[unauthorized]
<body>
<a name="top"></a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
<ul>
<li><a href="http://%host%" class=button><img border=0 align=absbottom src="/~img1"> Home</a></li>
<li><a href="~login" class=button>
<img border=0 align=absbottom src="/~img28"> LOGIN</a></li>            
<li><img src="/~img3"><img src="/~img_graph200x20" style="border:white outset 2px;"></li>      
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</ul>
</div></td></tr>
</tbody></table>
</div>
<!-- *** END   - the floating layer, make is as fancy as you like *** --->
<script type="text/javascript">
function JSFX_FloatTopLeft()
{
   var startX = 0, startY = 9;
   var ns = (navigator.appName.indexOf("Netscape") != -1);
   var d = document;
   var px = document.layers ? "" : "px";
   function ml(id)
   {
      var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
      if(d.layers)el.style=el;
      el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};
      el.x = startX; el.y = startY;
      return el;
   }
   window.stayTopLeft=function()
   {
      var pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
      var dY = (pY > startY) ? pY : startY;
      ftlObj.y += (dY - ftlObj.y)/8;
      ftlObj.sP(ftlObj.x, ftlObj.y);
      setTimeout("stayTopLeft()", 20);
   }
   ftlObj = ml("divStayTopLeft");
   stayTopLeft();
}
JSFX_FloatTopLeft();
</script>
<!-- ********************************************************* -->
<br><br><br><br>
<h1>Unauthorized</h1>
</div>
<p class="error">
<img border=0 align=absbottom src="/~img25">  You have to be logged in to view this section.  <img border=0 align=absbottom src="/~img25">
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false"><img border=0 align=absbottom src="/~img26"> &laquo; back</a>
</p>

[deny]
<h1>Forbidden</h1>
</div>
<p class="error">
This section is currently forbidden.
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[ban]
<h1>Banned</h1>
</div>
<p class="error">
You have been banned.
</p>
<p class="error">
%reason%
</p>

[upload]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<a name="top"></a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
      <ul>
         <li><a href="http://%host%" class=button target=_parent><img border=0 align=absbottom src="/~img1"> Home</a></li>
         <li><a href="%parent-folder%" id="title" class=button target=_parent><img border=0 align=absbottom src="/~img8"> %folder%</a></li>
         <li><a href="" class=button><img border=0 align=absbottom src="/~img31">%diskfree%  Free</a></li>
         <li><a href="%encoded-folder%" target="_parent" class="button" text-indent: 16px;"><img border=0 align=absbottom src="/~img21">Cancel</a></li>
         <li><a href="%encoded-folder%~upload" class="button" onclick="if(document.getElementById('upbtn').disabled) {return false}" id="progress_btn" >Progress bar</a></li>
         <li>%loggedin%</li>    
                                    <li>%login-link%</li>          
<li><img src="/~img3"><img src="/~img_graph200x20" style="border:white outset 2px;"></li>    
   <script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
      </ul>
   </div></td></tr>
</tbody></table>
</div>
<br><br><br><br>
<div id="heading">
<script type="text/javascript">
 var progress_btn = document.getElementById('progress_btn');
 if (window.parent.progress) {
  progress_btn.target = "_parent";
  progress_btn.innerHTML = "Hide progress bar"
 } else {
  progress_btn.href += "+progress";
  progress_btn.innerHTML = "Show progress bar"
 }
</script>
<h1><a href="%encoded-folder%" target="_parent">%folder%</a></h1>
</div>
<div class="grid">
<form name="frm" action="%encoded-folder%" target="_parent" method="post" enctype="multipart/form-data" onsubmit="document.getElementById('upbtn').disabled=true; document.getElementById('progress_btn').style.color='silver'; window.parent.progress.document.location='/~progress'; return true;">
%upload-files%
<input name="upbtn" id="upbtn" type="submit" value="Upload &raquo;" />
</form>
</div>
</body>
</html>
[upload-file]
<input name="fileupload%idx%" size="70" type="file" class="file_input" />

[upload-results]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<div id="heading">
%loggedin%
<h1><a href="%encoded-folder%">%folder%</a></h1>
</div>
<div class="grid">
<div style='background: #FFFFEF; color: black; width: 59.5em; margin-bottom: 0.8em; padding:0.6em; border:1px solid orange;'>Files uploaded:</div>
<table id="filelist">
<thead>
<tr>
<th style="width:6%; padding:0px;"><a href="%encoded-folder%" id="up"><img src="/~img14" alt="back" title="back" /></a></th>
<th style="width:40%;">Filename</th>
<th style="width:11%">Size</th>
<th style="width:13%">Speed</th>
<th style="30%">Status</th>
</tr>
</thead>
<tbody>
%uploaded-files%
</tbody>
</table>
</div>
</body>
</html>
[upload-success]
<tr><td class="file" colspan="2" style="background-image:url('/~img32'); color:green;">%item-name%</td><td class="right">%item-size%</td><td class="right">%speed% KB/s</td><td class="filestatus" style="color: green; font-weight:bold">OK</td></tr>
[upload-failed]
<tr><td class="file" colspan="2" style="background-image:url('/~img11'); color:red;">%item-name%</td><td class="right">%item-size%</td><td class="right">%speed% KB/s</td><td class="filestatus" style="color: red"><b title="%reason%">%reason%</b></td></tr>
[upload+progress]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/2002/REC-xhtml1-20020801/DTD/xhtml1-frameset.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
</head>
<frameset cols="250,*" frameborder="0">
<frame name="progress" src="/~progress" scrolling="auto" />
<frame src="%encoded-folder%~upload-no-progress" scrolling="auto" />
</frameset>
</html>
[progress]
<html>
<head>
<meta http-equiv="Refresh" content="10;URL=/~progress">
<title>HFS - Progress status</title>
<style>
%style%
.filename { font-weight:bold; font-size:8pt; }
.bytes { font-size:7pt; }
.perc { font-size:14px; vertical-align:middle; }
.out_bar { width:100px; font-size:15px; background:black; border:black 1px solid; margin-right:5px; float:left; }
.in_bar { height:16px; background:white; color:white;  }
div.body { margin-left:0; margin-right:0; }
body { padding:2px; }
</style>
</head>
<body>
<div class=big>Progress status</div>
Auto-refresh: 10 seconds
<br><br><img src="/~img_graph190x40" style="border:white outset 2px;">
<div class=body>
%progress-files%
</div>
<div class=little>Uptime: %uptime%</div>
Server Adress: http://%host% <br><img src="/~img32">
Server Output Speed: %speed-out% KB/s
<br>
Total Downloaded Data: %total-out%
<br>
<img src="/~img33"> Server input Speed: %speed-in% KB/s
<br>
Total Uploaded Data: %total-in%<br>
<img src="/~img5"> Actual Nº Conections: %connections%<br>
<img src="/~img35"> User Loged: %user%<br>
<img src="/~img28"> Number of Connections: %number-addresses% users<br>
<img src="/~img27"> Clients: %number-addresses-downloading% users<br>
<img src="/~img10"> Server Date and Time: %timestamp%<br>
<img src="/~img10"> Server UpTime: %uptime% Hours <br>
<img src="/~img23"> <a href="http://www.rejetto.com/hfs">HFS Verssion %version%</a><br>
</body>
</html>



[progress-nofiles]
No files are being uploaded.
[progress-upload-file]
<div class="filename">%filename%</div>
<div class="bytes">%done-bytes% / %total-bytes% b<br/>%speed-kb% KB/s</div>
<div style="margin-top:0.5em; margin-bottom:1em;">
<div class="out_bar" style="background-color:#278DCF; border: 1px solid #278DCF;"><div class="in_bar" style="width:%perc%px"></div></div><div class="perc">%perc%%</div>
</div>
[progress-download-file]
<div class="filename">%filename%</div>
<div class="bytes">%done-bytes% / %total-bytes% b<br/>%speed-kb% KB/s</div>
<div style="margin-top:0.5em; margin-bottom:1em;">
  <div class="out_bar" style="background-color: #888888; border: 1px solid #888888;"><div class="in_bar" style="width:%perc%px"></div></div><div class="perc">%perc%%</div>
</div>
[newfile]
<div style="float:left; padding:10px;">
<span class=flag>&nbsp;NEW&nbsp;</span>
</div>
<<LeDuFe>>


BowflexMaster

  • Guest
very nice!!!! :D

I am THRILLED with this template!!!!

EDIT: This is by far the best template I've seen in a LONG time... and I've been using HFS for a little more than a year now (and searching for an excellent template the whole time)

The only suggestion I would make to improve it is that when there's a NEW file, that the text "NEW" should be in RED :)


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
Quote from: "BowflexMaster"
very nice!!!! :D

I am THRILLED with this template!!!!


thanks! but... :#)
Quote from: "BowflexMaster"

EDIT: This is by far the best template I've seen in a LONG time... and I've been using HFS for a little more than a year now (and searching for an excellent template the whole time)

im tired to search for a better template (i love all others...) and im trying to learn how to make a good template, and learning it by examining the other templates, and leaning css and mixing the other templates...inserting  some thing good idea of one template and inserting it into another....
Quote from: "BowflexMaster"

The only suggestion I would make to improve it is that when there's a NEW file, that the text "NEW" should be in RED :)


just insert in the template css/style this class section, it was my copy-error mistake, like i said, im mixing, and have missed this class in the css
to get attention over the new added files, if you still want it, do use the updated template of this post and uncomment the line deleting the two slashe ( // )in the begining of the line
Code: [Select]
//.flag{
font-weight:bold;
font-size:8pt;
background:white;
color:red;
text-align:center;
border:1px solid red;
}

or use the defaul that i fixed by examining the HFS_damn_Template_by_brooks.en_2.0beta23.tpl and changed it a little
and dont forget to add the two slash to the one you don´t want to use like this

Code: [Select]
//.flag{
font-weight:bold;
font-size:8pt;
background:#383838;
color:#CCC;
text-align: center;
border:1px solid #CCC
}
<<LeDuFe>>


BowflexMaster

  • Guest
Thank you so much!!! It worked! :D

I just plopped this in the text/css section, and it worked:

//.flag{
font-weight:bold;
font-size:8pt;
background:white;
color:red;
text-align:center;
border:1px solid red;
}

(after taking away the two slashes// of course)

OK, this is now OFFICIALLY the best template :)


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
hi guys, i would like to ask, how can i test the template file to check if it is something compilant (html, xhtml, css, xml...)???

do i have to copy and past every section to test in some tool or site?

and please, help me to make this template better....
<<LeDuFe>>



Offline rejetto

  • Administrator
  • Tireless poster
  • *****
    • Posts: 13510
    • View Profile

Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
hey, just to inform, i am a stupid guy that don´t really know html, or even css, im trying to learn it by copy and change and paste the code, but i really don´t know why is this html or css validation dont work if the page are showed correctly, so i ask, help in here to change this template to make it css and xhtml or html valid....please let me knoew if someone wanna help....
<<LeDuFe>>


Pit

  • Guest
i like this template, but some butons on the top don´t work on internet explorer, but in firefox it works, and this is the second update you make with this template, but you erase the out-dated template and some of visual aids now are missed, exemple, the folder icon now its on the right and the folder is aligned in the center, keep the good work, then after finished your template, do name it and release, and some of the best sites i know, don´t get validated in the validator of the w3....yours are only one of so many others that don´t get validate.

keep the good work, and also keep the thing of CSS change on the fly it was super duper on yours template v11 and 12, yeah! am having a closer look to your work ;-)

and i like it, also i'am a brazillian, but i don´t have the guts to do a try in the html.


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
hi pit, it´s good to know that there are other brazillians that look close to my work, and i will try to do this css change on the fly again, but first let me fix the other problems on the template to start the css thing...
<<LeDuFe>>


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
hi guys just to inform that i updated this template, still trying to improve it.
<<LeDuFe>>


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
another update to this template and with thumbnail code in javascript....
my friend moondog helps on testing it, it is still bug, and the thumbs must be named with tn- on the name of it like this:

somefile.jpg

the thumbnail must be named

tn-somefile.jpg to be showed
but edit the code and it should suit the needs of the most that wanted thumbnail function

Code: [Select]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<meta name="generator" content="HFS%version% (+ HFS-Clean[EN] template by Chionsas)" />
<meta name="uptime" content="%uptime%" />
<link rel="shortcut icon" href="/~img_folder" />
<!--  code for popHTMLwith_embed_player from some scratches of a friend of mine Thanks Leandro Cavalheiro!!! -->
<script language="javascript">
function popUp(){
window.open("http://%host%/~progress",null,
    "height=400,width=280,status=no,toolbar=no,menubar=no,location=no");
}
</script>
<script language="Javascript" type="text/javascript">
<!--
// ----------------------------------
// Block All JavaScript Errors
function blockError(){return true;}
window.onerror = blockError;
// ----------------------------------

isDOM=document.getElementById //DOM1 browser (MSIE 5+, Netscape 6, Opera 5+)
isMSIE=document.all && document.all.item //Microsoft Internet Explorer 4+
isNetscape4=document.layers //Netscape 4.*
isOpera=window.opera //Opera
isOpera5=isOpera && isDOM //Opera 5+
isMSIE5=isDOM && isMSIE && !isOpera //MSIE 5+
isMozilla=isNetscape6=isDOM && !isMSIE && !isOpera

var obj;

function getLayer(layerName){
//  if(isDOM){ return document.getElementById(layerName); }
//  if(isMSIE){ return document.all[layerName]; }
//  if(isNetscape4){ return eval('document.layers[layerName]'); }
//  return false;
return layerName.parentNode.firstChild;

}

function ts(e,what){
  mousex = e.clientX;
  mousey = e.clientY;
  pagexoff = 0;
  pageyoff = 0;
  if(isMSIE5){
    pagexoff = document.body.scrollLeft;
    pageyoff = document.body.scrollTop;
  }
  else{
    pagexoff = window.pageXOffset;
     pageyoff = window.pageYOffset;
  }
  if(getLayer(what)){
    if(isNetscape4)
      obj = getLayer(what);
    else
      obj = getLayer(what).style;
 
  if(obj){
   leftoff = mousex-pagexoff;
    obj.left = (mousex+pagexoff);
 
   topoff = mousey-pageyoff;
    if(isOpera && topoff <= 30)
     obj.top = mousey + 20;
   else
if( mousey <= 30)
       obj.top = (mousey+pageyoff) + 20;
else
     if (isOpera)
       obj.top = mousey + 20;
   else
     obj.top = (mousey+pageyoff) + 20;
   

   if(isNetscape4)
     obj.visibility = 'show';
   else
     obj.visibility = 'visible';
 }
   }
  return true;
}

function tc(){
  if(obj){
    if(isNetscape4)
      obj.visibility = 'hide';
    else
      obj.visibility='hidden';
  }
  return true
}
//-->
</script>

<script language=JavaScript><!--
function Hover(isover) {
 var it = event.srcElement;
 if(it.parentElement.className == 'mout' && it.tagName == 'TD'
 ) {
   it.style.cursor = isover ? 'hand' : 'default';
   it.parentElement.style.backgroundColor = isover ? '#1E1E1E' : '';
   if (event.type == 'click') location.href = it.parentElement.getAttribute('href');
   }
 }
// --></script>

<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body onMouseOver="Hover(true)" onMouseOut="Hover(false)" onClick="Hover(true)">
<a name="top">
</a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
<ul>
<li><label title="Go To Root"><a href="http://%host%" class=button><img border=0 align=absbottom src="/~img1"> Home</a></label></li>
<li><label title="Go Up one Folder"><a href="%parent-folder%" id="title" class=button><img border=0 align=absbottom src="/~img8"> %folder%</a></label></li>
<li><label title="▲Top of This Dir▲"><a href="#top" class=button><img border=0 align=absbottom src="/~img32"> Top</a></label></li>
<li><label title="▼Bottom of This Dir▼"><a href="#bottom" class=button><img border=0 align=absbottom src="/~img33"> Bottom</a></label></li>
<li><label title="User Logged Now">%loggedin%</label></li>      
<li><label title="Please Login Here">%login-link%</label></li>            
<li><label title="Click Here To Upload a File">%upload-link%</label></li>  
<li>
<label title="SERVER INFO">
<a href="javascript:popUp();" id="info" class=button><img border=0 align=absbottom src="/~img3"></a></label>
<img src="/~img_graph200x20" style="border:white outset 2px;"></li>      
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</ul>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- *** END   - the floating layer, make is as fancy as you like *** --->
<script type="text/javascript">
function JSFX_FloatTopLeft()
{
   var startX = 0, startY = 9;
   var ns = (navigator.appName.indexOf("Netscape") != -1);
   var d = document;
   var px = document.layers ? "" : "px";
   function ml(id)
   {
      var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
      if(d.layers)el.style=el;
      el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};
      el.x = startX; el.y = startY;
      return el;
   }
   window.stayTopLeft=function()
   {
      var pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
      var dY = (pY > startY) ? pY : startY;
      ftlObj.y += (dY - ftlObj.y)/8;
      ftlObj.sP(ftlObj.x, ftlObj.y);
      setTimeout("stayTopLeft()", 20);
   }
   ftlObj = ml("divStayTopLeft");
   stayTopLeft();
}
JSFX_FloatTopLeft();
</script>
<!-- ********************************************************* -->
<br>
<br>
<br>
<br>
<div id="heading">
<h1>
<a href="%parent-folder%" id="title">
<img src="/~img14">
 %folder%
</a>
</h1>
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</div>
<div class="grid">
%folder-comment%
%files%
</div>
<!-- generated in %build-time%s -->
<!-- ********************************************************* -->
<a name="bottom">.
</a>
</body>
</html>

[style]
body {font-size: 70%;font-family: Verdana, Arial, Tahoma, sans;margin:0px;background-color: White;color: black;padding: 0px;}
div#divStayTopLeft {position: absolute; left: 0; right: 0px; top: 9px; width: 100%;}
table#menu {background-color:#336699;border:2px;width:100%}
#menu ul {padding:0px;margin:0px;float: left;width: 100%;background-color:#EDEDED;list-style:none;font:80% Tahoma;}
#menu ul li { display: inline; }
#menu ul li a {background-color:#EDEDED;color: #333;text-decoration: none;border-bottom:3px solid #EDEDED;padding: 2px 10px;float:left;}
#menu ul li a:hover {background-color:#D6D6D6;color: #6D6D6D;border-bottom:3px solid #EA0000;}
#filelist {border-collapse: collapse;table-layout: fixed;width:60em; font: bold;}
#filelist td, #filelist th {vertical-align: middle;border-bottom: 1px solid Teal;overflow: hidden;white-space: nowrap; font: bold;}
#filelist th {padding-bottom: 0.2em;padding-top:0.2em;font-size: 1.1em;}#filelist th a {color: black;height:16px; font: bold;}
#filelist th a:hover {text-decoration: underline;color: black; font: bold;}
#filelist { border-collapse: collapse; table-layout: fixed; width:60em; }
#filelist td, #filelist th { vertical-align: middle; border-bottom: 1px solid #EFEFEF; overflow: hidden; white-space: nowrap;}
#filelist th { padding-bottom: 0.2em; padding-top:0.2em; font-size: 1.1em;}
#filelist th { color: #436976; height:1.5em;}
#up { display: block; text-align: left; padding-left: 7px; padding-top: 0.2em; padding-bottom: 0.2em;}
.file { font-weight: bold; padding: 0.3em; font-size: medium; text-indent: 22px; background-repeat: no-repeat; background-position: 1% 50%;}
.filestatus { text-align: center; padding-right: 0.5em;  font: bold;}
.filename { font-weight: bold; font-size:1.1em; color:black;}
.bytes { font-size:7pt; }
.perc { font-size:0.8em; }
.out_bar { width:100px; height:10px; margin-right:5px; float:left; }
.in_bar { height:10px; background:white; color:white;  }
div.body { margin-left:0; margin-right:0; }
#up {display: block;text-align: left;padding-left: 7px;padding-top: 0.2em;padding-bottom: 0.2em;}
#upbtn { font-family: Verdana, Arial, sans; }
.file a, .folder a, .link a {display: block;width: 100%;height: 100%;padding: 0.3em 0.3em;background-repeat: no-repeat;background-position: 1% 50%;text-indent: 22px;font-weight: normal;font-size: medium;}
.file_input { display: block; margin-bottom: 0.4em; font-family: Arial, sans; font-size: 1em; }
.new {color: red;}
.folder a {background-position: 1% 60%; font: bold;}
.file a  span, .folder a span, .link a span {display: block; font: normal bold;}
.filehits {text-align: right;padding-right: 0.5em;}
#heading {padding:1em;background-color: #3366CC}
h1 {font-size:2em;font-weight:bold;font-family: "Trebuchet MS";color: white;padding: 0px;text-align: center}
h1 a {color: white;text-decoration: none;}
a {color: black;text-decoration:none;}
a:hover {color: #FFCC33;  font-weight: bold; }
img {border:none;}
.little {font-size: 0.8em;}
.right {text-align: right;}
.center {text-align: center;}
.grid {padding:15px;margin:15px;text-align: center; font: bold;}
.button {float:right;padding:1px;font-weight:bold;background-repeat: no-repeat;background-position: 0% 50%;margin-right: 0.5em;color: grey;}
.error {margin: 2em;text-align: center}
.error_timestamp { float: right; margin-right: 1.5em; margin-top: 0.7em; }
.big {margin: 2em;text-align: center}
.flag{font-weight: bold;font-size:8pt;background: White;color: Red;text-align center;border: 2px double Red;position:absolute;left:10px;}
footer#menu {background-color:#336699;border:2px;width:100%}
.TD-thumb{COLOR:#FF9933;FONT-SIZE:9pt;FONT-FAMILY:Tahoma,Arial,"MS Sans Serif",sans-serif;TEXT-ALIGN:center}
#bb{border:1px solid #000}
.img_prop{font-size:11px;font-family:verdana,sans-serif;border:1px solid green;text-align:left;padding:3px;position:absolute;z-index:999;visibility:hidden;color:#CCC;top:20px;left:90px;background-color:#FFFFFF;width:195px}
.tipline{padding:5px;display:block;border-bottom:#BFBFBF 2px solid;background-color:#383838}

[login-link]
<div style="float:right; padding:1px;"><a href="%encoded-folder%~login" class=button><img border=0 align=absbottom src="/~img28"> LOGIN</a></div>

[loggedin]
<div style="float:right; padding:1px;"><a><b><class=button><img border=0 align=absbottom src="/~img27"> USER: %user%</a></b></div>

[upload-link]
<div style="float:right; padding:1px;"><a href="%encoded-folder%~upload" class=button><img border=0 align=absbottom src="/~img31"> UPLOAD</a></div>

[up]
<a class=big href="%parent-folder%"><img src="/~img14"> UP</a>

[nofiles]
<div class=big><img src="/~img9">  No Files Here <img src="/~img9"></div>

[files]
<table id="filelist">
<thead>
<tr>
<th style="width:6%; padding:0px;">%up%</th>
<th style="width:51%;"><a href="%encoded-folder%?sort=n">Filename</a></th>
<th style="width:11%"><a href="%encoded-folder%?sort=s">Size</a></th>
<th style="width:23%"><a href="%encoded-folder%?sort=t">Date</a></th>
<th style="9%; text-align:right"><label title="number of times a file has been downloaded">Hits</label></th>
</tr>
</thead>
<tbody>
%list%
</tbody>
</table>
<p class="right" style="width:60em">
<span class="little">%number-folders% folders,  <a href="%encoded-folder%~files.lst">%number-files% files</a> &ndash; %total-size%</span>
</p>

[file]
<tr><td class="file" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_file')"%new%>%item-name%</a></td><td class="right">%item-size%</td><td class="right">%item-modified%</td><td class="filehits">%item-dl-count%</td></tr>

[file.jpg]
<tr>
<td class="file" colspan="2">
<a href="%item-url%"%comment% style="background-image:url('/~img_file')"%new%>
%item-name%
</a>
<TABLE>
    <TR>
      <TD class="TD-thumb"><div id="com_ment" class=img_prop style='left: 200px; top: 100px;'>
            <table>
              <tr>
                <td> <strong><img align=top src="tn-%item-url%" alt="Missing Thumbnail of %item-name%"></strong> </td>
              </tr>
            </table>
        </div>
      <img onmousemove="ts(event,this)" onmouseout="tc()" src="/~img10" alt="Thumbnail" border="0"></TD>
    </TR>
</TABLE>
</td><td class="right">
%item-size%
</td>
<td class="right">
%item-modified%
</td>
<td class="filehits">
%item-dl-count%
</td>
</tr>


[folder]
<tr><td class="folder" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_folder')"%new%>%item-name%</a></td><td class="center">&ndash;</td><td class="right">%item-modified%</td><td class="filehits">%item-dl-count%</td></tr>
[link]
<tr><td class="link" colspan="2"><a href="%item-url%"%comment% style="background-image:url('/~img_link')"%new%>%item-name%</a></td><td colspan="3" style="padding-left:1em"><i title="%item-url%">%item-url%</i></td></tr>
[comment]
 title="%item-comment%"
[newfile]
 class="new"
[folder-comment]
<div style='background: #FFFFEF; color: black; width: 100%.5em; margin-bottom: 0.8em; padding:0.6em; border:1px solid orange;'>%item-comment%</div>

[error-page]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img11" />
<title>Error</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<div id="heading">
<div class="error_timestamp">%timestamp%</div>
%content%
</body>
</html>

[not found]
<h1>404 - Not found..</h1>
</div>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[overload]
<h1>Server overload</h1>
</div>
<p class="error">
Come back later.
</p>

[max contemp downloads]
<h1>No more downloads alowed</h1>
</div>
<p class="error">
You have reached the limit of maximum contemporary downloads.
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[unauthorized]
<body>
<a name="top"></a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
<ul>
<li><a href="http://%host%" class=button><img border=0 align=absbottom src="/~img1"> Home</a></li>
<li><a href="~login" class=button>
<img border=0 align=absbottom src="/~img28"> LOGIN</a></li>            
<li><img src="/~img3"><img src="/~img_graph200x20" style="border:white outset 2px;"></li>      
<script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
</ul>
</div></td></tr>
</tbody></table>
</div>
<!-- *** END   - the floating layer, make is as fancy as you like *** --->
<script type="text/javascript">
function JSFX_FloatTopLeft()
{
   var startX = 0, startY = 9;
   var ns = (navigator.appName.indexOf("Netscape") != -1);
   var d = document;
   var px = document.layers ? "" : "px";
   function ml(id)
   {
      var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
      if(d.layers)el.style=el;
      el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};
      el.x = startX; el.y = startY;
      return el;
   }
   window.stayTopLeft=function()
   {
      var pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
      var dY = (pY > startY) ? pY : startY;
      ftlObj.y += (dY - ftlObj.y)/8;
      ftlObj.sP(ftlObj.x, ftlObj.y);
      setTimeout("stayTopLeft()", 20);
   }
   ftlObj = ml("divStayTopLeft");
   stayTopLeft();
}
JSFX_FloatTopLeft();
</script>
<!-- ********************************************************* -->
<br><br><br><br>
<h1>Unauthorized</h1>
</div>
<p class="error">
<img border=0 align=absbottom src="/~img25">  You have to be logged in to view this section.  <img border=0 align=absbottom src="/~img25">
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false"><img border=0 align=absbottom src="/~img26"> &laquo; back</a>
</p>

[deny]
<h1>Forbidden</h1>
</div>
<p class="error">
This section is currently forbidden.
</p>
<p class="error">
<a href="/" onclick="history.go(-1); return false">&laquo; back</a>
</p>

[ban]
<h1>Banned</h1>
</div>
<p class="error">
You have been banned.
</p>
<p class="error">
%reason%
</p>

[upload]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<a name="top"></a>
<div id="divStayTopLeft">
<table id="menu">
<tbody>
<tr>
<td align="center">
<div id="menu">
      <ul>
         <li><a href="http://%host%" class=button target=_parent><img border=0 align=absbottom src="/~img1"> Home</a></li>
         <li><a href="%parent-folder%" id="title" class=button target=_parent><img border=0 align=absbottom src="/~img8"> %folder%</a></li>
         <li><a href="" class=button><img border=0 align=absbottom src="/~img31">%diskfree%  Free</a></li>
         <li><a href="%encoded-folder%" target="_parent" class="button" text-indent: 16px;"><img border=0 align=absbottom src="/~img21">Cancel</a></li>
         <li><a href="%encoded-folder%~upload" class="button" onclick="if(document.getElementById('upbtn').disabled) {return false}" id="progress_btn" >Progress bar</a></li>
         <li>%loggedin%</li>    
                                    <li>%login-link%</li>          
<li><img src="/~img3"><img src="/~img_graph200x20" style="border:white outset 2px;"></li>    
   <script type="text/javascript">
 if ("%folder%" == "/") {
 document.getElementById('title').innerHTML = "%host%";
 document.title = "%host%";
}
</script>
      </ul>
   </div></td></tr>
</tbody></table>
</div>
<br><br><br><br>
<div id="heading">
<script type="text/javascript">
 var progress_btn = document.getElementById('progress_btn');
 if (window.parent.progress) {
  progress_btn.target = "_parent";
  progress_btn.innerHTML = "Hide progress bar"
 } else {
  progress_btn.href += "+progress";
  progress_btn.innerHTML = "Show progress bar"
 }
</script>
<h1><a href="%encoded-folder%" target="_parent">%folder%</a></h1>
</div>
<div class="grid">
<form name="frm" action="%encoded-folder%" target="_parent" method="post" enctype="multipart/form-data" onsubmit="document.getElementById('upbtn').disabled=true; document.getElementById('progress_btn').style.color='silver'; window.parent.progress.document.location='/~progress'; return true;">
%upload-files%
<input name="upbtn" id="upbtn" type="submit" value="Upload &raquo;" />
</form>
</div>
</body>
</html>
[upload-file]
<input name="fileupload%idx%" size="70" type="file" class="file_input" />

[upload-results]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
<style type="text/css">
%style%
</style>
</head>
<body>
<div id="heading">
%loggedin%
<h1><a href="%encoded-folder%">%folder%</a></h1>
</div>
<div class="grid">
<div style='background: #FFFFEF; color: black; width: 59.5em; margin-bottom: 0.8em; padding:0.6em; border:1px solid orange;'>Files uploaded:</div>
<table id="filelist">
<thead>
<tr>
<th style="width:6%; padding:0px;"><a href="%encoded-folder%" id="up"><img src="/~img14" alt="back" title="back" /></a></th>
<th style="width:40%;">Filename</th>
<th style="width:11%">Size</th>
<th style="width:13%">Speed</th>
<th style="30%">Status</th>
</tr>
</thead>
<tbody>
%uploaded-files%
</tbody>
</table>
</div>
</body>
</html>
[upload-success]
<tr><td class="file" colspan="2" style="background-image:url('/~img32'); color:green;">%item-name%</td><td class="right">%item-size%</td><td class="right">%speed% KB/s</td><td class="filestatus" style="color: green; font-weight:bold">OK</td></tr>
[upload-failed]
<tr><td class="file" colspan="2" style="background-image:url('/~img11'); color:red;">%item-name%</td><td class="right">%item-size%</td><td class="right">%speed% KB/s</td><td class="filestatus" style="color: red"><b title="%reason%">%reason%</b></td></tr>
[upload+progress]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/2002/REC-xhtml1-20020801/DTD/xhtml1-frameset.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
<meta name="robots" content="noindex,nofollow" />
<link rel="shortcut icon" href="/~img_folder" />
<title>%folder%</title>
</head>
<frameset cols="250,*" frameborder="0">
<frame name="progress" src="/~progress" scrolling="auto" />
<frame src="%encoded-folder%~upload-no-progress" scrolling="auto" />
</frameset>
</html>
[progress]
<html>
<head>
<meta http-equiv="Refresh" content="10;URL=/~progress">
<title>HFS - Progress status</title>
<style>
%style%
.filename { font-weight:bold; font-size:8pt; }
.bytes { font-size:7pt; }
.perc { font-size:14px; vertical-align:middle; }
.out_bar { width:100px; font-size:15px; background:black; border:black 1px solid; margin-right:5px; float:left; }
.in_bar { height:16px; background:white; color:white;  }
div.body { margin-left:0; margin-right:0; }
body { padding:2px; }
</style>
</head>
<body>
<div class=big>Progress status</div>
Auto-refresh: 10 seconds
<br><br><img src="/~img_graph190x40" style="border:white outset 2px;">
<div class=body>
%progress-files%
</div>
<div class=little>Uptime: %uptime%</div>
Server Adress: http://%host% <br><img src="/~img32">
Server Output Speed: %speed-out% KB/s
<br>
Total Downloaded Data: %total-out%
<br>
<img src="/~img33"> Server input Speed: %speed-in% KB/s
<br>
Total Uploaded Data: %total-in%<br>
<img src="/~img5"> Actual Nº Conections: %connections%<br>
<img src="/~img35"> User Loged: %user%<br>
<img src="/~img28"> Number of Connections: %number-addresses% users<br>
<img src="/~img27"> Clients: %number-addresses-downloading% users<br>
<img src="/~img10"> Server Date and Time: %timestamp%<br>
<img src="/~img10"> Server UpTime: %uptime% Hours <br>
<img src="/~img23"> <a href="http://www.rejetto.com/hfs" target=_new>HFS Verssion %version%</a><br>
</body>
</html>



[progress-nofiles]
No files are being uploaded.
[progress-upload-file]
<div class="filename">%filename%</div>
<div class="bytes">%done-bytes% / %total-bytes% b<br/>%speed-kb% KB/s</div>
<div style="margin-top:0.5em; margin-bottom:1em;">
<div class="out_bar" style="background-color:#278DCF; border: 1px solid #278DCF;"><div class="in_bar" style="width:%perc%px"></div></div><div class="perc">%perc%%</div>
</div>
[progress-download-file]
<div class="filename">%filename%</div>
<div class="bytes">%done-bytes% / %total-bytes% b<br/>%speed-kb% KB/s</div>
<div style="margin-top:0.5em; margin-bottom:1em;">
  <div class="out_bar" style="background-color: #888888; border: 1px solid #888888;"><div class="in_bar" style="width:%perc%px"></div></div><div class="perc">%perc%%</div>
</div>
[newfile]
<div style="float:left; padding:10px;">
<span class=flag>&nbsp;NEW&nbsp;</span>
</div>


by the way, if anyone want to try it this link points to my server test area, see the thumbnail function

http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/

bye...
<<LeDuFe>>


Offline maverick

  • Tireless poster
  • ****
    • Posts: 1052
  • Computer Solutions
    • View Profile
Well it looks like you have no thumbnails available as they don't show.

It's a nice effort creating new templates.  But be advised that you are using to much javascript.  That's not good.  Not to many security conscience people travel the internet with javascript enabled.  

Try and create templates without the need for javascript.  Your site would be more user friendly and available to all.
maverick


Offline ledufe

  • Tireless poster
  • ****
    • Posts: 272
  • LEandro DUpont FErreira
    • View Profile
    • http://ledufe.no-ip.info:2222
Quote from: "maverick"
Well it looks like you have no thumbnails available as they don't show.


i didnt understand what you mean in the comment above
Quote from: "maverick"

It's a nice effort creating new templates.  But be advised that you are using to much javascript. That's not good. Not to many security conscience people travel the internet with javascript enabled.


Try and create templates without the need for javascript.  Your site would be more user friendly and available to all.


ok, i will try to do a new one without javascript, but this only another test, and i would not use javascript if the hfs support any dynamic language like asp or php....
<<LeDuFe>>


homeuser

  • Guest
i like it
even with javascript, but i dont get the idea of the thumbnails, could it work if the thumbs are inside a dir named thumbs on the same dir of the images or can you prevent the thumbs.jpg to list on the file list and still show then if it exist