On Develop branch

Sorry about that
This commit is contained in:
William Crandell 2015-10-26 08:51:02 -04:00
parent f8cb2e96e4
commit 6fb43eab19
10 changed files with 524 additions and 0 deletions

View file

@ -0,0 +1,283 @@
<?php
/**
* A class to turn a Page data structure into a blob of HTML
*/
class Layout {
/**
* turns the Page into HTML
*/
public function display_page(Page $page) {
global $config;
$theme_name = $config->get_string('theme', 'material');
$site_name = $config->get_string('title');
$data_href = get_base_href();
$main_page = $config->get_string('main_page');
$contact_link = $config->get_string('contact_link');
$site_link = make_link();
$header_html = "";
ksort($page->html_headers);
foreach($page->html_headers as $line) {
$header_html .= "\t\t$line\n";
}
$left_block_html = "";
$main_block_html = "";
$head_block_html = "";
$sub_block_html = "";
$drawer_block_html = ""; //use exampled in user.theme.php & view.theme.php
$toolbar_block_html = ""; // not used at this point
$subtoolbar_block_html = ""; // use exampled in user.theme.php
$navigation = "";
$h_search = "
<div class='mdl-textfield mdl-js-textfield mdl-textfield--expandable
mdl-textfield--floating-label mdl-textfield--align-right'>
<form action='".make_link()."' method='GET'>
<label class='mdl-button mdl-js-button mdl-button--icon'
for='waterfall-exp'>
<i class='material-icons'>search</i>
</label>
<div class='mdl-textfield__expandable-holder'>
<input id='waterfall-exp' class='autocomplete_tags mdl-textfield__input' name='search' type='text' placeholder='Search' value='' />
<input type='hidden' name='q' value='/post/list'>
<input type='submit' value='Find' style='display: none;' />
</div>
</form>
</div>
";
foreach($page->blocks as $block) {
switch($block->section) {
case "toolbar":
$toolbar_block_html .= $this->get_html($block, "toolbar");
break;
case "subtoolbar":
$subtoolbar_block_html .= $this->get_html($block, "subtoolbar");
break;
case "left":
if($block->header == "Navigation"){
$subtoolbar_block_html = $this->rework_navigation($block);
break;
}
// $left_block_html .= $block->get_html(true);
$left_block_html .= $this->get_html($block, "full", true, "left-blocks nav-card mdl-cell--4-col-tablet");
break;
case "head":
$head_block_html .= $this->get_html($block, "third", true, "nav-card head-blocks");
break;
case "drawer":
$drawer_block_html .= $this->get_html($block, "full", true, "nav-card drawer-blocks");
break;
case "main":
// $main_block_html .= $block->get_html(false);
$main_block_html .= $this->get_html($block, "main", true, "");
break;
case "subheading":
// $sub_block_html .= $block->body; // $this->block_to_html($block, true);
$sub_block_html .= $this->get_html($block, "third", true, "nav-card");
break;
default:
print "<p>error: {$block->header} using an unknown section ({$block->section})";
break;
}
}
$debug = get_debug_info();
$contact = empty($contact_link) ? "" : "<br><a href='mailto:$contact_link'>Contact</a>";
/*$subheading = empty($page->subheading) ? "" : "<div id='subtitle'>{$page->subheading}</div>";
$wrapper = "";
if(strlen($page->heading) > 100) {
$wrapper = ' style="height: 3em; overflow: auto;"';
}
*/
$flash = get_prefixed_cookie("flash_message");
$flash_html = "";
if($flash) {
$flash_html = "<b id='flash'>".nl2br(html_escape($flash))." <a href='#' onclick=\"\$('#flash').hide(); return false;\">[X]</a></b>";
set_prefixed_cookie("flash_message", "", -1, "/");
}
print <<<EOD
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{$page->title}</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&amp;lang=en">
<link rel="stylesheet" href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="{$data_href}/themes/{$theme_name}/material.min.css?v1.0.5" rel="stylesheet">
$header_html
<script type="text/javascript" src="{$data_href}/themes/{$theme_name}/material.min.js?v1.0.5"></script>
<script type="text/javascript" src="{$data_href}/themes/{$theme_name}/script0.js?v1"></script>
<!-- having conflicts this ensures the screens will not remain hidden \while the layout is adjusted -->
</head>
<body>
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header mdl-layout__header--waterfall">
<!-- Top row, always visible -->
<div class="mdl-layout__header-row ">
<!-- Title -->
<span class="mdl-layout-title">
<a class="mdl-logo" href="{$site_link}">{$site_name}</a>
</span>
<div class="mdl-layout-spacer"></div>
$h_search
{$toolbar_block_html}
<button id="menu-left-col-menu"
class="mdl-button mdl-js-button mdl-button--icon">
<i class="material-icons">more_vert</i>
</button>
</div>
<!-- Bottom row, not visible on scroll -->
<div class="mdl-layout__header-row">
<div class="mdl-layout-spacer"></div>
<!-- Navigation -->
{$subtoolbar_block_html}
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title">Drawer</span>
<div class="mdl-grid">
$drawer_block_html
</div>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="http://code.shishnet.org/shimmie2/">Shimmie &copy;</a>
</nav>
</div>
<main class="mdl-layout__content">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--12-col mdl-grid ">
$head_block_html
$sub_block_html
</div>
</div>
<div id="main-grid" class="mdl-grid">
<div id="left-block" class="mdl-cell mdl-cell--4-col mdl-cell--8-col-tablet mdl-cell--4-col-phone mdl-color--grey-200">
<script>
document.getElementById("left-block").style.display="none";
</script>
<div id="left-blk-content" class="mdl-cell mdl-cell--12-col mdl-grid">
<!-- Start Left Block -->
$left_block_html
</div>
</div>
<div id="main-block" class="mdl-cell mdl-shadow--2dp mdl-cell--8-col mdl-cell--8-col-tablet mdl-color--grey-200 mdl-grid">
<script>
document.getElementById("main-block").style.display="none";
</script>
<!-- Start art Block -->
<article class="mdl-cell mdl-cell--12-col mdl-cell--top">
$flash_html
$main_block_html
</article>
</div>
</div>
<footer class="mdl-mini-footer">
$debug
$contact
</footer>
</main>
</div>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
for="menu-left-col-menu">
<li id="layout-top" class="mdl-menu__item">Layout Top</li>
<li id="layout-right" class="mdl-menu__item">Layout Right</li>
<li id="layout-bottom" class="mdl-menu__item">Layout Bottom</li>
<li id="layout-left" class="mdl-menu__item">Layout Left</li>
</ul>
</body>
</html>
EOD;
}
public function rework_navigation(Block $block){
$h = $block->header;
$b = $block->body;
$i = $block->id;
$dom = new DomDocument();
$dom->loadHTML($b);
$output = array();
$html = "<section id='$i'>\n<nav class='mdl-navigation'>\n";
foreach ($dom->getElementsByTagName('a') as $item) {
$item->setAttribute('class', 'mdl-navigation__link');
$html .= $dom->saveHTML($item);
// $output[] = array (
// ,'str' => $dom->saveHTML($item)
// // ,'href' => $item->getAttribute('href')
// // ,'anchorText' => $item->nodeValue
// );
}
$html .= "</nav>\n</section>\n";
return $html;
}
/**
* Get the HTML for this block. from core
*
* @param bool $hidable
* @return string
*/
public function get_html(Block $block, $section="main", $hidable=false, $extra_class="") {
$h = $block->header;
$b = $block->body;
$i = $block->id;
$i = preg_replace('/[^\w-]/', '', $i);//blotter extention id has `!`
if($section == "toolbar"){
$html = "<section id='$i'>\n<nav class='mdl-navigation'>\n";
if(!empty($b)) $html .= "$b";
$html .= "</nav>\n</section>\n";
return $html;
}
if($section == "subtoolbar"){
$html = "<section id='$i'>\n<nav class='mdl-navigation'>\n";
if(!empty($b)) $html .= "$b";
$html .= "</nav>\n</section>\n";
return $html;
}
if($section == "full"){
$html = "<div class='mdl-card mdl-shadow--4dp mdl-cell mdl-cell--12-col $extra_class'><section id='$i'>";
$h_toggler = $hidable ? " shm-toggler" : "";
if(!empty($h)) $html .="<div class='mdl-card__title'><h3 data-toggle-sel='#$i' class='mdl-card__title-text $h_toggler'>$h</h3></div>";
if(!empty($b)) $html .="<div class='mdl-card__supporting-text blockbody'>$b</div>";
$html .= "</section></div>\n";
return $html;
}
if($section == "third"){
$html = "<div class='mdl-card mdl-shadow--4dp mdl-cell mdl-cell--4-col $extra_class'><section id='$i'>";
$h_toggler = $hidable ? " shm-toggler" : "";
if(!empty($h)) $html .="<div class='mdl-card__title'><h3 data-toggle-sel='#$i' class='mdl-card__title-text $h_toggler'>$h</h3></div>";
if(!empty($b)) $html .="<div class='mdl-card__supporting-text blockbody'>$b</div>";
$html .= "</section></div>\n";
return $html;
}
$html = "<section id='$i'>";
$h_toggler = $hidable ? " shm-toggler" : "";
if(!empty($h)) $html .= "<h3 data-toggle-sel='#$i' class='$h_toggler'>$h</h3>";
if(!empty($b)) $html .= "<div class='blockbody'>$b</div>";
$html .= "</section>\n";
return $html;
}
}
//@todo fix ext/blotter id tag
//@todo fix table row error for ext/ip_ban
//@todo fix table row error for ext/image_hash_ban
//@todo fix table row error for ext/untag
//@todo fix ext private-messages gives Uncaught TypeError: Cannot read property 'href' of null when no messages are there..

