Skip to content

Instantly share code, notes, and snippets.

@matijs

matijs/switcher-es5.js

Last active December 8, 2016 22:47
Show Gist options
  • Save matijs/94e39a9e5821d9d6dbdecaf6ebadd322 to your computer and use it in GitHub Desktop.
Save matijs/94e39a9e5821d9d6dbdecaf6ebadd322 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. matijs revised this gist Dec 8, 2016. 1 changed file with 40 additions and 38 deletions.
    78 changes: 40 additions & 38 deletions switcher-es5.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,45 +1,47 @@
    (function() {
    var links = Array.prototype.slice.call( document.querySelectorAll( 'link[title]') );
    var styles = links.reduce( function( styles, link ){
    if ( styles.indexOf( link.title ) === -1 ) {
    styles.push( link.title );
    }
    return styles;
    }, []);
    var title = window.sessionStorage && window.sessionStorage.getItem( 'title' ) || '';
    var select;
    var option;
    var i = 0;
    window.addEventListener( 'load', function() {
    var links = Array.prototype.slice.call( document.querySelectorAll( 'link[title]') );
    var uniqueTitles = links.reduce( function( titles, link ) {
    if ( titles.indexOf( link.title ) === -1 ) {
    titles.push( link.title );
    }
    return titles;
    }, []);
    var title = window.sessionStorage && window.sessionStorage.getItem( 'title' ) || '';
    var select;
    var option;
    var i = 0;

    function selectStyle( title ) {
    links.forEach( function( link ){
    link.disabled = true;
    link.disabled = link.title !== title;
    });
    function selectStyle( title ) {
    links.forEach( function( link ) {
    link.disabled = true;
    link.disabled = link.title !== title;
    });

    if ( window.sessionStorage ) {
    window.sessionStorage.setItem( 'title', title );
    if ( window.sessionStorage ) {
    window.sessionStorage.setItem( 'title', title );
    }
    }
    }

    if ( styles.length > 1 ) {
    if ( title ) {
    selectStyle( title );
    }
    select = document.createElement( 'select' );
    select.setAttribute( 'style', 'position: absolute; top: 1em; right: 1em;' );
    for ( ; i < styles.length; i++ ) {
    option = document.createElement( 'option' );
    option.text = 'CSS: ' + styles[ i ];
    option.value = styles[ i ];
    option.selected = styles[ i ] === title;
    select.add( option );
    }
    document.body.appendChild( select );
    if ( uniqueTitles.length > 1 ) {
    if ( title ) {
    selectStyle( title );
    }
    select = document.createElement( 'select' );
    select.setAttribute( 'style', 'position: absolute; top: 1em; right: 1em;' );
    for ( ; i < uniqueTitles.length; i++ ) {
    option = document.createElement( 'option' );
    option.text = 'CSS: ' + uniqueTitles[ i ];
    option.value = uniqueTitles[ i ];
    option.selected = uniqueTitles[ i ] === title;
    select.add( option );
    }
    document.body.appendChild( select );

    select.addEventListener( 'change', function( event ) {
    title = event.target.options[ event.target.selectedIndex ].value;
    selectStyle( title );
    });
    }
    select.addEventListener( 'change', function( event ) {
    title = event.target.options[ event.target.selectedIndex ].value;
    selectStyle( title );
    });
    }
    });
    }());
  2. matijs revised this gist Dec 8, 2016. 1 changed file with 5 additions and 4 deletions.
    9 changes: 5 additions & 4 deletions switcher-es5.js
    View file
    Original file line number Diff line number Diff line change
    @@ -6,7 +6,7 @@
    }
    return styles;
    }, []);
    var title = localStorage.getItem( 'title' );
    var title = window.sessionStorage && window.sessionStorage.getItem( 'title' ) || '';
    var select;
    var option;
    var i = 0;
    @@ -17,15 +17,16 @@
    link.disabled = link.title !== title;
    });

    localStorage.setItem( 'title', title );
    if ( window.sessionStorage ) {
    window.sessionStorage.setItem( 'title', title );
    }
    }

    if ( styles.length > 1 ) {
    select = document.createElement( 'select' );

    if ( title ) {
    selectStyle( title );
    }
    select = document.createElement( 'select' );
    select.setAttribute( 'style', 'position: absolute; top: 1em; right: 1em;' );
    for ( ; i < styles.length; i++ ) {
    option = document.createElement( 'option' );
  3. matijs created this gist Dec 8, 2016.
    44 changes: 44 additions & 0 deletions switcher-es5.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,44 @@
    (function() {
    var links = Array.prototype.slice.call( document.querySelectorAll( 'link[title]') );
    var styles = links.reduce( function( styles, link ){
    if ( styles.indexOf( link.title ) === -1 ) {
    styles.push( link.title );
    }
    return styles;
    }, []);
    var title = localStorage.getItem( 'title' );
    var select;
    var option;
    var i = 0;

    function selectStyle( title ) {
    links.forEach( function( link ){
    link.disabled = true;
    link.disabled = link.title !== title;
    });

    localStorage.setItem( 'title', title );
    }

    if ( styles.length > 1 ) {
    select = document.createElement( 'select' );

    if ( title ) {
    selectStyle( title );
    }
    select.setAttribute( 'style', 'position: absolute; top: 1em; right: 1em;' );
    for ( ; i < styles.length; i++ ) {
    option = document.createElement( 'option' );
    option.text = 'CSS: ' + styles[ i ];
    option.value = styles[ i ];
    option.selected = styles[ i ] === title;
    select.add( option );
    }
    document.body.appendChild( select );

    select.addEventListener( 'change', function( event ) {
    title = event.target.options[ event.target.selectedIndex ].value;
    selectStyle( title );
    });
    }
    }());