MediaWiki:Guidedtour-tour-newtour.js: Difference between revisions

From ChemWiki
(Added to the wiki via WikiImport-Script.)
(Added to the wiki via WikiImport-Script.)
 
(3 intermediate revisions by the same user not shown)
Line 7: Line 7:
     var isnav_open = $('#ce-side-panel-content')[0].attributes.style ;
     var isnav_open = $('#ce-side-panel-content')[0].attributes.style ;
     var navbarstate = '#ce-side-panel-content-collapsed';
     var navbarstate = '#ce-side-panel-content-collapsed';
    var hasEditSection = $( '.mw-editsection' ).length > 0


    console.log(hasEditSection)
     if (isnav_open == "display:none;") {
     if (isnav_open == "display:none;") {
         navbarstate = "#ce-topic-element";
         navbarstate = "#ce-topic-element";  
       
     };
     };
     console.log(isnav_open)
 
     console.log(navbarstate);
     var old_pageName = $("#mw-content-text > div > table > tbody > tr:nth-child(4) > td > a").attr('href');
     // Declare a variable for use later
     if (typeof old_pageName !== 'undefined'){
     var pageName = 'Help:Guided tours/newtour',
        var new_pagename = old_pageName.replace("/main/mediawiki/", "")}
        tour;
      
     console.log($( '.ve-ce-documentNode[contenteditable="true"]' ))
    // console.log(new_pagename)
 
     function open_nav(){
     function open_nav(){
        if (1 < 2){
             $('#ce-side-panel-content-collapsed').hide();
             $('#ce-side-panel-content-collapsed').hide();
             $('#ce-side-panel-content').show();
             $('#ce-side-panel-content').show();
             $('div.container-fluid div.row').attr('style', 'margin-left: 400px !important;');
             $('div.container-fluid div.row').attr('style', 'margin-left: 400px !important;');
             navbarstate = "#ce-topic-element"
             navbarstate = "#ce-topic-element";}
            console.log("yes");
             return "m_topic"
             return "m_topic"
     }
            }
 
    // addEventListener("submit", (event) => {});
    onsubmit = (event) => {console.log(event)};
 
    function fix_home(){
        $('#gt-newtour-homebutton').attr('style', 'width: 400px; position: absolute; top: 6px; left: 63px;');
        $('#gt-newtour-homebutton > div.guider_arrow.guider_arrow_left').attr('style', 'top: 8.281px;');
        return "homebutton"
     }  
 
     tour = new gt.TourBuilder( {
     tour = new gt.TourBuilder( {
        /*
        * This is the name of the tour.  It must be lowercase, without any hyphen (-) or
        * period (.) characters.
        *
        * The page where you save an on-wiki tour must be named
        * MediaWiki:Guidedtour-tour-{name}.js , in this example MediaWiki:Guidedtour-tour-mytest.js
        */
         name: 'newtour'
         name: 'newtour'
     } );
     } );
 
// 1
     // Information defining each tour step
     // Information defining each tour step
    // This tour shows a central overlay at the start of the tour.
    // Guiders appear in the center if another position is not specified.
    // To specify the first step of the tour, use .firstStep instead of .step
     tour.firstStep( {
     tour.firstStep( {
         name: 'intro',
         name: 'intro',
        // Note that for on-wiki tours, we use title and description with the actual text.
        // The title appears in the title bar of the guider.
         title: 'Welcome',
         title: 'Welcome',
        // The description appears in the body
         description: 'Welcome to the Introduction tour for MediaWiki',
         description: 'Welcome to the Introduction tour for MediaWiki',
        // This specifies that there is an overlay behind the guider.
         overlay: true
         overlay: true
     } )
     } )
        // This specifies the next step of the tour, and will automatically generate a next button.
        // 'callout' refers to the name used in the step immediately below.  Although putting the steps
        // in a meaningful order is recommended, any step can be specified as next/back.
         .next( 'homebutton' );
         .next( 'homebutton' );


