Skip to content

Commit

Permalink
Themes: Add experimental material theme
Browse files Browse the repository at this point in the history
  • Loading branch information
@SMillerDev
SMillerDev committed May 18, 2017
1 parent 3ad9d47 commit eb41fcb
Show file tree
Hide file tree
Showing 7 changed files with 336 additions and 14 deletions.
2 changes: 1 addition & 1 deletion src/PHPDraft/Model/Elements/ObjectStructureElement.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -214,7 +214,7 @@ function __toString()

if (is_array($this->value))
{
$return = '<table class="table table-striped">';
$return = '<table class="table table-striped mdl-data-table mdl-js-data-table ">';
foreach ($this->value as $object) {
if (is_string($object)
|| in_array(get_class($object), [
Expand Down
9 changes: 2 additions & 7 deletions src/PHPDraft/Out/HTML/default.phtml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,6 @@
* @author Sean Molenaar<[email protected]>
*/
use PHPDraft\Out\Minifier;

/**
* @var \PHPDraft\Model\HierarchyElement[]
*/
$base = $this->categories;
?>
<!DOCTYPE html>
<html lang="en">
Expand Down Expand Up @@ -54,7 +49,7 @@ $base = $this->categories;
</div>
<div class="row">
<div class="col-md-2 method-nav">
<?php foreach ($base as $category): ?>
<?php foreach ($this->categories as $category): ?>
<?php if ($category->children !== []): ?>
<div class="panel panel-default">
<div class="panel-heading">
Expand Down Expand Up @@ -121,7 +116,7 @@ $base = $this->categories;
<div class="main-url"><?= $this->base_data['HOST']; ?></div>
</div>
<div class="col-md-10">
<?php foreach ($base as $category): ?>
<?php foreach ($this->categories as $category): ?>
<?php if (!empty($category->title)): ?>
<h2><a id="<?= $category->get_href(); ?>"><?= $category->title; ?></a></h2>
<?php endif; ?>
Expand Down
53 changes: 53 additions & 0 deletions src/PHPDraft/Out/HTML/material.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
.demo-layout-transparent {
background: rgba(0,0,0,0) center / cover;
}
.demo-layout-transparent .mdl-layout__header,
.demo-layout-transparent .mdl-layout__drawer-button {
/* This background is dark, so we set text to white. Use 87% black instead if
your background is light. */
color: white;
}
main {
width: 100%;
}

.demo-card-wide.mdl-card {
width: 100%;
margin-bottom: 30px;
}
.demo-card-wide > .mdl-card__title {
color: #fff;
height: 176px;
background: #cccccc center / cover;
}
.demo-card-wide > .mdl-card__menu {
color: #fff;
}
h2.mdl-card__title-text {
display: inline-block;
width: 100%;
}
.page-content {
width: 80%;
margin: 0px auto;
}
.pull-right {
text-align: right !important;
float: right !important;
}

.text-success {
color: #3c763d;
}

.text-warning {
color: #8a6d3b;
}

.text-error {
color: #761c19;
}

table.table p {
margin-bottom: 0px;
}
3 changes: 3 additions & 0 deletions src/PHPDraft/Out/HTML/material.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
/**
* Created by smillernl on 18-5-17.
*/
259 changes: 259 additions & 0 deletions src/PHPDraft/Out/HTML/material.phtml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,259 @@
<?php
/**
* This file contains the material template
*
* @package PHPDraft\HTML
* @author Sean Molenaar<[email protected]>
*/
use PHPDraft\Out\Minifier;
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title><?= $this->base_data['TITLE']; ?></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
<?php foreach ($this->css as $style): ?>
<link rel="stylesheet" href="<?= $style ?>">
<?php endforeach; ?>
<style>
<?= Minifier::minify_css(file_get_contents($this->find_include_file($this->template, 'css'), true));?>
</style>
</head>
<body>
<div class="demo-layout-waterfall mdl-layout mdl-js-layout">
<header class="mdl-layout__header mdl-layout__header--waterfall">
<div class="mdl-layout__header-row">
<!-- Title -->
<span class="mdl-layout-title"><?= $this->base_data['TITLE']; ?></span>
<div class="mdl-layout-spacer"></div>
<div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable
mdl-textfield--floating-label mdl-textfield--align-right">
<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 class="mdl-textfield__input" type="text" name="sample"
id="waterfall-exp">
</div>
</div>
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title"><?= $this->base_data['TITLE']; ?></span>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="#"><b>Webservices</b></a>
<?php foreach ($this->categories as $category): ?>
<a class="mdl-navigation__link" href="#<?= $category->get_href(); ?>"><?= $category->title; ?></a>
<?php if ($category->children !== []): ?>
<?php foreach ($category->children as $resource): ?>
<a class="mdl-navigation__link" href="#<?= str_replace('-', '/', $resource->get_href()); ?>">
- <?= $resource->title; ?>
</a>
<?php foreach ($resource->children as $transition): ?>
<a class="mdl-navigation__link" href="#<?= str_replace('-', '/', $transition->get_href()); ?>">
-- <?= $transition->title; ?>
<span class="pull-right <?= $this->get_method_icon($transition->get_method()); ?>"></span>
</a>
<?php endforeach; ?>
<?php endforeach; ?>
<?php endif; ?>
<?php endforeach; ?>
<?php if (!empty($this->base_structures)): ?>
<a class="mdl-navigation__link" href="#"><b>Objects</b></a>
<?php foreach ($this->base_structures as $key => $structure): ?>
<a class="mdl-navigation__link" href="#<?= $this->strip_link_spaces($key); ?>"><?= $key; ?></a>
<?php endforeach; ?>
<?php endif; ?>
</nav>
</div>
<main class="mdl-layout__content">
<div class="page-content">
<?php foreach ($this->categories as $category): ?>
<?php if (!empty($category->title)): ?>
<h3><a id="<?= $category->get_href(); ?>"><?= $category->title; ?></a></h3>
<?php endif; ?>
<?php if (!empty($category->description)): ?>
<p><?= $category->description; ?></p>
<?php endif; ?>
<?php foreach ($category->children as $resource): ?>
<h4>
<a id="<?= str_replace('-', '/', $resource->get_href()); ?>"><?= $resource->title; ?></a>
<small><?= $resource->href; ?></small>
</h4>
<p><?php $resource->description; ?></p>
<?php foreach ($resource->children as $transition): ?>
<div class="demo-card-wide mdl-card mdl-shadow--2dp <?= $transition->get_method(); ?>">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text"><var><?= $transition->get_method(); ?></var>
<code><?= $transition->href; ?></code>
<a class="pull-right transition-title"
id="<?= str_replace('-', '/',
$transition->get_href()); ?>"><?= $transition->title; ?></a></h2>
</div>
<div class="mdl-card__supporting-text">
<?= $transition->description; ?>
<?php if (!empty($transition->requests) || !empty($transition->responses)): ?>
<div class="mdl-tabs mdl-js-tabs mdl-js-ripple-effect">
<div class="mdl-tabs__tab-bar">
<?php if (!empty($transition->requests)): ?>
<a href="#<?= $transition->get_href(); ?>-request-panel" class="mdl-tabs__tab is-active">Request</a>
<?php endif;?>
<?php if (!empty($transition->responses)): ?>
<?php foreach ($transition->responses as $key => $response): ?>
<a href="#<?= $transition->get_href() . '-' . $response->statuscode; ?>-panel"
class="mdl-tabs__tab <?= $this->get_response_status($response->statuscode) ?>"><?= $response->statuscode; ?></a>
<?php endforeach;?>
<?php endif;?>
</div>
<?php if (!empty($transition->requests)): ?>
<?php foreach ($transition->requests as $key => $request): ?>
<div class="mdl-tabs__panel is-active" id="<?= $transition->get_href(); ?>-request-panel">
<?= $request->description; ?>
<?php if ($transition->url_variables !== []): ?>
<h5>Example URI</h5>
<span class="base-url"><?= $this->base_data['HOST']; ?></span><em><?= $transition->build_url(); ?></em>
<?php endif; ?>
<?php if ($request->headers !== []): ?>
<h5>Headers</h5>
<ul class="headers mdl-list">
<?php foreach ($request->headers as $name => $value): ?>
<li class="mdl-list__item">
<code>
<span class="attr"><?= $name; ?></span>: <span class="value"><?= $value; ?></span>
</code>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<?php if (!empty($request->body)): ?>
<h5>Body</h5>
<?php foreach ($request->body as $value): ?>
<?php if (is_string($value)): ?>
<code class="request-body"><?= $value; ?></code>
<?php else: ?>
<?php $type = (isset($request->headers['Content-Type'])) ? $request->headers['Content-Type'] : null; ?>
<?= $value->print_request($type); ?>
<?= $value ?>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
<?php if (!empty($request->struct)): ?>
<h5>Structure</h5>
<?= $request->struct ?>
<?php endif; ?>
<?php if ($transition->url_variables !== null): ?>
<h5>URI Parameters</h5>
<?= $transition->url_variables; ?>
<?php endif; ?>
<?php if ($transition->data_variables !== null): ?>
<h5>Data object</h5>
<?= $transition->data_variables ?>
<?php endif; ?>
</div>
<?php endforeach; ?>
<?php endif; ?>
<?php if (!empty($transition->responses)): ?>
<?php foreach ($transition->responses as $key => $response): ?>
<div class="mdl-tabs__panel" id="<?= $transition->get_href() . '-' . $response->statuscode; ?>-panel">
<?= $response->description; ?>
<?php if ($response->headers !== []): ?>
<h5>Headers</h5>
<ul class="headers mdl-list">
<?php foreach ($response->headers as $name => $value): ?>
<li class="mdl-list__item">
<code>
<span class="attr"><?= $name; ?></span>: <span class="value"><?= $value; ?></span>
</code>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<?php if ($response->structure !== []): ?>
<h5>Data Structure</h5>
<div class="row">
<?php foreach ($response->structure as $value): ?>
<?= $value; ?>
<?php endforeach; ?>
</div>
<?php endif; ?>
<?php foreach ($response->content as $key => $value): ?>
<div>
<?php $href =
$transition->get_href() . '-' . $response->statuscode . '-' . str_replace([
'/',
'+',
], '-', $key); ?>
<h5 class="response-body"
data-toggle="collapse"
data-target="#request-<?= $href ?>">
<span class="glyphicon indicator glyphicon-menu-up"></span>
<?= $key; ?>

</h5>
<pre class="collapse collapsed response-body"
id="request-<?= $href ?>"><?= $value; ?></pre>
</div>
<?php endforeach; ?>
</div>
</div>
<?php endforeach; ?>
<?php endif; ?>
<?php endif;?>
</div>
<div class="mdl-card__menu">
<button id="<?=$transition->get_href();?>" class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
<i class="material-icons">bug_report</i>
</button>
<div class="mdl-tooltip" for="<?=$transition->get_href();?>">
<?= $transition->get_curl_command($this->base_data['HOST'], []); ?>
</div>
</div>
</div>
<?php endforeach;?>
<?php endforeach;?>
<?php endforeach;?>
<?php if (count($this->base_structures) > 0): ?>
<h3><a id="datastructures">Data structures</a></h3>
<?php foreach ($this->base_structures as $key => $structure): ?>
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title">
<h2 class="mdl-card__title-text"><a id="object-<?= $this->strip_link_spaces($key); ?>"><?= $key; ?></a></h2>
</div>
<div class="mdl-card__supporting-text">
<?= $structure; ?>
</div>
</div>
<?php endforeach; ?>
<?php endif; ?>
</div>
</main>
</div>
<?php $extras = array_filter($this->base_data, function ($value) {
return !in_array($value, ['HOST', 'TITLE', 'ALT_HOST', 'FORMAT', 'DESC']);
}, ARRAY_FILTER_USE_KEY);
if (!empty($extras)):
$extras['host'] = $this->base_data['HOST']; ?>
<button
type="button"
class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored"
data-toggle="popover"
title="Extra info"
data-placement="top"
data-html="true"
data-content="<?php foreach ($extras as $key => $value): ?><p><?= $key; ?>: <?= $value; ?></p><?php endforeach; ?>">
<i class="material-icons">help outline</i>
</button>
<?php endif; ?>
<?php foreach ($this->js as $js): ?>
<script src="<?= $js ?>"></script>
<?php endforeach; ?>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
<script><?= Minifier::minify_js(file_get_contents($this->find_include_file($this->template, 'js'), true)); ?></script>
</body>
</html>
Loading

0 comments on commit eb41fcb

Please sign in to comment.