User:CBM/quickpreview.js
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/* javascript quick preview, via AJAX
* Originally by Alex Smotrov, User:Alex Smotrov/qpreview.js
* Minor tweaks by CBM:
* - default location of button changed
* - change button title
* - scroll to top of preview automatically
* <pre>
*/
if (mw.config.get('wgAction') == 'edit' || mw.config.get('wgAction') == 'submit')
addOnloadHook(addQPreviewButton);
function addQPreviewButton(){
if (!window.qPreviewName) qPreviewName = 'Quick Preview';
var accesskey = window.qPreviewKey || '';
if ((!window.qPreviewAtBottom) || (window.qPreviewAtBottom != 1) )
addQPSystemButton(qPreviewName, qPreview, 'btnQPreview', 'Quick Preview', accesskey);
else
addQPToolbarButton(qPreviewName, qPreview, 'btnQPreview', 'Quick Preview', accesskey);
}
function qPreview(){
var divPreview = document.getElementById('wikiPreview');
divPreview.style.display="block";
if (!divPreview) return;
var btnQPreview = document.getElementById('btnQPreview');
var btnWidth = Math.max(btnQPreview.scrollWidth, btnQPreview.offsetWidth);
if (btnQPreview) btnQPreview.value = window.qPreviewWait || 'Please wait...';
btnQPreview.style.width = btnWidth + 'px';
a = sajax_init_object();
a.open('POST', document.editform.action+'&live', true);
var Boundary = '--------p1415';
a.setRequestHeader('Content-Type', 'multipart/form-data; boundary='+Boundary);
var txt = document.getElementById('wpTextbox1').value ;
if(txt.indexOf('<ref')>=0 && txt.indexOf('<references')<0
&& txt.indexOf('{{reflist')<0)
txt+='\n<hr />\n==Reference preview ==\n{{reflist|2}}';
var PostData = '--' + Boundary
+ '\nContent-Disposition: form-data; name="wpTextbox1"\n\n'
+ txt + '\n--'+Boundary;
if (a.overrideMimeType) a.overrideMimeType('text/html');
a.send(PostData);
a.onreadystatechange = function(){
if (a.readyState != 4) return;
var html = a.responseText;
html = html.replace(/>/g,'>').replace(/</g,'<').replace(/"/g,'"').replace(/&/g,'&').replace(/'/g,"'");
divPreview.innerHTML = html;
var coords = findQPPos(divPreview);
window.scrollTo(0, coords[1]); // hard left, only scroll vertically
if (btnQPreview) btnQPreview.value = qPreviewName;
};
}
function addQPSystemButton(name, onclick, id, tooltip, accesskey){
var wpPreview = document.getElementById('wpPreview');
if (!wpPreview) {
return;
}
var btn = document.createElement('input');
btn.type = 'button';
if (name) btn.value = name;
if (onclick) btn.onclick = onclick;
if (id) btn.id = id;
if (tooltip) btn.title = tooltip;
if (accesskey) {
btn.accessKey = accesskey;
btn.title += ' [' + tooltipAccessKeyPrefix + btn.accessKey + ']';
}
wpPreview.parentNode.insertBefore(btn, wpPreview);
return btn;
}
function addQPToolbarButton(name, onclick, id, tooltip, accesskey){
var toolbar = document.getElementById('toolbar');
if (!toolbar) return;
var btn = document.createElement('input');
btn.type = 'button';
btn.style.background = '#adbede';
btn.style.height = '22px';
btn.style.verticalAlign = 'middle';
if (name) btn.value = name;
if (onclick) btn.onclick = onclick;
if (id) btn.id = id;
if (tooltip) btn.title = tooltip;
if (accesskey) btn.accessKey = accesskey;
toolbar.appendChild(btn);
return btn;
}
function findQPPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
}
return [curleft,curtop];
}
// </pre>