MediaWiki/Slideshow: Difference between revisions

adds js presentation approach
 
adds indentation to make the script more readable
Line 12: Line 12:


var wikipedia_presentation = {
var wikipedia_presentation = {
setup: function() {
    setup: function() {
 
       
this.sections = [];
        this.sections = [];
this.pos = 0;
        this.pos = 0;
 
       
var body = document.getElementsByTagName('body')[0];
        var body = document.getElementsByTagName('body')[0];
this.orig_markup = body.innerHTML;
        this.orig_markup = body.innerHTML;
var markup = body.innerHTML;
        var markup = body.innerHTML;
var start = 0;
        var start = 0;
var end = markup.indexOf('<span class="editsection"');
        var end = markup.indexOf('<span class="editsection"');
while (end != -1) {
        while (end != -1) {
start = markup.indexOf('</span>', end);
            start = markup.indexOf('</span>', end);
end = markup.indexOf('<span class="editsection"', start);
            end = markup.indexOf('<span class="editsection"', start);
if (end == -1) {
            if (end == -1) {
end = markup.indexOf('<div class="printfooter">', start);
                end = markup.indexOf('<div class="printfooter">', start);
this.sections.push(markup.substr(start, end - start));
                this.sections.push(markup.substr(start, end - start));
end = -1;
                end = -1;
}
            }
this.sections.push(markup.substr(start, end - start));
            this.sections.push(markup.substr(start, end - start));
}
        }
if (this.sections.length > 0) {
        if (this.sections.length > 0) {
var div = document.getElementById('bodyContent');
            var div = document.getElementById('bodyContent');
var link = div.insertBefore(document.createElement('a'), div.firstChild);
            var link = div.insertBefore(document.createElement('a'), div.firstChild);
link.innerHTML = 'Start presentation';
            link.innerHTML = 'Start presentation';
link.setAttribute('href', '#presentation');
            link.setAttribute('href', '#presentation');
link.addEventListener('click', this.start, false);
            link.addEventListener('click', this.start, false);
}
        }
},
    },
 
   
start: function() {
    start: function() {
var body = document.getElementsByTagName('body')[0];
        var body = document.getElementsByTagName('body')[0];
body.innerHTML = '';
        body.innerHTML = '';
body.style.textAlign = 'center';
        body.style.textAlign = 'center';
 
       
var prev = body.appendChild(document.createElement('a'));
        var prev = body.appendChild(document.createElement('a'));
prev.innerHTML = '&larr; Prev';
        prev.innerHTML = '&larr; Prev';
prev.setAttribute('href', '#prev');
        prev.setAttribute('href', '#prev');
prev.style.font = '11px verdana, sans-serif';
        prev.style.font = '11px verdana, sans-serif';
prev.addEventListener('click', function() {
        prev.addEventListener('click', function() {
wikipedia_presentation.prev();
          wikipedia_presentation.prev();
}, false);
        }, false);
 
       
body.appendChild(document.createTextNode(' / '));
        body.appendChild(document.createTextNode(' / '));
 
       
var stop = body.appendChild(document.createElement('a'));
        var stop = body.appendChild(document.createElement('a'));
stop.innerHTML = 'Exit';
        stop.innerHTML = 'Exit';
stop.setAttribute('href', '#exit');
        stop.setAttribute('href', '#exit');
stop.style.font = '11px verdana, sans-serif';
        stop.style.font = '11px verdana, sans-serif';
stop.addEventListener('click', function() {
        stop.addEventListener('click', function() {
wikipedia_presentation.stop();
          wikipedia_presentation.stop();
}, false);
        }, false);
 
       
body.appendChild(document.createTextNode(' / '));
        body.appendChild(document.createTextNode(' / '));
 
       
var next = body.appendChild(document.createElement('a'));
        var next = body.appendChild(document.createElement('a'));
next.innerHTML = 'Next &rarr;';
        next.innerHTML = 'Next &rarr;';
next.setAttribute('href', '#next');
        next.setAttribute('href', '#next');
next.style.font = '11px verdana, sans-serif';
        next.style.font = '11px verdana, sans-serif';
next.addEventListener('click', function() {
        next.addEventListener('click', function() {
wikipedia_presentation.next();
          wikipedia_presentation.next();
}, false);
        }, false);
 
       
var slide = body.appendChild(document.createElement('div'));
        var slide = body.appendChild(document.createElement('div'));
slide.setAttribute('id', 'wikipedia_presentation');
        slide.setAttribute('id', 'wikipedia_presentation');
slide.style.width = '780px';
        slide.style.width = '780px';
slide.style.margin = '10px 10px 10px 20px';
        // slide.style.background = 'red';
slide.style.textAlign = 'left';
        slide.style.margin = '10px 10px 10px 20px';
slide.style.font = '2em verdana, sans-serif';
        slide.style.textAlign = 'left';
 
        slide.style.font = '2em verdana, sans-serif';
slide.innerHTML = wikipedia_presentation.sections[0];
       
var items = slide.getElementsByTagName('li');
        slide.innerHTML = wikipedia_presentation.sections[0];
for (var i = 1; i < items.length; i++) {
        var items = slide.getElementsByTagName('li');
items[i].style.display = 'none';
        for (var i = 1; i < items.length; i++) {
}
            items[i].style.display = 'none';
 
        }
document.addEventListener('keypress', wikipedia_presentation.keypress, false);
       
},
        document.addEventListener('keypress', wikipedia_presentation.keypress, false);
 
    },
stop: function() {
   
var body = document.getElementsByTagName('body')[0];
    stop: function() {
body.innerHTML = wikipedia_presentation.orig_markup;
        var body = document.getElementsByTagName('body')[0];
body.style.textAlign = 'left';
        body.innerHTML = wikipedia_presentation.orig_markup;
wikipedia_presentation.setup();
        body.style.textAlign = 'left';
document.removeEventListener('keypress', wikipedia_presentation.keypress, false);
        wikipedia_presentation.setup();
},
        document.removeEventListener('keypress', wikipedia_presentation.keypress, false);
 
    },
keypress: function(event) {
   
if (event.keyCode == 39) {
    keypress: function(event) {
wikipedia_presentation.next();
        if (event.keyCode == 39) {
} else if (event.keyCode == 37) {
            wikipedia_presentation.next();
wikipedia_presentation.prev();
        } else if (event.keyCode == 37) {
}
            wikipedia_presentation.prev();
},
        }
 
    },
prev: function() {
   
this.pos--;
    prev: function() {
if (this.pos == -1) {
        this.pos--;
this.pos = this.sections.length - 1;
        if (this.pos == -1) {
}
            this.pos = this.sections.length - 1;
var slide = document.getElementById('wikipedia_presentation');
        }
slide.innerHTML = wikipedia_presentation.sections[this.pos];
        var slide = document.getElementById('wikipedia_presentation');
},
        slide.innerHTML = wikipedia_presentation.sections[this.pos];
 
    },
next: function() {
   
 
    next: function() {
var slide = document.getElementById('wikipedia_presentation');
       
var items = slide.getElementsByTagName('li');
        var slide = document.getElementById('wikipedia_presentation');
 
        var items = slide.getElementsByTagName('li');
var hidden = 0;
       
for (var i = 0; i < items.length; i++) {
        var hidden = 0;
if (items[i].style.display == 'none') {
        for (var i = 0; i < items.length; i++) {
hidden++;
            if (items[i].style.display == 'none') {
}
                hidden++;
}
            }
 
        }
if (hidden > 0) {
       
items[items.length - hidden].style.display = 'list-item';
        if (hidden > 0) {
return;
            items[items.length - hidden].style.display = 'list-item';
}
            return;
 
        }
this.pos++;
       
if (this.pos == this.sections.length) {
        this.pos++;
this.pos = 0;
        if (this.pos == this.sections.length) {
}
            this.pos = 0;
slide.innerHTML = wikipedia_presentation.sections[this.pos];
        }
var items = slide.getElementsByTagName('li');
        slide.innerHTML = wikipedia_presentation.sections[this.pos];
for (var i = 1; i < items.length; i++) {
        var items = slide.getElementsByTagName('li');
items[i].style.display = 'none';
        for (var i = 1; i < items.length; i++) {
}
            items[i].style.display = 'none';
 
        }
}
       
    }
};
};