nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-23 07:47:54 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

variant: make variant switch work on slow networks #228

Browse source
This commit is contained in:
Sören Weber 2022-03-28 11:56:51 +02:00
parent c673a65c62
commit 1b1d036534
No known key found for this signature in database
GPG key ID: 07D17FF580AE7589
2 changed files with 22 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
layouts/partials/stylesheet.html
View file

@ -7,7 +7,7 @@
<link href="{{"css/theme.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet">
{{- $themevariants := slice | append (.Site.Params.themeVariant | default "relearn-light" ) }}
{{- with index $themevariants 0 }}
<link id="variant-style" href="{{(printf "css/theme-%s.css" .) | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet">
<link href="{{(printf "css/theme-%s.css" .) | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" id="variant-style">
{{- end }}
<link href="{{"css/variant.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet">
<link href="{{"css/theme-relearn-light.css" | relURL}}{{ if $assetBusting }}?{{ now.Unix }}{{ end }}" rel="stylesheet" media="print">

25
static/js/variant.js
View file

@ -4,6 +4,7 @@ var variants = {
variant: '',
variants: [],
customvariantname: 'my-custom-variant',
isstylesheetloaded: true,
init: function( variants ){
this.variants = variants;
@ -25,6 +26,10 @@ var variants = {
window.localStorage.setItem( baseUriFull+'variant', variant );
},
isVariantLoaded: function(){
return window.theme && this.isstylesheetloaded;
},
markSelectedVariant: function(){
var variant = this.getVariant();
var select = document.querySelector( '#select-variant' );
@ -35,8 +40,9 @@ var variants = {
if( variant && select.value != variant ){
select.value = variant;
}
setTimeout( function(){
if( window.theme ){
var interval_id = setInterval( function(){
if( this.isVariantLoaded() ){
clearInterval( interval_id );
initMermaid( true );
initSwagger( true );
}
@ -127,7 +133,6 @@ var variants = {
this.saveCustomVariant();
}
}.bind( this ), 25 );
},
resetVariant: function(){
@ -142,6 +147,10 @@ var variants = {
}
},
onLoadStylesheet: function(){
variants.isstylesheetloaded = true;
},
switchStylesheet: function( variant, without_check ){
var link = document.querySelector( '#variant-style' );
if( !link ){
@ -149,7 +158,15 @@ var variants = {
}
var old_path = link.getAttribute( 'href' );
var new_path = this.generateVariantPath( variant, old_path );
link.setAttribute( 'href', new_path );
this.isstylesheetloaded = false;
// Chrome needs a new element to trigger the load callback again
var new_link = document.createElement( 'link' );
new_link.id = 'variant-style';
new_link.rel = 'stylesheet';
new_link.onload = this.onLoadStylesheet;
new_link.setAttribute( 'href', new_path );
link.parentNode.replaceChild( new_link, link );
},
changeVariant: function( variant ){