8
themes/material/material.min.css vendored Normal file

File diff suppressed because one or more lines are too long

10
themes/material/material.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View file

View file

@ -0,0 +1,95 @@
$(function(){
$( "#layout-top" ).click(function() {
leftAddFullSize("top");
});
$( "#layout-right" ).click(function() {
leftAddSideSize("right");
});
$( "#layout-bottom" ).click(function() {
leftAddFullSize("bottom");
});
$( "#layout-left" ).click(function() {
leftAddSideSize("left");
});
function leftAddSideSize(layout_type){
$("#left-block").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--4-col mdl-cell--8-col-tablet mdl-cell--4-col-phone");
$(".left-blocks").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--12-col mdl-cell--4-col-tablet");
$("#main-block").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--8-col mdl-cell--8-col-tablet");
if(layout_type == "right"){
$("#left-block").appendTo("#main-grid")
} else {
$("#left-block").prependTo("#main-grid")
}
$.cookie("ui-layout-type", layout_type, {path: '/', expires: 365});
zoom("width");
}
function leftAddFullSize(layout_type){
$("#left-block").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--12-col");
$(".left-blocks").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--4-col");
$("#main-block").removeClass (function (index, css) {
return (css.match (/(^|\s)mdl-cell--\S+/g) || []).join(' ');
}).addClass("mdl-cell--12-col");
if(layout_type == "bottom"){
$("#left-block").appendTo("#main-grid")
} else {
$("#left-block").prependTo("#main-grid")
}
$.cookie("ui-layout-type", layout_type, {path: '/', expires: 365});
zoom("width");
}
current_layout = $.cookie("layout-type");
if (current_layout != null) {
if(current_layout =="top" || current_layout == "bottom"){
leftAddFullSize(current_layout);
} else {
leftAddSideSize(current_layout);
}
}
$('#main-block, #left-block').show();
});
function zoom(zoom_type) {
var img = $('.shm-main-image');
if(zoom_type == "full") {
img.css('max-width', img.data('width') + 'px');
img.css('max-height', img.data('height') + 'px');
}
if(zoom_type == "width") {
img.css('max-width', ($( "#main-block" ).width()) + 'px');
img.css('max-height', img.data('height') + 'px');
}
if(zoom_type == "height") {
img.css('max-width', img.data('width') + 'px');
img.css('max-height', (window.innerHeight * 0.95) + 'px');
}
if(zoom_type == "both") {
img.css('max-width', '95%');
img.css('max-height', (window.innerHeight * 0.95) + 'px');
}
$(".shm-zoomer").val(zoom_type);
$.cookie("ui-image-zoom", zoom_type, {path: '/', expires: 365});
}

