wip: 2025-03-02T16:00:40+0100 (1740927640)

This commit is contained in:
Victor Westerlund 2025-03-02 16:02:54 +01:00
parent 73c3d7f14a
commit 6336281dd7
79 changed files with 314 additions and 1288 deletions

1
.gitignore vendored Normal file
View file

@ -0,0 +1 @@
vegvisir

3
.gitmodules vendored Normal file
View file

@ -0,0 +1,3 @@
[submodule "vegvisir"]
path = vegvisir
url = https://codeberg.org/vegvisir/vegvisir

8
Consts.php Normal file
View file

@ -0,0 +1,8 @@
<?php
namespace Website;
/**
* # Docs
*/
const VERSION_LATEST = "/public/docs/v3.1.4/";

View file

@ -19,27 +19,4 @@ aside .spacer {
height: 1px;
background-color: rgba(var(--primer-color-accent), .1);
margin: var(--padding) 0;
}
/* # Nav states */
vv-shell[vv-page="/docs"] aside a[href="/docs"] button,
vv-shell[vv-page="/docs/PHP"] aside a[href="/docs/PHP"] button,
vv-shell[vv-page="/docs/Reference/PHP/VV"] aside a[href="/docs/Reference/PHP/VV"] button,
vv-shell[vv-page="/docs/Reference/PHP/VV/css"] aside a[href="/docs/Reference/PHP/VV/css"] button,
vv-shell[vv-page="/docs/get-started"] aside a[href="/docs/get-started"] button,
vv-shell[vv-page="/docs/Reference/PHP/VV/embed"] aside a[href="/docs/Reference/PHP/VV/embed"] button {
font-weight: 900;
background: none;
pointer-events: none;
color: var(--color-accent);
}
vv-shell[vv-page="/docs"] aside a[href="/docs"] button svg,
vv-shell[vv-page="/docs/PHP"] aside a[href="/docs/PHP"] button svg,
vv-shell[vv-page="/docs/Reference/PHP/VV"] aside a[href="/docs/Reference/PHP/VV"] button svg,
vv-shell[vv-page="/docs/Reference/PHP/VV/css"] aside a[href="/docs/Reference/PHP/VV/css"] button svg,
vv-shell[vv-page="/docs/get-started"] aside a[href="/docs/get-started"] button svg,
vv-shell[vv-page="/docs/Reference/PHP/VV/embed"] aside a[href="/docs/Reference/PHP/VV/embed"] button svg {
display: none;
}

View file

@ -93,6 +93,16 @@ code-demo .body [data-file].active {
display: initial;
}
code-demo .body a {
display: inline;
text-decoration: underline;
text-decoration-color: white;
}
code-demo .body a:hover {
text-decoration-thickness: 2px;
}
/* # Size queries */
@media (max-width: 950px) {

View file

@ -0,0 +1,7 @@
<?php
use const Website\VERSION_LATEST;
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/Env"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/EVENTS"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/MODE"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/POSITION"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/TARGET"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/abort"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/bindElements"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/constructor"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/index"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/navigate"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/JavaScript/options"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/VV/css"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/VV/embed"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/VV/include"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/VV/init"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/VV/js"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/PHP/index"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/index"); ?>

View file

@ -0,0 +1,7 @@
<?php
use const Website\VERSION_LATEST;
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "Reference/vv-attributes"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "get-started"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "index"); ?>

View file

@ -1,7 +1,7 @@
<?php
use const VVWebsite\VERSION_LATEST;
use const Website\VERSION_LATEST;
require_once VV::root("src/Consts.php");
require_once VV::root("Consts.php");
?>
<?= VV::include(VERSION_LATEST . "installation"); ?>

View file

