MediaWiki:Gadget-Teckenstorlek.js
Utseende
OBS: Efter du har publicerat sidan kan du behöva tömma din webbläsares cache för att se ändringarna.
- Firefox / Safari: Håll ned Skift och klicka på Uppdatera sidan eller tryck Ctrl-F5 eller Ctrl-R (⌘-R på Mac)
- Google Chrome: Tryck Ctrl-Skift-R (⌘-Skift-R på Mac)
- Edge Håll ned Ctrl och klicka på Uppdatera eller tryck Ctrl-F5.
- Opera: Tryck Ctrl-F5.
if ( window.Storage ) {
$( function () {
'use strict';
var storage;
// ensure localStorage available
try {
localStorage.setItem('MediaWiki:Gadget-Teckenstorlek.js', '1');
localStorage.removeItem('MediaWiki:Gadget-Teckenstorlek.js');
storage = localStorage;
} catch (e) {
return;
}
if ( mw.config.get( 'wgUserName' ) === null ) {
storage = sessionStorage;
}
var textbox = $( '#wpTextbox1' );
var summarylabel = $( '#wpSummaryLabel' );
var key = 'gadget-teckenstorlek';
var savedvalue = storage.getItem( key );
var title = 'Set the font size for the edit window';
var text = 'Font size';
var message = 'Set the font size in pixels:';
var savetext = 'Save';
var savetitle = 'Save the input and close the dialog';
var closetext = 'Close';
var closetitle = 'Close the dialog without saving';
var resettext = 'Reset';
var resettitle = 'Remove the saved value and close the dialog';
function setValue( val ) {
if ( val ) {
val = val.trim();
if ( val ) {
if ( /^\d+$/.test( val ) ) {
textbox.css( 'font-size', val + 'px' );
} else {
textbox.css( 'font-size', val );
}
}
}
}
if ( mw.config.get( 'wgUserLanguage' ) === 'sv' ) {
title = 'Bestäm teckenstorlek för redigeringsrutan';
text = 'Teckenstorlek';
message = 'Ange teckenstorlek i antal pixlar:';
savetext = 'Spara';
savetitle = 'Spara inmatningen och stäng dialogrutan';
closetext = 'Stäng';
closetitle = 'Stäng dialogrutan utan att spara';
resettext = 'Återställ';
resettitle = 'Ta bort det sparade värdet och stäng dialogrutan';
}
if ( textbox.length && summarylabel.length ) {
setValue( savedvalue );
summarylabel.after( '<button type="button" id="gadget-teckenstorlek-button" title="' + title + '">' + text + '</button>' );
$( '#gadget-teckenstorlek-button' ).click( function ( e ) {
e.preventDefault();
// Creating and opening a simple dialog window.
// Subclass Dialog class. Note that the OOjs inheritClass() method extends the parent constructor's prototype and static methods and properties to the child constructor.
function MyDialog( config ) {
MyDialog.super.call( this, config );
}
if ( $( '.oo-ui-window-active' ).length === 0 ) {
OO.inheritClass( MyDialog, OO.ui.Dialog );
// Specify a title statically (or, alternatively, with data passed to the opening() method).
MyDialog.static.name = 'gadgetteckenstorlekdialog';
MyDialog.static.title = 'Simple dialog';
// Customize the initialize() function: This is where to add content to the dialog body and set up event handlers.
MyDialog.prototype.initialize = function () {
var current = textbox.css( 'font-size' );
var str = '<div id="gadget-teckenstorlek-container">';
str += '<p>' + message + '</p>';
str += '<input id="gadget-teckenstorlek-input" value="' + current + '">';
str += '<button id="gadget-teckenstorlek-save" title="' + savetitle + '">' + savetext + '</button>';
str += '<button id="gadget-teckenstorlek-close" title="' + closetitle + '">' + closetext + '</button>';
if ( storage.getItem( key ) !== null ) {
str += '<button id="gadget-teckenstorlek-reset" title="' + resettitle + '">' + resettext + '</button>';
}
str += '</div>';
// Call the parent method
MyDialog.super.prototype.initialize.call( this );
// Create and append a layout and some content.
this.content = new OO.ui.PanelLayout( { padded: true, expanded: false } );
this.content.$element.append( str );
this.$body.append( this.content.$element );
};
// Set up the ready mode of the window.
MyDialog.prototype.getReadyProcess = function ( data ) {
return MyDialog.super.prototype.getReadyProcess.call( this, data )
.next( function () {
$( '#gadget-teckenstorlek-input' ).select();
}, this );
};
// Use the getTeardownProcess() method to perform actions whenever the dialog is closed.
// This method provides access to data passed into the window's close() method
// or the window manager's closeWindow() method.
MyDialog.prototype.getTeardownProcess = function ( data ) {
return MyDialog.super.prototype.getTeardownProcess.call( this, data )
.first( function () {
// Perform any cleanup as needed
$( '.oo-ui-windowManager' ).remove();
}, this );
};
// Make the window.
var myDialog = new MyDialog();
// Create and append a window manager, which will open and close the window.
var windowManager = new OO.ui.WindowManager();
$( 'body' ).append( windowManager.$element );
// Add the window to the window manager using the addWindows() method.
windowManager.addWindows( [ myDialog ] );
// Open the window!
windowManager.openWindow( myDialog );
$( '#gadget-teckenstorlek-save' ).click( function() {
var value = $( '#gadget-teckenstorlek-input' ).val();
setValue( value );
storage.setItem( key, value );
myDialog.close();
} );
$( '#gadget-teckenstorlek-close' ).click( function() {
myDialog.close();
} );
$( '#gadget-teckenstorlek-reset' ).click( function() {
storage.removeItem( key );
myDialog.close();
} );
$( '#gadget-teckenstorlek-container' ).keyup( function( e ) {
if ( e.which === 13 ) {
$( '#gadget-teckenstorlek-save' ).trigger( 'click' );
}
} );
}
} );
}
} );
}