View file

@ -0,0 +1,3 @@
.nav-card{
min-height: 3em;
}

View file

@ -0,0 +1,3 @@
<?php
class Themelet extends BaseThemelet {}

View file

@ -0,0 +1,11 @@
<?php
class CustomUploadTheme extends UploadTheme {
// public function display_block(Page $page) {
// $page->add_block(new Block("Upload", $this->build_upload_block(), "left", 20));
// }
//
// public function display_full(Page $page) {
// $page->add_block(new Block("Upload", "Disk nearly full, uploads disabled", "left", 20));
// }
}

View file

@ -0,0 +1,29 @@
<?php
class CustomUserPageTheme extends UserPageTheme {
public function display_user_block(Page $page, User $user, $parts) {
$h_name = html_escape($user->name);
$html = " | ";
foreach($parts as $part) {
$html .= "<a href='{$part["link"]}'>{$part["name"]}</a> | ";
}
$page->add_block(new Block("Logged in as $h_name", $html, "drawer", 90));
}
public function display_login_block(Page $page) {
global $config;
$html = "
<form action='".make_link("user_admin/login")."' method='POST'>
<table summary='Login Form' align='center'>
<tr><td width='70'>Name</td><td width='70'><input type='text' name='user'></td></tr>
<tr><td>Password</td><td><input type='password' name='pass'></td></tr>
<tr><td colspan='2'><input type='submit' name='gobu' value='Log In'></td></tr>
</table>
</form>
";
if($config->get_bool("login_signup_enabled")) {
$html .= "<small><a href='".make_link("user_admin/create")."'>Create Account</a></small>";
}
$page->add_block(new Block("Login", $html, "head", 90));
}
}