@ -1,75 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>vegvisir.Navigation.EVENTS</code></h1>
<p>Various navigation <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent" target="_blank"><code>CustomEvent</code></a>s that can be listened for.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/EVENTS/description", Snippet::JAVASCRIPT) ?>
<p>All events will also fire on <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document" target="_blank"><code>document</code></a> as a catch-all interface.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>navstarted</code></h3>
<p>This <a href=""><code>CustomEvent</code></a> will be fired on the navigation <a href=""><code>target</code></a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document" target="_blank"><code>document</code></a> when a navigation is started with <a href=""><code>.navigate()</code></a>.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>navfinished</code></h3>
<p>This <a href=""><code>CustomEvent</code></a> will be fired on the navigation <a href=""><code>target</code></a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document" target="_blank"><code>document</code></a> when a navigation with <a href=""><code>.navigate()</code></a> has finished completely.</p>
<p>A navigation is considered finished when the page has been fully loaded and all <a href="">element attributes</a> have been updated.</p>
</container>
</section>
<section class="md">
<container>
<h1><code>CustomEvent.detail</code> property</h1>
<?= Snippet::put("docs/API/JS/Navigation/EVENTS/description-additional", Snippet::JAVASCRIPT) ?>
<p>Accessing the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail" target="_blank"><code>.detail</code></a> property on a captured Vegvisir event will contain the following object.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>target</code></h3>
<p>The <a href=""><code>target</code></a> element that is used/was used for the navigation.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>This example logs the <a href=""><code>target</code></a> element of all navigations on this page.</p>
<?= Snippet::put("docs/API/JS/Navigation/EVENTS/example-0-0", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,51 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>vegvisir.Navigation.MODE</code></h1>
<p>Change if content should be replaced or inserted when used in <a href=""><code>.navigate()</code></a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/MODE/description", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>REPLACE</code></h3>
<p>Content of the destination URL will replace the content at <a href=""><code>vegvisir.Navigation.POSITION</code></a>.</p>
<ul>
<li><p>Position: <code>beforebegin</code> = Replace the <a href=""><code>target</code></a> element itself.</p></li>
<li><p>Position: <code>afterbegin</code> = Replace the inner contents of the <a href=""><code>target</code></a> element.</li>
<li><p>Position: <code>beforeend</code> = Replace the inner contents of the <a href=""><code>target</code></a> element.</li>
<li><p>Position: <code>afterend</code> = Replace the <a href=""><code>target</code></a> element itself.</p></li>
</ul>
</container>
</section>
<section class="md inset">
<container>
<h3><code>INSERT</code></h3>
<p>Content of the destination URL will append/prepend to the existing content at <a href=""><code>vegvisir.Navigation.POSITION</code></a>.</p>
<p>Setting the mode to <code>INSERT</code> will make <a href=""><code>.navigate()</code></a> behave exactly like <a href="https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentElement"><code>HTMLElement.insertAdjacentElement()</code></a>.</p>
<ul>
<li><p>Position: <code>beforebegin</code> = Prepend before the <a href=""><code>target</code></a> element itself.</p></li>
<li><p>Position: <code>afterbegin</code> = Prepend just inside the <a href=""><code>target</code></a> element, before its first child.</p></li>
<li><p>Position: <code>beforeend</code> = Append just inside the <a href=""><code>target</code></a> element, after its last child.</p></li>
<li><p>Position: <code>afterend</code> = Append after the <a href=""><code>target</code></a> element itself.</p></li>
</ul>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,65 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>vegvisir.Navigation.POSITION</code></h1>
<p>Change where content should be placed when <a href=""><code>.navigate()</code></a> is used.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/POSITION/description", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Values</h2>
<p>The effect of <code>Navigation.POSITION</code> depend on the <a href=""><code>Navigation.MODE</code></a> used for the current navigation.</p>
<p>The default <code>Navigation.POSITION</code> for <a href=""><code>.navigate()</code></a> is <a href=""><code>beforeend</code></a> and the default mode is <a href=""><code>replace</code></a>.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>afterend</code></h3>
<ul>
<li><p>Mode: <code>replace</code> = Replace the <a href=""><code>target</code></a> element itself.</li>
<li><p>Mode: <code>insert</code> = Append after the <a href=""><code>target</code></a> element itself.</p></li>
</ul>
</container>
</section>
<section class="md inset">
<container>
<h3><code>beforeend</code></h3>
<p>This is the default position for <a href=""><code>.navigate()</code></a>.</p>
<ul>
<li><p>Mode: <code>replace</code> = Replace the inner contents of the <a href=""><code>target</code></a> element.</li>
<li><p>Mode: <code>insert</code> = Append just inside the <a href=""><code>target</code></a> element, after its last child.</p></li>
</ul>
</container>
</section>
<section class="md inset">
<container>
<h3><code>afterbegin</code></h3>
<ul>
<li><p>Mode: <code>replace</code> = Replace the inner contents of the <a href=""><code>target</code></a> element.</li>
<li><p>Mode: <code>insert</code> = Prepend just inside the <a href=""><code>target</code></a> element, before its first child.</p></li>
</ul>
</container>
</section>
<section class="md inset">
<container>
<h3><code>beforebegin</code></h3>
<ul>
<li><p>Mode: <code>replace</code> = Replace the <a href=""><code>target</code></a> element itself.</p></li>
<li><p>Mode: <code>insert</code> = Prepend before the <a href=""><code>target</code></a> element itself.</p></li>
</ul>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,77 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>vegvisir.Navigation.TARGET</code></h1>
<p>Defines the <a href=""><code>target</code></a> element of a navigation triggered from a <a href="">bound element</a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/TARGET/description", Snippet::JAVASCRIPT) ?>
<p>This object follows the same syntax as the <code>target</code> attribute of <a href=""><code>HTMLAnchorElement</code></a>.</p>
<p>If a string is provided to a <code>target</code> attribute of the <a href="">bound element</a> that <strong>isn't</strong> in this enumerable, the string will be treated as a <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors" target="_blank">CSS selector</a>.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Values</h2>
<p>These values correspond to the value of a <code>target</code> attribute on a <a href="">bound element</a>.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>_top</code></h3>
<p>Target <a href=""><code>vegvisir.Navigation.rootShellElement</code></a>. This is the same as performing a normal soft-navigation.</p>
<p>This is the default behavior if a <code>target</code> attribute is omitted or equals an empty string.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>_self</code></h3>
<p>Target the <a href="">bound element</a> itself with the defaults <a href=""><code>vegvisir.Navigation.POSITION.BEFOREEND</code></a> and <a href=""><code>vegvisir.Navigation.MODE.REPLACE</code></a>, which will replace the <a href="">bound element</a> itself with the contents of the destination URL.</p>
<p>The default position and mode behavior can be overridden with by setting a <a href=""><code>vv-position</code></a> and <a href=""><code>vv-mode</code></a> attribute on the <a href="">bound element</a> respectivly.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>_blank</code></h3>
<p>Default browser behavior. The destination URL will open in a new tab or window.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>_parent</code></h3>
<p>Target the closest parent <a href="">HTMLElement</a> that has a <a href=""><code>vv-page</code></a> attribute.</p>
<p><a href=""><code>vegvisir.Navigation.rootShellElement</code></a> will become the target if no parent is found.</p>
</container>
</section>
<section class="md inset">
<container>
<h3>default</h3>
<p>The value of the <a href="">bound element</a>'s <code>target</code> attribute will be treated as a <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_selectors" target="_blank">CSS selector</a> if the string value does not equal an entry in this enumerable.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Here's an example that uses a native anchor tag to do various navigations.</p>
<?= Snippet::put("docs/API/JS/Navigation/TARGET/example-0-0", Snippet::PHP) ?>
<?= Snippet::put("docs/API/JS/Navigation/TARGET/example-0-1", Snippet::PHP) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,33 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>Navigation.abort</code></h1>
<p>Interrupt a navigation started with <a href=""><code>.navigate()</code></a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/abort/description", Snippet::JAVASCRIPT) ?>
<p><code>Navigation.abort</code> is an instance of <a href="https://developer.mozilla.org/en-US/docs/Web/API/AbortController">AbortController</a> which gets contructed automatically with new <a href=""><code>vegvisir.Navigation</code></a> instances.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>.abort()</code></h3>
<p>Call <code>Navigation.abort.abort()</code> to interrupt a Vegvisir navigation in progress.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,35 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>vegvisir.Navigation.bindElements()</code></h1>
<p>Trigger automatic binding of unbound tags.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/bindElements/description", Snippet::JAVASCRIPT) ?>
<p>Bind event listeners for <a href=""><code>HTMLAnchorElement</code></a> tags and other tags with a <a href=""><code>vv</code></a> attribute that haven't already been bound.</p>
<p>This method is runned automatically after a finished Vegvisir navigation.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>In this example we will programatically create and append an anchor tag to the DOM and use this method to bind it.</p>
<?= Snippet::put("docs/API/JS/Navigation/bindElements/example-0-0", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,69 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>vegvisir.Navigation()</code> constructor</h1>
<p>The Vegvisir navigation constructor is used to create a new instance of <code>Navigation</code>. This is the first step to creating a custom navigation.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/constructor/description", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>url</code></h3>
<p>A <a href="https://developer.mozilla.org/en-US/docs/Web/API/URL/URL"><code>URL</code></a> object or string with to a location on the same origin as the initiator.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>options</code></h3>
<p>An optional object containing <a href=""><code>vegvisir.Navigation.options</code></a> overrides.</p>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>Navigation</code> instance</h3>
<p>A <code>Navigation</code> object instance. Use the instance method <a href=""><code>.navigate()</code></a> to navigate an, or many element(s) in the DOM.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Different ways to initialize <code>vegvisir.Navigation</code> with a location that will open <code>/public/some-page.php</code> relative from <a href="">project root</a>.</p>
<p>With strings:</p>
<?= Snippet::put("docs/API/JS/Navigation/constructor/example-0-0", Snippet::JAVASCRIPT) ?>
<?= Snippet::put("docs/API/JS/Navigation/constructor/example-0-1", Snippet::JAVASCRIPT) ?>
<p>With URL objects:</p>
<?= Snippet::put("docs/API/JS/Navigation/constructor/example-0-2", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,13 +0,0 @@
<section class="md">
<container>
<h1><code>vegvisir.Navigation</code></h1>
<p>The Vegvisir <code>Navigation</code> class contains APIs for triggering navigations of any element programmatically.</p>
</container>
</section>
<section class="md">
<container>
<h2>Quickstart</h2>
<p>A new navigation can be initialized by constructing the <code>vegvisir.Navigation</code> class.</p>
</container>
</section>
<?= VV::shell("shells/docs") ?>

View file

@ -1,92 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>Navigation.navigate()</code></h1>
<p>Perform a soft-navigation on an element.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/navigate/description", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>target</code></h3>
<p>An optional instance of an <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement" target="_blank"><code>HTMLElement</code></a> which will be the target of this navigation.</p>
<p><a href=""><code>Vegivisr.rootShellElement</code></a> will be used if no argument is passed to this parameter.</p>
<details>
<summary>Examples</summary>
<p>Passing nothing to this parameter will target the top shell. This would be equivalent to clicking a link.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/0", Snippet::JAVASCRIPT) ?>
<p>Passing an <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement" target="_blank"><code>HTMLElement</code></a> to this parameter would in this example with no other arguments changed, replace the innerHTML of the target element with the response from <code>/some-page</code>.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/1", Snippet::JAVASCRIPT) ?>
</details>
</container>
</section>
<section class="md inset">
<container>
<h3><code>position</code></h3>
<p>This parameter takes an optional <a href=""><code>Navigation.POSITION</code></a> string which can be used to change where content from the destination URL should be placed relative to the <a href=""><code>target</code></a> element.</p>
<details>
<summary>Examples</summary>
<p>Passing nothing to this parameter will replace the innerHTML of <a href=""><code>target</code></a>.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/1", Snippet::JAVASCRIPT) ?>
<p>Passing an position string will in this example place the contents afterEnd from target.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/2", Snippet::JAVASCRIPT) ?>
</details>
</container>
</section>
<section class="md inset">
<container>
<h3><code>mode</code></h3>
<p>This parameter takes an optional <a href=""><code>Navigation.MODE</code></a> string which can be used to change how the contents of the destination URL should be placed relative to existing content around the <a href=""><code>target</code></a> element.</p>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<p>This method will not return anything, but a navigation in progress can be aborted with <a href=""><code>Navigation.abort</code></a>.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Programmatically invoke a top navigation - as if a user clicked a link.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/0", Snippet::JAVASCRIPT) ?>
</container>
</section>
<section class="md inset">
<container>
<h2>Click to refresh</h2>
<p>An example how a simple "click to refresh" button can be implemented.</p>
<?= Snippet::put("docs/API/JS/Navigation/navigate/example-0-0", Snippet::JAVASCRIPT) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,64 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>Navigation.options</code></h1>
<p>Override default Vegvisir navigation behavior.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/JS/Navigation/options/description", Snippet::JAVASCRIPT) ?>
<p>This object should be passed as the second argument when constructing a <a href=""><code>vegvisir.Navigation</code></a> instance.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pushHistory</code></h3>
<p><strong>This option has no default value:</strong></p>
<p>The default behavior of any Vegvisir <strong>top</strong> navigation is to push the new URL to the history stack. Ie. History API entry and browser pathname changes.</p>
<p>Any navigation that is <strong>not</strong> a top navigation will not push to the history stack.</p>
<hr>
<p>By setting the <code>pushHistory</code> option to:</p>
<ul>
<li>
<p><code>true</code></p>
<p>Force all navigations with <a href=""><code>.navigate()</code></a> on this instance will push to the history stack. Including non-top navigations.</p>
</li>
<li>
<p><code>false</code></p>
<p>Force no navigations with <a href=""><code>.navigate()</code></a> on this instance will push to the history stack. Including top navigations.</p>
</li>
</ul>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Here is an example the embeds an SVG file directly on a page.</p>
<p>This can come in handy for inlining small vector icons.</p>
<?= Snippet::put("docs/API/PHP/VV/embed/example-1-0", Snippet::PHP) ?>
<?= Snippet::put("docs/API/PHP/VV/embed/example-1-1", Snippet::PHP) ?>
<p>By using <code>VV::css()</code> inside a <code class="tag">style</code>, we've enabled this stylesheet for that specific page.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,14 +0,0 @@
<section class="md">
<container>
<h1>JavaScript Cheat Sheet</h1>
<p>Vegvisir will automatically bind <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement"><code>HTMLAnchorElement</code></a> tags and perform soft-navigation between pages on the same <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin" target="_blank">origin</a>.</p>
<p>The <a href=""><code>Navigation</code></a> lets you interact with, and expand Vegvisirs front-end behavior.</p>
</container>
</section>
<section class="md">
<container>
<h2>Manual pages</h2>
<?= VV::include("modules/docs/legend-js") ?>
</container>
</section>
<?= VV::shell("shells/docs") ?>

View file

@ -1,82 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>VV::css()</code></h1>
<p>Import and minify a CSS file.</p>
<p>The syntax is identical to <a href=""><code>VV::js()</code></a>, and <a href=""><code>VV::embed()</code></a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/css/description", Snippet::PHP) ?>
<p><code>VV::css()</code> imports and minifies a CSS styleheet file and returns it as a string.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a CSS stylesheet file to import relative from <a href="">project root</a>.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/css/0", Snippet::PHP) ?>
</details>
</container>
</section>
<section class="md inset">
<container>
<h3><code>relative</code></h3>
<p>Path provided to <a href=""><code>pathname</code></a> will be a relative when this parameter is <code>true</code> (default). Set to <code>false</code> to make path absolute.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/css/1", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>string</code></h3>
<p>A string containing minified CSS. Please note that <a href="https://www.php.net/manual/en/reserved.constants.php#constant.php-eol">linebreaks</a> are preserved.</p>
<p>Will return an empty string if the path provided to <a href=""><code>pathname</code></a> is not a valid CSS stylesheet file, or if it failed to import.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/css/2", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Let's take the following CSS stylesheet file and put it into a page.</p>
<?= Snippet::put("docs/API/PHP/VV/css/example-1-0", Snippet::CSS) ?>
<?= Snippet::put("docs/API/PHP/VV/css/example-1-1", Snippet::PHP) ?>
<p>By using <code>VV::css()</code> inside a <code class="tag">style</code>, we've enabled this stylesheet for that specific page.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,71 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>VV::embed()</code></h1>
<p>Import and inline the contents of any file without executing code.</p>
<p>The syntax is identical to <a href=""><code>VV::js()</code></a>, and <a href=""><code>VV::css()</code></a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/embed/description", Snippet::PHP) ?>
<p><code>VV::embed()</code> returns the contents of any file as a string.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a file to embed relative from <a href="">project root</a>.</p>
</container>
</section>
<section class="md inset">
<container>
<h3><code>relative</code></h3>
<p>Path provided to <a href=""><code>pathname</code></a> will be a relative when this parameter is <code>true</code> (default). Set to <code>false</code> to make path absolute.</p>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>string</code></h3>
<p>A string containing the raw contents of the file. File encoding is preserved.</p>
<p>Will return an empty string if the path provided to <a href=""><code>pathname</code></a> is not a valid file, or if it failed to import.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Here is an example the embeds an SVG file directly on a page.</p>
<p>This can come in handy for inlining small vector icons.</p>
<?= Snippet::put("docs/API/PHP/VV/embed/example-1-0", Snippet::PHP) ?>
<?= Snippet::put("docs/API/PHP/VV/embed/example-1-1", Snippet::PHP) ?>
<p>By using <code>VV::css()</code> inside a <code class="tag">style</code>, we've enabled this stylesheet for that specific page.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,77 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>VV::include()</code></h1>
<p>Inline contents of one page inside another page.</p>
<p>The syntax and functionality is similar to <a href=""><code>VV::embed()</code></a>, except it executes included code.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/include/description", Snippet::PHP) ?>
<p><code>VV::include()</code> lets you put the contents of one page into another page.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a PHP file to import and evaluate relative from <a href="">project root</a>.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/include/0", Snippet::PHP) ?>
</details>
</container>
</section>
<section class="md inset">
<container>
<h3><code>relative</code></h3>
<p>Path provided to <a href=""><code>pathname</code></a> will be a relative when this parameter is <code>true</code> (default). Set to <code>false</code> to make path absolute.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/include/1", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<p>This method will return whatever the compiled output of the included PHP file will be.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Consider the following page snippet</p>
<?= Snippet::put("docs/API/PHP/VV/include/example-1-0", Snippet::PHP) ?>
<p>Let's put this snippet into another page</p>
<?= Snippet::put("docs/API/PHP/VV/include/example-1-1", Snippet::PHP) ?>
<p>By importing the snippet with <code>VV::include()</code> we have placed the <code class="tag">banner</code> tag and its contents into another page.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,15 +0,0 @@
<section class="md">
<container>
<h1><code>VV</code></h1>
<p>The <code>VV</code> (two "V"'s, not a W) contains everything needed to interact with Vegvisir's PHP features.</p>
<p>The class can not be instanced since it only contains static methods.</p>
</container>
</section>
<section class="md">
<container>
<h2>Namespace</h2>
<p>The <code>VV</code> class is accessible <strong>without</strong> a namespace from <strong>any</strong> PHP file within your project.</p>
<p>The class intentionally lacks a namespace to reduce the (all be it short) boilerplate code that would be required to import and <code>use</code> it on every page of your project.</p>
</container>
</section>
<?= VV::shell("shells/docs") ?>

View file

@ -1,82 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 2, Vegvisir 3)</p>
<h1><code>VV::js()</code></h1>
<p>Import and minify a JavaScript file.</p>
<p>The syntax is identical to <a href=""><code>VV::css()</code></a>, and <a href=""><code>VV::embed()</code></a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/js/description", Snippet::PHP) ?>
<p><code>VV::js()</code> imports and minifies a JavaScript file and returns it as a string.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a JavaScript file to import relative from <a href="">project root</a>.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/js/0", Snippet::PHP) ?>
</details>
</container>
</section>
<section class="md inset">
<container>
<h3><code>relative</code></h3>
<p>Path provided to <a href=""><code>pathname</code></a> will be a relative when this parameter is <code>true</code> (default). Set to <code>false</code> to make path absolute.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/js/1", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>string</code></h3>
<p>A string containing minified JavaScript. Please note that <a href="https://www.php.net/manual/en/reserved.constants.php#constant.php-eol">linebreaks</a> are preserved.</p>
<p>Will return an empty string if the path provided to <a href=""><code>pathname</code></a> is not a valid JavaScript file, or if it failed to import.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/js/2", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>Let's take the following JavaScript file and put it into a page.</p>
<?= Snippet::put("docs/API/PHP/VV/js/example-1-0", Snippet::JAVASCRIPT) ?>
<?= Snippet::put("docs/API/PHP/VV/js/example-1-1", Snippet::PHP) ?>
<p>By using <code>VV::js()</code> inside a <code class="tag">script</code>, we've enabled the code for that specific page.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,76 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>VV::root()</code></h1>
<p>Return an absolute path to a file or folder relative from <a href="">project root</a>.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/root/description", Snippet::PHP) ?>
<p>Return an absolute path to a file or folder relative from <a href="">project root</a>. This method does not process the entity at the provided location in any way. It simply returns an absolute path to it, which can be used with other functions.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a location relative from <a href="">project root</a>. This parameter is an empty string by default, which will return an absolute path to <a href="">project root</a> itself.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/root/0", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>string</code></h3>
<p>An absolute path to the relative location provided by <a href=""><code>pathname</code></a>.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/root/1", Snippet::PLAINTEXT) ?>
</details>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p><code>VV::root()</code> doesn't do anything on its own other than "convert" a relative path into an absolute one.</p>
<p>This can come in really handy when importing other PHP classes within your project. Let's import a PHP class from one location in the project into a public page.</p>
</container>
</section>
<section class="md inset">
<container>
<?= Snippet::put("docs/API/PHP/VV/root/2", Snippet::PHP) ?>
<p>Let's import and use this class on our page with <code>VV::root()</code>.</p>
<?= Snippet::put("docs/API/PHP/VV/root/3", Snippet::PHP) ?>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,74 +0,0 @@
<?= VV::include("modules/snippet/Snippet.php") ?>
<?php // General information ?>
<section class="md">
<container>
<p>(Vegvisir 3)</p>
<h1><code>VV::shell()</code></h1>
<p>Wrap contents of a page within another page.</p>
<p>This method is similar to <a href=""><code>VV::include()</code></a> except it lets you place persistent content around the included page.</p>
</container>
</section>
<section class="md">
<container>
<h1>Description</h1>
<?= Snippet::put("docs/API/PHP/VV/shell/description", Snippet::PHP) ?>
<p><code>VV::shell()</code> is a powerful method which lets you put the contents of one page into a <code class="tag">vv-shell</code> tag on another page.</p>
<p>Subsequent navigations to pages using the same shell will preserve the outer shell's state. The shell will not be fetched again.</p>
</container>
</section>
<?php // Method parameters ?>
<section class="md">
<container>
<h2>Parameters</h2>
</container>
</section>
<section class="md inset">
<container>
<h3><code>pathname</code></h3>
<p>Path to a PHP shell page relative from <a href="">project root</a> which the contents of the initiator page will be wrapped inside.</p>
<details>
<summary>Example</summary>
<?= Snippet::put("docs/API/PHP/VV/shell/0", Snippet::PHP) ?>
</details>
</container>
</section>
<?php // Method return values ?>
<section class="md">
<container>
<h2>Return values</h2>
</container>
</section>
<section class="md inset">
<container>
<p>This method is buffered and will flush the buffer contents to <code>stdout</code> when the last shell has been imported.</p>
</container>
</section>
<?php // Examples ?>
<section class="md">
<container>
<h1>Examples</h1>
</container>
</section>
<section class="md inset">
<container>
<h2>Basic usage</h2>
<p>If we want the contents of page <code>/public/some-page.php</code> wrapped inside the contents of <code>/shells/some-shell.php</code>, we can do the following:</p>
<?= Snippet::put("docs/API/PHP/VV/shell/example-0-0", Snippet::PHP) ?>
<p>Place a <code>VV::shell()</code> snippet <strong>at the end</strong> of the page you wish to wrap.</p>
</container>
</section>
<section class="md inset">
<container>
<p>Now let's add a <code class="tag">vv-shell</code> tag somewhere in our <code>/shells/some-shell.php</code> file.</p>
<?= Snippet::put("docs/API/PHP/VV/shell/example-0-1", Snippet::PHP) ?>
<p>The contents of <code>/public/some-page.php</code> will <strong>replace</strong> the <strong>inner</strong> contents of the <code>vv-shell</code> tag.</p>
<p>The shell file acts like any other Vegvisir page, which means you have access to all <a href=""><code>VV</code></a> methods.</p>
</container>
</section>
<?php // Contribute ?>
<?= VV::shell("shells/docs") ?>

View file

@ -1,26 +0,0 @@
<section class="md">
<container>
<h1>PHP Cheat Sheet</h1>
<p>Vegvisir only has one class you need to worry about. The <a href="/docs/API/PHP/VV"><code>VV</code></a> class contains everything needed to interact with Vegvisir functions from project pages.</p>
</container>
</section>
<section class="md">
<container>
<h2>Useful thoughts</h2>
<p>Here are some one-liners to help remember what things do.</p>
</container>
</section>
<section class="md">
<container>
<h3>Difference between <code>VV::include()</code> and <code>VV::shell()</code></h3>
<p><a href=""><code>VV::include()</code></a> puts content inside another page.</p>
<p><a href=""><code>VV::shell()</code></a> puts a page inside other content.</p>
</container>
</section>
<section class="md">
<container>
<h2>Manual pages</h2>
<?= VV::include("modules/docs/legend-php") ?>
</container>
</section>
<?= VV::shell("shells/docs") ?>

View file

@ -1 +0,0 @@
<?= VV::shell("shells/docs") ?>

View file

@ -0,0 +1,47 @@
<?= VV::include("public/docs/v3.1.4/Reference/layout") ?>
<main>
<section>
<h1>Environment variables</h1>
<p>Vegvisir has a few environment variables that can be modified to change its behavior.</p>
<p>Copy <code>.env.example.ini</code> to <code>.env.ini</code> and edit the copied file to get started.</p>
</section>
<hr>
<section>
<h1>Reference</h1>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">root_path</code></h2>
<p>An <strong>absolute</strong> path to the folder where your project is located.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">shell_page</code></h2>
<p>A path relative from your <code class="mtk10">root_path</code> to a PHP file that contains a <a href="/docs/v3.1.4/Reference/Env#vv-shell"><code>vv-shell</code></a> element, and will be loaded as the shell of your page.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">public_path</code></h2>
<p>A path relative from your <code class="mtk10">root_path</code> to a folder containing public PHP pages and other public static assets.</p>
<p>The default for this variable is "public/".</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code> | <code class="mtk6">null</code></h3>
<h2><code class="mtk10">error_page_path</code></h2>
<p>An optional path relative from your <code class="mtk10">root_path</code> to a PHP file that will be loaded when a page can not be found.</p>
<p>Commenting-out this variable or setting it to null will disable error pages. An empty respone body will be returned.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">worker_magic_pathname</code></h2>
<p>Vegvisir navigation worker code will be returned when request pathname matches this string</p>
<p>This variable can be left as-is for most applications.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code> | <code class="mtk6">null</code></h3>
<h2><code class="mtk10">rfc_4288_url</code></h2>
<p>URL to an RFC 4288 compatible MIME-type file which will be cached (until server reboot) and referenced for serving static assets.</p>
<p>The default for this variable is <a href="https://raw.githubusercontent.com/apache/httpd/refs/heads/trunk/docs/conf/mime.types">Apache's httpd MIME-reference</a>.</p>
<p>Commenting-out this variable or setting it to null will disable custom MIME-lists and default to PHP's <a href="https://www.php.net/manual/en/function.mime-content-type.php"><code>mime_content_type</code></a> parser.</p>
</section>
</main>

View file

@ -12,13 +12,13 @@
</section>
<section class="md param">
<h2 class="default"><code class="mtk19">STARTED</code></h2>
<p>An event dispatched with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#type"><code>type</code></a> of <code class="mtk12">"navstarted"</code> on the <a href=""><code>target</code></a> element when a navigation has started. This event is also dispatched on <code>document.body</code>.</p>
<p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail"><code>detail</code></a> property of this event returns the <a href=""><code class="mtk17">Navigation</code></a> instance that initiated the navigation.</p>
<p>An event dispatched with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#type"><code>type</code></a> of <code class="mtk12">"navstarted"</code> on the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element when a navigation has started. This event is also dispatched on <code>document.body</code>.</p>
<p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail"><code>detail</code></a> property of this event returns the <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance that initiated the navigation.</p>
</section>
<section class="md param">
<h2 class="default"><code class="mtk19">FINISHED</code></h2>
<p>An event dispatched with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#type"><code>type</code></a> of <code class="mtk12">"navfinished"</code> on the <a href=""><code>target</code></a> element when a navigation has finished loading completely (content has been injected). This event is also dispatched on <code>document.body</code>.</p>
<p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail"><code>detail</code></a> property of this event returns the <a href=""><code class="mtk17">Navigation</code></a> instance that initiated the navigation.</p>
<p>An event dispatched with the <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent#type"><code>type</code></a> of <code class="mtk12">"navfinished"</code> on the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element when a navigation has finished loading completely (content has been injected). This event is also dispatched on <code>document.body</code>.</p>
<p>The <a href="https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail"><code>detail</code></a> property of this event returns the <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance that initiated the navigation.</p>
</section>
<hr>
<section>

View file

@ -2,7 +2,7 @@
<main>
<section>
<h1>Navigation.MODE</h1>
<p>A static object of <a href=""><code class="mtk17">Navigation</code></a> that alters the injection method of the <a href=""><code>target</code></a> element of <a href=""><code>.navigate()</code></a></p>
<p>A static object of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> that alters the injection method of the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element of <a href="/docs/v3.1.4/Reference/JavaScript/navigate"><code>.navigate()</code></a></p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/mode/description") ?>
@ -12,12 +12,12 @@
</section>
<section class="md param">
<h2 class="default"><code class="mtk19">REPLACE</code></h2>
<p>The inner DOM of the <a href=""><code>target</code></a> element of <a href=""><code>.navigate()</code></a> will be <strong>replaced</strong> with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p>The inner DOM of the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element of <a href="/docs/v3.1.4/Reference/JavaScript/navigate"><code>.navigate()</code></a> will be <strong>replaced</strong> with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
<p>This is the default behavior.</p>
</section>
<section class="md param">
<h2><code class="mtk19">REPLACE</code></h2>
<p>The contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance will be <strong>inserted</strong>(appended) to the end of the existing DOM of the <a href=""><code>target</code></a> element of <a href=""><code>.navigate()</code></a></p>
<p>The contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance will be <strong>inserted</strong>(appended) to the end of the existing DOM of the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element of <a href="/docs/v3.1.4/Reference/JavaScript/navigate"><code>.navigate()</code></a></p>
</section>
<hr>
<section>

View file

@ -2,7 +2,7 @@
<main>
<section>
<h1>Navigation.POSITION</h1>
<p>A static object of <a href=""><code class="mtk17">Navigation</code></a> that adheres to the same concept as <a href="https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentElement#position"><code>position</code> of <code>.insertAdjacentElement()</code></a></p>
<p>A static object of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> that adheres to the same concept as <a href="https://developer.mozilla.org/en-US/docs/Web/API/Element/insertAdjacentElement#position"><code>position</code> of <code>.insertAdjacentElement()</code></a></p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/position/description") ?>
@ -12,22 +12,22 @@
</section>
<section class="md param">
<h2><code class="mtk19">AFTEREND</code></h2>
<p><a href="">Inserts/replaces</a> the DOM <strong>after</strong> the <a href=""><code>target</code></a> element with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/MODE">Inserts/replaces</a> the DOM <strong>after</strong> the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
</section>
<section class="md param">
<h2 class="default"><code class="mtk19">BEFOREEND</code></h2>
<p>This is the default behavior.</p>
<p><a href="">Inserts/replaces</a> the DOM <strong>right before closing</strong> the <a href=""><code>target</code></a> element with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href=""><code><span class="mtk17">Navigation</span>.<span class="mtk19">MODE</span>.<span class="mtk19">REPLACE</span></code></a> makes this perform the same operation as <code class="mtk19">AFTERBEGIN</code>.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/MODE">Inserts/replaces</a> the DOM <strong>right before closing</strong> the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code><span class="mtk17">Navigation</span>.<span class="mtk19">MODE</span>.<span class="mtk19">REPLACE</span></code></a> makes this perform the same operation as <code class="mtk19">AFTERBEGIN</code>.</p>
</section>
<section class="md param">
<h2><code class="mtk19">AFTERBEGIN</code></h2>
<p><a href="">Inserts/replaces</a> the DOM <strong>right after opening</strong> the <a href=""><code>target</code></a> element with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href=""><code><span class="mtk17">Navigation</span>.<span class="mtk19">MODE</span>.<span class="mtk19">REPLACE</span></code></a> makes this perform the same operation as <code class="mtk19">BEFOREEND</code>.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/MODE">Inserts/replaces</a> the DOM <strong>right after opening</strong> the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code><span class="mtk17">Navigation</span>.<span class="mtk19">MODE</span>.<span class="mtk19">REPLACE</span></code></a> makes this perform the same operation as <code class="mtk19">BEFOREEND</code>.</p>
</section>
<section class="md param">
<h2><code class="mtk19">BEFOREBEGIN</code></h2>
<p><a href="">Inserts/replaces</a> the DOM <strong>before</strong> the <a href=""><code>target</code></a> element with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p><a href="/docs/v3.1.4/Reference/JavaScript/MODE">Inserts/replaces</a> the DOM <strong>before</strong> the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
</section>
<hr>
<section>

View file

@ -2,7 +2,7 @@
<main>
<section>
<h1>Navigation.TARGET</h1>
<p>A static object of <a href=""><code class="mtk17">Navigation</code></a> that alters where the contents of a navigation should be placed relative to the <a href=""><code>target</code></a> element element for <a href=""><code>.navigate()</code></a>.</p>
<p>A static object of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> that alters where the contents of a navigation should be placed relative to the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element element for <a href="/docs/v3.1.4/Reference/JavaScript/navigate"><code>.navigate()</code></a>.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/target/description") ?>
@ -12,24 +12,24 @@
</section>
<section class="md param">
<h2 ><code class="mtk19">TOP</code></h2>
<p>The inner DOM of the <a href=""><code>target</code></a> element will be <strong>replaced</strong> with the contents of <a href=""><code>href</code></a> from a <a href=""><code class="mtk17">Navigation</code></a> instance.</p>
<p>The inner DOM of the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element will be <strong>replaced</strong> with the contents of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>href</code></a> from a <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> instance.</p>
<p>This is the default behavior when the <code>vv-shell</code> element (top navigation) is navigated.</p>
<p>Setting this parameter on a <a href=""><code>target</code></a> element that isn't the <code>vv-shell</code> element has the same effect as a normal top navigation. The target is "ignored".</p>
<p>Setting this parameter on a <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element that isn't the <code>vv-shell</code> element has the same effect as a normal top navigation. The target is "ignored".</p>
</section>
<section class="md param">
<h2><code class="mtk19">SELF</code></h2>
<p>The contents of the <a href=""><code>target</code></a> element will be navigated.</p>
<p>The contents of the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element will be navigated.</p>
<p>This is the default behavior when an element that <strong>isn't</strong> the <code>vv-shell</code> is navigated.</p>
<p>Setting this parameter on a <a href=""><code>target</code></a> element that is the <code>vv-shell</code> (top navigation) has the same effect as <code class="mtk19">TOP</code>.</p>
<p>Setting this parameter on a <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element that is the <code>vv-shell</code> (top navigation) has the same effect as <code class="mtk19">TOP</code>.</p>
</section>
<section class="md param">
<h2><code class="mtk19">BLANK</code></h2>
<p>Performs the browser-default behavior for opening links in a new window. The <a href=""><code>target</code></a> element is ignored.</p>
<p>Performs the browser-default behavior for opening links in a new window. The <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element is ignored.</p>
</section>
<section class="md param">
<h2><code class="mtk19">PARENT</code></h2>
<p>The closest <code>HTMLElement</code> to the <a href=""><code>target</code></a> element with a <code>vv-page</code> property present will be navigated. If no parent element with that attribute is found, the <code>vv-shell</code> element (top navigation) will be navigated.</p>
<p>Setting this parameter on a <a href=""><code>target</code></a> element that is the <code>vv-shell</code> (top navigation) has the same effect as <code class="mtk19">TOP</code>.</p>
<p>The closest <code>HTMLElement</code> to the <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element with a <code>vv-page</code> property present will be navigated. If no parent element with that attribute is found, the <code>vv-shell</code> element (top navigation) will be navigated.</p>
<p>Setting this parameter on a <a href="/docs/v3.1.4/Reference/JavaScript/navigate#target"><code>target</code></a> element that is the <code>vv-shell</code> (top navigation) has the same effect as <code class="mtk19">TOP</code>.</p>
</section>
<hr>
<section>

View file

@ -1,52 +1,22 @@
<?= VV::include("public/docs/v3.1.4/Reference/layout") ?>
<main>
<section>
<h1>VV::embed()</h1>
<p>Inline the contents of any file.</p>
<p>This can be very useful for bundling SVGs, plaintext files, HTML, and more for faster page loading.</p>
<h1>Navigation.bindElements()</h1>
<p>Static method on the <code class="mtk17">Navigation</code> class.</p>
<p>Calling this method will trigger an automatic binding of anchor tags that haven't been bound yet.</p>
<p>SSR anchor tags are automatically bound. This method should be called after you've added anchor tags dynamically with JavaScript.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/embed/description") ?>
</section>
<section>
<h1>Parameters</h1>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">$pathname</code></h2>
<p>Path to an asset to inline.</p>
</section>
<section class="md param">
<h3><code class="mtk6">bool</code></h3>
<h2><code class="mtk10">$relative</code></h2>
<p>Flag which when set to:</p>
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to <a href=""><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to the root of the whole filesystem.</p>
</li>
</ol>
</section>
<section>
<h1>Return value</h1>
</section>
<section>
<h3><code class="mtk6">string</code></h3>
<p>Returns the contents of a file passed to <code class="mtk10">$pathname</code> as a string. If a file can not be found at <code class="mtk10">$pathname</code>, an empty string is returned.</p>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/bindElements/description") ?>
</section>
<hr>
<section>
<h1>Examples</h1>
</section>
<section>
<h2>Inlining an SVG icon</h2>
<p>In this example we will be inlining an SVG icon from <code>/public/assets/icon.svg</code> directly into our page as if it were hardcoded.</p>
<h2>Binding an anchor tag added programmatically</h2>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/embed/example_import") ?>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/bindElements/example_bind") ?>
</section>
</main>

View file

@ -12,7 +12,7 @@
</section>
<section>
<h3><code class="mtk17">Navigation</code></h3>
<p>Returns an instance of <code class="mtk17">Navigation</code> which can then be excuted by chaining <a href=""><code>.<span class="mtk16">navigate</span>()</code></a>.</p>
<p>Returns an instance of <code class="mtk17">Navigation</code> which can then be excuted by chaining <a href="/docs/v3.1.4/Reference/JavaScript/navigate"><code>.<span class="mtk16">navigate</span>()</code></a>.</p>
</section>
<hr>
<section>

View file

@ -4,7 +4,7 @@
<container>
<h1>JavaScript Reference</h1>
<p>Vegvisir will automatically find and bind <a href="https://developer.mozilla.org/en-US/docs/Web/API/HTMLAnchorElement"><code>HTMLAnchorElement</code></a> tags and perform soft-navigation between pages on the same <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin" target="_blank">origin</a>.</p>
<p>The <a href=""><code>Navigation</code></a> lets you interact with, and expand Vegvisirs front-end behavior.</p>
<p>The <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code>Navigation</code></a> lets you interact with, and expand Vegvisirs front-end behavior.</p>
</container>
</section>
</main>

View file

@ -1,52 +1,55 @@
<?= VV::include("public/docs/v3.1.4/Reference/layout") ?>
<main>
<section>
<h1>VV::embed()</h1>
<p>Inline the contents of any file.</p>
<p>This can be very useful for bundling SVGs, plaintext files, HTML, and more for faster page loading.</p>
<h1>.navigate()</h1>
<p></p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/embed/description") ?>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/navigate/description") ?>
</section>
<section>
<h1>Parameters</h1>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">$pathname</code></h2>
<p>Path to an asset to inline.</p>
<h3><code class="mtk17">HTMLElement</code> | <code class="mtk17">String</code> | <code class="mtk6">null</code></h3>
<h2><code class="mtk10">target</code></h2>
<p>An element passed either by reference or a CSS selector passed as a string (if multiple elements match the selector; the first match will be navigated).</p>
<p>If null or no value is passed to this argument, the <a href="/docs/v3.1.4/Reference/JavaScript/Env"><code>vv-shell</code></a> element will be navigated (top navigation).</p>
</section>
<section class="md param">
<h3><code class="mtk6">bool</code></h3>
<h2><code class="mtk10">$relative</code></h2>
<p>Flag which when set to:</p>
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to <a href=""><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to the root of the whole filesystem.</p>
</li>
</ol>
<h3><code class="mtk17">String</code></h3>
<h2><code class="mtk10">position</code></h2>
<p>A <a href="/docs/v3.1.4/Reference/JavaScript/POSITION">Navigation.POSITION</a> string which will determine where content from the navigated page should be injected relative to <code class="mtk10">target</code>.</p>
</section>
<section class="md param">
<h3><code class="mtk17">String</code></h3>
<h2><code class="mtk10">mode</code></h2>
<p>A <a href="/docs/v3.1.4/Reference/JavaScript/MODE">Navigation.MODE</a> string which will determine how content from the navigated page should be injected relative to <code class="mtk10">target</code>.</p>
</section>
<section>
<h1>Return value</h1>
</section>
<section>
<h3><code class="mtk6">string</code></h3>
<p>Returns the contents of a file passed to <code class="mtk10">$pathname</code> as a string. If a file can not be found at <code class="mtk10">$pathname</code>, an empty string is returned.</p>
<h3><code class="mtk17">Promise</code></h3>
<p>Returns a Promise that will resolve when the navigated page has been injected sucessfully, or rejects if the navigation failed <strong>or</strong> if the navigation was aborted with <a href="/docs/v3.1.4/Reference/JavaScript/abort"><code>Navigation.abort</code></a></p>
</section>
<hr>
<section>
<h1>Examples</h1>
</section>
<section>
<h2>Inlining an SVG icon</h2>
<p>In this example we will be inlining an SVG icon from <code>/public/assets/icon.svg</code> directly into our page as if it were hardcoded.</p>
<h2>Top navigation</h2>
<p>Navigate the <code>vv-shell</code> element to another page (top navigation).</p>
<p>Remember that anchor tags with href's on the same origin are automatically navigated this way.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/embed/example_import") ?>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/navigate/example_shell_navigate") ?>
</section>
<section>
<h2>Navigating an element</h2>
<p>Simple programmatic navigation of an element.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/navigate/example_element_navigate") ?>
</section>
</main>