// 2
     tour.step( {
     tour.step( {
        /*
        * Callout of left menu
        */
         name: 'homebutton',
         name: 'homebutton',
         title: 'Home Button',
         title: 'Home Button',
         description: 'Here is the home buttton click here to return to the home page',
         description: 'Here is the home buttton click here to return to the home page',
        // This positions the guider next to a page element, in this
        // case the portal link (which is "Community portal" on English
        // Wikipedia, but varies by site).
        // The string is a jQuery selector.  "#n-portal" means the HTML
        // element with this id attribute, and "a" means an a, or link,
        // element inside that.
         attachTo: '#mw-navigation a',
         attachTo: '#mw-navigation a',
       
         position: 'bottomRight',
        // This means the guider shows to the right of the Community Portal link
         position: 'right',
     } )
     } )
         .next( 'feat_mol' )
         .next( 'edit_trans' )
        // The 'back' property specifies that you can go back from this step, and where to go
        // if the back button is clicked.
         .back( 'intro' );
         .back( 'intro' );
// 3
    tour.step( {
        name: 'edit_trans',
        title: 'Edit the whole page…',
        description: 'Click the \"Edit\" button to make your changes.',
        attachTo: '#ca-ve-edit',
        position: 'bottom',
        closeOnClickOutside: false ,
        // This indicates that we don't want an automatic next button,
        // even though we are specifying which step comes next.
        // allowAutomaticNext: false,
        // buttons: [ {
        //    // Custom logic to specify a button and its behavior
        //    // depending on whether there are sections on the page.
        //    action: hasEditSection ? 'next' : 'okay',
        //    onclick: function () {
        //        if ( hasEditSection ) {
        //            mw.libs.guiders.next();
        //        } else {
        //            mw.libs.guiders.hideAll();
        //        }
        //    }
        // } ]
        } )
        // At certain times, called transition points, the callback passed to .transition
        // will be called.  At those times, this tour checks if the user is editing.  If so,
        // the tour returns 'preview', indicating that the tour should transition to the
        // 'preview' step automatically.
        // step.transition( function () {
           
        //    if ( gt.isVisualEditorOpen() ) {
               
        //        return 'm_topic';
        //    }
        // } )
        // .transition( function () { if ( mw.guidedTour.isEditing() ) { return 'm_topic'; } else{return "search_nav"} } )
        .next( 'feat_mol' );


// 4
     tour.step( {
     tour.step( {
        /*
        * Test out mediawiki description pages
        */
         name: 'feat_mol',
         name: 'feat_mol',
         title: 'Featured Molecule',
         title: 'Featured Molecule',
        // Name of the page to parse
         description: 'Clicking this will bring you to the relevant molecule page. From here you can see experiments that use the selected molecule.',
         description: 'Clicking this will bring you to the relevant molecule page. From here you can see experiments that use the selected molecule.',
         overlay: false,
         overlay: false,
Line 110: Line 124:
         //        //    tools.createCookie(NAVBAR_STATUS_COOKIE, 'expanded');
         //        //    tools.createCookie(NAVBAR_STATUS_COOKIE, 'expanded');
         //        // }
         //        // }
         //    },
         //    },  closeOnClickOutside: false ,
         //    action: "next",
         //    action: "next",
         //    page: pageName,
         //    page: pageName,
Line 125: Line 139:
     // ]
     // ]
     //  
     //  
}  
        } )
    )
         .next(open_nav())
         .next(open_nav())
         .back( 'homebutton' );
         .back( 'homebutton' );


