User:Bradv/splitpreview.js

/* splitPreview = { enabled:  true, width:    null }; splitPreview.init = function { if (mw.config.get('wgAction') == "edit" || mw.config.get('wgAction') == "submit") { splitPreview.loadCookies; if (splitPreview.enabled) { splitPreview.draw; }   } };
 * Split-screen Edit Preview
 * Author: User:Bradv

splitPreview.loadCookies=function { function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)==' ') { c = c.substring(1,c.length); } if (c.indexOf(nameEQ) === 0) { return c.substring(nameEQ.length,c.length); } }       return ''; }

var w = readCookie('splitPreview_width'); if (w) { splitPreview.width = w;   } };

splitPreview.saveCookies=function { var cend = "; expires=Tue, 31-Dec-2030 23:59:59 GMT; path=/"; document.cookie = 'splitPreview_width=' + splitPreview.width.toString + cend; };

splitPreview.draw=function { var wp = document.getElementById('wikiPreview');

if (wp) { var w = splitPreview.width; if (!w) { w = window.innerWidth / 3 + 'px'; }       //Make room var topbar = document.evaluate('//div[@id="p-personal"]//div[@class="pBody"]',            document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null); if (topbar.singleNodeValue) { topbar = topbar.singleNodeValue; topbar.style.marginRight=w; }

//Find the container where the placeholder goes. //This differs between monobook and modern skins. var container = document.getElementById('content'); if (!container) { container = document.getElementById('mw_content'); }       container.style.marginRight = w;

var ph = document.createElement('div'); with (ph) { id='splitPreview_placeholder'; style.width=w; style.top='0px'; style.right='0px'; style.bottom='0px'; style.zIndex=90; style.position='fixed'; style.backgroundColor=document.defaultView.getComputedStyle(document.body, null).backgroundColor; //innerHTML = "Testing... "; }       container.appendChild(ph);

var slider = document.createElement('div'); with (slider) { id='splitPreview_slider'; style.position='absolute'; style.width='.5em'; style.top='0px'; style.left='0px'; style.bottom='0px'; style.borderLeft='1px solid #aaaaaa'; style.cursor='w-resize'; style.float='left'; }       ph.appendChild(slider);

slider.onmousedown=function(event) { event.preventDefault; slider.initialWidth = parseInt( window.innerWidth - event.clientX - ph.offsetWidth ); window.onmouseup=function(event) { window.onmousemove=null; window.onmouseup=null; with (splitPreview) { width=w; saveCookies; }           }            window.onmousemove=function(event) { if (event.clientX > (window.innerWidth / 3)) { w=window.innerWidth - event.clientX - slider.initialWidth+'px'; topbar.style.marginRight=w; ph.style.width=w; container.style.marginRight=w; }           }        }

with (wp) { style.position='absolute'; style.top='0px'; style.left='0.5em'; style.right='0.5em'; style.bottom='0px'; style.float='right'; style.overflow='auto'; }       ph.appendChild(wp); } };

$(splitPreview.init);