View file

@ -2,7 +2,7 @@
<main>
<section>
<h1>Navigation.options</h1>
<p>An object containing parameters that can be changed to alter the behavior of a Vegvisir <a href=""><code class="mtk17">Navigation</code></a>.</p>
<p>An object containing parameters that can be changed to alter the behavior of a Vegvisir <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a>.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/JS/options/description") ?>
@ -17,17 +17,17 @@
<ol>
<li>
<code class="mtk6">true</code>
<p>Will cause navigations performed on an instance of <a href=""><code class="mtk17">Navigation</code></a> to push to the History stack and update the browser pathname.</p>
<p>Will cause navigations performed on an instance of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> to push to the History stack and update the browser pathname.</p>
</li>
<li>
<code class="mtk6">false</code>
<p>Will cause a "silent" navigation on an instance of <a href=""><code class="mtk17">Navigation</code></a> that won't update the broweser History stack and won't change the browser pathname.</p>
<p>Will cause a "silent" navigation on an instance of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> that won't update the broweser History stack and won't change the browser pathname.</p>
</li>
</ol>
<p>The default setting for this property is:</p>
<ul>
<li><code class="mtk6">true</code> when the <a href="">vv-shell</a> (top navigation) is navigated.</li>
<li><code class="mtk6">false</code> when an element that <strong>isn't</strong> the <a href="">vv-shell</a> element is navigated.</li>
<li><code class="mtk6">true</code> when the <a href="/docs/v3.1.4/Reference/JavaScript/Env">vv-shell</a> (top navigation) is navigated.</li>
<li><code class="mtk6">false</code> when an element that <strong>isn't</strong> the <a href="/docs/v3.1.4/Reference/JavaScript/Env">vv-shell</a> element is navigated.</li>
</ul>
</section>
<section class="md param">
@ -37,11 +37,11 @@
<ol>
<li>
<code class="mtk6">true</code>
<p>Will cause navigations performed on an instance of <a href=""><code class="mtk17">Navigation</code></a> to carry the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods">request method</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Response/body">response body</a> that the initiator page received on load.</p>
<p>Will cause navigations performed on an instance of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> to carry the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods">request method</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/API/Response/body">response body</a> that the initiator page received on load.</p>
</li>
<li class="default">
<code class="mtk6">false</code>
<p>Navigations performed on an instance of <a href=""><code class="mtk17">Navigation</code></a> will be sent as <code>GET</code> requests (without a request body).</p>
<p>Navigations performed on an instance of <a href="/docs/v3.1.4/Reference/JavaScript/constructor"><code class="mtk17">Navigation</code></a> will be sent as <code>GET</code> requests (without a request body).</p>
</li>
</ol>
</section>