// 5
         tour.step( {
         tour.step( {
             name:  "m_topic",
             name:  "m_topic",
             title: "Main Topic",
             title: "Main Topic",
             description:"Here is the main topic inside it are sub topics that organize papers on stricter criteria" ,
             description:"Here is the main topic inside it are sub topics that organize papers on stricter criteria. Each paper is stored at the publication level" ,
             overlay: true,
             overlay: true,
             attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeItem:first-child' ,
             attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeItem:first-child' ,
Line 139: Line 153:


         })
         })
         .next("pub")
         .next("testa")
         .back("feat_mol");
         .back("feat_mol");


         tour.step( {
// 6
            name: "pub",
         // tour.step( {
            title: "Publication",
        //    name: "pub",
            description:"Here is the level at which papers are stored" ,
        //    title: "Publication",
            overlay: true,
        //    description:"Here is the level at which papers are stored" ,
            attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeChildren div.CategoryTreeSection ' ,
        //    overlay: true,
            position: 'right'
        //    attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeChildren div.CategoryTreeSection ' ,
        //    position: 'right'


         })
         // })
         .next("testa")
         // .next("testa")
         .back("m_topic");
         // .back("m_topic");


// 7
         tour.step( {
         tour.step( {
             name: "testa",
             name: "testa",
             title: "topic attacment",
             title: "topic attacment",
             description:"this is the highest level of the Organization" ,
             description:"this is the highest level of the Organization" ,
          // overlay: true,
            // attachTo: "#ce-side-panel-content-collapsed" ,
             attachTo: navbarstate,
             attachTo: navbarstate,
             position: 'right',
             position: 'right',
Line 165: Line 179:
         })
         })
         .next("pub_nav")
         .next("pub_nav")
         .back("pub");
         .back("m_topic");
 


// 8
         tour.step( {
         tour.step( {
             name: "pub_nav",
             name: "pub_nav",
             title: "Publications",
             title: "Publications",
             description:"This is the publication level. Papers are stored here with each investigation splitting into the next level" ,
             description:"This is the publication level. Papers are stored here with each investigation splitting into the next level" ,
          // overlay: true,
            // attachTo: "#ce-side-panel-content-collapsed" ,
             attachTo: '#ce-publication-element',
             attachTo: '#ce-publication-element',
             position: 'right',
             position: 'right',
        })
        .next("search_nav")
        .back("testa");


// 9
        tour.step({
            name:"search_nav",
            title: "search bar",
            description: "Here if you click on the search bar and hit enter will allow you to entered facted search",
            attachTo: "#searchInput",
            position:"bottom",
            closeOnClickOutside: false ,
            allowAutomaticNext : false,
         })
         })
         // .next()
        .transition( function () {
         .back("pub");
            if ( gt.isEditing() ) {
 
                console.log("lets try it")
// The following should be the last line of your tour.
                return 'pub_feat';}
            else (console.log("fail"))})
         // .next("pub_feat")
         .back("pub_nav");


// 10
        tour.step( {
            name: "pub_feat",
            title: "Publications",
            description:"this a featured publications page" ,
            attachTo: '#mw-content-text > div > table > tbody > tr:nth-child(4)',
            position: 'top',
            buttons: [{action: 'wikiLink',
                page: new_pagename,
                name: 'Link to Featured Molecues',
                type: 'progressive',
            }]
        })
        .next("pub_page")
        .back("search_nav");


// 11
        tour.step( {
            name: "pub_page",
            title: "Publication page",
            description:"From here you will start the next tour about searching" ,
            attachTo: '#Investigation',
            position: 'top',
            buttons: [ {
                // This makes a button which acts like a wikilink to 'Help:Guided tours/guider'
                action: 'wikiLink',
                page: '/mediawiki/Special:Search?tour=searchtour',
                name: 'go to the search page',
                // This specifies that the button takes you to the next step of a process,
                // which affects its appearance.
                type: 'progressive'
            }, {
                // This makes the okay button on this step end the tour.
                action: 'end'
            } ]
        } )
     
        // .next("pub_feat")
        .back("pub_feat");


// The following should be the last line of your tour.
} ( window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) );
} ( window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) );

Latest revision as of 15:55, 19 April 2024

/*
 * Guided Tour to test guided tour features.
 */
// Copy the next line into the start of your tour.

