diff --git a/themes/html5/background.svg b/themes/html5/background.svg
new file mode 100644
index 00000000..2a85bc72
--- /dev/null
+++ b/themes/html5/background.svg
@@ -0,0 +1,222 @@
+
+
+
+
diff --git a/themes/html5/comment.theme.php b/themes/html5/comment.theme.php
new file mode 100644
index 00000000..4c6f95dc
--- /dev/null
+++ b/themes/html5/comment.theme.php
@@ -0,0 +1,19 @@
+rr(parent::comment_to_html($comment, $trim));
+ }
+
+ protected function build_postbox($image_id) {
+ return $this->rr(parent::build_postbox($image_id));
+ }
+
+ protected function rr($html) {
+ return "
+
+
$html
+ ";
+ }
+}
+?>
diff --git a/themes/html5/layout.class.php b/themes/html5/layout.class.php
new file mode 100644
index 00000000..a96da4ec
--- /dev/null
+++ b/themes/html5/layout.class.php
@@ -0,0 +1,126 @@
+get_string('theme', 'default');
+ $data_href = get_base_href();
+ $contact_link = $config->get_string('contact_link');
+
+ $header_html = "";
+ ksort($page->headers);
+ foreach($page->headers as $line) {
+ $header_html .= "\t\t$line\n";
+ }
+
+ $left_block_html = "";
+ $main_block_html = "";
+ $sub_block_html = "";
+
+ foreach($page->blocks as $block) {
+ switch($block->section) {
+ case "left":
+ $left_block_html .= $this->block_to_html($block, true, "left");
+ break;
+ case "main":
+ $main_block_html .= $this->block_to_html($block, false, "main");
+ break;
+ case "subheading":
+ $sub_block_html .= $this->block_to_html($block, false, "main");
+ break;
+ default:
+ print "error: {$block->header} using an unknown section ({$block->section})";
+ break;
+ }
+ }
+
+ $debug = get_debug_info();
+
+ $contact = empty($contact_link) ? "" : "
Contact";
+ $subheading = empty($page->subheading) ? "" : "
{$page->subheading}
";
+
+ $wrapper = "";
+ if(strlen($page->heading) > 100) {
+ $wrapper = ' style="height: 3em; overflow: auto;"';
+ }
+
+ print <<
+
+
+ {$page->title}
+
+
+$header_html
+
+
+
+ {$page->heading}
+ $subheading
+ $sub_block_html
+
+ $left_block_html
+ $main_block_html
+
+
+
+
+EOD;
+ }
+
+ /**
+ * A handy function which does exactly what it says in the method name
+ */
+ private function block_to_html($block, $hidable=false, $salt="") {
+ $h = $block->header;
+ $b = $block->body;
+ $html = "";
+ $i = str_replace(' ', '_', $h) . $salt;
+ if($hidable) $html .= "
+
+ ";
+ if(!is_null($h)) $html .= "
+ $h
+ ";
+ if(!is_null($b)) {
+ if(strpos($b, "") === FALSE) {
+ $html .= "$b
";
+ }
+ else {
+ $html .= "$b
";
+ }
+ }
+
+ return $html;
+ }
+}
+?>
diff --git a/themes/html5/setup.theme.php b/themes/html5/setup.theme.php
new file mode 100644
index 00000000..6f55a711
--- /dev/null
+++ b/themes/html5/setup.theme.php
@@ -0,0 +1,38 @@
+header;
+ $b = $block->body;
+ $i = preg_replace('/[^a-zA-Z0-9]/', '_', $h) . "-setup";
+ $html = "
+
+
+
+ ";
+
+ return $html;
+ }
+}
+?>
diff --git a/themes/html5/style.css b/themes/html5/style.css
new file mode 100644
index 00000000..487455e3
--- /dev/null
+++ b/themes/html5/style.css
@@ -0,0 +1,235 @@
+
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
+* things common to all pages *
+* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+BODY {
+ background: #EEE;
+ font-family: sans-serif;
+ font-size: 14px;
+ margin: 0px;
+}
+H1 {
+ background: #BBB;
+ text-align: center;
+ border: 1px solid #AAA;
+}
+H1 A {
+ color: black;
+}
+H3 {
+ text-align: center;
+ margin: 0px;
+}
+.hrr {
+ background: #CCC;
+ border: 1px solid #BBB;
+}
+.brr, .thumb {
+ background: #DDD;
+ border: 1px solid #CCC;
+}
+.brr, .hrr, H1, #footer, .thumb {
+ margin: 8px;
+ padding: 8px;
+ -webkit-border-radius: 12px;
+ -moz-border-radius: 12px;
+ -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
+ -moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
+}
+THEAD {
+ font-weight: bold;
+}
+TD {
+ vertical-align: top;
+ text-align: center;
+}
+CODE {
+ background: #DEDEDE;
+ font-size: 0.8em;
+}
+#subtitle {
+ width: 256px;
+ font-size: 0.75em;
+ margin: auto;
+ margin-top: -16px;
+ text-align: center;
+ border: 1px solid black;
+ border-top: none;
+ background: #DDD;
+}
+#body SELECT {width: 150px;}
+TD>INPUT[type="submit"] {width: 100%;}
+TD>INPUT[type="text"] {width: 100%;}
+TD>INPUT[type="password"] {width: 100%;}
+TD>TEXTAREA {width: 100%;}
+TD>SELECT {width: 100%;}
+[onclick] {cursor:pointer;}
+
+TABLE.zebra {border-spacing: 0px; border: 2px solid #CCC;}
+TABLE.zebra TD, TABLE.zebra TH {vertical-align: middle; padding: 4px;}
+TABLE.zebra THEAD TD, TABLE.zebra THEAD TH {border-bottom: 2px solid #CCC;}
+TABLE.zebra TFOOT TD, TABLE.zebra TFOOT TH {border-top: 2px solid #CCC;}
+TABLE.zebra TR TD {border-bottom: 1px solid #DDD;}
+TABLE.zebra TR.odd {background: #EFEFEF;}
+TABLE.zebra TR.even {background: #E0E0E0;}
+
+#footer {
+ clear: both;
+ font-size: 0.7em;
+ text-align: center;
+ background: #BBB;
+ border: 1px solid #AAA;
+}
+
+*[onclick] {cursor: pointer;}
+IMG {border: none;}
+FORM {margin: 0px;}
+A {text-decoration: none;}
+A:hover {text-decoration: underline;}
+
+BLOCKQUOTE {
+ border: 1px solid black;
+ padding: 8px;
+ background: #DDD;
+}
+
+UL {
+ text-align: left;
+}
+
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
+* the navigation bar, and all its blocks *
+* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+#nav {
+ width: 200px;
+ float: left;
+ text-align: center;
+ margin-left: 16px;
+}
+#nav .blockbody {
+ font-size: 0.85em;
+ text-align: center;
+ overflow: hidden;
+}
+#nav TABLE {
+ width: 150px;
+}
+#nav TD {
+ vertical-align: middle;
+}
+#nav INPUT {
+ width: 100%;
+ padding: 0px;
+}
+#nav SELECT {
+ width: 100%;
+ padding: 0px;
+}
+
+#comments P {
+ text-align: left;
+ width: 150px;
+ max-width: 150px;
+ overflow: hidden;
+}
+.comment {
+ text-align: left;
+}
+
+.more:after {
+ content: " >>>";
+}
+
+.tag_count:before {
+ content: "(";
+}
+.tag_count:after {
+ content: ")";
+}
+
+.paginator {
+ clear: both;
+ padding: 4px;
+ margin-bottom: 32px;
+}
+
+
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
+* the main part of each page *
+* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+#body {
+ margin-left: 226px;
+ margin-right: 16px;
+ text-align: center;
+ height: 1%;
+}
+#body TABLE {
+ width: 90%;
+ margin: auto;
+}
+
+
+/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
+* specific page types *
+* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
+
+#pagelist {
+ margin-top: 32px;
+}
+
+#tagmap A {
+ padding: 8px 4px 8px 4px;
+}
+
+.setupblock {
+ text-align: center;
+ width: 350px;
+}
+.setupblock TEXTAREA {
+ width: 300px;
+ font-size: 0.75em;
+}
+
+.helpable {
+ border-bottom: 1px dashed gray;
+}
+
+.ok {
+ background: #AFA;
+}
+.bad {
+ background: #FAA;
+}
+
+#nav .thumbblock {
+ float: none;
+ height: auto;
+}
+#nav .thumb {
+ margin-bottom: 0px;
+}
+.thumbblock {
+ width: 220px;
+ height: 220px;
+ display: inline-block;
+ text-align: center;
+ float: left;
+}
+.thumb {
+ display: inline-block;
+ margin-bottom: 32px;
+}
+
+#downtime #message, #downtime #login {
+ text-align: center;
+}
+#downtime H3 {
+ margin-top: 32px;
+}
+#downtime #login_table {
+ margin: auto;
+}
+
diff --git a/themes/html5/themelet.class.php b/themes/html5/themelet.class.php
new file mode 100644
index 00000000..81990bb8
--- /dev/null
+++ b/themes/html5/themelet.class.php
@@ -0,0 +1,99 @@
+set_title($title);
+ $page->set_heading($title);
+ $page->add_block(new NavBlock());
+ $page->add_block(new Block("Error", $message));
+ }
+
+
+ /**
+ * A specific, common error message
+ */
+ public function display_permission_denied(Page $page) {
+ header("HTTP/1.0 403 Permission Denied");
+ $this->display_error($page, "Permission Denied", "You do not have permission to access this page");
+ }
+
+
+ /**
+ * Generic thumbnail code; returns HTML rather than adding
+ * a block since thumbs tend to go inside blocks...
+ */
+ public function build_thumb_html(Image $image, $query=null) {
+ global $config;
+ $i_id = int_escape($image->id);
+ $h_view_link = make_link("post/view/$i_id", $query);
+ $h_tip = html_escape($image->get_tooltip());
+ $h_thumb_link = $image->get_thumb_link();
+ $tsize = get_thumbnail_size($image->width, $image->height);
+ return "
+
+
+ ";
+ }
+
+
+ /**
+ * Add a generic paginator
+ */
+ public function display_paginator(Page $page, $base, $query, $page_number, $total_pages) {
+ if($total_pages == 0) $total_pages = 1;
+ $body = $this->build_paginator($page_number, $total_pages, $base, $query);
+ $page->add_block(new Block(null, $body, "main", 90));
+ }
+
+ private function gen_page_link($base_url, $query, $page, $name) {
+ $link = make_link("$base_url/$page", $query);
+ return "$name";
+ }
+
+ private function gen_page_link_block($base_url, $query, $page, $current_page, $name) {
+ $paginator = "";
+ if($page == $current_page) $paginator .= "";
+ $paginator .= $this->gen_page_link($base_url, $query, $page, $name);
+ if($page == $current_page) $paginator .= "";
+ return $paginator;
+ }
+
+ private function build_paginator($current_page, $total_pages, $base_url, $query) {
+ $next = $current_page + 1;
+ $prev = $current_page - 1;
+ $rand = rand(1, $total_pages);
+
+ $at_start = ($current_page <= 1 || $total_pages <= 1);
+ $at_end = ($current_page >= $total_pages);
+
+ $first_html = $at_start ? "First" : $this->gen_page_link($base_url, $query, 1, "First");
+ $prev_html = $at_start ? "Prev" : $this->gen_page_link($base_url, $query, $prev, "Prev");
+ $random_html = $this->gen_page_link($base_url, $query, $rand, "Random");
+ $next_html = $at_end ? "Next" : $this->gen_page_link($base_url, $query, $next, "Next");
+ $last_html = $at_end ? "Last" : $this->gen_page_link($base_url, $query, $total_pages, "Last");
+
+ $start = $current_page-5 > 1 ? $current_page-5 : 1;
+ $end = $start+10 < $total_pages ? $start+10 : $total_pages;
+
+ $pages = array();
+ foreach(range($start, $end) as $i) {
+ $pages[] = $this->gen_page_link_block($base_url, $query, $i, $current_page, $i);
+ }
+ $pages_html = implode(" | ", $pages);
+
+ return "$first_html | $prev_html | $random_html | $next_html | $last_html".
+ "
<< $pages_html >>
";
+ }
+}
+?>