rejetto forum
Software => HFS ~ HTTP File Server => HTML & templates => Topic started by: ledufe on July 03, 2006, 06:28:43 PM
-
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
<!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> – %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">–</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">« 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">« 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"> « 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">« 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 »" />
</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> NEW </span>
</div>
-
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 :)
-
very nice!!!! :D
I am THRILLED with this template!!!!
thanks! but... :#)
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....
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
//.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
//.flag{
font-weight:bold;
font-size:8pt;
background:#383838;
color:#CCC;
text-align: center;
border:1px solid #CCC
}
-
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 :)
-
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....
-
On this Site you can test/verificate your page:
http://validator.w3.org/
-
i fear you should test every possible generated page...
-
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....
-
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.
-
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...
-
hi guys just to inform that i updated this template, still trying to improve it.
-
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
<!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> – %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">–</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">« 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">« 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"> « 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">« 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 »" />
</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> NEW </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...
-
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.
-
Well it looks like you have no thumbnails available as they don't show.
i didnt understand what you mean in the comment above
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....
-
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
-
Well it looks like you have no thumbnails available as they don't show.
i didnt understand what you mean in the comment above
I see NO thumbnails on the page.
-
well i guess that you did not undestand the script it self, on this link there is 3 images, and exist only 2 thumbnails
these are the files:
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/Alegria.jpg
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/Amigo.jpg
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/Azul.jpg
and these are the thumbnails:
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/tn-Alegria.jpg
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/tn-Amigo.jpg
since there is no thumbnail to the file azul.jpg it shows the message:
missing thumbnail of the FILENAME.JPG
i made this intentionally just to test the function, and it works as it should be, i can´t see the error that you mentioned, i've just visited the link and it shows the thumbnails where are availiable.
http://ledufe.no-ip.info:2222/Test/test-load-thumbnail-if-exist/
-
I didn't look at the script. There are no thumbnails shown on the page as I said before. I see you have to hover your mouse over an information icon to see it. You should have mentioned that.
-
ops sorry, i did not undestand what you mean when you said that "there are no thumbnail on the page", and you are right, i should have mentioned it, but what about this way to show the thumbs? anyone like it? or is too much javascript to everyone?
-
hey ledufe, i like your template, it is the more beauty and the more usable than every other, and about the javascript use, i don´t mind it, as a matter of fact, i love it and like so much the float tool bar, and why this template isn´t on the topic of share templates, and the major error, there is no screenshots of it, if i didn´t imported it to my hfs and test it, i would not know that this one is the best template ever made until now....
please, moderator or ledufe, post it on the share section...
-
thanks
im a little out of time these weeks, so i only give a few quick look at the forum, and i was busy re-instaling the stuffs on my pc, but the situation tends to be normal in the next few days, and when it become more light and normal, i will put this template with the 2 new versions with and without the javascript(more limited of course) but i hope it makes everybody happy...
and its not my template or the best template, it is a join/cut/slice/split/re-join of stuffs i found on the other templates, it is not "mine", but im glad you like it...
-
With this code all thumbs must be in the same dir as the pics... had the code all fixed up but got a differnt pc and its on my dvd cd so i can realy do nothing lol
-
my code was all done for it so u just have to click the thumb nail and cleanned it here is my code
[file.jpg]
<tr>
<td class="file" colspan="2">
<a href="%item-url%"%comment% >
</a>
<TABLE>
<TR>
<TD class="TD-thumb"><div id="com_ment" class=img_prop style='left: 200px; top: 100px;'>
<table>
<tr>
<td> <strong><img src='thumb/tn-%item-url%'><img align=top src=".jpg %item-url%" alt=" %item-name%"></strong> </td>
</tr>
</table>
</div>
</TD>
</TR>
</TABLE>
</td><td class="right">
%item-size%
</td>
<td class="right">
%item-modified%
</td>
<td class="filehits">
%item-dl-count%
</td>
thumbs have to be in a thumb folder were ever the pics are and must be named tr-??.jpg if some knows how to make it so u can click the thumb nail and link to the full pic plz let me know
-
do u mean like for every pic i would have to type in a code...
[file.jpg]
<tr>
<td class="file" colspan="2">
<a href="%item-url%"%comment% >
</a>
<TABLE>
<TR>
<TD class="TD-thumb"><div id="com_ment" class=img_prop style='left: 200px; top: 100px;'>
<table>
<tr>
<td> <strong><img src='thumb/%item-url%'><img align=top src=".jpg %item-url%" alt=" %item-name%"></strong> </td>
</tr>
</table>
</div>
</TD>
</TR>
</TABLE>
</td><td class="right">
%item-size%
</td>
<td class="right">
%item-modified%
</td>
<td class="filehits">
%item-dl-count%
</td>
</tr>
my new code just how I wanted it well kinda
-
do u mean like for every pic i would have to type in a code...
Yes, that's what I mentioned above. "Each thumbnail has to have it's own html".
-
i have programs to do that this way is fast and easy