Utente:Ruthven/DdojePaggene.js

'A Wikisource.

Notarella: Aroppo pubbreca putisse necessità 'e pulezzà 'a caché d' 'o navigatóre pe vedé 'e cagnamienti.

  • Firefox / Safari: Sprémme 'o buttóne maiuscole e ffà clic ncopp'a Recarreca, o pure spremme Ctrl-F5 o Ctrl-R (⌘-R ncopp'a Mac)
  • Google Chrome: spremme Ctrl-Shift-R (⌘-Shift-R ncopp'a nu Mac)
  • Internet Explorer/edge: Spremme 'o buttóne Ctrl pe' tramente ca faie click ncopp'a Refresh, o pure spremmere Ctrl-F5
  • Opera: Vaje addò 'o Menu → Mpustaziune (Opera → Mpustaziune ncopp' 'o Mac) e po' ncopp'a Privacy & sicurezza → Pulezza date d' 'o browser → Immaggene e file d' 'a cache.
// ==UserScript==
// @name        Wikisource Double Page - Ddoje paggene
// @description Wikisource reading mode with two pages side-by-side 
// @include     http://*.wikisource.org/*
// @author      Ruthven
// @date		2019
// ==/UserScript==


// Make sure the utilities module is loaded (will only load if not already)
mw.loader.using( [ 'mediawiki.util',  'mediawiki.api' ], function () {
    $twoPages = false;
    
    // Only for NS Paggena
    if ( mw.config.get( 'wgCanonicalNamespace' ) === 'Page' ) {
        $( document ).ready( function () { 

            // Goes back to the initial page
            var pageContent = document.getElementById( 'content' ).innerHTML;
            $currentPage = mw.config.get( 'wgPageName' );
            
            // Side bar Portlet
            var link = mw.util.addPortletLink ( 'p-tb', '#', 'Ddoje paggene', 'pt-twopages', 'Split screen and read two pages at once' );   

            $( link ).click( function ( event ) {
                event.preventDefault();
                $twoPages = ! $twoPages;
                if ( $twoPages ){
                    doTwoPages();
                } else {
                    doOnePage( pageContent );
                }
                replacePortlet( link );
            } );  // end link-event
        } );
    } // ns verification
} );

/**
 * Loads the previous two pages.
 */
function doPrev () {
    // getting the number of the page
    var currentPageNum = parseInt( $currentPage.split( '/' )[1] );
    var previousPage = $currentPage.split( '/' )[0] + '/' + ( currentPageNum - 1 );
    var previousPrevPage = $currentPage.split( '/' )[0] + '/' + ( currentPageNum - 2 );
    $ra.style.backgroundColor = "beige";
  
    if ( (currentPageNum - 1) < 1 ) {
        console.log( "Document finished!" );
        $la.style.backgroundColor = "black";
        return;        
    } else if ( ( currentPageNum - 2 ) < 1 ) {
        $currentPage = previousPage;
        // replace left with right
        var containerFirst = document.getElementById( 'content-first' );
        var replacer = containerFirst.getElementsByClassName( 'mw-parser-output' )[0].innerHTML;
        var containerSecond = document.getElementById( 'content-parallel' );
        var replacing = containerSecond.getElementsByClassName( 'mw-parser-output' )[0];
        replacing.innerHTML = replacer; 
                
        var params = {
            action: 'parse',
            page:    previousPage,
            format: 'json'
        },
            api = new mw.Api();
        api.get( params ).done( function ( data ) {
            var wikitext = data.parse.text['*'];
            // _Heading           
            var q1 = document.getElementById( 'firstHeading' );
            q1.innerHTML = previousPage.replace( /\_/g, ' ' );
            var q2 = document.getElementById( 'secondHeading' );
            q2.innerHTML = ($currentPage.split( '/' )[0] + '/' + currentPageNum).replace( /\_/g, ' ' );
            console.log(currentPageNum);
            display( wikitext, containerFirst );
        }).fail ( function () {
    		console.log ( 'Api GET failed!!' );
    	});
        return;
    } // end special cases
    $currentPage = previousPrevPage;
    
    // gets page -2 and page -1
    var params = {
        action: 'parse',
        page:    previousPrevPage,
        format: 'json'
    },
        api = new mw.Api();
    api.get( params ).done( function ( data ) {
        var wikitext = data.parse.text[ '*' ];
        // _Heading           
        var q1 = document.getElementById( 'firstHeading' );
        if ( q1 !== null )
    		q1.innerHTML = previousPrevPage.replace( /\_/g, ' ' );
		var containerFirst =  document.getElementById( 'content-first' );
	    display(wikitext, containerFirst );
    }).fail ( function () {
    	alert( 'API Query Failed!! (previousPrevPage)' );
	});

    params = {
        action: 'parse',
        page:    previousPage,
        format: 'json'
    },
      api = new mw.Api();
    api.get( params ).done( function ( data ) {
        var wikitext =  data.parse.text[ '*' ];
        // _Heading           
        var q2 = document.getElementById( 'secondHeading' );
        if ( q2 !== null)
            q2.innerHTML = previousPage.replace( /\_/g, ' ' );
	    var containerParallel = document.getElementById( 'content-parallel' );
	    display( wikitext, containerParallel );
    }).fail ( function () {
    		console.log ( 'Api GET failed!! (previousPage)' );
    });    
} // end doPrev

/**
 * Loads the next two pages.
 */
function doNext () {
    // getting the number of the page
    var currentPageNum = parseInt( $currentPage.split( '/' )[1] );
    var nextPage = $currentPage.split( '/' )[0] + '/' + (currentPageNum + 2);
    var nextNextPage = $currentPage.split( '/' )[0] + '/' + (currentPageNum + 3);
    $la.style.backgroundColor = 'beige';
    
    var params = {
        action: 'parse',
        page:    nextPage,
        format: 'json'
    },
        api = new mw.Api();
    api.get( params ).done( function ( data ) {
        var wikitext =  data.parse.text[ '*' ];
        // _Heading           
        var q1 = document.getElementById( 'firstHeading' );
        q1.innerHTML = nextPage.replace( /\_/g, ' ' );
        display( wikitext, document.getElementById( 'content-first' ) );
    }).fail( function() {
        console.log( "Document finished!" );
        $ra.style.backgroundColor = "black";
        return;
    });

    params = {
        action: 'parse',
        page:    nextNextPage,
        format: 'json'
    },
    	api = new mw.Api();
    api.get( params ).done( function ( data ) {
        var wikitext =  data.parse.text[ '*' ];
        $currentPage = nextPage;
        // _Heading           
        var q2 = document.getElementById( 'secondHeading' );
        q2.innerHTML = nextNextPage.replace( /\_/g, ' ' );
        var containerParallel = document.getElementById( 'content-parallel' );
        display( wikitext, containerParallel );
    }).fail( function () {
        console.log( "Document finished!" );
        $ra.style.backgroundColor = "black";
        $currentPage = nextPage;
        var q2 = document.getElementById( 'secondHeading' );
        q2.innerHTML = '\u00A0';
        display( '\u00A0', document.getElementById( 'content-parallel' ));
    });
} // end doNext

/**
 * Creates empty div
 * @param {string} xtext Text to be displayed
 * @return {HTMLElement} mwp The HTML element of the portlet menu.
 */
function emptyDivParserOutput ( xtext ) {
  var mwp = document.createElement( 'div' );
  mwp.setAttribute( 'class', 'mw-parser-output' );
  mwp.innerHTML = xtext;
  return mwp;
}


/**
 * Creates the left arrow.
 */
function rebuildLeftArrow() {
  console.log( 'rebuildLeftArrow' );
  var prp = document.getElementsByClassName( 'prp-tabs' ) [0];
  var li = document.createElement( 'li' );
  li.setAttribute( 'id', 'ca-proofreadPagePrevLink' );
  li.setAttribute( 'class', 'icon' );
  var sp = document.createElement( 'span' );
  $la = document.createElement( 'a' );
  $la.setAttribute( 'href', mw.config.get( 'wgArticlePath' ).replace( '$1', $currentPage)); // TODO Check
  $la.setAttribute( 'rel', 'prev' );
  $la.setAttribute( 'title', 'Paggena precedente' );
  $la.setAttribute( 'class', 'oo-ui-icon-previous' );
  $la.innerHTML = 'Paggena precedente';
  $la.style.backgroundColor = 'black';
  sp.appendChild($la);
  li.appendChild(sp);
  $(li).click(function (event) {
    event.preventDefault();
    doPrev();
  });
  prp.insertAdjacentElement( 'afterbegin', li);
  $ra.style.backgroundColor = 'beige'; // NB_: there can be the case (1 page text) where ra doesn't exist
} 

/**
 * Creates the right arrow.
 **/
function rebuildRightArrow() {
  console.log( 'rebuildRightArrow' );
  var prp = document.getElementsByClassName( 'prp-tabs' ) [0];
  var li = document.createElement( 'li' );
  li.setAttribute( 'id', 'ca-proofreadPageNextLink' );
  li.setAttribute( 'class', 'icon' );
  var sp = document.createElement( 'span' );
  $ra = document.createElement( 'a' );
  $ra.setAttribute( 'href', mw.config.get( 'wgArticlePath' ).replace( '$1', $currentPage) ); // TODO Check
  $ra.setAttribute( 'rel', 'next' );
  $ra.setAttribute( 'title', 'Paggena successiva' );
  $ra.setAttribute( 'class', 'oo-ui-icon-next' );
  $ra.innerHTML = 'Paggena successiva';
  $ra.style.backgroundColor = 'black';
  sp.appendChild($ra);
  li.appendChild(sp);
  $(li).click(function (event) {
    event.preventDefault();
    doNext();
  });
  prp.insertBefore(li, document.getElementById( 'ca-nstab-page' ));
  $la.style.backgroundColor = 'beige';
}

/**
 * Creates a parallel text with the next page.
 * 
 * @param {string} cont The HTML content to display.
 */
function doOnePage ( cont ) {
    // Navigation arrows
    try {
	    $la.style.backgroundColor = '';
	} catch (e) {
		console.log( e.message );
	}
	try {
	    $ra.style.backgroundColor = '';
	} catch (e) {
	    console.log( e.message );
	}
    var c = document.getElementById( 'content' );
    c.innerHTML = cont;
}

/**
 * Queries and displays the page contents.
 */
function doTwoPages () {
    // getting the number of the page
    // TODO: here put always odd page at left
    var currentPageNum = parseInt( $currentPage.split( '/' )[1] );
    var nextPage = $currentPage.split( '/' )[0] + '/' + ( currentPageNum + 1 );
    console.log(nextPage);
       
    var params = {
        action: 'parse',
        page:    nextPage,
        format: 'json'
    },
    api = new mw.Api();

    api.get( params ).done( function ( data ) {
        var wikitext =  data.parse.text[ '*' ];
        firstDisplay( wikitext, nextPage );
    }).fail( function () {
	    console.log( 'Next page does not exist' ); 
	    var wikitext = '\u00A0';
	    firstDisplay( wikitext, $currentPage) ;
	});
               
    // Navigation arrows
	try {
	    $la.style.backgroundColor = 'beige';
	} catch (e) {
		console.log( e.message );
	}
	try {
		$ra.style.backgroundColor = 'beige';
	} catch (e) {
	    console.log( e.message );
	}
}

/**
 * Modifies the portlet menu element of the gadget,
 * showing one or two pages visualisation mode.
 * 
 * @param {HTMLElement} pt The HTML element of the portlet menu.
 */
function replacePortlet( pt ) {
    var a = pt.getElementsByTagName( 'a' )[0];

    if  ( $twoPages ) {
        a.setAttribute( 'title', 'go back to single page' );
        a.innerHTML = "Na paggena sula";
    } else {
        a.setAttribute( 'title', 'Split screen and read two pages at once' );
        a.innerHTML = "Doje paggene";
    }   
}

/**
 * Displays a text.
 * 
 * @param (string) wtext Content to display.
 * @param {HTMLElement} container The HTML element where to put the content.
 */
display = function(wtext, container) {
    var replacing = container.getElementsByClassName( 'mw-parser-output' )[0];
    replacing.innerHTML = wtext; 
} // end display

/**
 * First time the gadget is called.
 * Displays a text.Creates a parallel text with the next page
 * 
 * @param (string) wtext Content to display.
 * @param {string} nextPage The pagename of the next page.
 */
firstDisplay = function( wtext, nextPage ) {
	// builds arrows if necessary
	if ( document.getElementById('ca-proofreadPagePrevLink') !== null ) {
    	var leftArr = document.getElementById('ca-proofreadPagePrevLink');
    	$la = leftArr.getElementsByTagName('a')[0];
    	$la.style.backgroundColor = 'beige';
    } else {
    	rebuildLeftArrow();  
    }

	if ( document.getElementById( 'ca-proofreadPageNextLink' ) !== null ) {
    	var rightArr = document.getElementById( 'ca-proofreadPageNextLink' );
    	$ra = rightArr.getElementsByTagName( 'a' )[0];
    	$ra.style.backgroundColor = 'beige';           
    } else {
    	rebuildRightArrow();  
    }
	var leftArr  = document.getElementById( 'ca-proofreadPagePrevLink' );
	var rightArr = document.getElementById( 'ca-proofreadPageNextLink' );
	$la = leftArr.getElementsByTagName( 'a' )[0];
	$ra = rightArr.getElementsByTagName( 'a' )[0];

	$(leftArr).click( function ( event ) {
    	if ( $twoPages ) {
    		event.preventDefault();
    		doPrev();
    	}
	});

	$( rightArr ).click(function ( event ) {
    	if ( $twoPages ) {
    		event.preventDefault();
    		doNext();   
    	}
	});  
    // create div and set innerHTML to link  
    var currentPageElm = document.getElementsByClassName( 'prp-page-content' )[0];
    currentPageElm.style.width = "48%";
    currentPageElm.id = 'content-first';
    // TODO, there is the question if ltr or rtl (?)

    var i = document.getElementsByClassName( 'prp-page-image' )[0];
    i.setAttribute( 'class', 'prp-page-content' );
    i.removeChild( i.firstElementChild );
    i.setAttribute( "id", "content-parallel" );
    i.style.float = "right";
    i.style.width = "48%";
    var headNext = document.createElement( "h1" );
    headNext.setAttribute( 'id', 'secondHeading' );
    headNext.setAttribute( 'class', 'firstHeading' );
    headNext.style.paddingTop = '0';
    i.appendChild( headNext );
	if ( $currentPage === nextPage ) { // A way to check if we're at the last page
		var mwp = emptyDivParserOutput( wtext );
		var myText = document.createTextNode( '\u00A0' );
		headNext.appendChild( myText );
		i.appendChild( mwp );
	} else {
		var myText = document.createTextNode( nextPage.replace( /\_/g, ' ' ) );  
		headNext.appendChild( myText );
	}
    i.insertAdjacentHTML( 'beforeend', wtext );        

    // _Heading 
    var prpcontainer = document.getElementsByClassName( 'prp-page-content' )[0];
    var c = document.getElementById( 'content' );
    var q = document.getElementById( 'firstHeading' );
    c.removeChild( q );
    prpcontainer.insertAdjacentElement( 'afterbegin', q );

    // insert divContainer into the DOM 
    if (window.mw.config.get( 'skin' ) === 'monobook' ) {
    	var divContainer = document.createElement( 'div' );
        divContainer.setAttribute( "class", "mw-body" );
        divContainer.setAttribute( "id", "content-parallel" );
		//contents.setAttribute( "lang", lang);
		//contents.setAttribute( "dir", dir);
		//contents.setAttribute( "xml:lang", xmllang); // probably irrelevant, but set it anyway        
        
        container.insertBefore( divContainer, document.getElementById( 'mw-data-after-content' ) );
    } 
} // end firstDisplay
Estratto 'e "https://nap.wikisource.org/w/index.php?title=Utente:Ruthven/DdojePaggene.js&oldid=100873"