( function ( window, document, $, mw, gt ) {
    var isnav_open = $('#ce-side-panel-content')[0].attributes.style ;
    var navbarstate = '#ce-side-panel-content-collapsed';
    var hasEditSection = $( '.mw-editsection' ).length > 0

    console.log(hasEditSection)
    if (isnav_open == "display:none;") {
        navbarstate = "#ce-topic-element"; 
    };

    var old_pageName = $("#mw-content-text > div > table > tbody > tr:nth-child(4) > td > a").attr('href');
    if (typeof old_pageName !== 'undefined'){
        var new_pagename = old_pageName.replace("/main/mediawiki/", "")}
    
    console.log($( '.ve-ce-documentNode[contenteditable="true"]' ))
    // console.log(new_pagename)

    function open_nav(){
        if (1 < 2){
            $('#ce-side-panel-content-collapsed').hide();
            $('#ce-side-panel-content').show();
            $('div.container-fluid div.row').attr('style', 'margin-left: 400px !important;');
            navbarstate = "#ce-topic-element";}
            return "m_topic"
            }

    // addEventListener("submit", (event) => {});
    onsubmit = (event) => {console.log(event)};

    function fix_home(){
        $('#gt-newtour-homebutton').attr('style', 'width: 400px; position: absolute; top: 6px; left: 63px;');
        $('#gt-newtour-homebutton > div.guider_arrow.guider_arrow_left').attr('style', 'top: 8.281px;');
        return "homebutton"
    }   

    tour = new gt.TourBuilder( {
        name: 'newtour'
    } );
// 1
    // Information defining each tour step
    tour.firstStep( {
        name: 'intro',
        title: 'Welcome',
        description: 'Welcome to the Introduction tour for MediaWiki',
        overlay: true
    } )
        .next( 'homebutton' );

// 2
    tour.step( {
        name: 'homebutton',
        title: 'Home Button',
        description: 'Here is the home buttton click here to return to the home page',
        attachTo: '#mw-navigation a',
        position: 'bottomRight',
    } )
        .next( 'edit_trans' )
        .back( 'intro' );
// 3
    tour.step( {
        name: 'edit_trans',
        title: 'Edit the whole page…',
        description: 'Click the \"Edit\" button to make your changes.',
        attachTo: '#ca-ve-edit',
        position: 'bottom',
        closeOnClickOutside: false ,
        // This indicates that we don't want an automatic next button,
        // even though we are specifying which step comes next.
        // allowAutomaticNext: false,
        // buttons: [ {
        //     // Custom logic to specify a button and its behavior
        //     // depending on whether there are sections on the page.
        //     action: hasEditSection ? 'next' : 'okay',
        //     onclick: function () {
        //         if ( hasEditSection ) {
        //             mw.libs.guiders.next();
        //         } else {
        //             mw.libs.guiders.hideAll();
        //         }
        //     }
        // } ]
        } )
        // At certain times, called transition points, the callback passed to .transition
        // will be called.  At those times, this tour checks if the user is editing.  If so,
        // the tour returns 'preview', indicating that the tour should transition to the
        // 'preview' step automatically.
        // step.transition( function () {
            
        //     if ( gt.isVisualEditorOpen() ) {
                
        //         return 'm_topic';
        //     }
        // } )
        // .transition( function () { if ( mw.guidedTour.isEditing() ) { return 'm_topic'; } else{return "search_nav"} } )
        .next( 'feat_mol' );

// 4
    tour.step( {
        name: 'feat_mol',
        title: 'Featured Molecule',
        description: 'Clicking this will bring you to the relevant molecule page. From here you can see experiments that use the selected molecule.',
        overlay: false,
        attachTo: 'table tr:nth-child(2) td:nth-child(2)',
        position: 'left',
        // '#mw-content-text.mw-parser-output.tbody.tr:nth-child(7)'
        // This means the wikitext for the description will be loaded from the
        // page name in the description field.
        // onShow: gt.getPageAsDescription,
        // buttons: [ {
        //     // This makes a button which acts like a wikilink to 'Help:Guided tours/mytest'
        //     // action: 'next',
        //     onclick: function () {
        //         $('#ce-side-panel-content-collapsed').hide();
        //         $('#ce-side-panel-content').show();
        //         $('div.container-fluid div.row').attr('style', 'margin-left: 400px !important;');
        //         navbarstate = "#ce-topic-element"
        //         console.log("yes");
        //         // if (tools.getCookie(NAVBAR_STATUS_COOKIE) !== 'expanded') {
        //         //     tools.createCookie(NAVBAR_STATUS_COOKIE, 'expanded');
        //         // }
        //     },  closeOnClickOutside: false ,
        //     action: "next",
        //     page: pageName,
        //     name: 'next',
        //     // This specifies that the button takes you to the next step of a process,
        //     // which affects its appearance.
        //     type: 'progressive'

        // },
        //  {
        //     // This makes the okay button on this step end the tour.
        //     action: 'next'
        // } 
    // ]
    // 
        } )
        .next(open_nav())
        .back( 'homebutton' );

// 5
        tour.step( {
            name:  "m_topic",
            title: "Main Topic",
            description:"Here is the main topic inside it are sub topics that organize papers on stricter criteria. Each paper is stored at the publication level" ,
            overlay: true,
            attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeItem:first-child' ,
            position: 'right'

        })
        .next("testa")
        .back("feat_mol");

// 6
        // tour.step( {
        //     name: "pub",
        //     title: "Publication",
        //     description:"Here is the level at which papers are stored" ,
        //     overlay: true,
        //     attachTo: 'table tr:nth-child(2) td:nth-child(1) div.CategoryTreeChildren div.CategoryTreeSection ' ,
        //     position: 'right'

        // })
        // .next("testa")
        // .back("m_topic");

// 7
        tour.step( {
            name: "testa",
            title: "topic attacment",
            description:"this is the highest level of the Organization" ,
            attachTo: navbarstate,
            position: 'right',

        })
         .next("pub_nav")
        .back("m_topic");

// 8
        tour.step( {
            name: "pub_nav",
            title: "Publications",
            description:"This is the publication level. Papers are stored here with each investigation splitting into the next level" ,
            attachTo: '#ce-publication-element',
            position: 'right',
        })
        .next("search_nav")
        .back("testa");

// 9
        tour.step({
            name:"search_nav",
            title: "search bar",
            description: "Here if you click on the search bar and hit enter will allow you to entered facted search",
            attachTo: "#searchInput",
            position:"bottom",
            closeOnClickOutside: false ,
            allowAutomaticNext : false,
        })
        .transition( function () {
            if ( gt.isEditing() ) {
                console.log("lets try it")
                return 'pub_feat';}
            else (console.log("fail"))})
        // .next("pub_feat")
        .back("pub_nav");

// 10
        tour.step( {
            name: "pub_feat",
            title: "Publications",
            description:"this a featured publications page" ,
            attachTo: '#mw-content-text > div > table > tbody > tr:nth-child(4)',
            position: 'top',
            buttons: [{action: 'wikiLink',
                page: new_pagename,
                name: 'Link to Featured Molecues',
                type: 'progressive',
            }]
        })
        .next("pub_page")
        .back("search_nav");

// 11
        tour.step( {
            name: "pub_page",
            title: "Publication page",
            description:"From here you will start the next tour about searching" ,
            attachTo: '#Investigation',
            position: 'top',
            buttons: [ {
                // This makes a button which acts like a wikilink to 'Help:Guided tours/guider'
                action: 'wikiLink',
                page: '/mediawiki/Special:Search?tour=searchtour',
                name: 'go to the search page',
                // This specifies that the button takes you to the next step of a process,
                // which affects its appearance.
                type: 'progressive'
            }, {
                // This makes the okay button on this step end the tour.
                action: 'end'
            } ]
        } )
      
        // .next("pub_feat")
        .back("pub_feat");

// The following should be the last line of your tour.
} ( window, document, jQuery, mediaWiki, mediaWiki.guidedTour ) );