User:Slevinski/signwriting viewer.js

/** * SignWriting Styled Viewer * * Copyright 2007-2013 Stephen E Slevinski Jr * Steve (Slevin@signpuddle.net) * * This file is part of SWIS: the SignWriting Icon Server. * * SWIS is free software: you can redistribute it and/or modify * it under the terms of the GNU General Public License as published by * the Free Software Foundation, either version 3 of the License, or * (at your option) any later version. * * SWIS is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU General Public License for more details. * * You should have received a copy of the GNU General Public License * along with SWIS. If not, see . * * END Copyright * * @copyright 2007-2013 Stephen E Slevinski Jr * @author Steve (slevin@signpuddle.net) * @license http://opensource.org/licenses/GPL-2.0 GPL * @access public * @version 1.0.0.rc.3 * @filesource * */ /** *  define a function that uses regular expression to modify a node, *  then crawl the document object model for TEXT elements and apply the function */ signwriting_styled=(function (node) {   var u = 'http://swis.wmflabs.org/',        v = '1.0.0-rc.3',        s1, s2, d, p, r, r2, o, f;    r = /(A(S[123][0-9a-f]{2}[0-5][0-9a-f])+)?[BLMR]([0-9]{3}x[0-9]{3})(S[123][0-9a-f]{2}[0-5][0-9a-f][0-9]{3}x[0-9]{3})*|S38[7-9ab][0-5][0-9a-f][0-9]{3}x[0-9]{3}/;    r2 = /[0-9]{3}x[0-9]{3}/g;    o = {};    o.L = -1;    o.R = 1;

var newStyle = "a:hover .signwritingtext { opacity: 0.8; } \     .signwritingtext{ \        background-repeat: no-repeat; \        background-origin: content-box; } \      .signwritingtext span{ display: table-cell; \        vertical-align: middle; \        font-size: 0%; \        height:inherit;}" /* writing modes? var elemStyle = document.createElement('div').style; if ( '-webkit-writing-mode' in elemStyle || '-moz-writing-mode' in elemStyle || 'writing-mode' in elemStyle ) { newStyle += "\           .mw-content-ltr { \              -webkit-writing-mode: vertical-lr; \              -moz-writing-mode: vertical-lr; \              writing-mode: vertical-lr; \            } \            .mw-content-ltr .signwritingtext { \              display: inline-block; \              left: 0 !important; \              vertical-align: middle; \              min-width: 50px; \              background-position-x: 50%; \            }" }   */    mw.util.addCSS( newStyle ) function rgbToHex(rgb) { if (rgb.match(/^[0-9A-Fa-f]{6}$/)) { return rgb; }       var rgbvals = /rgba?\((.+),(.+),(.+)\)/i.exec(rgb); if (!rgbvals) { return 'ffffff'; }       var rval = parseInt(rgbvals[1]); var gval = parseInt(rgbvals[2]); var bval = parseInt(rgbvals[3]); var pad = function (value) { return (value.length < 2 ? '0' : '') + value; };       return pad(rval.toString(16)) + pad(gval.toString(16)) + pad(bval.toString(16)); }

var color, background, size; f = function ( node ) { for( var ex, value; ex = r.exec( value = node.nodeValue ); ) { var x, x1 = 500, x2 = 500, y, y1 = 500, y2 = 500, k, l, m = ex[0], index = ex.index, parent = node.parentNode; k = m.charAt(0); m.replace(r2, function ($0) {               x = parseInt($0.slice(0, 3));                y = parseInt($0.slice(4, 7));                x1 = Math.min(x1, x);                x2 = Math.max(x2, x);                y1 = Math.min(y1, y);                y2 = Math.max(y2, y);            }); if (k == 'S') { x2 = 1000 - x1; y2 = 1000 - y1; }           l = o[k] || 0; l = (l * 75 + x1 - 400) * size; var div = document.createElement( "div" ), span = div.appendChild( document.createElement( "span" ) ), style = div.style; div.className = "signwritingtext"; style.padding = 10 * size + 'px'; style.width = (x2 - x1) * size + 'px'; style.height = (y2 - y1) * size + 'px'; style.marginLeft = l + 'px'; style.backgroundImage = 'url(\'' + u + 'glyphogram.php?font=svg&text=' + m + '&line=' + color + '&fill=' + background + '&size=' + size + '\')'; if ( index > 0 ) { node = node.splitText( index ); }           if ( value.length > index + m.length ) { var nS = node.splitText( m.length ); span.appendChild( node ); parent.insertBefore( div, node = nS ); } else { span.appendChild( node ); parent.appendChild( div ); return; }       }    };    function fswReplace(node) { if (node.nodeType == 3) { color = rgbToHex(jQuery(node.parentNode).css('color')); background = jQuery(node.parentNode).css('background-color'); parent = node.parentNode; while (background.toString == 'rgba(0, 0, 0, 0)' || background.toString == 'transparent') { parent = parent.parentNode; background = jQuery(parent).css('background-color'); }           background = rgbToHex(background); size = parseInt(jQuery(node.parentNode).css('font-size')) / 30; f( node ); } else { var nodes; if (node.nodeName != 'TEXTAREA') nodes = node.childNodes; if (nodes) { var i = nodes.length; while (i--) fswReplace(nodes[i]); }       }    };    if (!node || !node.nodeType) node = document.body; fswReplace(node); });

//page should be loaded so call the function to crawl the DOM signwriting_styled;