View file

@ -23,7 +23,7 @@
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a CSS file relative to <a href=""><code>root_path</code></a>.</p>
<p>Will make <code class="mtk10">$pathname</code> look for a CSS file relative to <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>
@ -44,7 +44,7 @@
</section>
<section>
<h2>Importing a stylesheet</h2>
<p>In this example we're importing a stylesheet from <code>/public/assets/css/style.css</code> relative from <a href=""><code>root_path</code></a>.</p>
<p>In this example we're importing a stylesheet from <code>/public/assets/css/style.css</code> relative from <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/css/example_import") ?>

View file

@ -23,7 +23,7 @@
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to <a href=""><code>root_path</code></a>.</p>
<p>Will make <code class="mtk10">$pathname</code> look for a file relative to <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>

View file

@ -22,7 +22,7 @@
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a source file relative to <a href=""><code>root_path</code></a>.</p>
<p>Will make <code class="mtk10">$pathname</code> look for a source file relative to <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>

View file

@ -23,7 +23,7 @@
<ol>
<li class="default">
<code class="mtk6">true</code>
<p>Will make <code class="mtk10">$pathname</code> look for a JavaScript source file relative to <a href=""><code>root_path</code></a>.</p>
<p>Will make <code class="mtk10">$pathname</code> look for a JavaScript source file relative to <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</li>
<li>
<code class="mtk6">false</code>
@ -44,7 +44,7 @@
</section>
<section>
<h2>Importing a JavaScript source file</h2>
<p>In this example we're importing a JavaScript source file from <code>/public/assets/js/script.js</code> relative from <a href=""><code>root_path</code></a>.</p>
<p>In this example we're importing a JavaScript source file from <code>/public/assets/js/script.js</code> relative from <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/js/example_import") ?>

