Removed dynload
This commit is contained in:
parent
5413c3b433
commit
b943030412
4 changed files with 8 additions and 117 deletions
|
|
@ -30,14 +30,14 @@ $showNowPlaying = !empty($is_index) || !empty($do_fullscreen_header);
|
|||
<img src="<?=($backgrounds[array_rand($backgrounds)]);?>" alt=""/>
|
||||
</div>
|
||||
<div class="header-foreground"<?php if(isset($offset) && $offset > 0) echo " style=\"padding-bottom: {$offset}px\""; ?>>
|
||||
<a class="header-logo" href="/" data-fm-dynload="">
|
||||
<a class="header-logo" href="/">
|
||||
<div class="header-flash">flash</div>
|
||||
<div class="header-wave">wave</div>
|
||||
</a>
|
||||
<div class="header-right">
|
||||
<div class="header-now-playing header-now-playing-hidden">
|
||||
<div class="header-now-playing-icon" title="Now listening to...">
|
||||
<a href="/now-listening" data-fm-dynload=""><div class="fmi fmi-music"></div></a>
|
||||
<a href="/now-listening"><div class="fmi fmi-music"></div></a>
|
||||
</div>
|
||||
<div class="header-now-playing-cover">
|
||||
<img src="//now.flash.moe/resources/no-cover.png" alt=""/>
|
||||
|
|
@ -49,7 +49,7 @@ $showNowPlaying = !empty($is_index) || !empty($do_fullscreen_header);
|
|||
</div>
|
||||
<div class="header-menu">
|
||||
<?php foreach($menu as $link): ?>
|
||||
<a href="<?=$link['link'];?>"<?php if($link['link'][0] === '/' && substr($link['link'], 0, 2) !== '//') { echo ' data-fm-dynload=""'; } ?>><?=$link['title'];?></a>
|
||||
<a href="<?=$link['link'];?>"<?php if($link['link'][0] === '/' && substr($link['link'], 0, 2) !== '//') { echo ''; } ?>><?=$link['title'];?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -195,7 +195,7 @@ $router->get('/', function() use ($db) {
|
|||
$body .= "<a href=\"{$link['link']}\"";
|
||||
|
||||
if($link['link'][0] === '/' && substr($link['link'], 0, 2) !== '//')
|
||||
$body .= ' data-fm-dynload=""';
|
||||
$body .= '';
|
||||
|
||||
$body .= ">{$link['title']}</a>";
|
||||
}
|
||||
|
|
@ -208,7 +208,7 @@ HTML;
|
|||
$body .= <<<HTML
|
||||
<div class="index-feature">
|
||||
<div class="index-feature-header">
|
||||
<a href="/projects" class="index-feature-header-link" data-fm-dynload=""></a>
|
||||
<a href="/projects" class="index-feature-header-link"></a>
|
||||
<div class="index-feature-header-title">Projects</div>
|
||||
<div class="index-feature-header-more">More</div>
|
||||
</div>
|
||||
|
|
@ -228,7 +228,7 @@ HTML;
|
|||
|
||||
$body .= <<<HTML
|
||||
<div class="index-project" style="background-color: #{$colour};">
|
||||
<a href="/projects#{$project->getCleanName()}" class="index-project-anchor" data-fm-dynload=""></a>
|
||||
<a href="/projects#{$project->getCleanName()}" class="index-project-anchor"></a>
|
||||
<div class="index-project-content">
|
||||
<div class="index-project-name">{$project->getName()}</div>
|
||||
HTML;
|
||||
|
|
@ -254,7 +254,7 @@ HTML;
|
|||
</div>
|
||||
<div class="index-feature">
|
||||
<div class="index-feature-header">
|
||||
<a href="/contact" class="index-feature-header-link" data-fm-dynload=""></a>
|
||||
<a href="/contact" class="index-feature-header-link"></a>
|
||||
<div class="index-feature-header-title">Contact</div>
|
||||
<div class="index-feature-header-more">More</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -61,97 +61,6 @@ window.fm = (function() {
|
|||
hXhr.send();
|
||||
}
|
||||
|
||||
this.dynloadCurrent = function() {
|
||||
return {
|
||||
components: {
|
||||
header: {
|
||||
title: document.title,
|
||||
is_index: document.body.classList.contains('index'),
|
||||
do_fullscreen_header: document.body.classList.contains('fullscreen-header'),
|
||||
is_now_playing: document.body.classList.contains('now-playing'),
|
||||
},
|
||||
footer: {
|
||||
onload: this.onload || [],
|
||||
}
|
||||
},
|
||||
raw_html: fm.container.innerHTML,
|
||||
};
|
||||
};
|
||||
|
||||
this.dynloadApply = function(state) {
|
||||
if((state.components || {}).header) {
|
||||
document.title = state.components.header.title || '';
|
||||
document.body.classList[state.components.header.is_index ? 'add' : 'remove']('index');
|
||||
document.body.classList[state.components.header.do_fullscreen_header ? 'add' : 'remove']('fullscreen-header');
|
||||
document.body.classList[state.components.header.is_now_playing ? 'add' : 'remove']('now-playing');
|
||||
}
|
||||
|
||||
if(typeof state.raw_html !== 'undefined')
|
||||
this.container.innerHTML = state.raw_html;
|
||||
|
||||
if((state.components || {}).footer) {
|
||||
this.runFuncs(state.components.footer.onload || []);
|
||||
}
|
||||
|
||||
fm.dynloadInit();
|
||||
fm.setRandomHeaderBackgroundIfNotPlaying();
|
||||
};
|
||||
|
||||
this.dynloadInit = function(initial) {
|
||||
if(initial) {
|
||||
history.replaceState(this.dynloadCurrent(), document.title, location.toString());
|
||||
window.addEventListener('popstate', function(ev) {
|
||||
fm.dynloadApply(ev.state || {});
|
||||
});
|
||||
}
|
||||
|
||||
var dynload = document.querySelectorAll('[data-fm-dynload]');
|
||||
for(var i = 0; i < dynload.length; ++i)
|
||||
(function(dc){
|
||||
var url = new URL(dc.href),
|
||||
hash = url.hash.substring(1);
|
||||
url.hash = '';
|
||||
dc.removeAttribute('data-fm-dynload');
|
||||
dc.addEventListener('click', function(ev) {
|
||||
ev.stopPropagation();
|
||||
ev.preventDefault();
|
||||
|
||||
var xhr = new XMLHttpRequest;
|
||||
xhr.onload = function() {
|
||||
try {
|
||||
var obj = JSON.parse(xhr.responseText);
|
||||
} catch(ex) {}
|
||||
if(!obj) {
|
||||
location.assign(dc.href);
|
||||
return;
|
||||
}
|
||||
var title = ((obj.components || {}).header || {}).title || '';
|
||||
history.pushState(obj, title, dc.href);
|
||||
fm.dynloadApply(obj);
|
||||
if(hash) {
|
||||
var targetEl = document.getElementById(hash);
|
||||
if(targetEl) {
|
||||
setTimeout(function() {
|
||||
window.scrollTo({
|
||||
top: targetEl.getBoundingClientRect().top,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}, 500);
|
||||
}
|
||||
}
|
||||
};
|
||||
xhr.onerror = function(ev) {
|
||||
location.assign(dc.href);
|
||||
};
|
||||
xhr.open('GET', url);
|
||||
xhr.setRequestHeader('Accept', 'application/x-fdynload+json');
|
||||
xhr.send();
|
||||
}, true);
|
||||
})(dynload[i]);
|
||||
};
|
||||
|
||||
this.dynloadInit(true);
|
||||
|
||||
this.selectTextInElement = function(elem) {
|
||||
// MSIE
|
||||
if(document.body.createTextRange) {
|
||||
|
|
|
|||
|
|
@ -68,17 +68,7 @@ define('FM_ERRS' , [
|
|||
],
|
||||
]);
|
||||
|
||||
define('FM_DYNLOAD', filter_input(INPUT_SERVER, 'HTTP_ACCEPT') === 'application/x-fdynload+json');
|
||||
|
||||
function fm_component(string $_component_name, array $vars = []): string {
|
||||
if(FM_DYNLOAD) {
|
||||
global $fmComponentVars;
|
||||
if(!isset($fmComponentVars))
|
||||
$fmComponentVars = [];
|
||||
$fmComponentVars[$_component_name] = $vars;
|
||||
return '';
|
||||
}
|
||||
|
||||
extract($vars);
|
||||
|
||||
ob_start();
|
||||
|
|
@ -207,16 +197,8 @@ if($result !== null && !is_bool($result)) {
|
|||
if(strtolower(substr($result, 0, 14)) === '<!doctype html') {
|
||||
header('Content-Type: text/html; charset=utf-8');
|
||||
echo $result;
|
||||
} else {
|
||||
if(FM_DYNLOAD) {
|
||||
header('Content-Type: application/x-fdynload+json');
|
||||
echo json_encode([
|
||||
'components' => $fmComponentVars ?? [],
|
||||
'raw_html' => $result,
|
||||
]);
|
||||
} else {
|
||||
echo $result;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue