Compare commits
22 Commits
Author | SHA1 | Date | |
---|---|---|---|
|
0f681930b3 | ||
|
5db74d054f | ||
|
2e179df6e5 | ||
|
8aed077297 | ||
|
89fd74c4ab | ||
|
5708b2e38e | ||
|
2407cd50ce | ||
|
fbcb8cb5e8 | ||
|
d822eb63e2 | ||
|
5245b131b8 | ||
|
0293d54789 | ||
|
0d4edcb047 | ||
|
a339814582 | ||
|
8eac4ca133 | ||
|
e4646734f2 | ||
|
e54abe08ca | ||
|
faaddd8d60 | ||
|
d599425452 | ||
|
3e6197d2fc | ||
|
ecf93da505 | ||
|
e91a127771 | ||
|
b8fba3ac8e |
2
.gitignore
vendored
@@ -2,7 +2,7 @@
|
||||
# Build folders to ignore
|
||||
bin
|
||||
build
|
||||
#target
|
||||
target
|
||||
|
||||
build.local.*
|
||||
|
||||
|
19
LICENSE.txt
Normal file
@@ -0,0 +1,19 @@
|
||||
Copyright (c) 2011 Lars Jung, http://larsjung.de
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
the Software without restriction, including without limitation the rights to
|
||||
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
|
||||
of the Software, and to permit persons to whom the Software is furnished to do
|
||||
so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
131
README.md
@@ -1,43 +1,13 @@
|
||||
# h5ai v0.5.2   ·   a beautified Apache index
|
||||
# h5ai v0.12   ·   a beautified Apache index
|
||||
|
||||
h5ai tries to make browsing files on a Apache HTTP server more comfortable. It makes use of the
|
||||
built-in autoindex module of Apache and adds styles and functionality to the page generated by
|
||||
this module.
|
||||
For installation instructions and documentation have a look at the [project page](http://larsjung.de/h5ai).
|
||||
There is also a [sample folder](http://larsjung.de/h5ai/sample).
|
||||
|
||||
## Screenshots
|
||||
|
||||
<a href="http://github.com/lrsjng/h5ai/raw/master/resources/h5ai-v0.4-details.png" target="_blank">
|
||||
<img src="http://github.com/lrsjng/h5ai/raw/master/resources/h5ai-v0.4-details.png" width="400px" alt="screenshot" title="screenshot" style="display: inline" />
|
||||
</a>
|
||||
     
|
||||
<a href="http://github.com/lrsjng/h5ai/raw/master/resources/h5ai-v0.4-icons.png" target="_blank">
|
||||
<img src="http://github.com/lrsjng/h5ai/raw/master/resources/h5ai-v0.4-icons.png" width="400px" alt="screenshot" title="screenshot" style="display: inline" />
|
||||
</a>
|
||||
|
||||
|
||||
## Live example
|
||||
|
||||
View a [sample folder](http://larsjung.de/h5ai/sample)
|
||||
*(the files are all empty to save webspace)*
|
||||
|
||||
|
||||
## Install
|
||||
|
||||
Everything you need is located in folder `target`.
|
||||
|
||||
* Copy folder `h5ai` to the web-root directory of your server or alternativly set an alias `/h5ai/` to
|
||||
this folder.
|
||||
* Add the content of file `dot.htaccess` to the `.htaccess` file inside the directory
|
||||
you want to be styled (you might have to create this file). This directory and any subdirectories will be
|
||||
styled by h5ai.
|
||||
|
||||
Optionally add `h5ai.header.html` and/or `h5ai.footer.html` files to any of the styled folders to [display
|
||||
custom top or bottom sections](http://larsjung.de/h5ai/sample/customize). The content of those files
|
||||
will be wrapped by `<header>` and `<footer>` tags.
|
||||
|
||||
|
||||
## License and References
|
||||
|
||||
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-sa/3.0/88x31.png" /></a>
|
||||
[h5ai](http://larsjung.de/h5ai) is provided under the terms of the [CC BY-SA 3.0 License](http://creativecommons.org/licenses/by-sa/3.0/).
|
||||
It is based on
|
||||
[h5ai](http://larsjung.de/h5ai) is provided under the terms of the MIT License.
|
||||
It uses
|
||||
[HTML5 Boilerplate](http://html5boilerplate.com),
|
||||
[jQuery](http://jquery.com),
|
||||
[Modernizr](http://www.modernizr.com) and
|
||||
@@ -47,6 +17,91 @@ please respect their rights.
|
||||
|
||||
## Changelog
|
||||
|
||||
### v0.12.1
|
||||
*2011-07-29*
|
||||
|
||||
* fixed unchecked use of console.log
|
||||
|
||||
|
||||
### v0.12
|
||||
*2011-07-28*
|
||||
|
||||
* improved performance
|
||||
|
||||
|
||||
### v0.11
|
||||
*2011-07-27*
|
||||
|
||||
* changed license to MIT license, see `LICENSE.txt`
|
||||
|
||||
|
||||
### v0.10.2
|
||||
*2011-07-26*
|
||||
|
||||
* improved tree scrollbar
|
||||
|
||||
|
||||
### v0.10.1
|
||||
*2011-07-24*
|
||||
|
||||
* fixed problems with ' in links
|
||||
|
||||
|
||||
### v0.10
|
||||
*2011-07-24*
|
||||
|
||||
* fixed problems with XAMPP on Windows (see `dot.htaccess` comments for instructions)
|
||||
* fixed tree fade-in-fade-out effect for small displays ([issue #6](http://github.com/lrsjng/h5ai/issues/6))
|
||||
* added custom scrollbar to tree ([issue #6](http://github.com/lrsjng/h5ai/issues/6))
|
||||
* fixed broken links caused by URI encoding/decoding ([issue #9](http://github.com/lrsjng/h5ai/issues/9))
|
||||
* added "empty" to localization (hope Google Translate did a good job here)
|
||||
|
||||
|
||||
### v0.9
|
||||
*2011-07-18*
|
||||
|
||||
* linked hover states between crumb, extended view and tree
|
||||
* fixed size of tree view (now there's a ugly scrollbar, hopefully will be fixed)
|
||||
* refactored js to improve performance and cleaned code
|
||||
* added caching for folder status codes and content
|
||||
* added fr translation by [Nicolas](http://github.com/Nicosmos)
|
||||
* added nl translation by [Stefan de Konink](http://github.com/skinkie)
|
||||
* added sv translation by Oscar Carlsson
|
||||
|
||||
|
||||
### v0.8
|
||||
*2011-07-08*
|
||||
|
||||
* removed slashes from folder labels
|
||||
* optionally rename parent folder entries to real folder names, see `options.js`
|
||||
* long breadcrumbs (multiple rows) no longer hide content
|
||||
* error folder icons are opaque now
|
||||
* refactored js a lot (again...)
|
||||
|
||||
|
||||
### v0.7
|
||||
*2011-07-07*
|
||||
|
||||
* removed shadows
|
||||
* smarter tree side bar
|
||||
|
||||
|
||||
### v0.6
|
||||
*2011-07-05*
|
||||
|
||||
* refactored js
|
||||
* added localization, see `options.js`
|
||||
|
||||
|
||||
### v0.5.3
|
||||
*2011-07-04*
|
||||
|
||||
* refactored js
|
||||
* added basic options support via `options.js`
|
||||
* commented `options.js`
|
||||
* optional tree sidebar
|
||||
|
||||
|
||||
### v0.5.2
|
||||
*2011-07-02*
|
||||
|
||||
|
@@ -3,7 +3,7 @@ custom = true
|
||||
|
||||
# project
|
||||
project.name = h5ai
|
||||
project.version = 0.5.2
|
||||
project.version = 0.12.1
|
||||
|
||||
|
||||
# src
|
||||
@@ -11,7 +11,8 @@ src.dir = src
|
||||
|
||||
|
||||
# build
|
||||
build.dir = target
|
||||
build.dir = build
|
||||
release.dir = release
|
||||
|
||||
|
||||
# libs
|
||||
|
10
build.xml
@@ -2,6 +2,7 @@
|
||||
<project
|
||||
name="h5ai"
|
||||
basedir="."
|
||||
default="build"
|
||||
xmlns:scripp="antlib:de.larsjung.scripp.ant"
|
||||
>
|
||||
<target name="init">
|
||||
@@ -21,6 +22,7 @@
|
||||
|
||||
<target name="clean" depends="init">
|
||||
<delete dir="${build.dir}" />
|
||||
<delete dir="${release.dir}" />
|
||||
</target>
|
||||
|
||||
|
||||
@@ -29,6 +31,7 @@
|
||||
<copy todir="${build.dir}">
|
||||
<fileset dir="${src.dir}" />
|
||||
</copy>
|
||||
<copy file="LICENSE.txt" todir="${build.dir}" />
|
||||
<replace dir="${build.dir}">
|
||||
<replacefilter token="%BUILD%" value="${build.label}" />
|
||||
<replacefilter token="%BUILD_NAME%" value="${project.name}" />
|
||||
@@ -38,6 +41,13 @@
|
||||
|
||||
<scripp.dir dir="${build.dir}/h5ai/css" />
|
||||
<scripp.dir dir="${build.dir}/h5ai/js" />
|
||||
|
||||
<!-- release -->
|
||||
<mkdir dir="${release.dir}" />
|
||||
<tar destfile="${release.dir}/${project.name}-${project.version}.tar" basedir="${build.dir}"/>
|
||||
<gzip destfile="${release.dir}/${project.name}-${project.version}.tar.gz" src="${release.dir}/${project.name}-${project.version}.tar"/>
|
||||
<delete file="${release.dir}/${project.name}-${project.version}.tar" />
|
||||
<zip destfile="${release.dir}/${project.name}-${project.version}.zip" basedir="${build.dir}" />
|
||||
</target>
|
||||
|
||||
|
||||
|
BIN
release/h5ai-0.12.1.tar.gz
Normal file
BIN
release/h5ai-0.12.1.zip
Normal file
Before Width: | Height: | Size: 68 KiB |
Before Width: | Height: | Size: 64 KiB |
Before Width: | Height: | Size: 74 KiB |
@@ -8,7 +8,7 @@
|
||||
# Options +FollowSymLinks
|
||||
|
||||
|
||||
<IfModule mod_headers.c>
|
||||
<IfModule headers_module>
|
||||
|
||||
################################
|
||||
# cache images for 52 weeks
|
||||
@@ -25,7 +25,13 @@
|
||||
# style auto index
|
||||
################################
|
||||
|
||||
<IfModule mod_autoindex.c>
|
||||
################################
|
||||
# IMPORTANT FOR XAMPP
|
||||
# if you're running XAMPP you might need to replace the
|
||||
# following line with
|
||||
# <IfModule autoindex_color_module>
|
||||
################################
|
||||
<IfModule autoindex_module>
|
||||
|
||||
################################
|
||||
# uncomment the following line to force directory listing
|
||||
|
@@ -12,38 +12,58 @@
|
||||
white-space: nowrap;
|
||||
clear: both;
|
||||
|
||||
&.header a {
|
||||
padding-bottom: 18px;
|
||||
color: #555;
|
||||
opacity: 0.4;
|
||||
cursor: pointer;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
|
||||
&:visited {
|
||||
&.header {
|
||||
a, a:active, a:visited {
|
||||
padding-bottom: 18px;
|
||||
color: #555;
|
||||
}
|
||||
&:hover {
|
||||
color: #555;
|
||||
opacity: 0.9;
|
||||
}
|
||||
img {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
padding: 0 8px;
|
||||
text-decoration: none;
|
||||
opacity: 0.4;
|
||||
cursor: pointer;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
|
||||
&:hover {
|
||||
color: #555;
|
||||
opacity: 0.9;
|
||||
}
|
||||
img {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.entry {
|
||||
border-bottom: 1px solid #ddd;
|
||||
|
||||
a {
|
||||
a, a:active, a:visited {
|
||||
display: block;
|
||||
color: #555;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
|
||||
&:hover, &.hover {
|
||||
background-color: #f6f6f6;
|
||||
color: #e80;
|
||||
}
|
||||
}
|
||||
&.error {
|
||||
a, a:active, a:visited {
|
||||
color: #aaa;
|
||||
|
||||
.label {
|
||||
.hint {
|
||||
margin-left: 12px;
|
||||
font-size: 0.9em;
|
||||
color: #c55;
|
||||
}
|
||||
}
|
||||
&:hover, &.hover {
|
||||
opacity: 1;
|
||||
background-color: #f6f6f6;
|
||||
color: #e80;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.icon, .label, .date, .size {
|
||||
padding: 6px;
|
||||
@@ -65,17 +85,17 @@
|
||||
}
|
||||
.label {
|
||||
display: block;
|
||||
margin: 0 220px 0 24px;
|
||||
margin: 0 270px 0 24px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-align: left;
|
||||
}
|
||||
.date {
|
||||
position: absolute;
|
||||
right: 70px;
|
||||
right: 100px;
|
||||
top: 0;
|
||||
text-align: right;
|
||||
width: 140px;
|
||||
width: 160px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.size {
|
||||
@@ -83,7 +103,7 @@
|
||||
right: 0;
|
||||
top: 0;
|
||||
text-align: right;
|
||||
width: 50px;
|
||||
width: 80px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
@@ -100,7 +120,7 @@
|
||||
|
||||
#extended.icons-view {
|
||||
display: none;
|
||||
padding: 10px;
|
||||
padding: 3px;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 15px;
|
||||
|
||||
@@ -116,7 +136,7 @@
|
||||
&.entry {
|
||||
float: left;
|
||||
|
||||
a {
|
||||
a, a:active, a:visited {
|
||||
display: block;
|
||||
margin: 8px;
|
||||
padding: 8px;
|
||||
@@ -124,16 +144,17 @@
|
||||
height: 120px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
border: 2px solid rgba(0,0,0,0);
|
||||
|
||||
&:hover {
|
||||
&:hover, &.hover {
|
||||
color: #e80;
|
||||
border-color: #eee;
|
||||
background-color: #f6f6f6;
|
||||
//.box-shadow( 0, 0, 20px, #999 );
|
||||
}
|
||||
.icon {
|
||||
display: block;
|
||||
@@ -155,6 +176,25 @@
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&.error {
|
||||
a, a:active, a:visited {
|
||||
color: #aaa;
|
||||
text-decoration: none;
|
||||
|
||||
.label {
|
||||
.hint {
|
||||
padding: 0 6px;
|
||||
font-size: 0.9em;
|
||||
color: #c55;
|
||||
}
|
||||
}
|
||||
&:hover, &.hover {
|
||||
color: #e80;
|
||||
border-color: #eee;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -1,26 +1,77 @@
|
||||
|
||||
#tree {
|
||||
display: none;
|
||||
position: fixed;
|
||||
display: none;
|
||||
left: 0;
|
||||
top: 80px;
|
||||
top: 0;
|
||||
overflow: auto;
|
||||
font-size: 0.85em;
|
||||
padding: 16px 32px 16px 16px;
|
||||
background-color: rgb(240,240,240);
|
||||
border: 1px solid rgb(225,225,225);
|
||||
padding: 16px 16px 16px 16px;
|
||||
background-color: rgb(241,241,241);
|
||||
border: 2px solid rgb(210,210,210);
|
||||
border-left: none;
|
||||
.border-radius ( 0 15px 15px 0 );
|
||||
.box-shadow( 0 0 30px #999 );
|
||||
|
||||
> .scrollbar {
|
||||
margin: 12px 12px 12px 0;
|
||||
width: 6px;
|
||||
background-color: rgb(210,210,210);
|
||||
.border-radius( 3px );
|
||||
|
||||
.drag {
|
||||
background-color: rgb(180,180,180);
|
||||
.border-radius( 3px );
|
||||
}
|
||||
&.dragOn .drag {
|
||||
background-color: rgb(150,150,150);
|
||||
}
|
||||
}
|
||||
|
||||
.entry {
|
||||
> a, > a.visited {
|
||||
.blank, .indicator {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 25px;
|
||||
float: left;
|
||||
}
|
||||
.indicator {
|
||||
opacity: 0.7;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
img {
|
||||
position: relative;
|
||||
left: 0;
|
||||
top: 3px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
vertical-align: bottom;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
}
|
||||
&.open {
|
||||
img {
|
||||
.transform( rotate(90deg) );
|
||||
}
|
||||
}
|
||||
&.unknown {
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
> a, > a:active, > a.visited {
|
||||
margin-left: 16px;
|
||||
padding: 4px 6px;
|
||||
border: 1px solid rgba(0,0,0,0);
|
||||
.border-radius( 5px );
|
||||
display: block;
|
||||
color: #555;
|
||||
text-decoration: none;
|
||||
opacity: 0.7;
|
||||
|
||||
&:hover {
|
||||
&:hover, &.hover {
|
||||
color: #e80;
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -39,7 +90,7 @@
|
||||
.hint {
|
||||
display: inline-block;
|
||||
margin-left: 12px;
|
||||
font-style: italic;
|
||||
font-size: 0.9em;
|
||||
color: #ccc;
|
||||
img {
|
||||
width: 10px;
|
||||
@@ -47,26 +98,29 @@
|
||||
vertical-align: baseline;
|
||||
}
|
||||
}
|
||||
.error {
|
||||
color: #c55;
|
||||
}
|
||||
}
|
||||
&.file {
|
||||
display: none;
|
||||
}
|
||||
&.current {
|
||||
> a, > a:visited {
|
||||
border: 1px solid rgba(0,0,0,0.1);
|
||||
> a, > a:active, > a:visited {
|
||||
border: 1px solid rgb(221,221,221);
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.notListable {
|
||||
> a, > a:visited {
|
||||
&.error {
|
||||
> a, > a:active, > a:visited {
|
||||
color: #999;
|
||||
&:hover, &.hover {
|
||||
color: #e80;
|
||||
}
|
||||
}
|
||||
.hint {
|
||||
color: #c55;
|
||||
}
|
||||
}
|
||||
ul {
|
||||
.content {
|
||||
list-style: none;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
@@ -14,6 +14,7 @@ html.no-js {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
font-family: Ubuntu, sans-serif;
|
||||
font-size: 16px;
|
||||
@@ -22,16 +23,6 @@ body {
|
||||
}
|
||||
|
||||
|
||||
a, a:visited {
|
||||
color: #555;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
color: #e80;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
body > nav {
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
@@ -39,9 +30,8 @@ body > nav {
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 0.85em;
|
||||
background-color: rgb(240,240,240);
|
||||
border-bottom: 1px solid rgb(225,225,225);
|
||||
.box-shadow( 0 0 30px #555 );
|
||||
background-color: rgb(241,241,241);
|
||||
border-bottom: 2px solid rgb(210,210,210);
|
||||
|
||||
span.jsDisabledFallback {
|
||||
display: block;
|
||||
@@ -50,45 +40,27 @@ body > nav {
|
||||
padding: 0 10px;
|
||||
color: #999;
|
||||
}
|
||||
li {
|
||||
a, a:active, a:visited {
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
opacity: 0.7;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
|
||||
&.crumb {
|
||||
float: left;
|
||||
border-right: 1px dotted rgb(225,225,225);
|
||||
.hint {
|
||||
margin-left: 8px;
|
||||
font-style: italic;
|
||||
color: #999;
|
||||
}
|
||||
img.hint {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
vertical-align: baseline;
|
||||
padding: 0px;
|
||||
}
|
||||
}
|
||||
&.current {
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
opacity: 1.0;
|
||||
}
|
||||
&.view {
|
||||
float: right;
|
||||
border-left: 1px dotted rgb(225,225,225);
|
||||
}
|
||||
&:hover, &:hover a {
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
color: #e80;
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
a {
|
||||
display: block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 10px;
|
||||
|
||||
&:hover, &.hover {
|
||||
color: #e80;
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
.current a {
|
||||
background-color: rgba(255,255,255,0.5);
|
||||
opacity: 1.0;
|
||||
}
|
||||
img {
|
||||
width: 16px;
|
||||
@@ -96,11 +68,30 @@ body > nav {
|
||||
vertical-align: bottom;
|
||||
padding: 0 6px 6px 0;
|
||||
}
|
||||
.crumb {
|
||||
float: left;
|
||||
border-right: 1px solid rgb(231,231,231);
|
||||
.hint {
|
||||
margin-left: 8px;
|
||||
font-style: italic;
|
||||
color: #999;
|
||||
}
|
||||
img.hint {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
vertical-align: baseline;
|
||||
padding: 0px;
|
||||
}
|
||||
}
|
||||
.view {
|
||||
float: right;
|
||||
border-left: 1px solid rgb(231,231,231);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#content {
|
||||
max-width: 980px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
|
||||
> header {
|
||||
@@ -130,15 +121,16 @@ body > footer {
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
padding: 10px 0;
|
||||
border-top: 1px solid rgb(225,225,225);
|
||||
background-color: rgb(240,240,240);
|
||||
background-color: rgb(241,241,241);
|
||||
border-top: 2px solid rgb(210,210,210);
|
||||
|
||||
color: #999;
|
||||
font-size: 0.85em;
|
||||
text-align: center;
|
||||
.box-shadow( 0 0 30px #555 );
|
||||
|
||||
a, a:visited {
|
||||
a, a:active, a:visited {
|
||||
color: #555;
|
||||
text-decoration: none;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
|
||||
&:hover {
|
||||
@@ -152,15 +144,14 @@ body > footer {
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
bottom: 6px;
|
||||
float: left;
|
||||
opacity: 0.4;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
|
||||
img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
opacity: 0.4;
|
||||
.transition( all 0.2s ease-in-out );
|
||||
}
|
||||
&:hover img {
|
||||
&:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
@@ -11,12 +11,13 @@
|
||||
<img class="techclass" src="/h5ai/images/html5-storage.png" alt="html5-storage" />
|
||||
<img class="techclass" src="/h5ai/images/html5-css3.png" alt="html5-css3" />
|
||||
</a>
|
||||
<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai %BUILD_VERSION%">h5ai</a>
|
||||
using
|
||||
<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai project page">h5ai %BUILD_VERSION%</a>
|
||||
<span class="l10n-footerUsing">using</span>
|
||||
<a href="http://tiheum.deviantart.com/art/Faenza-Icons-173323228" target="_blank" title="icon theme for Gnome">Faenza icons</a>
|
||||
</footer>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write( '<script src="/h5ai/js/lib/jquery.min.js"><\/script>' )</script>
|
||||
<script src="/h5ai/options.js"></script>
|
||||
<script src="/h5ai/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
@@ -13,14 +13,16 @@
|
||||
<script src="/h5ai/js/lib/modernizr.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<nav class="clearfix">
|
||||
<span class="jsDisabledFallback">Directory index · JavaScript is disabled</span>
|
||||
<ul>
|
||||
<li id="domain" class="crumb"><a href="/"><img src="/h5ai/images/home.png" alt="domain" /><span>domain</span></a></li>
|
||||
<li id="viewicons" class="view"><a href="#"><img src="/h5ai/images/view-icons.png" alt="view-icons" />icons</a></li>
|
||||
<li id="viewdetails" class="view" ><a href="#"><img src="/h5ai/images/view-details.png" alt="view-details" />details</a></li>
|
||||
<li id="viewicons" class="view">
|
||||
<a href="#"><img src="/h5ai/images/view-icons.png" alt="view-icons" /><span class="l10n-viewIcons">icons</span></a>
|
||||
</li>
|
||||
<li id="viewdetails" class="view" >
|
||||
<a href="#"><img src="/h5ai/images/view-details.png" alt="view-details" /><span class="l10n-viewDetails">details</span></a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</nav>
|
||||
<section id="content">
|
||||
<header></header>
|
||||
|
BIN
src/h5ai/icons/16x16/folder-home.png
Normal file
After Width: | Height: | Size: 637 B |
Before Width: | Height: | Size: 441 B After Width: | Height: | Size: 441 B |
Before Width: | Height: | Size: 587 B After Width: | Height: | Size: 587 B |
Before Width: | Height: | Size: 227 B After Width: | Height: | Size: 236 B |
BIN
src/h5ai/icons/48x48/folder-home.png
Normal file
After Width: | Height: | Size: 2.0 KiB |
BIN
src/h5ai/icons/48x48/folder-open.png
Normal file
After Width: | Height: | Size: 1.5 KiB |
BIN
src/h5ai/icons/48x48/folder-page.png
Normal file
After Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 227 B After Width: | Height: | Size: 227 B |
Before Width: | Height: | Size: 409 B |
Before Width: | Height: | Size: 697 B |
Before Width: | Height: | Size: 458 B After Width: | Height: | Size: 458 B |
@@ -1,324 +1,306 @@
|
||||
( function( $ ) {
|
||||
|
||||
var H5ai = function ( options, langs, pathCache ) {
|
||||
|
||||
|
||||
/*******************************
|
||||
* config
|
||||
*******************************/
|
||||
|
||||
var defaults = {
|
||||
defaultSortOrder: "C=N;O=A",
|
||||
store: {
|
||||
viewmode: "h5ai.viewmode"
|
||||
},
|
||||
customHeader: "h5ai.header.html",
|
||||
customFooter: "h5ai.footer.html",
|
||||
callbacks: {
|
||||
pathClick: []
|
||||
},
|
||||
|
||||
viewmodes: [ "details", "icons" ],
|
||||
showTree: false,
|
||||
folderStatus: {
|
||||
},
|
||||
lang: undefined,
|
||||
useBrowserLang: true,
|
||||
setParentFolderLabels: true,
|
||||
linkHoverStates: true
|
||||
};
|
||||
this.config = $.extend( {}, defaults, options );
|
||||
|
||||
|
||||
/*******************************
|
||||
* public api
|
||||
*******************************/
|
||||
|
||||
this.pathClick = function ( fn ) {
|
||||
|
||||
if ( $.isFunction( fn ) ) {
|
||||
this.config.callbacks.pathClick.push( fn );
|
||||
};
|
||||
return this;
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* init after dom load
|
||||
* init
|
||||
*******************************/
|
||||
|
||||
$( function() {
|
||||
this.init = function () {
|
||||
|
||||
$.h5ai = new H5ai();
|
||||
} );
|
||||
document.title = decodeURI( document.domain + document.location.pathname );
|
||||
|
||||
|
||||
|
||||
H5ai = function ( options ) {
|
||||
|
||||
/*******************************
|
||||
* config
|
||||
*******************************/
|
||||
|
||||
var config = {
|
||||
columnClasses: [ "icon", "name", "date", "size" ],
|
||||
defaultSortOrder: "C=N;O=A",
|
||||
viewmodes: [ "details", "icons" ],
|
||||
store: {
|
||||
viewmode: "h5ai.viewmode"
|
||||
},
|
||||
icons: {
|
||||
crumb: "/h5ai/images/crumb.png",
|
||||
ascending: "/h5ai/images/ascending.png",
|
||||
descending: "/h5ai/images/descending.png"
|
||||
},
|
||||
customHeader: "h5ai.header.html",
|
||||
customFooter: "h5ai.footer.html",
|
||||
callbacks: {
|
||||
folderClick: [],
|
||||
fileClick: []
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* public api
|
||||
*******************************/
|
||||
|
||||
this.folderClick = function ( fn ) {
|
||||
|
||||
if ( typeof fn === "function" ) {
|
||||
config.callbacks.folderClick.push( fn );
|
||||
};
|
||||
return this;
|
||||
};
|
||||
|
||||
|
||||
this.fileClick = function ( fn ) {
|
||||
|
||||
if ( typeof fn === "function" ) {
|
||||
config.callbacks.fileClick.push( fn );
|
||||
};
|
||||
return this;
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* init (will be called at the bottom)
|
||||
*******************************/
|
||||
|
||||
var init = function () {
|
||||
|
||||
applyViewmode();
|
||||
initBreadcrumb();
|
||||
initViews();
|
||||
customize();
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* callback triggers
|
||||
*******************************/
|
||||
|
||||
var triggerFolderClick = function ( label ) {
|
||||
|
||||
for ( idx in config.callbacks.folderClick ) {
|
||||
config.callbacks.folderClick[idx].call( window, label );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
var triggerFileClick = function ( label ) {
|
||||
|
||||
for ( idx in config.callbacks.fileClick ) {
|
||||
config.callbacks.fileClick[idx].call( window, label );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* local stored viewmode
|
||||
*******************************/
|
||||
|
||||
var getViewmode = function () {
|
||||
|
||||
var viewmode = localStorage.getItem( config.store.viewmode );
|
||||
if ( $.inArray( viewmode, config.viewmodes ) ) {
|
||||
return viewmode;
|
||||
};
|
||||
return config.viewmodes[0];
|
||||
};
|
||||
|
||||
|
||||
var applyViewmode = function ( viewmode ) {
|
||||
|
||||
$( "#table" ).hide();
|
||||
if ( viewmode !== undefined ) {
|
||||
localStorage.setItem( config.store.viewmode, viewmode );
|
||||
};
|
||||
$( "body > nav li.view" ).removeClass( "current" );
|
||||
if ( getViewmode() === "icons" ) {
|
||||
$( "#viewicons" ).closest( "li" ).addClass( "current" );
|
||||
$( "#extended" ).removeClass( "details-view" ).addClass( "icons-view" ).show();
|
||||
} else {
|
||||
$( "#viewdetails" ).closest( "li" ).addClass( "current" );
|
||||
$( "#extended" ).addClass( "details-view" ).removeClass( "icons-view" ).show();
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* breadcrumb and doc title
|
||||
*******************************/
|
||||
|
||||
var initBreadcrumb = function () {
|
||||
|
||||
$( "#domain span" ).text( document.domain );
|
||||
var pathname = decodeURI( document.location.pathname );
|
||||
var parts = pathname.split( "/" );
|
||||
var path = "/";
|
||||
var $ul = $( "nav ul" );
|
||||
for ( idx in parts ) {
|
||||
var part = parts[idx];
|
||||
if ( part !== "" ) {
|
||||
path += part + "/";
|
||||
$ul.append( $( "<li class='crumb'><a href='" + path + "'><img src='" + config.icons.crumb + "' alt='>' />" + part + "</a></li>" ) );
|
||||
};
|
||||
};
|
||||
$( "body > nav .crumb:last" ).addClass( "current" );
|
||||
|
||||
document.title = document.domain + pathname;
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* table view
|
||||
*******************************/
|
||||
|
||||
var initTableView = function () {
|
||||
|
||||
function getColumnClass( idx ) {
|
||||
|
||||
if ( idx >= 0 && idx < config.columnClasses.length ) {
|
||||
return config.columnClasses[idx];
|
||||
};
|
||||
return "unknown";
|
||||
};
|
||||
|
||||
$( "#table td" ).removeAttr( "align" ).removeAttr( "valign" );
|
||||
$( "#table tr" ).each( function () {
|
||||
var colIdx = 0;
|
||||
$( this ).find( "th,td" ).each( function () {
|
||||
$( this ).addClass( getColumnClass( colIdx++ ) );
|
||||
} );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* extended view
|
||||
*******************************/
|
||||
|
||||
var initExtendedView = function () {
|
||||
|
||||
var $ul = $( "<ul/>" );
|
||||
|
||||
// headers
|
||||
var $li = $( "<li class='header' />" ).appendTo( $ul );
|
||||
$( "<a class='icon'></a>" ).appendTo( $li );
|
||||
var $label = $( "th.name a" );
|
||||
var $date = $( "th.date a" );
|
||||
var $size = $( "th.size a" );
|
||||
$( "<a class='label' href='" + $label.attr( "href" ) + "'>" + $label.text() + "</a>" ).appendTo( $li );
|
||||
$( "<a class='date' href='" + $date.attr( "href" ) + "'>" + $date.text() + "</a>" ).appendTo( $li );
|
||||
$( "<a class='size' href='" + $size.attr( "href" ) + "'>" + $size.text() + "</a>" ).appendTo( $li );
|
||||
|
||||
// header sort icons
|
||||
var order = document.location.search;
|
||||
if ( order === "" ) {
|
||||
order = config.defaultSortOrder;
|
||||
};
|
||||
var $icon;
|
||||
if ( order.indexOf( "O=A" ) >= 0 ) {
|
||||
$icon = $( "<img src='" + config.icons.ascending + "' class='sort' alt='ascending' />" );
|
||||
} else {
|
||||
$icon = $( "<img src='" + config.icons.descending + "' class='sort' alt='descending' />" );
|
||||
};
|
||||
if ( order.indexOf( "C=N" ) >= 0 ) {
|
||||
$li.find( "a.label" ).append( $icon );
|
||||
} else if ( order.indexOf( "C=M" ) >= 0 ) {
|
||||
$li.find( "a.date" ).prepend( $icon );
|
||||
} else if ( order.indexOf( "C=S" ) >= 0 ) {
|
||||
$li.find( "a.size" ).prepend( $icon );
|
||||
};
|
||||
|
||||
// entries
|
||||
$( "#table td.name a" ).closest( "tr" ).each( function () {
|
||||
var $tr = $( this );
|
||||
var $img = $tr.find( "td.icon img" );
|
||||
var iconsmall = $img.attr( "src" );
|
||||
var iconbig = iconsmall.replace( "16x16", "48x48" );
|
||||
var alt = $img.attr( "alt" );
|
||||
var $link = $tr.find( "td.name a" );
|
||||
var label = $link.text();
|
||||
var href = $link.attr( "href" );
|
||||
var date = $tr.find( "td.date" ).text();
|
||||
var size = $tr.find( "td.size" ).text();
|
||||
|
||||
var $li = $( "<li class='entry' />" ).appendTo( $ul );
|
||||
if ( alt === "[DIR]" ) {
|
||||
$li.addClass( "folder" );
|
||||
} else {
|
||||
$li.addClass( "file" );
|
||||
}
|
||||
var $a = $( "<a href='" + href + "' />" ).appendTo( $li );
|
||||
$( "<span class='icon small'><img src='" + iconsmall + "' alt='" + alt + "' /></span>" ).appendTo( $a );
|
||||
$( "<span class='icon big'><img src='" + iconbig + "' alt='" + alt + "' /></span>" ).appendTo( $a );
|
||||
$( "<span class='label'>" + label + "</span>" ).appendTo( $a );
|
||||
$( "<span class='date'>" + date + "</span>" ).appendTo( $a );
|
||||
$( "<span class='size'>" + size + "</span>" ).appendTo( $a );
|
||||
} );
|
||||
|
||||
$( "#extended" ).append( $ul );
|
||||
|
||||
// empty
|
||||
$entries = $( "#extended .entry" );
|
||||
if ( $entries.size() === 0 || $entries.size() === 1 && $entries.find( ".label" ).text() === "Parent Directory" ) {
|
||||
$( "#extended" ).append( $( "<div class='empty'>empty</div>" ) );
|
||||
};
|
||||
|
||||
// in case of floats
|
||||
$( "#extended" ).append( $( "<div class='clearfix' />" ) );
|
||||
|
||||
// click callbacks
|
||||
$( "#extended .entry.folder" )
|
||||
.click( function() {
|
||||
triggerFolderClick( $( this ).find( ".label" ).text() );
|
||||
} );
|
||||
$( "#extended .entry.file" )
|
||||
.click( function() {
|
||||
triggerFileClick( $( this ).find( ".label" ).text() );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
/*******************************
|
||||
* init views
|
||||
*******************************/
|
||||
|
||||
var initViews = function () {
|
||||
|
||||
initTableView();
|
||||
initExtendedView();
|
||||
|
||||
$( "#viewdetails" ).closest( "li" )
|
||||
.click( function () {
|
||||
applyViewmode( "details" );
|
||||
} );
|
||||
$( "#viewicons" ).closest( "li" )
|
||||
.click( function () {
|
||||
applyViewmode( "icons" );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* customize
|
||||
*******************************/
|
||||
|
||||
var customize = function () {
|
||||
|
||||
$.ajax( {
|
||||
url: config.customHeader,
|
||||
dataType: "html",
|
||||
success: function ( data ) {
|
||||
$( "#content > header" ).append( $( data ) ).show();
|
||||
}
|
||||
} );
|
||||
|
||||
$.ajax( {
|
||||
url: config.customFooter,
|
||||
dataType: "html",
|
||||
success: function ( data ) {
|
||||
$( "#content > footer" ).prepend( $( data ) ).show();
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* finally run init
|
||||
*******************************/
|
||||
|
||||
init();
|
||||
this.applyViewmode();
|
||||
this.initBreadcrumb();
|
||||
this.initTopSpace();
|
||||
this.initViews();
|
||||
this.customize();
|
||||
this.localize( langs, this.config.lang, this.config.useBrowserLang );
|
||||
};
|
||||
|
||||
} )( jQuery );
|
||||
|
||||
|
||||
/*******************************
|
||||
* callback triggers
|
||||
*******************************/
|
||||
|
||||
this.triggerPathClick = function ( path, context ) {
|
||||
|
||||
for ( idx in this.config.callbacks.pathClick ) {
|
||||
this.config.callbacks.pathClick[idx].call( window, path, context );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* local stored viewmode
|
||||
*******************************/
|
||||
|
||||
this.getViewmode = function () {
|
||||
|
||||
var viewmode = localStorage.getItem( this.config.store.viewmode );
|
||||
return $.inArray( viewmode, this.config.viewmodes ) >= 0 ? viewmode : this.config.viewmodes[0];
|
||||
};
|
||||
|
||||
|
||||
this.applyViewmode = function ( viewmode ) {
|
||||
|
||||
if ( viewmode !== undefined ) {
|
||||
localStorage.setItem( this.config.store.viewmode, viewmode );
|
||||
};
|
||||
viewmode = this.getViewmode();
|
||||
|
||||
$( "#viewdetails,#viewicons" ).hide().removeClass( "current" );
|
||||
|
||||
if ( this.config.viewmodes.length > 1 ) {
|
||||
if ( $.inArray( "details", this.config.viewmodes ) >= 0 ) {
|
||||
$( "#viewdetails" ).show();
|
||||
};
|
||||
if ( $.inArray( "icons", this.config.viewmodes ) >= 0 ) {
|
||||
$( "#viewicons" ).show();
|
||||
};
|
||||
};
|
||||
|
||||
if ( viewmode === "details" ) {
|
||||
$( "#viewdetails" ).closest( "li" ).addClass( "current" );
|
||||
$( "#extended" ).addClass( "details-view" ).removeClass( "icons-view" ).show();
|
||||
} else if ( viewmode === "icons" ) {
|
||||
$( "#viewicons" ).closest( "li" ).addClass( "current" );
|
||||
$( "#extended" ).removeClass( "details-view" ).addClass( "icons-view" ).show();
|
||||
} else {
|
||||
$( "#extended" ).hide();
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* breadcrumb
|
||||
*******************************/
|
||||
|
||||
this.initBreadcrumb = function () {
|
||||
|
||||
var $ul = $( "body > nav ul" );
|
||||
|
||||
var pathname = "/";
|
||||
var path = pathCache.getPathForFolder( pathname );
|
||||
$ul.append( path.updateCrumbHtml() );
|
||||
|
||||
var pathnameParts = document.location.pathname.split( "/" );
|
||||
for ( idx in pathnameParts ) {
|
||||
var part = pathnameParts[idx];
|
||||
if ( part !== "" ) {
|
||||
pathname += part + "/";
|
||||
var path = pathCache.getPathForFolder( pathname );
|
||||
$ul.append( path.updateCrumbHtml() );
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* top space, depending on nav height
|
||||
*******************************/
|
||||
|
||||
this.initTopSpace = function () {
|
||||
|
||||
function adjustTopSpace() {
|
||||
|
||||
var winHeight = $( window ).height();
|
||||
var navHeight = $( "body > nav" ).outerHeight();
|
||||
var footerHeight = $( "body > footer" ).outerHeight();
|
||||
var contentSpacing = 50;
|
||||
var treeSpacing = 50;
|
||||
|
||||
$( "body" )
|
||||
.css( "margin-top", "" + ( navHeight + contentSpacing ) + "px" )
|
||||
.css( "margin-bottom", "" + ( footerHeight + contentSpacing ) + "px" );
|
||||
|
||||
$( "#tree" )
|
||||
.css( "top", "" + ( navHeight + treeSpacing ) + "px" )
|
||||
.css( "height", "" + ( winHeight - navHeight - footerHeight - 36 - 2 * treeSpacing ) + "px" );
|
||||
try {
|
||||
$( "#tree" ).get( 0 ).updateScrollbar();
|
||||
} catch ( err ) {};
|
||||
};
|
||||
|
||||
$( window ).resize( function () {
|
||||
adjustTopSpace();
|
||||
} );
|
||||
adjustTopSpace();
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* extended view
|
||||
*******************************/
|
||||
|
||||
this.initExtendedView = function () {
|
||||
|
||||
var $ul = $( "<ul/>" );
|
||||
|
||||
// headers
|
||||
var $ths = $( "#table th" );
|
||||
var $label = $ths.eq( 1 ).find( "a" );
|
||||
var $date = $ths.eq( 2 ).find( "a" );
|
||||
var $size = $ths.eq( 3 ).find( "a" );
|
||||
var $li = $( "<li class='header' />" ).appendTo( $ul );
|
||||
$( "<a class='icon'></a>" ).appendTo( $li );
|
||||
$( "<a class='label' href='" + $label.attr( "href" ) + "'><span class='l10n-columnName'>" + $label.text() + "</span></a>" ).appendTo( $li );
|
||||
$( "<a class='date' href='" + $date.attr( "href" ) + "'><span class='l10n-columnLastModified'>" + $date.text() + "</span></a>" ).appendTo( $li );
|
||||
$( "<a class='size' href='" + $size.attr( "href" ) + "'><span class='l10n-columnSize'>" + $size.text() + "</span></a>" ).appendTo( $li );
|
||||
|
||||
// header sort icons
|
||||
var order = document.location.search;
|
||||
if ( order === "" ) {
|
||||
order = this.config.defaultSortOrder;
|
||||
};
|
||||
var $icon;
|
||||
if ( order.indexOf( "O=A" ) >= 0 ) {
|
||||
$icon = $( "<img src='/h5ai/images/ascending.png' class='sort' alt='ascending' />" );
|
||||
} else {
|
||||
$icon = $( "<img src='/h5ai/images/descending.png' class='sort' alt='descending' />" );
|
||||
};
|
||||
if ( order.indexOf( "C=N" ) >= 0 ) {
|
||||
$li.find( "a.label" ).append( $icon );
|
||||
} else if ( order.indexOf( "C=M" ) >= 0 ) {
|
||||
$li.find( "a.date" ).prepend( $icon );
|
||||
} else if ( order.indexOf( "C=S" ) >= 0 ) {
|
||||
$li.find( "a.size" ).prepend( $icon );
|
||||
};
|
||||
|
||||
$.timer.log( "start entries" );
|
||||
// entries
|
||||
$( "#table td" ).closest( "tr" ).each( function () {
|
||||
var path = pathCache.getPathForTableRow( document.location.pathname, this );
|
||||
$ul.append( path.updateExtendedHtml() );
|
||||
} );
|
||||
$.timer.log( "end entries" );
|
||||
$( "#table" ).remove();
|
||||
|
||||
$( "#extended" ).append( $ul );
|
||||
$.log( document.location.pathname, "folders:", $( "#extended .folder" ).size() , "files:", $( "#extended .file" ).size() );
|
||||
|
||||
// empty
|
||||
if ( $ul.children( ".entry:not(.parentfolder)" ).size() === 0 ) {
|
||||
$( "#extended" ).append( $( "<div class='empty l10n-empty'>empty</div>" ) );
|
||||
};
|
||||
|
||||
// in case of floats
|
||||
$( "#extended" ).addClass( "clearfix" );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* init views
|
||||
*******************************/
|
||||
|
||||
this.initViews = function () {
|
||||
|
||||
this.initExtendedView();
|
||||
|
||||
$( "#viewdetails" ).closest( "li" )
|
||||
.click( $.proxy( function () {
|
||||
this.applyViewmode( "details" );
|
||||
}, this ) );
|
||||
$( "#viewicons" ).closest( "li" )
|
||||
.click( $.proxy( function () {
|
||||
this.applyViewmode( "icons" );
|
||||
}, this ) );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* customize
|
||||
*******************************/
|
||||
|
||||
this.customize = function () {
|
||||
|
||||
$.ajax( {
|
||||
url: this.config.customHeader,
|
||||
dataType: "html",
|
||||
success: function ( data ) {
|
||||
$( "#content > header" ).append( $( data ) ).show();
|
||||
}
|
||||
} );
|
||||
|
||||
$.ajax( {
|
||||
url: this.config.customFooter,
|
||||
dataType: "html",
|
||||
success: function ( data ) {
|
||||
$( "#content > footer" ).prepend( $( data ) ).show();
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* localization
|
||||
*******************************/
|
||||
|
||||
this.localize = function ( data, lang, useBrowserLang ) {
|
||||
|
||||
if ( useBrowserLang === true ) {
|
||||
var browserLang = navigator.language;
|
||||
if ( data[ browserLang ] !== undefined ) {
|
||||
lang = browserLang;
|
||||
} else if ( browserLang.length > 2 && data[ browserLang.substr( 0, 2 ) ] !== undefined ) {
|
||||
lang = browserLang.substr( 0, 2 );
|
||||
};
|
||||
};
|
||||
|
||||
if ( lang !== "en" && data[ lang ] !== undefined ) {
|
||||
var selected = data[ lang ];
|
||||
for ( key in selected ) {
|
||||
$( ".l10n-" + key ).text( selected[key] );
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
|
@@ -1,312 +0,0 @@
|
||||
|
||||
( function( $ ) {
|
||||
|
||||
|
||||
|
||||
/*******************************
|
||||
* init after dom load
|
||||
*******************************/
|
||||
|
||||
$( function() {
|
||||
|
||||
window.setTimeout( function() {
|
||||
$.h5aiTree = new H5aiTree();
|
||||
}, 1 );
|
||||
} );
|
||||
|
||||
|
||||
H5aiTree = function ( options ) {
|
||||
|
||||
|
||||
var folderRegEx = /\/$/;
|
||||
var pathnameRegEx = /^(\/(.*\/)*)([^\/]+\/?)$/;
|
||||
var contentTypeRegEx = /^text\/html;h5ai=/;
|
||||
|
||||
|
||||
function init() {
|
||||
|
||||
checkCrumb();
|
||||
initShifting();
|
||||
populateTree();
|
||||
};
|
||||
|
||||
|
||||
function splitPathname( pathname ) {
|
||||
|
||||
if ( pathname === "/" ) {
|
||||
return [ "", "/" ];
|
||||
};
|
||||
var match = pathnameRegEx.exec( pathname );
|
||||
return [ match[1], match[3] ];
|
||||
};
|
||||
|
||||
|
||||
function checkCrumb() {
|
||||
|
||||
$( "li.crumb a" ).each( function() {
|
||||
|
||||
var $a = $( this );
|
||||
var pathname = $a.attr( "href" );
|
||||
checkPathname( pathname, function ( status ) {
|
||||
if ( status !== 0 ) {
|
||||
$( "<img class='hint' src='/h5ai/images/page.png' alt='not listable' />" ).appendTo( $a );
|
||||
if ( status !== 200 ) {
|
||||
$( "<span class='hint'>(" + status + ")</span>" ).appendTo( $a );
|
||||
};
|
||||
};
|
||||
} );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function shiftTree( show ) {
|
||||
|
||||
var $tree = $( "#tree" );
|
||||
var $extended = $( "#extended" );
|
||||
var show = show || false;
|
||||
|
||||
if ( $tree.outerWidth() < $extended.offset().left || show ) {
|
||||
$tree.stop().animate( { left: 0 } );
|
||||
} else {
|
||||
//var left = Math.max( 24 - $tree.outerWidth(), $extended.offset().left - $tree.outerWidth() - 16 );
|
||||
var left = 24 - $tree.outerWidth();
|
||||
$tree.stop().animate( { left: left } );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
function initShifting() {
|
||||
|
||||
$( "#tree" ).hover(
|
||||
function () {
|
||||
shiftTree( true );
|
||||
},
|
||||
function () {
|
||||
shiftTree();
|
||||
}
|
||||
);
|
||||
$( window ).resize( function() {
|
||||
shiftTree();
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function populateTree() {
|
||||
|
||||
var $tree = $( "#tree" );
|
||||
$tree.css( { left: -400 } ).show();
|
||||
shiftTree();
|
||||
var pathname = decodeURI( document.location.pathname );
|
||||
fetchTree( pathname, function( entry ) {
|
||||
$tree.empty().append( entry.toHtml() );
|
||||
shiftTree();
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function fetchTree( pathname, callback ) {
|
||||
|
||||
walkBack( pathname, function( walkbackedPathname ) {
|
||||
var entry = new Entry( walkbackedPathname );
|
||||
fetchEntriesRecursive( walkbackedPathname, function ( content ) {
|
||||
entry.content = content;
|
||||
callback( entry );
|
||||
} );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function walkBack( pathname, callback ) {
|
||||
|
||||
var splits = splitPathname( pathname );
|
||||
var parent = splits[0];
|
||||
if ( parent === "" ) {
|
||||
callback( pathname );
|
||||
} else {
|
||||
checkPathname( parent, function( state ) {
|
||||
if ( state === 0 ) {
|
||||
walkBack( parent, callback );
|
||||
} else {
|
||||
callback( pathname );
|
||||
};
|
||||
} );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
function fetchEntriesRecursive( pathname, callback ) {
|
||||
|
||||
fetchEntries( pathname, false, function ( entries ) {
|
||||
if ( entries instanceof Array ) {
|
||||
for ( idx in entries ) {
|
||||
( function ( entry ) {
|
||||
if ( entry.isFolder ) {
|
||||
fetchEntriesRecursive( entry.absHref, function( content ) {
|
||||
entry.content = content;
|
||||
callback( entries );
|
||||
} );
|
||||
};
|
||||
} ) ( entries[idx] );
|
||||
};
|
||||
};
|
||||
callback( entries );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function fetchEntries( pathname, includeParent, callback ) {
|
||||
|
||||
checkPathname( pathname, function ( status ) {
|
||||
console.log( "checkPathname", pathname, status );
|
||||
if ( status !== 0 ) {
|
||||
callback( status );
|
||||
} else {
|
||||
$.ajax( {
|
||||
url: pathname,
|
||||
type: "GET",
|
||||
dataType: "html",
|
||||
error: function ( xhr ) {
|
||||
// since it was checked before this should never happen
|
||||
callback( xhr.status );
|
||||
},
|
||||
success: function ( html, status, xhr ) {
|
||||
if ( !contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
|
||||
// since it was checked before this should never happen
|
||||
callback( xhr.status );
|
||||
} else {
|
||||
var entries = [];
|
||||
$( html ).find( "#table table td" ).closest( "tr" ).each( function () {
|
||||
var entry = new Entry( pathname, this );
|
||||
if ( !entry.isParentFolder || includeParent ) {
|
||||
entries.push( entry );
|
||||
};
|
||||
} );
|
||||
callback( entries );
|
||||
};
|
||||
}
|
||||
} );
|
||||
};
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
function checkPathname( pathname, callback ) {
|
||||
|
||||
$.ajax( {
|
||||
url: pathname,
|
||||
type: "HEAD",
|
||||
complete: function ( xhr ) {
|
||||
if ( xhr.status === 200 && contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
|
||||
callback( 0 );
|
||||
} else {
|
||||
callback( xhr.status );
|
||||
};
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
Entry = function ( folder, tableRow ) {
|
||||
|
||||
if ( !folderRegEx.test( folder ) ) {
|
||||
folder += "/";
|
||||
};
|
||||
|
||||
if ( tableRow !== undefined ) {
|
||||
var $tds = $( tableRow ).find( "td" );
|
||||
var $img = $( $tds.get( 0 ) ).find( "img" );
|
||||
var $a= $( $tds.get( 1 ) ).find( "a" );
|
||||
|
||||
this.parentFolder = folder;
|
||||
this.icon16 = $img.attr( "src" );
|
||||
this.alt = $img.attr( "alt" );
|
||||
this.label = $a.text();
|
||||
this.href = $a.attr("href");
|
||||
this.date = $( $tds.get(2) ).text();
|
||||
this.size = $( $tds.get(3) ).text();
|
||||
} else {
|
||||
var splits = splitPathname( folder );
|
||||
|
||||
this.parentFolder = splits[0];
|
||||
this.label = splits[1];
|
||||
this.icon16 = "/h5ai/icons/16x16/folder.png";
|
||||
this.alt = "[DIR]";
|
||||
this.href = this.label;
|
||||
this.date = "";
|
||||
this.size = "";
|
||||
if ( this.label === "/" ) {
|
||||
this.label = document.domain + "/";
|
||||
};
|
||||
};
|
||||
|
||||
this.icon48 = this.icon16.replace( "16x16", "48x48" );
|
||||
this.isFolder = ( this.alt === "[DIR]" );
|
||||
this.isParentFolder = ( this.isFolder && this.label === "Parent Directory" );
|
||||
this.absHref = this.isParentFolder ? this.href : this.parentFolder + this.href;
|
||||
this.content = undefined;
|
||||
|
||||
|
||||
this.isComplete = function () {
|
||||
|
||||
if ( this.isFolder ) {
|
||||
if ( this.content === undefined ) {
|
||||
return false;
|
||||
} else if ( this.content instanceof Array ) {
|
||||
for ( idx in this.content ) {
|
||||
if ( !this.content[idx].isComplete() ) {
|
||||
return false;
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
this.toHtml = function () {
|
||||
|
||||
var $entry = $( "<div class='entry' />" );
|
||||
|
||||
try {
|
||||
var $a = $( "<a href='" + this.absHref + "' />" )
|
||||
.appendTo( $entry )
|
||||
.append( $( "<span class='icon'><img src='" + this.icon16 + "' /></span>" ) )
|
||||
.append( $( "<span class='label'>" + this.label + "</span>" ) );
|
||||
|
||||
if ( this.isFolder ) {
|
||||
$entry.addClass( "folder" );
|
||||
if ( this.absHref === document.location.pathname ) {
|
||||
$a.find( ".icon img" ).attr( "src", "/h5ai/images/folder-open.png" );
|
||||
$entry.addClass( "current" );
|
||||
};
|
||||
if ( this.content instanceof Array ) {
|
||||
var $ul = $( "<ul class='content' />" ).appendTo( $entry );
|
||||
for ( idx in this.content ) {
|
||||
$( "<li />" ).append( this.content[idx].toHtml() ).appendTo( $ul );
|
||||
};
|
||||
} else if ( this.content === undefined ) {
|
||||
$a.append( $( "<span class='hint'><img src='/h5ai/images/loading.png' /></span>" ) );
|
||||
} else if ( this.content === 200 ) {
|
||||
$a.find( ".icon img" ).attr( "src", "/h5ai/images/folder-page.png" );
|
||||
$a.append( $( "<span class='hint'><img src='/h5ai/images/page.png' /></span>" ) );
|
||||
} else {
|
||||
$a.append( $( "<span class='hint error'>" + this.content + "</span>" ) );
|
||||
$entry.addClass( "notListable" );
|
||||
};
|
||||
} else {
|
||||
$entry.addClass( "file" );
|
||||
};
|
||||
|
||||
} catch( err ) {
|
||||
$( "<span class='fail'>fail</span>" ).appendTo( $entry );
|
||||
};
|
||||
|
||||
return $entry;
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
init()
|
||||
};
|
||||
|
||||
} )( jQuery );
|
11
src/h5ai/js/inc/jquery.mousewheel.min.js
vendored
Normal file
@@ -0,0 +1,11 @@
|
||||
/* Copyright (c) 2009 Brandon Aaron (http://brandonaaron.net)
|
||||
* Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
|
||||
* and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
|
||||
* Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers.
|
||||
* Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix.
|
||||
*
|
||||
* Version: 3.0.2
|
||||
*
|
||||
* Requires: 1.2.2+
|
||||
*/
|
||||
(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d;){this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d;){this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(f){var d=[].slice.call(arguments,1),g=0,e=true;f=c.event.fix(f||window.event);f.type="mousewheel";if(f.wheelDelta){g=f.wheelDelta/120}if(f.detail){g=-f.detail/3}d.unshift(f,g);return c.event.handle.apply(this,d)}})(jQuery);
|
483
src/h5ai/js/inc/path.js
Normal file
@@ -0,0 +1,483 @@
|
||||
|
||||
var pathnameSplitRegEx = /^(\/(.*\/)*)([^\/]+\/?)$/;
|
||||
var pathEndsWithSlashRegEx = /\/$/;
|
||||
|
||||
var PathCache = function () {
|
||||
|
||||
|
||||
this.cache = {};
|
||||
this.objectCache = {};
|
||||
|
||||
|
||||
this.splitPathname = function ( pathname ) {
|
||||
|
||||
if ( pathname === "/" ) {
|
||||
return [ "", "/" ];
|
||||
};
|
||||
var match = pathnameSplitRegEx.exec( pathname );
|
||||
return [ match[1], match[3] ];
|
||||
};
|
||||
|
||||
|
||||
this.loadCache = function () {
|
||||
|
||||
var json = localStorage.getItem( "h5ai.cache" );
|
||||
var objs = $.evalJSON( json );
|
||||
var objectCache = {};
|
||||
for ( idx in objs ) {
|
||||
var obj = objs[idx];
|
||||
objectCache[obj.r] = obj;
|
||||
};
|
||||
return objectCache;
|
||||
};
|
||||
|
||||
|
||||
this.storeCache = function () {
|
||||
|
||||
var objs = [];
|
||||
for ( ref in this.objectCache ) {
|
||||
objs.push( this.objectCache[ref] );
|
||||
};
|
||||
var json = $.toJSON( objs );
|
||||
localStorage.setItem( "h5ai.cache", json );
|
||||
};
|
||||
|
||||
|
||||
this.pathToObject = function ( path ) {
|
||||
|
||||
var object = {
|
||||
r: path.absHref,
|
||||
s: path.status,
|
||||
c: [],
|
||||
o: path.treeOpen
|
||||
};
|
||||
|
||||
if ( path.content !== undefined ) {
|
||||
for ( ref in path.content ) {
|
||||
object.c.push( ref );
|
||||
};
|
||||
};
|
||||
|
||||
return object;
|
||||
};
|
||||
|
||||
|
||||
this.objectToPath = function ( obj ) {
|
||||
|
||||
var path = this.getPathForFolder( obj.r );
|
||||
path.status = obj.s;
|
||||
path.content = {};
|
||||
path.treeOpen = obj.o;
|
||||
for ( idx in obj.c ) {
|
||||
var href = obj.c[idx];
|
||||
path.content[href] = this.getPathForFolder( href );
|
||||
};
|
||||
return path;
|
||||
};
|
||||
|
||||
|
||||
this.getAbsHref = function ( folder, tableRow ) {
|
||||
|
||||
if ( ! pathEndsWithSlashRegEx.test( folder ) ) {
|
||||
folder += "/";
|
||||
};
|
||||
|
||||
if ( tableRow === undefined ) {
|
||||
return folder;
|
||||
};
|
||||
|
||||
var $a = $( tableRow ).find( "td" ).eq( 1 ).find( "a" );
|
||||
var isParentFolder = ( $a.text() === "Parent Directory" );
|
||||
var href = $a.attr( "href" );
|
||||
return isParentFolder ? undefined : folder + href;
|
||||
};
|
||||
|
||||
|
||||
this.getPathForFolder = function ( folder ) {
|
||||
|
||||
var absHref = this.getAbsHref( folder );
|
||||
|
||||
var cachedPath = this.cache[absHref];
|
||||
if ( cachedPath !== undefined ) {
|
||||
return cachedPath;
|
||||
};
|
||||
|
||||
var path = new Path( this, folder );
|
||||
this.cache[path.absHref] = path;
|
||||
|
||||
var obj = this.objectCache[absHref];
|
||||
if ( obj !== undefined ) {
|
||||
path.status = obj.s;
|
||||
path.content = {};
|
||||
path.treeOpen = obj.o;
|
||||
for ( idx in obj.c ) {
|
||||
var href = obj.c[idx];
|
||||
path.content[href] = this.getPathForFolder( href );
|
||||
};
|
||||
} else {
|
||||
var obj = this.pathToObject( path );
|
||||
this.objectCache[obj.r] = obj;
|
||||
this.storeCache();
|
||||
};
|
||||
|
||||
return path;
|
||||
};
|
||||
|
||||
|
||||
this.getPathForTableRow = function ( parentFolder, tableRow ) {
|
||||
|
||||
var absHref = this.getAbsHref( parentFolder, tableRow );
|
||||
|
||||
var cachedPath = this.cache[absHref];
|
||||
if ( cachedPath !== undefined ) {
|
||||
return cachedPath;
|
||||
};
|
||||
|
||||
var path = new Path( this, parentFolder, tableRow );
|
||||
if ( ! path.isParentFolder ) {
|
||||
this.cache[path.absHref] = path;
|
||||
|
||||
var obj = this.objectCache[absHref];
|
||||
if ( obj !== undefined ) {
|
||||
path.status = obj.s;
|
||||
path.content = {};
|
||||
path.treeOpen = obj.o;
|
||||
for ( idx in obj.c ) {
|
||||
var href = obj.c[idx];
|
||||
path.content[href] = this.getPathForFolder( href );
|
||||
};
|
||||
} else {
|
||||
if ( path.isFolder && path.status !== undefined ) {
|
||||
var obj = this.pathToObject( path );
|
||||
this.objectCache[obj.r] = obj;
|
||||
this.storeCache();
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
return path;
|
||||
};
|
||||
|
||||
|
||||
this.objectCache = this.loadCache();
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var Path = function ( pathCache, folder, tableRow ) {
|
||||
|
||||
if ( ! pathEndsWithSlashRegEx.test( folder ) ) {
|
||||
folder += "/";
|
||||
};
|
||||
|
||||
if ( tableRow !== undefined ) {
|
||||
var $tds = $( tableRow ).find( "td" );
|
||||
var $img = $tds.eq( 0 ).find( "img" );
|
||||
var $a= $tds.eq( 1 ).find( "a" );
|
||||
|
||||
this.parentFolder = folder;
|
||||
this.icon16 = $img.attr( "src" );
|
||||
this.alt = $img.attr( "alt" );
|
||||
this.label = $a.text();
|
||||
this.href = $a.attr("href");
|
||||
this.date = $tds.eq( 2 ).text();
|
||||
this.size = $tds.eq( 3 ).text();
|
||||
} else {
|
||||
var splits = pathCache.splitPathname( folder );
|
||||
|
||||
this.parentFolder = splits[0];
|
||||
this.href = splits[1];
|
||||
this.label = decodeURI( splits[1] );
|
||||
this.icon16 = "/h5ai/icons/16x16/folder.png";
|
||||
this.alt = "[DIR]";
|
||||
this.date = "";
|
||||
this.size = "";
|
||||
if ( this.label === "/" ) {
|
||||
this.label = decodeURI( document.domain ) + "/";
|
||||
};
|
||||
};
|
||||
|
||||
if ( pathEndsWithSlashRegEx.test( this.label ) ) {
|
||||
this.label = this.label.slice( 0, -1 );
|
||||
};
|
||||
|
||||
this.icon48 = this.icon16.replace( "16x16", "48x48" );
|
||||
this.isFolder = ( this.alt === "[DIR]" );
|
||||
this.isParentFolder = ( this.isFolder && this.label === "Parent Directory" );
|
||||
this.absHref = this.isParentFolder ? this.href : this.parentFolder + this.href;
|
||||
this.isCurrentFolder = ( this.absHref === document.location.pathname );
|
||||
this.isDomain = ( this.absHref === "/" );
|
||||
|
||||
if ( this.isParentFolder && h5ai.config.setParentFolderLabels ) {
|
||||
if ( this.isDomain ) {
|
||||
this.label = decodeURI( document.domain );
|
||||
} else {
|
||||
this.label = decodeURI( pathCache.splitPathname( pathCache.splitPathname( this.parentFolder )[0] )[1].slice( 0, -1 ) );
|
||||
};
|
||||
};
|
||||
|
||||
this.status = undefined; // undefined, "h5ai" or HTTP response code
|
||||
this.content = undefined; // associative array path.absHref -> path
|
||||
this.html = {
|
||||
$crumb: undefined,
|
||||
$extended: undefined,
|
||||
$tree: undefined
|
||||
};
|
||||
this.treeOpen = false;
|
||||
|
||||
this.isEmpty = function() {
|
||||
|
||||
return this.content === undefined || $.isEmptyObject( this.content );
|
||||
};
|
||||
|
||||
|
||||
this.onClick = function ( context ) {
|
||||
|
||||
pathCache.storeCache();
|
||||
h5ai.triggerPathClick( this, context );
|
||||
};
|
||||
|
||||
|
||||
this.onHoverIn = function () {
|
||||
|
||||
if ( h5ai.config.linkHoverStates ) {
|
||||
for ( ref in this.html ) {
|
||||
$ref = this.html[ref];
|
||||
if ( $ref !== undefined ) {
|
||||
$ref.find( "> a" ).addClass( "hover" );
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
this.onHoverOut = function () {
|
||||
|
||||
if ( h5ai.config.linkHoverStates ) {
|
||||
for ( ref in this.html ) {
|
||||
$ref = this.html[ref];
|
||||
if ( $ref !== undefined ) {
|
||||
$ref.find( "> a" ).removeClass( "hover" );
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
this.updateHtml = function () {
|
||||
|
||||
this.updateCrumbHtml();
|
||||
this.updateExtendedHtml();
|
||||
this.updateTreeHtml();
|
||||
};
|
||||
|
||||
|
||||
this.updateCrumbHtml = function () {
|
||||
|
||||
if ( this.html.$crumb !== undefined && this.html.$crumb.data( "status" ) === this.status ) {
|
||||
return this.html.$crumb;
|
||||
};
|
||||
|
||||
var $html = $( "<li class='crumb' />" ).data( "path", this );
|
||||
if ( this.status !== undefined ) {
|
||||
$html.data( "status", this.status );
|
||||
};
|
||||
|
||||
try {
|
||||
$html.addClass( this.isFolder ? "folder" : "file" );
|
||||
var $a = $( "<a><img src='/h5ai/images/crumb.png' alt='>' />" + this.label + "</a>" );
|
||||
$a.attr( "href", this.absHref );
|
||||
$a.click( $.proxy( function() { this.onClick( "crumb" ); }, this ) );
|
||||
$a.hover( $.proxy( function() { this.onHoverIn( "crumb" ); }, this ), $.proxy( function() { this.onHoverOut( "crumb" ); }, this ) );
|
||||
$html.append( $a );
|
||||
|
||||
if ( this.isDomain ) {
|
||||
$html.addClass( "domain" );
|
||||
$a.find( "img" ).attr( "src", "/h5ai/images/home.png" );
|
||||
};
|
||||
|
||||
if ( this.isCurrentFolder ) {
|
||||
$html.addClass( "current" );
|
||||
};
|
||||
|
||||
if ( !isNaN( this.status ) ) {
|
||||
if ( this.status === 200 ) {
|
||||
$( "<img class='hint' src='/h5ai/images/page.png' alt='not listable' />" ).appendTo( $a );
|
||||
} else {
|
||||
$( "<span class='hint'>(" + this.status + ")</span>" ).appendTo( $a );
|
||||
};
|
||||
};
|
||||
} catch( err ) {
|
||||
$( "<span class='fail'>failed</span>" ).appendTo( $html );
|
||||
};
|
||||
|
||||
if ( this.html.$crumb !== undefined ) {
|
||||
this.html.$crumb.replaceWith( $html );
|
||||
};
|
||||
this.html.$crumb = $html;
|
||||
|
||||
return $html;
|
||||
};
|
||||
|
||||
|
||||
this.updateExtendedHtml = function () {
|
||||
|
||||
if ( this.html.$extended !== undefined && this.html.$extended.data( "status" ) === this.status ) {
|
||||
return this.html.$extended;
|
||||
};
|
||||
|
||||
var $html = $( "<li class='entry' />" ).data( "path", this );
|
||||
if ( this.status !== undefined ) {
|
||||
$html.data( "status", this.status );
|
||||
};
|
||||
|
||||
try {
|
||||
$html.addClass( this.isFolder ? "folder" : "file" );
|
||||
var $a = $( "<a />" ).appendTo( $html );
|
||||
$a.attr( "href", this.absHref );
|
||||
$a.click( $.proxy( function() { this.onClick( "extended" ); }, this ) );
|
||||
$a.hover( $.proxy( function() { this.onHoverIn( "extended" ); }, this ), $.proxy( function() { this.onHoverOut( "extended" ); }, this ) );
|
||||
|
||||
$( "<span class='icon small'><img src='" + this.icon16 + "' alt='" + this.alt + "' /></span>" ).appendTo( $a );
|
||||
$( "<span class='icon big'><img src='" + this.icon48 + "' alt='" + this.alt + "' /></span>" ).appendTo( $a );
|
||||
var $label = $( "<span class='label'>" + this.label + "</span>" ).appendTo( $a );
|
||||
$( "<span class='date'>" + this.date + "</span>" ).appendTo( $a );
|
||||
$( "<span class='size'>" + this.size + "</span>" ).appendTo( $a );
|
||||
|
||||
if ( this.isParentFolder ) {
|
||||
if ( !h5ai.config.setParentFolderLabels ) {
|
||||
$label.addClass( "l10n-parentDirectory" );
|
||||
};
|
||||
$html.addClass( "parentfolder" );
|
||||
};
|
||||
|
||||
if ( !isNaN( this.status ) ) {
|
||||
if ( this.status === 200 ) {
|
||||
$html.addClass( "page" );
|
||||
$a.find( ".icon.small img" ).attr( "src", "/h5ai/icons/16x16/folder-page.png" );
|
||||
$a.find( ".icon.big img" ).attr( "src", "/h5ai/icons/48x48/folder-page.png" );
|
||||
} else {
|
||||
$html.addClass( "error" );
|
||||
$label.append( $( "<span class='hint'> " + this.status + " </span>" ) );
|
||||
};
|
||||
};
|
||||
} catch( err ) {
|
||||
$( "<span class='fail'>failed</span>" ).appendTo( $html );
|
||||
};
|
||||
|
||||
if ( this.html.$extended !== undefined ) {
|
||||
this.html.$extended.replaceWith( $html );
|
||||
};
|
||||
this.html.$extended = $html;
|
||||
|
||||
return $html;
|
||||
};
|
||||
|
||||
|
||||
this.updateTreeHtml = function () {
|
||||
|
||||
var $html = $( "<div class='entry' />" ).data( "path", this );
|
||||
var $blank = $( "<span class='blank' />" ).appendTo( $html );
|
||||
|
||||
try {
|
||||
$html.addClass( this.isFolder ? "folder" : "file" );
|
||||
var $a = $( "<a />" )
|
||||
.appendTo( $html )
|
||||
.append( $( "<span class='icon'><img src='" + this.icon16 + "' /></span>" ) )
|
||||
.append( $( "<span class='label'>" + this.label + "</span>" ) );
|
||||
$a.attr( "href", this.absHref );
|
||||
$a.click( $.proxy( function() { this.onClick( "tree" ); }, this ) );
|
||||
$a.hover( $.proxy( function() { this.onHoverIn( "tree" ); }, this ), $.proxy( function() { this.onHoverOut( "tree" ); }, this ) );
|
||||
|
||||
if ( this.isFolder ) {
|
||||
// indicator
|
||||
if ( this.status === undefined || !this.isEmpty() ) {
|
||||
var $indicator = $( "<span class='indicator'><img src='/h5ai/images/tree.png' /></span>" );
|
||||
if ( this.status === undefined ) {
|
||||
$indicator.addClass( "unknown" );
|
||||
} else if ( this.treeOpen ) {
|
||||
$indicator.addClass( "open" );
|
||||
};
|
||||
$indicator.click( $.proxy( function( event ) {
|
||||
if ( $indicator.hasClass( "unknown" ) ) {
|
||||
tree.fetchStatusAndContent( this.absHref, false, $.proxy( function ( status, content ) {
|
||||
this.status = status;
|
||||
this.content = content;
|
||||
this.treeOpen = true;
|
||||
pathCache.objectCache[this.absHref] = pathCache.pathToObject( this );
|
||||
$( "#tree" ).get( 0 ).updateScrollbar( true );
|
||||
this.updateTreeHtml( function() {
|
||||
$( "#tree" ).get( 0 ).updateScrollbar();
|
||||
} );
|
||||
}, this ) );
|
||||
} else if ( $indicator.hasClass( "open" ) ) {
|
||||
this.treeOpen = false;
|
||||
pathCache.objectCache[this.absHref] = pathCache.pathToObject( this );
|
||||
$indicator.removeClass( "open" );
|
||||
$( "#tree" ).get( 0 ).updateScrollbar( true );
|
||||
$html.find( "> ul.content" ).slideUp( function() {
|
||||
$( "#tree" ).get( 0 ).updateScrollbar();
|
||||
} );
|
||||
} else {
|
||||
this.treeOpen = true;
|
||||
pathCache.objectCache[this.absHref] = pathCache.pathToObject( this );
|
||||
$indicator.addClass( "open" );
|
||||
$( "#tree" ).get( 0 ).updateScrollbar( true );
|
||||
$html.find( "> ul.content" ).slideDown( function() {
|
||||
$( "#tree" ).get( 0 ).updateScrollbar();
|
||||
} );
|
||||
};
|
||||
}, this ) );
|
||||
$blank.replaceWith( $indicator );
|
||||
};
|
||||
|
||||
// is this the domain?
|
||||
if ( this.isDomain ) {
|
||||
$html.addClass( "domain" );
|
||||
$a.find( ".icon img" ).attr( "src", "/h5ai/icons/16x16/folder-home.png" );
|
||||
};
|
||||
|
||||
// is this the current folder?
|
||||
if ( this.isCurrentFolder ) {
|
||||
$html.addClass( "current" );
|
||||
$a.find( ".icon img" ).attr( "src", "/h5ai/icons/16x16/folder-open.png" );
|
||||
};
|
||||
|
||||
// does it have subfolders?
|
||||
if ( !this.isEmpty() ) {
|
||||
var $ul = $( "<ul class='content' />" ).appendTo( $html );
|
||||
for ( idx in this.content ) {
|
||||
$( "<li />" ).append( this.content[idx].updateTreeHtml() ).appendTo( $ul );
|
||||
};
|
||||
if ( this.status === undefined || !this.treeOpen ) {
|
||||
$ul.hide();
|
||||
};
|
||||
};
|
||||
|
||||
// reflect folder status
|
||||
if ( !isNaN( this.status ) ) {
|
||||
if ( this.status === 200 ) {
|
||||
$a.find( ".icon img" ).attr( "src", "/h5ai/icons/16x16/folder-page.png" );
|
||||
$a.append( $( "<span class='hint'><img src='/h5ai/images/page.png' /></span>" ) );
|
||||
} else {
|
||||
$html.addClass( "error" );
|
||||
$a.append( $( "<span class='hint'>" + this.status + "</span>" ) );
|
||||
};
|
||||
};
|
||||
};
|
||||
} catch( err ) {
|
||||
$( "<span class='fail'>failed</span>" ).appendTo( $html );
|
||||
};
|
||||
|
||||
if ( this.html.$tree !== undefined ) {
|
||||
this.html.$tree.replaceWith( $html );
|
||||
};
|
||||
this.html.$tree = $html;
|
||||
|
||||
return $html;
|
||||
};
|
||||
};
|
287
src/h5ai/js/inc/tree.js
Normal file
@@ -0,0 +1,287 @@
|
||||
|
||||
var Tree = function ( pathCache, h5ai ) {
|
||||
|
||||
var THIS = this;
|
||||
var contentTypeRegEx = /^text\/html;h5ai=/;
|
||||
|
||||
this.init = function () {
|
||||
|
||||
if ( h5ai.config.showTree ) {
|
||||
this.updatePaths();
|
||||
this.populateTree();
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
this.updatePath = function ( path ) {
|
||||
|
||||
if ( path.isFolder && !path.isParentFolder && path.status === undefined ) {
|
||||
this.fetchStatus( path.absHref, function ( status ) {
|
||||
if ( status !== "h5ai" ) {
|
||||
path.status = status;
|
||||
};
|
||||
path.updateHtml();
|
||||
} );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
this.updatePaths = function () {
|
||||
|
||||
for ( var ref in pathCache.cache ) {
|
||||
this.updatePath( pathCache.cache[ref] );
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
this.populateTree = function () {
|
||||
|
||||
var $tree = $( "#tree" );
|
||||
var $extended = $( "#extended" );
|
||||
var shiftTree = function ( forceVisible, dontAnimate ) {
|
||||
if ( $tree.outerWidth() < $extended.offset().left || forceVisible === true ) {
|
||||
if ( dontAnimate === true ) {
|
||||
$tree.stop().css( { left: 0 } );
|
||||
} else {
|
||||
$tree.stop().animate( { left: 0 } );
|
||||
};
|
||||
} else {
|
||||
if ( dontAnimate === true ) {
|
||||
$tree.stop().css( { left: 18 - $tree.outerWidth() } );
|
||||
} else {
|
||||
$tree.stop().animate( { left: 18 - $tree.outerWidth() } );
|
||||
};
|
||||
};
|
||||
};
|
||||
|
||||
$tree.hover( function () { shiftTree( true ); }, function () { shiftTree(); } );
|
||||
$( window ).resize( function() {
|
||||
shiftTree();
|
||||
} );
|
||||
|
||||
this.fetchTree( document.location.pathname, function( path ) {
|
||||
$tree.append( path.updateTreeHtml() );
|
||||
$tree.show();
|
||||
scrollpanel( $tree );
|
||||
shiftTree( false, true );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
this.fetchTree = function ( pathname, callback, childPath ) {
|
||||
|
||||
this.fetchPath( pathname, $.proxy( function ( path ) {
|
||||
|
||||
path.treeOpen = true;
|
||||
|
||||
if ( childPath !== undefined ) {
|
||||
path.content[ childPath.absHref ] = childPath;
|
||||
};
|
||||
|
||||
var parent = pathCache.splitPathname( pathname )[0];
|
||||
if ( parent === "" ) {
|
||||
callback( path );
|
||||
} else {
|
||||
this.fetchTree( parent, callback, path );
|
||||
};
|
||||
}, this ) );
|
||||
};
|
||||
|
||||
|
||||
this.fetchPath = function ( pathname, callback ) {
|
||||
|
||||
this.fetchStatusAndContent( pathname, false, function ( status, content ) {
|
||||
var path = pathCache.getPathForFolder( pathname );
|
||||
path.status = status;
|
||||
path.content = content;
|
||||
callback( path );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
this.fetchStatusAndContent = function ( pathname, includeParent, callback ) {
|
||||
|
||||
this.fetchStatus( pathname, function ( status ) {
|
||||
|
||||
if ( status !== "h5ai" ) {
|
||||
callback( status, {} );
|
||||
return;
|
||||
};
|
||||
|
||||
$.ajax( {
|
||||
url: pathname,
|
||||
type: "GET",
|
||||
dataType: "html",
|
||||
error: function ( xhr ) {
|
||||
callback( xhr.status, {} ); // since it was checked before this should never happen
|
||||
},
|
||||
success: function ( html, status, xhr ) {
|
||||
if ( !contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
|
||||
callback( xhr.status, {} ); // since it was checked before this should never happen
|
||||
return;
|
||||
};
|
||||
|
||||
var content = {};
|
||||
$( html ).find( "#table td" ).closest( "tr" ).each( function () {
|
||||
var path = pathCache.getPathForTableRow( pathname, this );
|
||||
if ( path.isFolder && ( !path.isParentFolder || includeParent ) ) {
|
||||
content[path.absHref] = path;
|
||||
THIS.updatePath( path );
|
||||
};
|
||||
} );
|
||||
callback( "h5ai", content );
|
||||
}
|
||||
} );
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
var pathnameStatusCache = {};
|
||||
|
||||
this.fetchStatus = function ( pathname, callback ) {
|
||||
|
||||
if ( h5ai.config.folderStatus[ pathname ] !== undefined ) {
|
||||
callback( h5ai.config.folderStatus[ pathname ] );
|
||||
return;
|
||||
} else if ( pathnameStatusCache[ pathname ] !== undefined ) {
|
||||
callback( pathnameStatusCache[ pathname ] );
|
||||
return;
|
||||
};
|
||||
|
||||
$.ajax( {
|
||||
url: pathname,
|
||||
type: "HEAD",
|
||||
complete: function ( xhr ) {
|
||||
var status = xhr.status;
|
||||
if ( status === 200 && contentTypeRegEx.test( xhr.getResponseHeader( "Content-Type" ) ) ) {
|
||||
status = "h5ai";
|
||||
};
|
||||
pathnameStatusCache[ pathname ] = status;
|
||||
callback( status );
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
|
||||
var scrollpanel = function ( htmlElement ) {
|
||||
|
||||
var $element = $( htmlElement );
|
||||
|
||||
if ( $element.css( "position" ) === undefined || $element.css( "position" ) === "static" ) {
|
||||
$element.css( "position", "relative" );
|
||||
};
|
||||
|
||||
var $scrollbar = $( "<div class='scrollbar' />" );
|
||||
var $drag = $( "<div class='drag' />" ).appendTo( $scrollbar );
|
||||
$element
|
||||
.wrapInner( "<div class='wrapper'><div class='content' /></div>" )
|
||||
.append( $scrollbar );
|
||||
var $wrapper = $element.find( "> .wrapper" );
|
||||
var $content = $wrapper.find( "> .content" );
|
||||
var mouseOffsetY = 0;
|
||||
var updateId = undefined;
|
||||
|
||||
var update = function ( repeat ) {
|
||||
if ( updateId !== undefined && !repeat ) {
|
||||
clearInterval( updateId );
|
||||
updateId = undefined;
|
||||
} else if ( updateId === undefined && repeat ) {
|
||||
updateId = setInterval( function() { update( true ); }, 50 );
|
||||
};
|
||||
|
||||
$wrapper.css( "height", $element.height() );
|
||||
var visibleHeight = $element.height();
|
||||
var contentHeight = $content.outerHeight();
|
||||
var scrollTop = $wrapper.scrollTop();
|
||||
var scrollTopFrac = scrollTop / contentHeight;
|
||||
var visVertFrac = Math.min( visibleHeight / contentHeight, 1 );
|
||||
|
||||
if ( visVertFrac < 1 ) {
|
||||
$scrollbar
|
||||
.fadeIn( 50 )
|
||||
.css( {
|
||||
height: $element.innerHeight() + $scrollbar.height() - $scrollbar.outerHeight( true )
|
||||
} );
|
||||
$drag
|
||||
.css( {
|
||||
top: $scrollbar.height() * scrollTopFrac,
|
||||
height: $scrollbar.height() * visVertFrac
|
||||
} );
|
||||
} else {
|
||||
$scrollbar.fadeOut( 50 );
|
||||
};
|
||||
};
|
||||
var scroll = function ( event ) {
|
||||
var clickFrac = ( event.pageY - $scrollbar.offset().top - mouseOffsetY ) / $scrollbar.height();
|
||||
$wrapper.scrollTop( $content.outerHeight() * clickFrac );
|
||||
update();
|
||||
};
|
||||
|
||||
$element
|
||||
.mousewheel( function ( event, delta) {
|
||||
$wrapper.scrollTop( $wrapper.scrollTop() - 50 * delta );
|
||||
update();
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
} )
|
||||
.scroll( update );
|
||||
$element.get( 0 ).updateScrollbar = update;
|
||||
$wrapper
|
||||
.css( {
|
||||
"padding-right": $scrollbar.outerWidth( true ),
|
||||
height: $element.height(),
|
||||
overflow: "hidden"
|
||||
} );
|
||||
$scrollbar
|
||||
.css( {
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
right: 0,
|
||||
overflow: "hidden"
|
||||
} )
|
||||
.mousedown( function ( event ) {
|
||||
mouseOffsetY = $drag.outerHeight() / 2;
|
||||
scroll( event );
|
||||
$scrollbar.addClass( "dragOn" );
|
||||
$( window )
|
||||
.bind( "mousemove", scroll )
|
||||
.one( "mouseup", function ( event ) {
|
||||
$scrollbar.removeClass( "dragOn" );
|
||||
$( window ).unbind( "mousemove", scroll );
|
||||
scroll( event );
|
||||
event.stopPropagation();
|
||||
} );
|
||||
event.stopPropagation();
|
||||
} )
|
||||
.attr( "unselectable", "on" )
|
||||
.css( "-moz-user-select", "none" )
|
||||
.each( function () {
|
||||
this.onselectstart = function () {
|
||||
return false;
|
||||
};
|
||||
} );
|
||||
$drag
|
||||
.css( {
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
width: "100%"
|
||||
} )
|
||||
.mousedown( function ( event ) {
|
||||
mouseOffsetY = event.pageY - $drag.offset().top;
|
||||
scroll( event );
|
||||
$scrollbar.addClass( "dragOn" );
|
||||
$( window )
|
||||
.bind( "mousemove", scroll )
|
||||
.one( "mouseup", function ( event ) {
|
||||
$scrollbar.removeClass( "dragOn" );
|
||||
$( window ).unbind( "mousemove", scroll );
|
||||
scroll( event );
|
||||
event.stopPropagation();
|
||||
} );
|
||||
event.stopPropagation();
|
||||
} );
|
||||
|
||||
update();
|
||||
};
|
||||
|
||||
};
|
@@ -1,3 +1,66 @@
|
||||
// @include "inc/jquery.json.min.js"
|
||||
// @include "inc/h5ai.js"
|
||||
// #not#include "inc/h5aitree.js"
|
||||
( function( $ ) {
|
||||
|
||||
// @include "inc/jquery.json.min.js"
|
||||
// @include "inc/jquery.mousewheel.min.js"
|
||||
// @include "inc/path.js"
|
||||
// @include "inc/h5ai.js"
|
||||
// @include "inc/tree.js"
|
||||
|
||||
// http://paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
|
||||
$.log = function () {
|
||||
$.log.history = $.log.history || [];
|
||||
$.log.history.push( arguments );
|
||||
if ( window.console ) {
|
||||
window.console.log( Array.prototype.slice.call( arguments ) );
|
||||
};
|
||||
};
|
||||
|
||||
var Timer = function () {
|
||||
this.start = new Date().getTime();;
|
||||
this.last = this.start;
|
||||
this.log = function ( label ) {
|
||||
var now = new Date().getTime();
|
||||
$.log( "timer", label, "+" + (now - this.last), "=" + (now - this.start) );
|
||||
this.last = now;
|
||||
};
|
||||
};
|
||||
$.timer = new Timer();
|
||||
|
||||
|
||||
/*******************************
|
||||
* create
|
||||
*******************************/
|
||||
|
||||
$.timer.log( "start pathcache" );
|
||||
var pathCache = new PathCache();
|
||||
$.timer.log( "end pathcache" );
|
||||
var h5ai = new H5ai( h5aiOptions, h5aiLangs, pathCache );
|
||||
var tree = new Tree( pathCache, h5ai );
|
||||
|
||||
|
||||
/*******************************
|
||||
* register public api
|
||||
*******************************/
|
||||
|
||||
$.h5ai = {
|
||||
click: $.proxy( h5ai.pathClick, h5ai )
|
||||
};
|
||||
|
||||
/*******************************
|
||||
* init after dom load
|
||||
*******************************/
|
||||
|
||||
$( function() {
|
||||
h5ai.init();
|
||||
tree.init();
|
||||
|
||||
// just for testing, resets the local cache /////////
|
||||
$( ".l10n-footerUsing" ).click( function () {
|
||||
pathCache.cache = {};
|
||||
pathCache.objectCache = {};
|
||||
pathCache.storeCache();
|
||||
} );
|
||||
/////////////////////////////////////////////////////
|
||||
} );
|
||||
|
||||
} )( jQuery );
|
153
src/h5ai/options.js
Normal file
@@ -0,0 +1,153 @@
|
||||
/*
|
||||
* h5ai %BUILD_VERSION%
|
||||
* Options and localization
|
||||
*/
|
||||
|
||||
h5aiOptions = {
|
||||
|
||||
/*
|
||||
* An array of view modes the user may choose from. Currently there
|
||||
* are two possible values: "details" and "icons". The first value
|
||||
* indicates the default view mode. If only one value is given the
|
||||
* view mode is fixed and the selector buttons are hidden.
|
||||
* The user selected view mode is also stored local in modern browsers
|
||||
* so that it will be persistent.
|
||||
*/
|
||||
viewmodes: [ "details", "icons" ],
|
||||
|
||||
/*
|
||||
* Show a folder tree, boolean.
|
||||
* Note that this tree might have side effects as it sends HEAD requests
|
||||
* to the folders, and therefore will invoke index.php scripts. Use
|
||||
* folderStatus below to avoid such requests.
|
||||
* It might also affect performance significantly.
|
||||
*/
|
||||
showTree: true,
|
||||
|
||||
/*
|
||||
* Associative array of folders and their HTTP status codes to
|
||||
* avoid HEAD requests to that folders. The key (folder) must start
|
||||
* and end with a slash (/).
|
||||
* For example:
|
||||
* "/some/folder/": 200
|
||||
* will always return HTTP status 200 (OK), which will be interpreted
|
||||
* as a non auto indexed folder, that means a folder containing an
|
||||
* appropriate default index file.
|
||||
*/
|
||||
folderStatus: {
|
||||
/*
|
||||
* for example:
|
||||
* "/some/folder/": 200
|
||||
*/
|
||||
},
|
||||
|
||||
/*
|
||||
* Localization, for example "en", "de" etc. - see h5aiLangs below for
|
||||
* possible values. Adjust it to your needs. If lang is not found in
|
||||
* h5aiLangs the displayed labels stay unchanged.
|
||||
*/
|
||||
lang: undefined,
|
||||
|
||||
/*
|
||||
* Try to use browser language, falls back to previous specified lang.
|
||||
*/
|
||||
useBrowserLang: true,
|
||||
|
||||
/*
|
||||
* Set parent folder labels to real folder names.
|
||||
*/
|
||||
setParentFolderLabels: true,
|
||||
|
||||
/*
|
||||
* Link the hover effects between crumb, extended view and tree.
|
||||
*/
|
||||
linkHoverStates: true
|
||||
};
|
||||
|
||||
|
||||
|
||||
/*
|
||||
* Available translations.
|
||||
* "en" is just an example - see it as a reference. Those values
|
||||
* are "hardcoded" and will be displayed if all labels stay unchanged.
|
||||
*/
|
||||
h5aiLangs = {
|
||||
|
||||
"en": {
|
||||
viewDetails: "details",
|
||||
viewIcons: "icons",
|
||||
columnName: "Name",
|
||||
columnLastModified: "Last modified",
|
||||
columnSize: "Size",
|
||||
footerUsing: "using",
|
||||
parentDirectory: "Parent Directory",
|
||||
empty: "empty"
|
||||
},
|
||||
|
||||
"de": {
|
||||
viewDetails: "Details",
|
||||
viewIcons: "Icons",
|
||||
columnName: "Name",
|
||||
columnLastModified: "Geändert",
|
||||
columnSize: "Größe",
|
||||
footerUsing: "nutzt",
|
||||
parentDirectory: "Übergeordnetes Verzeichnis",
|
||||
empty: "leer"
|
||||
},
|
||||
|
||||
"fr": {
|
||||
viewDetails: "détails",
|
||||
viewIcons: "icônes",
|
||||
columnName: "Nom",
|
||||
columnLastModified: "Dernière modification",
|
||||
columnSize: "Taille",
|
||||
footerUsing: "utilise",
|
||||
parentDirectory: "Dossier parent",
|
||||
empty: "vide"
|
||||
},
|
||||
|
||||
"nl": {
|
||||
viewDetails: "details",
|
||||
viewIcons: "iconen",
|
||||
columnName: "Naam",
|
||||
columnLastModified: "Laatste wijziging",
|
||||
columnSize: "Grootte",
|
||||
footerUsing: "gebruikt",
|
||||
parentDirectory: "Bovenliggende map",
|
||||
empty: "lege"
|
||||
},
|
||||
|
||||
"sv": {
|
||||
viewDetails: "detaljerad",
|
||||
viewIcons: "ikoner",
|
||||
columnName: "Filnamn",
|
||||
columnLastModified: "Senast ändrad",
|
||||
columnSize: "Filstorlek",
|
||||
footerUsing: "använder",
|
||||
parentDirectory: "Till överordnad mapp",
|
||||
empty: "tom"
|
||||
},
|
||||
|
||||
"cs": {
|
||||
viewDetails: "podrobnosti",
|
||||
viewIcons: "ikony",
|
||||
columnName: "Název",
|
||||
columnLastModified: "Upraveno",
|
||||
columnSize: "Velikost",
|
||||
footerUsing: "používá",
|
||||
parentDirectory: "Nadřazený adresář",
|
||||
empty: "prázdný"
|
||||
},
|
||||
|
||||
"sk": {
|
||||
viewDetails: "podrobnosti",
|
||||
viewIcons: "ikony",
|
||||
columnName: "Názov",
|
||||
columnLastModified: "Upravené",
|
||||
columnSize: "Velkosť",
|
||||
footerUsing: "používá",
|
||||
parentDirectory: "Nadriadený priečinok",
|
||||
empty: "prázdny"
|
||||
}
|
||||
|
||||
};
|
@@ -1,140 +0,0 @@
|
||||
################################
|
||||
# h5ai 0.5.2
|
||||
# customized .htaccess
|
||||
################################
|
||||
|
||||
|
||||
# Options +Indexes
|
||||
# Options +FollowSymLinks
|
||||
|
||||
|
||||
<IfModule mod_headers.c>
|
||||
|
||||
################################
|
||||
# cache images for 52 weeks
|
||||
################################
|
||||
|
||||
<FilesMatch "\.png$">
|
||||
Header set Cache-Control "max-age=31449600, public"
|
||||
</FilesMatch>
|
||||
|
||||
</IfModule>
|
||||
|
||||
|
||||
################################
|
||||
# style auto index
|
||||
################################
|
||||
|
||||
<IfModule mod_autoindex.c>
|
||||
|
||||
################################
|
||||
# uncomment the following line to force directory listing
|
||||
# even for directories with valid index files
|
||||
################################
|
||||
|
||||
# DirectoryIndex IGNORE-DEFAULT-INDEX-FILES
|
||||
|
||||
|
||||
################################
|
||||
# h5ai header and footer
|
||||
################################
|
||||
|
||||
HeaderName /h5ai/header.html
|
||||
ReadmeName /h5ai/footer.html
|
||||
|
||||
|
||||
################################
|
||||
# hide h5ai folder and config files from index
|
||||
################################
|
||||
|
||||
IndexIgnore h5ai h5ai.header.html h5ai.footer.html
|
||||
|
||||
|
||||
################################
|
||||
# table options
|
||||
################################
|
||||
|
||||
IndexOrderDefault Ascending Name
|
||||
|
||||
IndexOptions Type=text/html;h5ai=0.5.2
|
||||
IndexOptions Charset=UTF-8
|
||||
IndexOptions FancyIndexing
|
||||
IndexOptions HTMLTable
|
||||
IndexOptions XHTML
|
||||
IndexOptions SuppressHTMLPreamble
|
||||
IndexOptions SuppressRules
|
||||
IndexOptions SuppressDescription
|
||||
IndexOptions FoldersFirst
|
||||
IndexOptions IgnoreCase
|
||||
IndexOptions IconsAreLinks
|
||||
IndexOptions VersionSort
|
||||
IndexOptions NameWidth=*
|
||||
|
||||
|
||||
################################
|
||||
# icon mapping
|
||||
################################
|
||||
|
||||
AddIcon /h5ai/icons/16x16/parent.png ..
|
||||
AddIcon /h5ai/icons/16x16/folder.png ^^DIRECTORY^^
|
||||
AddIcon /h5ai/icons/16x16/blank.png ^^BLANKICON^^
|
||||
|
||||
AddIcon /h5ai/icons/16x16/readme.png README
|
||||
AddIcon /h5ai/icons/16x16/copying.png COPYING LICENSE
|
||||
AddIcon /h5ai/icons/16x16/install.png INSTALL
|
||||
AddIcon /h5ai/icons/16x16/authors.png AUTHORS
|
||||
AddIcon /h5ai/icons/16x16/log.png LOG Log log
|
||||
|
||||
AddIcon /h5ai/icons/16x16/css.png .less
|
||||
AddIcon /h5ai/icons/16x16/script.png .conf .ini .sh .shar .csh .ksh .tcl
|
||||
AddIcon /h5ai/icons/16x16/makefile.png .pom pom.xml build.xml
|
||||
AddIcon /h5ai/icons/16x16/bin.png .so .o
|
||||
|
||||
AddIcon /h5ai/icons/16x16/archive.png .tar.gz .tgz .tar.bz2
|
||||
AddIcon /h5ai/icons/16x16/zip.png .zip .Z .z .jar .war .gz .bz2
|
||||
AddIcon /h5ai/icons/16x16/tar.png .tar
|
||||
AddIcon /h5ai/icons/16x16/pdf.png .pdf
|
||||
AddIcon /h5ai/icons/16x16/deb.png .deb
|
||||
AddIcon /h5ai/icons/16x16/rpm.png .rpm
|
||||
AddIcon /h5ai/icons/16x16/cd.png .iso .cue
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/png.png image/png
|
||||
AddIconByType /h5ai/icons/16x16/jpg.png image/jpeg
|
||||
AddIconByType /h5ai/icons/16x16/gif.png image/gif
|
||||
AddIconByType /h5ai/icons/16x16/ico.png image/x-icon
|
||||
AddIconByType /h5ai/icons/16x16/bmp.png image/x-ms-bmp
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/html.png text/html
|
||||
AddIconByType /h5ai/icons/16x16/css.png text/css
|
||||
AddIconByType /h5ai/icons/16x16/xml.png application/xml
|
||||
AddIconByType /h5ai/icons/16x16/js.png application/javascript application/json
|
||||
AddIconByType /h5ai/icons/16x16/php.png application/x-httpd-php
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/py.png text/x-python
|
||||
AddIconByType /h5ai/icons/16x16/rb.png application/x-ruby
|
||||
AddIconByType /h5ai/icons/16x16/java.png text/x-java
|
||||
AddIconByType /h5ai/icons/16x16/cpp.png text/x-c++src
|
||||
AddIconByType /h5ai/icons/16x16/hpp.png text/x-c++hdr
|
||||
AddIconByType /h5ai/icons/16x16/c.png text/x-csrc
|
||||
AddIconByType /h5ai/icons/16x16/h.png text/x-chdr
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/pdf.png application/pdf
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/rtf.png text/rtf application/rtf
|
||||
AddIconByType /h5ai/icons/16x16/tex.png text/x-tex
|
||||
AddIconByType /h5ai/icons/16x16/makefile.png text/x-makefile
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/bin.png application/java-vm
|
||||
AddIconByType /h5ai/icons/16x16/exe.png application/x-executable application/x-msdos-program
|
||||
|
||||
AddIconByType /h5ai/icons/16x16/text.png text/*
|
||||
AddIconByType /h5ai/icons/16x16/image.png image/*
|
||||
AddIconByType /h5ai/icons/16x16/audio.png audio/*
|
||||
AddIconByType /h5ai/icons/16x16/video.png video/*
|
||||
|
||||
AddIconByEncoding /h5ai/icons/16x16/zip.png x-compress x-gzip x-bzip2
|
||||
|
||||
DefaultIcon /h5ai/icons/16x16/unknown.png
|
||||
|
||||
</IfModule>
|
||||
|
@@ -1,22 +0,0 @@
|
||||
<!-- generated code ends here -->
|
||||
</section>
|
||||
<section id="extended"></section>
|
||||
<footer></footer>
|
||||
</section>
|
||||
<section id="tree"></section>
|
||||
<footer>
|
||||
<a id="html5" href="http://www.w3.org/html/logo/" target="_blank" title="HTML5 semantics, storage & CSS3">
|
||||
<img class="logo" src="/h5ai/images/html5.png" alt="html5" />
|
||||
<img class="techclass" src="/h5ai/images/html5-semantics.png" alt="html5-semantics" />
|
||||
<img class="techclass" src="/h5ai/images/html5-storage.png" alt="html5-storage" />
|
||||
<img class="techclass" src="/h5ai/images/html5-css3.png" alt="html5-css3" />
|
||||
</a>
|
||||
<a href="http://larsjung.de/h5ai" target="_blank" title="h5ai 0.5.2">h5ai</a>
|
||||
using
|
||||
<a href="http://tiheum.deviantart.com/art/Faenza-Icons-173323228" target="_blank" title="icon theme for Gnome">Faenza icons</a>
|
||||
</footer>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write( '<script src="/h5ai/js/lib/jquery.min.js"><\/script>' )</script>
|
||||
<script src="/h5ai/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
@@ -1,33 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Directory index · styled with h5ai</title>
|
||||
<meta name="h5ai-version" content="h5ai 0.5.2">
|
||||
<meta name="description" content="Directory index styled with h5ai (http://larsjung.de/h5ai)">
|
||||
<meta name="keywords" content="directory, index, autoindex, h5ai">
|
||||
<link rel="shortcut icon" type="image/png" href="/h5ai/images/h5ai-16x16.png">
|
||||
<link rel="apple-touch-icon" type="image/png" href="/h5ai/images/h5ai-48x48.png">
|
||||
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold">
|
||||
<link rel="stylesheet" type="text/css" href="/h5ai/css/main.css">
|
||||
<script src="/h5ai/js/lib/modernizr.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<span class="jsDisabledFallback">Directory index · JavaScript is disabled</span>
|
||||
<ul>
|
||||
<li id="domain" class="crumb"><a href="/"><img src="/h5ai/images/home.png" alt="domain" /><span>domain</span></a></li>
|
||||
<li id="viewicons" class="view"><a href="#"><img src="/h5ai/images/view-icons.png" alt="view-icons" />icons</a></li>
|
||||
<li id="viewdetails" class="view" ><a href="#"><img src="/h5ai/images/view-details.png" alt="view-details" />details</a></li>
|
||||
</ul>
|
||||
<div class="clearfix"></div>
|
||||
</nav>
|
||||
<section id="content">
|
||||
<header></header>
|
||||
<section id="table" class="jsDisabledFallback">
|
||||
<!--
|
||||
The following code was generated by apache's autoindex module. It is not valid HTML 5 for the
|
||||
reason, that 'align' and 'valign' attributes on the td element are obsolete. Both of them are
|
||||
removed via javascript. The actual page should render as perfect HTML 5, even if the produced
|
||||
source is not valid HTML 5.
|
||||
-->
|
Before Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 554 B |
Before Width: | Height: | Size: 492 B |
Before Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 663 B |
Before Width: | Height: | Size: 554 B |
Before Width: | Height: | Size: 506 B |
Before Width: | Height: | Size: 757 B |
Before Width: | Height: | Size: 699 B |
Before Width: | Height: | Size: 599 B |
Before Width: | Height: | Size: 592 B |
Before Width: | Height: | Size: 671 B |
Before Width: | Height: | Size: 311 B |
Before Width: | Height: | Size: 535 B |
Before Width: | Height: | Size: 679 B |
Before Width: | Height: | Size: 619 B |
Before Width: | Height: | Size: 846 B |
Before Width: | Height: | Size: 409 B |
Before Width: | Height: | Size: 655 B |
Before Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 504 B |
Before Width: | Height: | Size: 530 B |
Before Width: | Height: | Size: 770 B |
Before Width: | Height: | Size: 792 B |
Before Width: | Height: | Size: 671 B |
Before Width: | Height: | Size: 788 B |
Before Width: | Height: | Size: 658 B |
Before Width: | Height: | Size: 675 B |
Before Width: | Height: | Size: 540 B |
Before Width: | Height: | Size: 423 B |
Before Width: | Height: | Size: 614 B |
Before Width: | Height: | Size: 614 B |
Before Width: | Height: | Size: 494 B |
Before Width: | Height: | Size: 799 B |
Before Width: | Height: | Size: 757 B |
Before Width: | Height: | Size: 610 B |
Before Width: | Height: | Size: 679 B |
Before Width: | Height: | Size: 629 B |
Before Width: | Height: | Size: 622 B |
Before Width: | Height: | Size: 743 B |
Before Width: | Height: | Size: 621 B |
Before Width: | Height: | Size: 781 B |
Before Width: | Height: | Size: 384 B |
Before Width: | Height: | Size: 660 B |
Before Width: | Height: | Size: 660 B |
Before Width: | Height: | Size: 627 B |
Before Width: | Height: | Size: 613 B |
Before Width: | Height: | Size: 586 B |
Before Width: | Height: | Size: 510 B |
Before Width: | Height: | Size: 406 B |
Before Width: | Height: | Size: 677 B |
Before Width: | Height: | Size: 463 B |
Before Width: | Height: | Size: 654 B |
Before Width: | Height: | Size: 556 B |
Before Width: | Height: | Size: 556 B |
Before Width: | Height: | Size: 739 B |
Before Width: | Height: | Size: 585 B |
Before Width: | Height: | Size: 617 B |
Before Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 2.0 KiB |
Before Width: | Height: | Size: 1.5 KiB |
Before Width: | Height: | Size: 1.7 KiB |