View file

@ -0,0 +1,36 @@
<?= VV::include("public/docs/v3.1.4/Reference/layout") ?>
<main>
<section>
<h1>VV::root()</h1>
<p>Return an absolute path to any resource relative to <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/root/description") ?>
</section>
<section>
<h1>Parameters</h1>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">$pathname</code></h2>
<p>Path to any resource relative from <a href="/docs/v3.1.4/Reference/Env#root_path"><code>root_path</code></a>.</p>
<p>Passing an empty string or nothing to this method will return an absolute path to the root folder itself.</p>
</section>
<section>
<h1>Return value</h1>
</section>
<section>
<h3><code class="mtk6">string</code></h3>
<p>Returns a string with an absolute pathname from a relative pathname passed to <code class="mtk10">$pathname</code>.</p>
</section>
<hr>
<section>
<h1>Examples</h1>
</section>
<section>
<h2>Check if an SVG file exists before embedding</h2>
</section>
<section>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/PHP/VV/root/example_import") ?>
</section>
</main>

View file

@ -1,11 +1,11 @@
<style><?= VV::css("public/assets/css/pages/docs/aside") ?></style>
<aside>
<nav>
<a href="/docs/Env"><button class="inline">
<p>environment variables</p>
<a href="/docs/v3.1.4/Reference/Env"><button class="inline">
<p>Environment variables</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/vv-attributes"><button class="inline">
<a href="/docs/v3.1.4/Reference/vv-attributes"><button class="inline">
<p>'vv'-attributes</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
@ -13,71 +13,75 @@
<div class="spacer"></div>
<p>PHP Reference</p>
<nav>
<a href="/docs/Reference/PHP"><button class="inline">
<a href="/docs/v3.1.4/Reference/PHP"><button class="inline">
<p>PHP</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/PHP/VV/css"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/PHP/VV/css"><button class="inline sly">
<p>VV::css()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/PHP/VV/embed"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/PHP/VV/embed"><button class="inline sly">
<p>VV::embed()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/PHP/VV/include"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/PHP/VV/include"><button class="inline sly">
<p>VV::include()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/PHP/VV/init"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/PHP/VV/init"><button class="inline sly">
<p>VV::init()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/PHP/VV/js"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/PHP/VV/js"><button class="inline sly">
<p>VV::js()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/v3.1.4/Reference/PHP/VV/root"><button class="inline sly">
<p>VV::root()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
</nav>
<div class="spacer"></div>
<p>JavaScript Reference</p>
<nav>
<a href="/docs/Reference/JavaScript"><button class="inline">
<a href="/docs/v3.1.4/Reference/JavaScript"><button class="inline">
<p>JavaScript</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/constructor"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/constructor"><button class="inline sly">
<p>Navigation.constructor</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/abort"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/abort"><button class="inline sly">
<p>.abort</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/options"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/options"><button class="inline sly">
<p>.options</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/navigate"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/navigate"><button class="inline sly">
<p>.navigate()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/MODE"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/MODE"><button class="inline sly">
<p>Navigation.MODE</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/TARGET"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/TARGET"><button class="inline sly">
<p>Navigation.TARGET</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/EVENTS"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/EVENTS"><button class="inline sly">
<p>Navigation.EVENTS</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/POSITION"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/POSITION"><button class="inline sly">
<p>Navigation.POSITION</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript/bindElements"><button class="inline sly">
<a href="/docs/v3.1.4/Reference/JavaScript/bindElements"><button class="inline sly">
<p>Navigation.bindElements()</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>