View file

@ -0,0 +1,82 @@
<?php
class CustomViewImageTheme extends ViewImageTheme {
/*
* Build a page showing $image and some info about it
*/
public function display_page(Image $image, $editor_parts) {
global $page;
$h_metatags = str_replace(" ", ", ", html_escape($image->get_tag_list()));
$page->set_title("Image {$image->id}: ".html_escape($image->get_tag_list()));
$page->add_html_header("<meta name=\"keywords\" content=\"$h_metatags\">");
$page->add_html_header("<meta property=\"og:title\" content=\"$h_metatags\">");
$page->add_html_header("<meta property=\"og:type\" content=\"article\">");
$page->add_html_header("<meta property=\"og:image\" content=\"".make_http($image->get_thumb_link())."\">");
$page->add_html_header("<meta property=\"og:url\" content=\"".make_http(make_link("post/view/{$image->id}"))."\">");
$page->set_heading(html_escape($image->get_tag_list()));
$page->add_block(new Block(null, $this->build_pin($image), "subtoolbar", 0));
$page->add_block(new Block(null, $this->build_info($image, $editor_parts), "left", 20));
}
public function display_admin_block(Page $page, $parts) {
if(count($parts) > 0) {
$page->add_block(new Block("Image Controls", join("<br>", $parts), "drawer", 50));
}
}
protected function build_pin(Image $image) {
global $database;
if(isset($_GET['search'])) {
$search_terms = explode(' ', $_GET['search']);
$query = "search=".url_escape($_GET['search']);
}
else {
$search_terms = array();
$query = null;
}
$h_prev = '<a id="prevlink" class="mdl-navigation__link mdl-js-ripple-effect" href="'.make_link("post/prev/{$image->id}", $query).'">Prev</a>';
$h_index = "<a class='mdl-navigation__link mdl-js-ripple-effect' href='".make_link()."'>Current</a>";
$h_next = '<a id="nextlink" class="mdl-navigation__link mdl-js-ripple-effect" href="'.make_link("post/next/{$image->id}", $query).'">Next</a>';
return $h_prev.$h_index.$h_next;
}
protected function build_info(Image $image, $editor_parts) {
global $user;
if(count($editor_parts) == 0) return ($image->is_locked() ? "<br>[Image Locked]" : "");
$html = make_form(make_link("post/set"))."
<input type='hidden' name='image_id' value='{$image->id}'>
<table style='' class='image_info form'>
";
foreach($editor_parts as $part) {
$html .= $part;
}
if(
(!$image->is_locked() || $user->can("edit_image_lock")) &&
$user->can("edit_image_tag")
) {
$html .= "
<tr><td colspan='4'>
<input class='view' type='button' value='Edit' onclick='$(\".view\").hide(); $(\".edit\").show();'>
<input class='edit' type='submit' value='Set'>
</td></tr>
";
}
$html .= "
</table>
</form>
";
return $html;
}
}