User:PerfektesChaos/js/browserStorageManager

JavaScript gadget – display and manipulate cookie and web storage values.

The values in effect for the current wiki project (domain and sub-domain) are displayed and may be deleted, changed or created.

For many browsers add-ons may be installed which cover some of the capabilities offered here, and more supporting any domain, or that might be built into debugging and expert modes. This gadget is supposed to help if using various browsers, mobile devices and a unified access to data is desired.

Functionality

edit

A link within the tool box of wiki page is offered. Furthermore there are different calls to base functions available (API).

When activated, one, two or three tables are shown at top of the current wiki page, which may be sorted by name and text length. Deletion and text assignment as well as creation of new items is supported.

All values available to JavaScript are displayed. There are cookies marked as HttpOnly which will be transferred to server, but are hidden from HTML document and JavaScript.

The length of each item and the total amount used for this domain are displayed.

The data for cookies and localStorage are the same for any browser window (and tab) of this domain. However, browsers might limit the volatile sessionStorage to a particular window or tab, using different data in each browser window. This is meaningful to transfer information from one document to subsequent renderings within the same window history.

The administrative datails (session/persistent, expires, path) of a cookie are not visible to the HTML document and cannot be retrieved. Those cookies are shown which are matching the current domain and page path, and did not yet expire.

Usage

edit

Hint: It's much easier if you get ScriptInstaller, then navigate to User:PerfektesChaos/js/browserStorageManager/r.js and click "Install" at the top. Insert these lines into personal common.js:

mw.loader.load("https://en.wikipedia.org/w/index.php?title=User:PerfektesChaos/js/browserStorageManager/r.js&action=raw&bcache=1&maxage=604800&ctype=text/javascript",
               "text/javascript");

This makes all functions available, including a link within tool box.

When clicking on the toolbox link, the current wiki page will be equipped with one to three tables, listing all available items.

You may load the source code by other means from any document in any domain. There is no access to manipulation, but values are listed on console tables or object browsers.

Interactive manipulation

edit
Icon Meaning
 * 
bottom row
 
Refresh this table.
 
 + 
bottom row
Create new item.
The table is refreshed automatically after saving new name.
Cookies will be assigned to / path.
  
end of name cell
Delete item.
The table is refreshed automatically.
 

end of value cell
Edit item value.
Only if current value has less characters than display limit: It is not a good idea to manipulate a string which is not visible afterwards.
+
on edit
Save value.
Total length sum is not updated; click “refresh” to get new total length.
X
on edit
Abort value editing.

on edit
Make cookie persistent for a couple of years (default: session only).

User configuration

edit

The initial environment and the behaviour can be equipped by each user individually.

Quick interactive costumization

edit

Number of displayed characters and font size can be set interactively on Special:Blankpage as soon as the script library has been loaded. On pages other than Special:Gadgets a button is offered in the top right corner, which opens Special:Gadgets in a new browser tab or window.

The portlet link can be switched on and off only.

When reloading a page the preferences declared here come into effect. This dynamic assignment overrides the static setting by application object.

Even anonymous users may store preferences in their local browser profile.

Configuration by JavaScript

edit

Insert the following lines into common.js etc. (best before mw.loader.load):

if ( typeof mw.browserStorageManager !== "object" ) {
   mw.libs.browserStorageManager   =  { };
}
mw.libs.browserStorageManager.key1 = value1;

See API for more information.

Application object and API

edit

Before script loading an application object may be declared as follows, e.g. within personal common.js page:

if ( ! mw.libs.browserStorageManager ) {
   mw.libs.browserStorageManager  =  { };
}

Subsequently assignments can be made according to the following table. Static assignments of values are to be made before script library was called. Later the functions are to be used for changing the current setting.

After loading the API functions may be used always, whether the application object has been declared by user or not.

Presettings Meaning
Key Value  
portlet
  • boolean
  • object
  • true – Show link in tool box (default)
  • false – Do not show any link
  • Object – Show link in modified shape; see mw.util.addPortletLink()
portlet.scope "p-tb" ID of container
portlet.show "Browser-Storage-Manager" Link title
portlet.shortcut Keyboard code
portlet.stick null ID of container element to place ahead
key 65100 (%) Font size percentage to be used for displaying data (default: 80)
max 101024 Number of characters to be displayed for each item (default: 100)
Show the first characters and truncate. Values might have more than one million bytes.
API
fiat() Equip current page with tables, or update all.
fresh(about) Rebuild table content.
  • about – string, with table identifier; one of
    • "localStorage"
    • "sessionStorage"
    • "cookies"

Returns Array with objects like table rows, including truncated string: { id, n, v }.

Example:

if ( typeof mw.libs.browserStorageManager !== "object" ) {
   mw.libs.browserStorageManager  =  { };
}
mw.libs.browserStorageManager.portlet = false;

Other languages

edit

This gadget is prepared for multilingual support.

  • If you like a version in your own language, please forward translations to me:
    • This documentation page.
    • The lang.texts mapping on top of source code.
    • Further ISO 639 language codes your translation might support.

Codes

edit
Source code
ResourceLoader
  • ext.gadget.browserStorageManager for mw:Extension:Gadgets
  • Dependencies: user, user.options, mediawiki.user, mediawiki.util
Namespaces all
Cookie
  • preferencesGadgetOptions (localStorage) – anonymous users only
mw.libs browserStorageManager
MediaWiki
  • 1.26 (mw.storage) options for anonymous users
  • 1.23 for registered users