View file

@ -3,11 +3,11 @@
<section class="md">
<h1>Reference documents</h1>
<p>Here you'll find cheat sheets for Vegvisir's <code>VV</code> PHP static class, and the <code>vegvisir.Navigation</code> JavaScript class.</p>
<a href="/docs/Reference/PHP"><button class="inline">
<a href="/docs/v3.1.4/Reference/PHP"><button class="inline">
<p>PHP Reference sheet</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="/docs/Reference/JavaScript"><button class="inline">
<a href="/docs/v3.1.4/Reference/JavaScript"><button class="inline">
<p>JavaScript Reference sheet</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>

View file

@ -0,0 +1,42 @@
<?= VV::include("public/docs/v3.1.4/Reference/layout") ?>
<main>
<section>
<h1>Navigation attributes</h1>
<p>Vegvisir has a few attributes that can be added to elements that can be used to bind navigations and change navigation behavior without JavaScript.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">vv</code></h2>
<p>This attribute can be added to <strong>any</strong> clickable HTML element to bind it like an anchor tag.</p>
<p>The value of this attribute should be a string with a pathname to the page that should be loaded.</p>
<p>An element with this attribute will be treated just like an anchor tag, which means (by default) the <code>vv-shell</code> will be navigated.</p>
<p>Note: If added to an anchor tag, the anchor <code>href</code> will be prefered - and the <code>vv</code> will be ignored.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">vv-position</code></h2>
<p>A <a href="/docs/v3.1.4/Reference/JavaScript/POSITION"><code>Navigation.POSITION</code></a> string that determines where the contents of <code>vv</code> (or <code>href</code> on an anchor tag) should be injected relative to the element with this attribute.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">vv-mode</code></h2>
<p>A <a href="/docs/v3.1.4/Reference/JavaScript/MODE"><code>Navigation.MODE</code></a> string that determines how the contents of <code>vv</code> (or <code>href</code> on an anchor tag) should be injected relative to the element with this attribute.</p>
</section>
<hr>
<section>
<h1>Wrapper attributes</h1>
<p>Vegvisir sets a few attributes on elements that wrap soft-navigated content. These attributes are created automatically when it's the first time an element is used as a wrapper.</p>
</section>
<section class="md param">
<h3><code class="mtk6">string</code></h3>
<h2><code class="mtk10">vv-page</code></h2>
<p>This attribute's value will be updated with the pathname of the page that was soft-navigated to.</p>
<p>The attribute is set when a navigation is <strong>initiated</strong>.</p>
</section>
<section class="md param">
<h3><code class="mtk6">bool</code></h3>
<h2><code class="mtk10">vv-loading</code></h2>
<p>The value of this attribute will be a string-boolean with a value of "true" or "false".</p>
<p>this attribute will be "true" when a navigation is initiated, and set to "false" when the contents of the target page has been fully loaded (DOM ready).</p>
</section>
</main>

