MediaWiki:Gadget-logo-voting.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.
Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.
(function(mw) {
	if (mw.config.get('wgPageName') !== 'Project:Proposal_for_changing_logo_of_MediaWiki,_2020/Round_2') {
		return;
	}
	
	/**
	 * Shuffles array in place.
	 * @param {Array} a items An array containing the items.
	 * From https://stackoverflow.com/a/6274381/2596051
	 */
	function shuffle(a) {
	    var j, x, i;
	    for (i = a.length - 1; i > 0; i--) {
	        j = Math.floor(Math.random() * (i + 1));
	        x = a[i];
	        a[i] = a[j];
	        a[j] = x;
	    }
	    return a;
	}

	function main() {
		var DraggableGroupWidget = function DraggableGroupWidget(config) {
			config = config || {};
			DraggableGroupWidget.super.call(this, config);
			OO.ui.mixin.DraggableGroupElement.call(this, $.extend({
				$group: this.$element
			}, config));
		};
		OO.inheritClass(DraggableGroupWidget, OO.ui.Widget);
		OO.mixinClass(DraggableGroupWidget, OO.ui.mixin.DraggableGroupElement);

		var DraggableItemWidget = function DraggableItemWidget(config) {
			config = config || {};
			DraggableItemWidget.super.call(this, config);
			OO.ui.mixin.DraggableElement.call(this, config);
		};
		OO.inheritClass(DraggableItemWidget, OO.ui.Widget);
		OO.mixinClass(DraggableItemWidget, OO.ui.mixin.DraggableElement);
		var items = [];
		$('.wikitable tr').each(function(i) {
			if (i == 0) {
				return;
			}
			var element = new DraggableItemWidget({
				content: [new OO.ui.HtmlSnippet('<br>'), new OO.ui.HtmlSnippet($(this).find('td:eq(2) img').clone())],
				data: $(this).find('td:first').text(),
				text: $(this).find('td:first').text() + ' - ' + $(this).find('td:eq(1)').text()
			});
			element.$element
				.css('border', '1px solid #a2a9b1')
				.css('background-color', '#f8f9fa')
				.css('padding', '5px')
				.css('border-radius', '2px')
				.css('margin', '5px');
			items.push(element);
		})
		shuffle(items);
		var draggableGroupWidget = new DraggableGroupWidget({
			orientation: 'horizontal',
			items: items,
		});
		var noticeText = '<strong>Please reorder the logos below in order of preference.<br>Your vote:</strong><br>'
		draggableGroupWidget.$element
			.css('border', '1px solid #a2a9b1')
			.css('padding', '5px')
			.css('border-radius', '2px')
			.css('margin', '5px');
		var massege = new OO.ui.MessageWidget({
			type: 'notice',
			label: new OO.ui.HtmlSnippet(noticeText + draggableGroupWidget.getItems().map(function(i) {
				return i.getData()
			}).join(" - "))
		});
		draggableGroupWidget.on('reorder', function(item) {
			massege.setLabel(new OO.ui.HtmlSnippet(noticeText + draggableGroupWidget.getItems().map(function(i) {
				return i.getData()
			}).join(" - ")));
		});
		var saveButton = new OO.ui.ButtonInputWidget({
			type: 'submit',
			label: 'Submit your vote',
			flags: [
				'primary',
				'progressive'
			]
		});
		saveButton.on('click', function() {
			var api = new mw.Api();
			api.edit('Project:Proposal for changing logo of MediaWiki, 2020/Round 2/Votes', function(revision) {
				return {
					text: revision.content + '\n*[[User:' + mw.config.get('wgUserName') + ']]: ' + draggableGroupWidget.getItems().map(function(i) {
						return i.getData().replace('\n', '')
					}).join(" - "),
					summary: 'Voting using the vote gadget'
				}
			}).done(function() {
				var messageText = 'Your vote has been recorded. Thank you! You will be redirected soon.';
				if (mw.config.get('wgUserName') === 'TK-999') {
					messageText += ' <3';
				}
				OO.ui.alert(messageText);
				setTimeout(function() {
					window.location.href = 'https://www.mediawiki.org/wiki/Project:Proposal_for_changing_logo_of_MediaWiki,_2020/Round_2/Votes'
				}, 5000);
			}).fail(function() {
				OO.ui.alert('Edit could not be saved :(');
			});
		})
		$('#bodyContent').prepend(draggableGroupWidget.$element);
		massege.$element.append(saveButton.$element);
		$('#bodyContent').prepend(massege.$element);
	}

	$('.mw-ui-button.mw-ui-progressive').on('click', function() {
		mw.loader.using(['oojs', 'oojs-ui', 'oojs-ui-core', 'oojs-ui-widgets']).then(function() {
			if ( !mw.config.get('wgUserName') ) {
				OO.ui.alert('Please login first.');
				return;
			}
			main();
		})
	});

})(mediaWiki);