MediaWiki:Gadget-dropDisplay-core.js

'use strict';

var userSettings,
	settingsName = 'rsw-drop-display-settings',
	defaultSettings = {_ratedisp: 2, _valcoldisp: 1};

// grabs settings from localstorage (or defaults if not supported)
function getSettings(){
	var settings = {};
	if (rswiki.hasLocalStorage()) {
		try {
			settings = JSON.parse(localStorage.getItem(settingsName));
		} catch (err) {
			settings = {};
		}
		if (settings === null) {
			settings = {};
		}

	}
	userSettings = $.extend({}, defaultSettings, settings);
}

// put settings back into localstorage
function updateSettings(){
	if (!rswiki.hasLocalStorage()) return;
	localStorage.setItem(settingsName, JSON.stringify(userSettings));
}

// change rate to a different display
function changeRateDisp(data, selected, init){
	var  rdisp = 0, attr = '', append = '', upsettings = false;
	if (init == true) {
		rdisp = data;
	} else {
		rdisp = data.getData();
	}
	switch(rdisp) {
		case 1:
			attr = 'data-drop-fraction';
			upsettings = true;
			break;
		case 2:
			attr = 'data-drop-oneover';
			upsettings = true;
			break;
		case 3:
			attr = 'data-drop-percent';
			upsettings = true;
			append = '%';
			break;
		default:
			mw.log('Invalid rate display type '+rdisp);
	}
	$('table.item-drops td span[data-drop-fraction]').each(function(){
		var $cell = $(this), newText = $cell.attr(attr);
		$cell.text(newText + append);
	});
	if (upsettings == true) {
		userSettings._ratedisp = rdisp;
		updateSettings();
	}
}

// change value display column
function changeValDisp(data, selected, init){
	var tbl = 'table.item-drops.filterable';
	var vdisp = 0, upsettings = false;
	if (init == true) {
		vdisp = data;
	} else {
		vdisp = data.getData();
	}
	switch (vdisp) {
		case 1:
			$(tbl).each(function(){
				$(this).removeClass('rsw-dropsline-hidege');
				$(this).addClass('rsw-dropsline-hidealch');
			});
			upsettings = true;
			break;
		case 2:
			$(tbl).each(function(){
				$(this).addClass('rsw-dropsline-hidege');
				$(this).removeClass('rsw-dropsline-hidealch');
			});
			upsettings = true;
			break;
		case 3:
			$(tbl).each(function(){
				$(this).removeClass('rsw-dropsline-hidege');
				$(this).removeClass('rsw-dropsline-hidealch');
			});
			upsettings = true;
			break;
		default:
			mw.log('Invalid value column display type '+vdisp);
	}
	if (upsettings == true) {
		userSettings._valcoldisp = vdisp;
		updateSettings();
	}
}

// initialise
function init() {
	var $tables = $('table.item-drops.filterable'),
	$overlay = $('<div id="rsw-drops-overlay2">').appendTo('body'),
	popup,
	fieldset, applyButton, 
	fractionButton, overoneButton, percentButton, rateGroup,
	gecolButton, alcolButton, bothcolButton, valGroup,
	typeGroup;

	// get settings and update display
	getSettings();
	changeRateDisp(userSettings._ratedisp, true, true);
	changeValDisp(userSettings._valcoldisp, true, true);
	
	// build popup
	// Droprate column
	fractionButton = new OO.ui.ButtonOptionWidget({
		data: 1,
		label: 'Expanded fraction (a/b)',
		title: 'Displays a fraction without simplifying, in a/b style. Example: 4/128.',
	});
	overoneButton = new OO.ui.ButtonOptionWidget({
		data: 2,
		label: 'One-over fraction (1/x, default)',
		title: 'Displays a fraction simplified to 1/x. Fraction denominators are rounded to 3 significant figures. This is the default display.',
	});
	percentButton = new OO.ui.ButtonOptionWidget({
		data: 3,
		label: 'Percentage (y%)',
		title: 'Displays a percentage (y%), rounded to 3 significant figures.',
	});
	rateGroup = new OO.ui.ButtonSelectWidget({
		items: [overoneButton, fractionButton, percentButton]
	});
	rateGroup.selectItemByData(userSettings._ratedisp);
	rateGroup.on('choose',changeRateDisp);

	//Price/Value columns
	gecolButton = new OO.ui.ButtonOptionWidget({
		data: 1,
		label: 'Show GE Price',
		title: 'Display only the GE Price column.',
	});
	alcolButton = new OO.ui.ButtonOptionWidget({
		data: 2,
		label: 'Show High alch value',
		title: 'Display only the high alch value column.',
	});
	bothcolButton = new OO.ui.ButtonOptionWidget({
		data: 3,
		label: 'Show both',
		title: 'Display both the GE Price and high alch value columns.',
	});
	valGroup = new OO.ui.ButtonSelectWidget({
		items: [gecolButton, alcolButton, bothcolButton]
	});
	valGroup.selectItemByData(userSettings._valcoldisp);
	valGroup.on('choose',changeValDisp);


	fieldset = new OO.ui.FieldsetLayout({});
	fieldset.addItems([
		new OO.ui.FieldLayout(rateGroup, {label: 'Display drops as: ', align: 'top'}),
		new OO.ui.FieldLayout(valGroup, {label: 'Display price/value as: ', align: 'top'}),
	]);
	
	popup = new OO.ui.PopupWidget({
		padded: true,
		autoClose: true,
		$content: fieldset.$element,
		width: 'auto',
		position: 'above',
		align: 'force-right',
		head: true,
		label: 'Display settings',
		classes: ['rsw-drop-display-popup2']
	});
	$overlay.append(popup.$element);
	
	// add button to each table
	$tables.each(function(i,e){
		var button = new OO.ui.ButtonWidget({
			icon: 'settings',
			title: 'Open display settings',
			framed: false,
			invisibleLabel: true,
			classes: ['rsw-drop-display-button2']
		});
		button.on('click',function(){
			// move popup to the clicked button
			popup.setFloatableContainer(button.$element);
			// reset buttons (i.e. open popup, click a button but don't apply, close - next time it is opened it should show the current setting not the unapplied one)
			rateGroup.selectItemByData(userSettings._ratedisp);
			valGroup.selectItemByData(userSettings._valcoldisp);
			// show popup
			popup.toggle(true);
		});
		
		var $cell = $(e).find('th.drop-disp-btn');
		$cell.append(button.$element);
	});
}

$(init);