View file

@ -35,7 +35,7 @@
<h2>4. Done!</h2>
<p>Navigate to your configured web server host and if you're greeted with a welcome to Vegvisir page, then everything is working as it should!</p>
<p>Feel free to experiment or follow the reference guide for more information about each Vegvisir feature.</p>
<a href="/docs/Reference"><button class="inline">
<a href="/docs/v3.1.4/Reference"><button class="inline">
<p>Reference guide</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>

View file

@ -3,6 +3,8 @@
<section class="md">
<h1>Introduction</h1>
<p>Vegvisir is a work in progress, based on a framework I developed for a company a few years ago, which in turn was based on a content injector I built for another company. You can read more about the history of this framework on my <a href="https://vlw.se/work/vlw/vegvisir">personal website</a>.</p>
<p>Adding a <a href="https://codeberg.org/vegvisir/vegvisir/releases">Vegvisir version number</a> after "/docs" in the pathname <code>/docs/vX.X.X/example-docs-page</code> lets you read the docs for a specific release.</p>
<?= VV::include("snippets/HTMLCodeDemoElement/HTMLCodeDemoElement?id=docs/v3.1.4/introduction_version") ?>
</section>
<section class="md">
<h1>Work in progress</h1>
@ -11,7 +13,7 @@
<section class="md">
<h1>The basics</h1>
<p>The simple answer to what Vegvisir does is that it will automatically find and bind navigation handlers for all <code>HTMLAnchorElement</code>s on a website. If the anchor <code>href</code> points to a page on the same origin; a PHP file (containing HTML and native PHP templating) from the website's <code>public_path</code> will be automatically soft-navigated to.</p>
<p>Another thing that Vegvisir lets you do with those soft-navigated pages is to inject and minify assets such as <a href="/docs/Reference/PHP/VV/css">CSS stylesheets</a>, <a href="/docs/Reference/PHP/VV/js">JavaScript source files</a>, and other assets that <a href="/docs/Reference/PHP/VV/embed">output text</a>.</p>
<p>And the last thing that Vegvisir will offer for you is <a href="/docs/Reference/PHP/VV/include">embeding snippets of PHP code (or another page) into a page</a>.</p>
<p>Another thing that Vegvisir lets you do with those soft-navigated pages is to inject and minify assets such as <a href="/docs/v3.1.4/Reference/PHP/VV/css">CSS stylesheets</a>, <a href="/docs/v3.1.4/Reference/PHP/VV/js">JavaScript source files</a>, and other assets that <a href="/docs/v3.1.4/Reference/PHP/VV/embed">output text</a>.</p>
<p>And the last thing that Vegvisir will offer for you is <a href="/docs/v3.1.4/Reference/PHP/VV/include">embeding snippets of PHP code (or another page) into a page</a>.</p>
</section>
</main>

View file

@ -103,7 +103,7 @@
<p>vlw</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>
<a href="https://codeberg.org/vegvisir/vegvisir/src/branch/master/LICENSE"><button class="inline sly">
<a href="https://codeberg.org/vegvisir/vegvisir/raw/branch/master/LICENSE"><button class="inline sly">
<p>license</p>
<?= VV::embed("public/assets/media/icons/chevron.svg") ?>
</button></a>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk16">bindElements</span><span class="mtk1">()&nbsp;</span><span class="mtk3">-</span><span class="mtk3">&gt;</span><span class="mtk1">&nbsp;</span><span class="mtk6">void</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">const</span><span class="mtk1">&nbsp;</span><span class="mtk19">element</span><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><span class="mtk10">document</span><span class="mtk1">.</span><span class="mtk16">createElement</span><span class="mtk1">(</span><span class="mtk12">"a"</span><span class="mtk1">);</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk19">element</span><span class="mtk1">.</span><span class="mtk10">href</span><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><span class="mtk12">"/example-page"</span><span class="mtk1">;</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk5">//&nbsp;Append&nbsp;a&nbsp;new&nbsp;anchor&nbsp;tag&nbsp;to&nbsp;the&nbsp;bottom&nbsp;of&nbsp;vv-she</span><span class="mtk5">ll</span></span></div><div style="top:76px;height:19px;" class="view-line"><span><span class="mtk10">vegvisir</span><span class="mtk1">.</span><span class="mtk10">Navigation</span><span class="mtk1">.</span><span class="mtk10">shellElement</span><span class="mtk1">.</span><span class="mtk16">appendChild</span><span class="mtk1">(</span><span class="mtk19">element</span><span class="mtk1">);</span></span></div><div style="top:95px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:114px;height:19px;" class="view-line"><span><span class="mtk5">//&nbsp;Bind&nbsp;the&nbsp;new&nbsp;element&nbsp;so&nbsp;we're&nbsp;soft-navigating&nbsp;t</span><span class="mtk5">hat&nbsp;element</span></span></div><div style="top:133px;height:19px;" class="view-line"><span><span class="mtk10">vegvisir</span><span class="mtk1">.</span><span class="mtk10">Navigation</span><span class="mtk1">.</span><span class="mtk16">bindElements</span><span class="mtk1">();</span></span></div></div>

