diff --git a/assets/layout.css b/assets/layout.css index 301a32a..dcbdf26 100644 --- a/assets/layout.css +++ b/assets/layout.css @@ -5,10 +5,6 @@ html, body { width: 100%; } -h1, h2, h3, h4, h5, h6, p { - margin: 0; -} - body { background-color: #2980b9; background-color: #34495e; @@ -35,6 +31,15 @@ header { grid-area: header; } +header > h1 { + color: #fff; + font-family: monospace; + font-weight: normal; + text-align: center; + line-height: 80px; + vertical-align: middle; +} + nav { grid-area: nav; align-self: start; @@ -48,10 +53,6 @@ nav { grid-area: empty-right; } -main { - grid-area: main; -} - footer { grid-area: footer; } @@ -107,3 +108,110 @@ iframe { padding: 0; margin: 0; } + +h1, h2, h3, h4, h5, h6 { + margin: 1.2em 0; + font-weight: 600; +} + +h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { + margin: 0 0 1em 0; +} + +p { + margin: 0 0 1em 0; +} + +h1 { + font-size: 2.2em; +} + +h2 { + font-size: 1.7em; +} + +h3 { + font-size: 1.37em; +} + +h4 { + font-size: 1em; +} + +h5 { + font-size: 1.03em; +} + +h6 { + font-size: .87em; +} + +ul { + margin: 1em 0 1.5em; +} + +h2:first-of-type::before { + content: "Section: "; + font-weight: normal; + color: #949aa0; +} + +a { + color: #3498db; + text-decoration: none; +} + +a:visited { + color: #3498db; +} + +a:hover { + text-decoration: underline; +} + +main { + background-color: #fff; + padding: 1em; + border-radius: 2px; + box-sizing: border-box; + font-size: 14px; + grid-area: main; + align-self: start; +} + +pre { + background-color: #ecf0f1; + padding: 0.5em; + font-size: 12px; + font-family: "Lucida Console", Monaco, monospace; +} + +code { + background-color: #ecf0f1; + color: #8e44ad; + padding: 2px 4px; + font-size: 12px; + font-family: "Lucida Console", Monaco, monospace; +} + +pre code { + background-color: #ecf0f1; + color: #2c3e50; + padding: none; +} + +pre:last-child { + margin-bottom: 0; +} + +.language-json-string { + color: #e67e22; +} + +.language-json-number { + color: #138C58; +} + +.language-json-key { + color: #4a51bf; +} diff --git a/assets/layout.js b/assets/layout.js index 96972c4..5eb5b0a 100644 --- a/assets/layout.js +++ b/assets/layout.js @@ -1,42 +1,8 @@ -/** - * 1, Make nav sections clickable - load apropriate section into the iframe - * 2, Load immediately first section from the nav - */ -document.addEventListener("DOMContentLoaded", function(event) { - var buttons = document.querySelectorAll('[data-section-href]'); - - for (var i = 0; i < buttons.length; i++) { - buttons[i].addEventListener("click", function(event) { - event.stopPropagation(); - event.preventDefault(); - - window.location.hash = this.getAttribute("data-target"); - }); - } - - if (buttons.length) { - if (window.location.hash) { - onHashChangeRouter(); - } else { - var sectionLink = buttons[0].getAttribute("data-section-href"); - - document.getElementsByTagName('iframe')[0].setAttribute("src", sectionLink); - } - } -}); - -/** - * Adjust iframe size it's content - */ -document.getElementsByTagName("iframe")[0].addEventListener("load", function() { - this.style.height = this.contentWindow.document.body.scrollHeight + 'px'; -}); - /** * Syntax highlighting - JSON */ -document.getElementsByTagName("iframe")[0].addEventListener("load", function() { - var jsonAreas = this.contentWindow.document.getElementsByClassName('language-json'); +var initSyntaxHighlighting = function() { + var jsonAreas = document.getElementById("section").getElementsByClassName("language-json"); for (var i = 0; i < jsonAreas.length; i++) { var content = jsonAreas[i].innerHTML; @@ -68,6 +34,31 @@ document.getElementsByTagName("iframe")[0].addEventListener("load", function() { jsonAreas[i].innerHTML = content; } +}; + +/** + * 1, Make nav sections clickable - load apropriate section into the iframe + * 2, Load immediately first section from the nav + */ +document.addEventListener("DOMContentLoaded", function(event) { + var buttons = document.querySelectorAll("[data-section-src]"); + + for (var i = 0; i < buttons.length; i++) { + buttons[i].addEventListener("click", function(event) { + event.stopPropagation(); + event.preventDefault(); + + window.location.hash = this.getAttribute("data-target"); + }); + } + + if (buttons.length) { + if (window.location.hash) { + onHashChangeRouter(); + } else { + window.location.hash = buttons[0].getAttribute("data-target"); + } + } }); /** @@ -75,15 +66,21 @@ document.getElementsByTagName("iframe")[0].addEventListener("load", function() { */ var onHashChangeRouter = function() { if (window.location.hash) { - var hash = window.location.hash.replace(/#/, ''); + var hash = window.location.hash.replace(/#/, ""); var sectionLink = document.querySelectorAll('[data-target="'+hash+'"]'); if (sectionLink.length) { - var sectionSrc = sectionLink[0].getAttribute("data-section-href"); + var xhr = new XMLHttpRequest(); + + xhr.addEventListener("load", function(e) { + document.getElementById("section").innerHTML = this.response; + initSyntaxHighlighting(); + }); - document.getElementsByTagName('iframe')[0].setAttribute("src", sectionSrc); + xhr.open("GET", sectionLink[0].getAttribute("data-section-src")); + xhr.send(); } } }; -window.addEventListener('hashchange', onHashChangeRouter); +window.addEventListener("hashchange", onHashChangeRouter); diff --git a/assets/layout.php b/assets/layout.php index 36005a1..53aa797 100644 --- a/assets/layout.php +++ b/assets/layout.php @@ -7,13 +7,11 @@ -
{title}
+

{title}

-
- -
+
diff --git a/assets/section.css b/assets/section.css deleted file mode 100644 index 5003ca3..0000000 --- a/assets/section.css +++ /dev/null @@ -1,121 +0,0 @@ -html, body { - margin: 0; - padding: 0; - height: 100%; - width: 100%; - font-size: 12px; - line-height: 18px; - vertical-align: middle; -} - -h1, h2, h3, h4, h5, h6 { - margin: 1.2em 0; - font-weight: 600; -} - -h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { - margin: 0 0 1em 0; -} - -p { - margin: 0 0 1em 0; -} - -h1 { - font-size: 2.2em; -} - -h2 { - font-size: 1.7em; -} - -h3 { - font-size: 1.37em; -} - -h4 { - font-size: 1em; -} - -h5 { - font-size: 1.03em; -} - -h6 { - font-size: .87em; -} - -ul { - margin: 1em 0 1.5em; -} - -h2:first-of-type::before { - content: "Section: "; - font-weight: normal; - color: #949aa0; -} - -a { - color: #3498db; - text-decoration: none; -} - -a:visited { - color: #3498db; -} - -a:hover { - text-decoration: underline; -} - -body { - background-color: transparent; - font-size: 14px; - font-family: Arial, Helvetica, sans-serif; - color: #2c3e50; - height: auto; -} - -main { - background-color: #fff; - padding: 1em; - border-radius: 2px; - box-sizing: border-box; -} - -pre { - background-color: #ecf0f1; - padding: 0.5em; - font-size: 12px; - font-family: "Lucida Console", Monaco, monospace; -} - -code { - background-color: #ecf0f1; - color: #8e44ad; - padding: 2px 4px; - font-size: 12px; - font-family: "Lucida Console", Monaco, monospace; -} - -pre code { - background-color: #ecf0f1; - color: #2c3e50; - padding: none; -} - -pre:last-child { - margin-bottom: 0; -} - -.language-json-string { - color: #e67e22; -} - -.language-json-number { - color: #138C58; -} - -.language-json-key { - color: #4a51bf; -} diff --git a/assets/section.php b/assets/section.php deleted file mode 100644 index de2ec07..0000000 --- a/assets/section.php +++ /dev/null @@ -1,13 +0,0 @@ -{httpAuth} - - - - {title} - - - -
- {content} -
- - diff --git a/demoOutput/about.html b/demoOutput/about.html index 4f7ed2b..a26fef9 100644 --- a/demoOutput/about.html +++ b/demoOutput/about.html @@ -1 +1 @@ - API Docu

About

Blah blah blah about

\ No newline at end of file +

About

Blah blah blah about

\ No newline at end of file diff --git a/demoOutput/home.html b/demoOutput/home.html index aaa9aa4..1a9fb75 100644 --- a/demoOutput/home.html +++ b/demoOutput/home.html @@ -1,4 +1,4 @@ - API Docu

Home

This is a documentation of our cookbook JSON-RPC API. If you are having any troubles baking your own API client, please contact our chef Pavel Janda.

Specification of project Awesome Cookbook (version 2.3.4)

Endpoint

All api calls should be targeting uri api.example.io. According to JSON-RPC specification, each and every request object has to contain following properties:

Example request payload:

{
+
Home
 
This is a documentation of our cookbook JSON-RPC API. If you are having any troubles baking your own API client, please contact our chef Pavel Janda.
 
Specification of project Awesome Cookbook (version 2.3.4)
 
Endpoint
 
All api calls should be targeting uri api.example.io. According to JSON-RPC specification, each and every request object has to contain following properties:
 
     
  • jsonrpc: JSON-RPC version ("2.0")
    •  
  • method: Name of the method to be invoked
    •  
  • params: Parameters of particular call (optional)
    •  
  • id: An string identifying this call (may be null)
    •  
 
Example request payload:
 
{
     "jsonrpc": "2.0",
     "method": "Receipe.store",
     "params": {
@@ -10,4 +10,4 @@
         "timeNeeded": 2
     },
     "id": null
-}
\ No newline at end of file +} \ No newline at end of file diff --git a/demoOutput/index.html b/demoOutput/index.html index 267a2bc..8da6ce0 100644 --- a/demoOutput/index.html +++ b/demoOutput/index.html @@ -1 +1 @@ - Awesome cookbook JSON-RPC API doc
Awesome cookbook JSON-RPC API doc
\ No newline at end of file + Awesome cookbook JSON-RPC API doc

Awesome cookbook JSON-RPC API doc

\ No newline at end of file diff --git a/demoOutput/methods/user.login.html b/demoOutput/methods/user.login.html index 411e820..6a709eb 100644 --- a/demoOutput/methods/user.login.html +++ b/demoOutput/methods/user.login.html @@ -1,4 +1,4 @@ - API Docu

user.login

Example request:

{
+
user.login
 
Example request:
 
{
     "jsonrpc": "2.0",
     "method": "user.login",
     "params": {
@@ -10,4 +10,4 @@
     "jsonrpc": "2.0",
     "result": {},
     "id": null
-}
\ No newline at end of file +} \ No newline at end of file diff --git a/demoOutput/methods/user.logout.html b/demoOutput/methods/user.logout.html index ac4e81d..e23a40a 100644 --- a/demoOutput/methods/user.logout.html +++ b/demoOutput/methods/user.logout.html @@ -1,4 +1,4 @@ - API Docu

user.logout

Example request:

{
+
user.logout
 
Example request:
 
{
     "jsonrpc": "2.0",
     "method": "user.logout",
     "params": {},
@@ -7,4 +7,4 @@
     "jsonrpc": "2.0",
     "result": {},
     "id": null
-}
\ No newline at end of file +} \ No newline at end of file diff --git a/src/Generator/Assets.php b/src/Generator/Assets.php index 9aba704..686d2b5 100644 --- a/src/Generator/Assets.php +++ b/src/Generator/Assets.php @@ -38,16 +38,6 @@ final class Assets */ private $layoutFavicon; - /** - * @var string - */ - private $sectionFile; - - /** - * @var string - */ - private $sectionStylesPath; - /** * @var string|null */ @@ -67,7 +57,6 @@ public function __construct(AuthCredentials $authCredentials) $this->layoutFavicon = __DIR__ . '/../../assets/favicon.ico'; $this->sectionFile = __DIR__ . '/../../assets/section.php'; - $this->sectionStylesPath = __DIR__ . '/../../assets/section.css'; $this->authCredentials = $authCredentials; } @@ -103,14 +92,12 @@ private function saveLayout(string $content, string $outputFile): void private function saveSection(string $content, string $outputFile): void { - $template = file_get_contents($this->sectionFile); + $template = $content; $this->replaceHttpAuth($template); $this->replaceTitle($template, $content); $this->replaceContent($template, $content); - $template = str_replace('{styles}', $this->getSectionStyles(), $template); - file_put_contents($outputFile, $this->minifyHtml($template)); } @@ -156,17 +143,6 @@ private function getLayoutSripts(): string } - private function getSectionStyles(): string - { - if ($this->sectionStyles === null) { - $minifier = new CSS($this->sectionStylesPath); - $this->sectionStyles = $minifier->minify(); - } - - return $this->sectionStyles; - } - - private function minifyHtml(string $html): string { return preg_replace( diff --git a/src/Parsedown/CustomParsedown.php b/src/Parsedown/CustomParsedown.php index 3d0a128..5cb84eb 100644 --- a/src/Parsedown/CustomParsedown.php +++ b/src/Parsedown/CustomParsedown.php @@ -32,7 +32,7 @@ protected function inlineSection($excerpt): ?array 'name' => $element, 'text' => $matches[2], 'attributes' => [ - 'data-section-href' => $matches[3], + 'data-section-src' => $matches[3], 'class' => $class, 'data-target' => Strings::webalize($matches[2]) ]