Difference between revisions of "MediaWiki:Common.js"

From Conceptual Reconstructionism Project
Line 23: Line 23:




     // Create one audio player per declared track.
     // Create one audio player per declared track


     $('*[data-track]').each(function(trackNumber) {
     $('*[data-track]').each(function(trackNumber) {
         var audio = $('<audio></audio>').prop('controls', true).attr('preload', 'auto').attr('src', $(this).attr('data-track')) );
         var audio = $('<audio></audio>').prop('controls', true).attr('preload', 'auto').attr('src', $(this).attr('data-track');
         $('<figure></figure>').append($('<figcaption></figcaption>').text($(this).attr('data-track-title'))).appendTo($(this)).append(audio);
          
$('<figure></figure>').append($('<figcaption></figcaption>').text($(this).attr('data-track-title'))).appendTo($(this)).append(audio);


         audio.onplay = function(event) {
         audio.onplay = function(event) {
if (playbackData.playingTrack !== null && playbackData.playingTrack !== trackNumber) {
if (playbackData.playingTrack !== null && playbackData.playingTrack !== trackNumber) {
playbackData.tracks[playbackData.playingTrack].stop();
playbackData.tracks[playbackData.playingTrack].stop();
}
}
playbackData.playingTrack = trackNumber;
playbackData.playingTrack = trackNumber;
  console.log('Play was called on track ' + trackNumber);
console.log('Play was called on track ' + trackNumber);
};
};
         playbackData.tracks.push(audio);
         playbackData.tracks.push(audio);
     });
     });




     // Create hyperlinks out of reconstruction markup.
     // Create hyperlinks out of reconstruction markup


     $('*[data-def]').click(function() {
     $('*[data-def]').click(function() {
Line 50: Line 51:




     // Update timing data.
     // Update timing data


     $('*[data-segment]').each(function() {
     $('*[data-segment]').each(function() {
Line 56: Line 57:
         var m = /(?<track>\d+\/)?((?<minuteStart>\d+):)?(?<secondStart>\d+(.\d*)?)-((?<minuteEnd>\d+):)?(?<secondEnd>\d+(.\d*)?)/.exec($(this).attr('data-segment'));
         var m = /(?<track>\d+\/)?((?<minuteStart>\d+):)?(?<secondStart>\d+(.\d*)?)-((?<minuteEnd>\d+):)?(?<secondEnd>\d+(.\d*)?)/.exec($(this).attr('data-segment'));


    if (m) {
if (m) {
        playbackData.timeSegments.push(new TimeSegment(parseInt(m.groups.track), parseInt(m.groups.minuteStart) * 60 + parseFloat(m.groups.secondStart),
playbackData.timeSegments.push(new TimeSegment(
            parseInt(m.groups.minuteEnd) * 60 + parseFloat(m.groups.secondEnd),
parseInt(m.groups.track),
            $(this)
parseInt(m.groups.minuteStart) * 60 + parseFloat(m.groups.secondStart),
        ));
parseInt(m.groups.minuteEnd) * 60 + parseFloat(m.groups.secondEnd),
    } else {
$(this)));
        $(this).append('Wrong time segment');
} else {
    }
$(this).append('Wrong time segment');
 
}
});
});
 
playbackData.timeSegments.sort(function(a, b) { return a.segmentStart - b.segmentStart; });


playbackData.timeSegments.sort(function(a, b) { return a.segmentStart - b.segmentStart; });


window.setInterval(function() {
// Playing tick
// Playing tick
window.setInterval(function() {


}, 50);
}, 50);


});
});

Revision as of 13:29, 19 December 2021

/* Any JavaScript here will be loaded for all users on every page load. */


function TimeSegment(track, segmentStart, segmentEnd, htmlElement) {
        this.track = track;
        this.segmentStart = segmentStart;
        this.segmentEnd = segmentEnd;
        this.htmlElement = htmlElement;
}

function PlaybackData() {
        this.autostopTime = null;
        this.timeSegments = [];
        this.tracks = [];
        this.closestPlayableSegment = 0;
        this.playingTrack = null;
    };

var playbackData = new PlaybackData();


$(document).ready(function() {


    // Create one audio player per declared track

    $('*[data-track]').each(function(trackNumber) {
        var audio = $('<audio></audio>').prop('controls', true).attr('preload', 'auto').attr('src', $(this).attr('data-track');
        
		$('<figure></figure>').append($('<figcaption></figcaption>').text($(this).attr('data-track-title'))).appendTo($(this)).append(audio);

        audio.onplay = function(event) {
			if (playbackData.playingTrack !== null && playbackData.playingTrack !== trackNumber) {
			playbackData.tracks[playbackData.playingTrack].stop();
			}
			playbackData.playingTrack = trackNumber;
			console.log('Play was called on track ' + trackNumber);
		};
		
        playbackData.tracks.push(audio);
    });


    // Create hyperlinks out of reconstruction markup

    $('*[data-def]').click(function() {
        var url = location.href;
        location.href = "#" + $(this).attr('data-def');
        history.replaceState(null, null, url);
    });


    // Update timing data

    $('*[data-segment]').each(function() {

        var m = /(?<track>\d+\/)?((?<minuteStart>\d+):)?(?<secondStart>\d+(.\d*)?)-((?<minuteEnd>\d+):)?(?<secondEnd>\d+(.\d*)?)/.exec($(this).attr('data-segment'));

		if (m) {
			playbackData.timeSegments.push(new TimeSegment(
				parseInt(m.groups.track),
				parseInt(m.groups.minuteStart) * 60 + parseFloat(m.groups.secondStart),
				parseInt(m.groups.minuteEnd) * 60 + parseFloat(m.groups.secondEnd),
				$(this)));
		} else {
			$(this).append('Wrong time segment');
		}
	});

	playbackData.timeSegments.sort(function(a, b) { return a.segmentStart - b.segmentStart; });

	
	// Playing tick
	
	window.setInterval(function() {
		

	}, 50);

});