View file

@ -1 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">new</span><span class="mtk1">&nbsp;</span><span class="mtk17">Navigation</span><span class="mtk1">(</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">href</span><span class="mtk1">:&nbsp;</span><span class="mtk17">URL</span><span class="mtk3">|</span><span class="mtk17">String</span><span class="mtk3">|</span><span class="mtk6">null</span><span class="mtk1">,</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">options</span><span class="mtk3">?:</span><span class="mtk1">&nbsp;</span><a href=""><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk10">options</span></a></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk1">)&nbsp;</span><span class="mtk3">-</span><span class="mtk3">&gt;</span><span class="mtk1">&nbsp;</span><span class="mtk6">this</span></span></div></div>
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">new</span><span class="mtk1">&nbsp;</span><span class="mtk17">Navigation</span><span class="mtk1">(</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">href</span><span class="mtk1">:&nbsp;</span><span class="mtk17">URL</span><span class="mtk3">|</span><span class="mtk17">String</span><span class="mtk3">|</span><span class="mtk6">null</span><span class="mtk1">,</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">options</span><span class="mtk3">?:</span><span class="mtk1">&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/options"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk10">options</span></a></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk1">)&nbsp;</span><span class="mtk3">-</span><span class="mtk3">&gt;</span><span class="mtk1">&nbsp;</span><span class="mtk6">this</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk1">.</span><span class="mtk16">navigate</span><span class="mtk1">(</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">target</span><span class="mtk1">:&nbsp;</span><span class="mtk17">HTMLElement</span><span class="mtk3">|</span><span class="mtk17">String</span><span class="mtk3">|</span><span class="mtk6">null</span><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/shellElement"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk10">shellElement</span></a><span class="mtk1">,</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">position</span><span class="mtk1">:&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/POSITION"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk19">POSITION</span></a><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/POSITION"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk19">POSITION</span><span class="mtk1">.</span><span class="mtk19">BEFOREEND</span></a><span class="mtk1">,</span></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk10">mode</span><span class="mtk1">:&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/MODE"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk19">MODE</span><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><a href="/docs/v3.1.4/Reference/JavaScript/MODE"><span class="mtk17">Navigation</span><span class="mtk1">.</span><span class="mtk19">MODE</span><span class="mtk1">.</span><span class="mtk19">REPLACE</span></span></a></div><div style="top:76px;height:19px;" class="view-line"><span><span class="mtk1">)&nbsp;</span><span class="mtk3">-</span><span class="mtk3">&gt;</span><span class="mtk1">&nbsp;</span><span class="mtk17">Promise</span><span class="mtk3">&lt;</span><span class="mtk6">void</span><span class="mtk3">&gt;</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">const</span><span class="mtk1">&nbsp;</span><span class="mtk19">nav</span><span class="mtk1">&nbsp;</span><span class="mtk3">=</span><span class="mtk1">&nbsp;</span><span class="mtk6">new</span><span class="mtk1">&nbsp;</span><span class="mtk10">vegvisir</span><span class="mtk1">.</span><span class="mtk16">Navigation</span><span class="mtk1">(</span><span class="mtk12">"/example-page"</span><span class="mtk1">);</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk5">//&nbsp;Navigate&nbsp;the&nbsp;passed&nbsp;&lt;article&gt;&nbsp;element&nbsp;to&nbsp;"publi</span><span class="mtk5">c/example-page"&nbsp;by&nbsp;element&nbsp;reference</span></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk19">nav</span><span class="mtk1">.</span><span class="mtk16">navigate</span><span class="mtk1">(</span><span class="mtk10">document</span><span class="mtk1">.</span><span class="mtk16">querySelector</span><span class="mtk1">(</span><span class="mtk12">"article"</span><span class="mtk1">));</span></span></div><div style="top:76px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:95px;height:19px;" class="view-line"><span><span class="mtk5">//&nbsp;Navigate&nbsp;the&nbsp;first&nbsp;section&nbsp;inside&nbsp;the&nbsp;article&nbsp;e</span><span class="mtk5">lement&nbsp;element&nbsp;to&nbsp;"public/example-page"&nbsp;by&nbsp;CSS&nbsp;sel</span><span class="mtk5">ector</span></span></div><div style="top:114px;height:19px;" class="view-line"><span><span class="mtk19">nav</span><span class="mtk1">.</span><span class="mtk16">navigate</span><span class="mtk1">(</span><span class="mtk12">"article&nbsp;&gt;&nbsp;section:first-child"</span><span class="mtk1">);</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">new</span><span class="mtk1">&nbsp;</span><span class="mtk10">vegvisir</span><span class="mtk1">.</span><span class="mtk16">Navigation</span><span class="mtk1">(</span><span class="mtk12">"/example-page"</span><span class="mtk1">).</span><span class="mtk16">navigate</span><span class="mtk1">();</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">&lt;?php</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk3">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk17">VV</span><span class="mtk3">::</span><span class="mtk16">root</span><span class="mtk3">(</span></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk6">string</span><span class="mtk3">&nbsp;</span><span class="mtk10">$pathname</span><span class="mtk3">&nbsp;=&nbsp;</span><span class="mtk12">""</span></span></div><div style="top:76px;height:19px;" class="view-line"><span><span class="mtk3">&nbsp;&nbsp;&nbsp;&nbsp;):&nbsp;</span><span class="mtk6">string</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk6">&lt;?php</span><span class="mtk3">&nbsp;</span><span class="mtk18">if</span><span class="mtk3">&nbsp;(</span><span class="mtk16">is_file</span><span class="mtk3">(</span><span class="mtk17">VV</span><span class="mtk3">::</span><span class="mtk16">root</span><span class="mtk3">(</span><span class="mtk12">"public/assets/my-icon.svg"</span><span class="mtk3">))):&nbsp;</span><span class="mtk6">?</span><span class="mtk6">&gt;</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk1">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="mtk6">&lt;?=</span><span class="mtk3">&nbsp;</span><span class="mtk17">VV</span><span class="mtk3">::</span><span class="mtk16">embed</span><span class="mtk3">(</span><span class="mtk12">"public/assets/my-icon.svg"</span><span class="mtk3">)&nbsp;</span><span class="mtk6">?</span><span class="mtk6">&gt;</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span class="mtk6">&lt;?php</span><span class="mtk3">&nbsp;</span><span class="mtk18">endif</span><span class="mtk3">;&nbsp;</span><span class="mtk6">?</span><span class="mtk6">&gt;</span></span></div></div>

View file

@ -0,0 +1 @@
<div><div style="top:0px;height:19px;" class="view-line"><span><span class="mtk5">#&nbsp;Get&nbsp;the&nbsp;reference&nbsp;for&nbsp;VV::css()&nbsp;for&nbsp;the&nbsp;latest&nbsp;v</span><span class="mtk5">ersion&nbsp;of&nbsp;Vegvisir</span></span></div><div style="top:19px;height:19px;" class="view-line"><span><span class="mtk1">/docs/Reference/PHP/VV/css</span></span></div><div style="top:38px;height:19px;" class="view-line"><span><span></span></span></div><div style="top:57px;height:19px;" class="view-line"><span><span class="mtk5">#&nbsp;Get&nbsp;the&nbsp;reference&nbsp;for&nbsp;VV::css()&nbsp;for&nbsp;a&nbsp;specific&nbsp;v</span><span class="mtk5">ersion&nbsp;of&nbsp;Vegvisir&nbsp;(v3.1.4&nbsp;for&nbsp;example)</span></span></div><div style="top:76px;height:19px;" class="view-line"><span><span class="mtk1">/docs/v3.1.4/Reference/PHP/VV/css</span></span></div></div>

View file

@ -1,8 +0,0 @@
<?php
namespace VVWebsite;
/**
* # Docs
*/
const VERSION_LATEST = "/public/docs/v3.1.4/";

1
vegvisir Submodule

@ -0,0 +1 @@
Subproject commit f66dc86d76dbb6739fef4dc6fbf941795a0fbc66