Add theme support.

This commit is contained in:
Lars Jung 2014-06-01 03:48:53 +02:00
parent c6b35c82e8
commit 7e0420073b
20 changed files with 430 additions and 12 deletions

View file

@ -8,9 +8,9 @@
* adds initial theme support
* adds icons from [Evolvere Icon Theme](http://franksouza183.deviantart.com/art/Evolvere-Icon-theme-440718295)
* adds PHP variant to calc folder sizes
* adds scroll position reset on location change (issue #279)
* adds scroll position reset on location change (issue [#279](https://github.com/lrsjng/h5ai/issues/279))
* adds "hide if 403" option
* fixes QR code URI origin (issue #287)
* fixes QR code URI origin (issue [#287](https://github.com/lrsjng/h5ai/issues/287))
* adds Google UA support
* extends selectable icon sizes (adds 128px, 192px, 256px, 384px)
* updates H5BP to 4.3.0
@ -25,7 +25,7 @@
## v0.24.1 - *2014-04-09*
* security fixes! (issues #268, #269)
* security fixes! (issues [#268](https://github.com/lrsjng/h5ai/issues/268), [#269](https://github.com/lrsjng/h5ai/issues/269))
* language updates (`fi`, `fr`, `hi`, `it`, `zh-tw`)
* fixes WinOS command detection

View file

@ -1,5 +1,5 @@
modulejs.define('core/resource', ['core/settings'], function (settings) {
modulejs.define('core/resource', ['config', 'core/settings'], function (config, settings) {
var image = function (id) {
@ -8,8 +8,7 @@ modulejs.define('core/resource', ['core/settings'], function (settings) {
icon = function (id) {
return settings.appHref + 'client/themes/faenza/icons/' + id + '.png';
// return settings.appHref + 'client/themes/evolvere/icons/' + id + '.svg';
return settings.appHref + 'client/themes/' + config.theme[id];
};
return {

View file

@ -46,7 +46,7 @@
$.ajax({
url: url,
data: {action: 'get', setup: true, options: true, types: true, langs: true},
data: {action: 'get', setup: true, options: true, types: true, theme: true, langs: true},
type: 'POST',
dataType: 'json',
success: function (config) {

View file

Before

Width:  |  Height:  |  Size: 6.6 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 119 B

View file

Before

Width:  |  Height:  |  Size: 2 KiB

After

Width:  |  Height:  |  Size: 2 KiB

View file

Before

Width:  |  Height:  |  Size: 667 B

After

Width:  |  Height:  |  Size: 667 B

View file

@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg7384"
height="96"
width="96"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="file.svg"
inkscape:export-filename="/home/lars/env/workspace/h5ai/local/file.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1877"
inkscape:window-height="1056"
id="namedview8"
showgrid="true"
inkscape:zoom="7.375"
inkscape:cx="23.67136"
inkscape:cy="43.419032"
inkscape:window-x="43"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg7384"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid3002"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
spacingx="6px"
spacingy="6px" />
</sodipodi:namedview>
<metadata
id="metadata90">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<title
id="title9167">Gnome Symbolic Icon Theme</title>
<path
style="fill:#555555;fill-opacity:1;stroke:none"
d="M 12,6 12,90 84,90 84,24 66,6 z m 6,6 45.559322,0 L 78,26.576271 78,84 18,84 z"
id="rect2984"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccccccc" />
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View file

Before

Width:  |  Height:  |  Size: 644 B

After

Width:  |  Height:  |  Size: 644 B

View file

@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg7384"
height="96"
width="96"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="folder-page.svg"
inkscape:export-filename="/home/lars/env/workspace/h5ai/src/_h5ai/client/images/fallback/folder-page.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1877"
inkscape:window-height="1056"
id="namedview8"
showgrid="true"
inkscape:zoom="7.375"
inkscape:cx="37.319242"
inkscape:cy="44.02228"
inkscape:window-x="43"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg7384"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid3001"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
spacingx="6px"
spacingy="6px" />
</sodipodi:namedview>
<metadata
id="metadata90">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<title
id="title9167">Gnome Symbolic Icon Theme</title>
<path
style="fill:#555555"
d="m 0,18 0,72 96,0 0,-72 -30,0 -12,-12.0000002 -42,0 z m 12,12 54,0 18,18 0,36 -72,0 z m 66,54 0,-30 -18,0 0,-18 -42,0 0,48"
id="rect3845"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccccccccccccccc" />
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View file

Before

Width:  |  Height:  |  Size: 380 B

After

Width:  |  Height:  |  Size: 380 B

View file

@ -0,0 +1,77 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg7384"
height="96"
width="96"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="folder-parent.svg"
inkscape:export-filename="/home/lars/folder-16.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1877"
inkscape:window-height="1056"
id="namedview8"
showgrid="true"
inkscape:zoom="7.375"
inkscape:cx="49.162692"
inkscape:cy="47.182237"
inkscape:window-x="43"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg7384"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid3002"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
spacingx="6px"
spacingy="6px" />
</sodipodi:namedview>
<metadata
id="metadata90">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<title
id="title9167">Gnome Symbolic Icon Theme</title>
<path
style="fill:#555555"
d="M 12,5.9999998 0,18 0,90 96,90 96,18 66,18 54,5.9999998 z M 48,30 72,54 66,60 54,54 54,72 42,72 42,54 30,60 24,54 z"
id="rect3845"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccccccccccccc"
inkscape:export-xdpi="270"
inkscape:export-ydpi="270" />
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 784 B

View file

@ -0,0 +1,77 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg7384"
height="96"
width="96"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="folder-parent.svg"
inkscape:export-filename="/home/lars/env/workspace/h5ai/src/_h5ai/client/themes/fallback/icons/folder-parent-1.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1877"
inkscape:window-height="1056"
id="namedview8"
showgrid="true"
inkscape:zoom="7.375"
inkscape:cx="33.027099"
inkscape:cy="47.182237"
inkscape:window-x="43"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg7384"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid3002"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
spacingx="6px"
spacingy="6px" />
</sodipodi:namedview>
<metadata
id="metadata90">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<title
id="title9167">Gnome Symbolic Icon Theme</title>
<path
style="fill:#555555"
d="M 48,20 80,51.999999 72,60 56,51.999999 56,76 l -15.999999,0 0,-24.000001 L 24,60 16,51.999999 z"
id="rect3845"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccccc"
inkscape:export-xdpi="270"
inkscape:export-ydpi="270" />
</svg>

After

Width:  |  Height:  |  Size: 2.3 KiB

View file

Before

Width:  |  Height:  |  Size: 206 B

After

Width:  |  Height:  |  Size: 206 B

View file

@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
id="svg7384"
height="96"
width="96"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="folder.svg.2014_05_17_14_45_14.0.svg"
inkscape:export-filename="/home/lars/env/workspace/web/h5ai/src/_h5ai/client/icons/scalable/folder.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs10" />
<sodipodi:namedview
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1"
objecttolerance="10"
gridtolerance="10"
guidetolerance="10"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:window-width="1877"
inkscape:window-height="1056"
id="namedview8"
showgrid="true"
inkscape:zoom="7.375"
inkscape:cx="31.901036"
inkscape:cy="43.419032"
inkscape:window-x="43"
inkscape:window-y="24"
inkscape:window-maximized="1"
inkscape:current-layer="svg7384"
showguides="true"
inkscape:guide-bbox="true">
<inkscape:grid
type="xygrid"
id="grid3002"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
spacingx="6px"
spacingy="6px" />
</sodipodi:namedview>
<metadata
id="metadata90">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Gnome Symbolic Icon Theme</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<title
id="title9167">Gnome Symbolic Icon Theme</title>
<path
style="fill:#555555"
d="m 0,18 0,72 96,0 0,-72 -30,0 -12,-12.0000002 -42,0 z"
id="rect3845"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccc" />
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View file

@ -42,6 +42,7 @@ Options
- smartBrowsing: use History API if available (no need to reload the whole page)
- extInNewWindow: open non-h5ai links in new window/tab
- hideIf403: hide files and folders that are not readable by the server
- theme: name of one of the folders in "_h5ai/client/themes", defaults to "fallback"
*/
"view": {
"modes": ["details", "grid", "icons"],
@ -54,7 +55,8 @@ Options
"ignore": ["^\\.", "^_{{pkg.name}}"],
"smartBrowsing": true,
"extInNewWindow": false,
"hideIf403": true
"hideIf403": true,
"theme": "fallback"
},

View file

@ -10,7 +10,6 @@ File types mapped to file extensions
"audio": [".aif", ".aiff", ".flac", ".m4a", ".mid", ".mp3", ".mpa", ".ra", ".ogg", ".wav", ".wma"],
"authors": ["authors"],
"bin": [".class", ".o", ".so"],
"blank": [],
"bmp": [".bmp"],
"c": [".c"],
"calc": [".ods", ".ots", ".xlr", ".xls", ".xlsx"],
@ -19,12 +18,12 @@ File types mapped to file extensions
"cpp": [".cpp"],
"css": [".css", ".less"],
"deb": [".deb"],
"default": [],
"diff": [".diff", ".patch"],
"doc": [".doc", ".docx", ".odm", ".odt", ".ott"],
"draw": [".drw"],
"eps": [".eps"],
"exe": [".bat", ".cmd", ".exe"],
"file": [],
"folder": [],
"folder-page": [],
"folder-parent": [],

View file

@ -46,6 +46,12 @@ class Api {
$response["types"] = $this->app->get_types();
}
if (has_request_param("theme")) {
use_request_param("theme");
$response["theme"] = $this->app->get_theme();
}
if (has_request_param("langs")) {
use_request_param("langs");

View file

@ -3,6 +3,7 @@
class App {
private static $RE_DELIMITER = "|";
private static $ICON_EXTS = array("svg", "png", "jpg");
private $options;
@ -34,6 +35,38 @@ class App {
}
public function get_icon($theme, $type, $fallback = null) {
foreach (App::$ICON_EXTS as $ext) {
$icon = "${theme}/icons/${type}.${ext}";
if (is_file(APP_PATH . "/client/themes/${icon}")) {
return $icon;
}
}
return $fallback;
}
public function get_theme() {
$theme = $this->options["view"]["theme"];
$types = $this->get_types();
$icons = array();
foreach (array("file", "folder", "folder-page", "folder-parent") as $type) {
$icons[$type] = $this->get_icon($theme, $type, "default/icons/${type}.svg");
}
foreach ($types as $type => $exts) {
if (!array_key_exists($type, $icons)) {
$icons[$type] = $this->get_icon($theme, $type, $icons["file"]);
}
}
return $icons;
}
public function to_url($path, $trailing_slash = true) {
$rel_path = substr($path, strlen(ROOT_PATH));
@ -179,7 +212,7 @@ class App {
if ($folder->get_parent($cache)) {
$html .= "<tr>";
$html .= "<td class='fb-i'><img src='" . APP_HREF . "client/images/fallback/parent.png' alt='folder-parent'/></td>";
$html .= "<td class='fb-i'><img src='" . APP_HREF . "client/themes/fallback/icons/folder-parent.png' alt='folder-parent'/></td>";
$html .= "<td class='fb-n'><a href='..'>Parent Directory</a></td>";
$html .= "<td class='fb-d'></td>";
$html .= "<td class='fb-s'></td>";
@ -190,7 +223,7 @@ class App {
$type = $item->is_folder ? "folder" : "file";
$html .= "<tr>";
$html .= "<td class='fb-i'><img src='" . APP_HREF . "client/images/fallback/" . $type . ".png' alt='" . $type . "'/></td>";
$html .= "<td class='fb-i'><img src='" . APP_HREF . "client/themes/fallback/icons/" . $type . ".png' alt='" . $type . "'/></td>";
$html .= "<td class='fb-n'><a href='" . $item->url . "'>" . basename($item->path) . "</a></td>";
$html .= "<td class='fb-d'>" . date("Y-m-d H:i", $item->date) . "</td>";
$html .= "<td class='fb-s'>" . ($item->size !== null ? intval($item->size / 1000) . " KB" : "" ) . "</td>";