diff options
Diffstat (limited to 'skins/common/preview.js')
-rw-r--r-- | skins/common/preview.js | 91 |
1 files changed, 80 insertions, 11 deletions
diff --git a/skins/common/preview.js b/skins/common/preview.js index b117e85b..ec612963 100644 --- a/skins/common/preview.js +++ b/skins/common/preview.js @@ -18,16 +18,15 @@ function openXMLHttpRequest() { function livePreview(target, text, postUrl) { prevTarget = target; if( !target ) { - window.alert('Live preview failed!\nTry normal preview.'); - var fallback = document.getElementById('wpPreview'); - if ( fallback ) { fallback.style.display = 'inline'; } + window.alert(i18n(wgLivepreviewMessageFailed)); + showFallback(); } prevReq = openXMLHttpRequest(); if( !prevReq ) return false; - + prevReq.onreadystatechange = updatePreviewText; prevReq.open("POST", postUrl, true); - + var postData = 'wpTextbox1=' + encodeURIComponent(text); prevReq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); prevReq.send(postData); @@ -35,19 +34,89 @@ function livePreview(target, text, postUrl) { } function updatePreviewText() { - if( prevReq.readyState != 4 ) { + + if (prevReq.readyState > 0 && prevReq.readyState < 4) { + notify(i18n(wgLivepreviewMessageLoading)); + } + + if(prevReq.readyState != 4) { return; } + + dismissNotify(i18n(wgLivepreviewMessageReady), 750); + if( prevReq.status != 200 ) { - window.alert('Failed to connect: ' + prevReq.status + - ' "' + prevReq.statusText + '"'); - var fallback = document.getElementById('wpPreview'); - if ( fallback ) { fallback.style.display = 'inline'; } + var keys = new Array(); + keys[0] = prevReq.status; + keys[1] = prevReq.statusText; + window.alert(i18n(wgLivepreviewMessageError, keys)); + showFallback(); return; } - prevTarget.innerHTML = prevReq.responseText; + + var xmlObject = prevReq.responseXML.documentElement; + var previewElement = xmlObject.getElementsByTagName('preview')[0]; + prevTarget.innerHTML = previewElement.firstChild.data; /* Hide the active diff if it exists */ var diff = document.getElementById('wikiDiff'); if ( diff ) { diff.style.display = 'none'; } } + +function showFallback() { + var fallback = document.getElementById('wpPreview'); + if ( fallback ) { fallback.style.display = 'inline'; } +} + + +// TODO: move elsewhere +/* Small non-intrusive popup which can be used for example to notify the user + * about completed AJAX action + */ +function notify(message) { + var notifyElement = document.getElementById('mw-js-notify'); + if ( !notifyElement ) { + createNotify(); + var notifyElement = document.getElementById('mw-js-notify'); + } + notifyElement.style.display = 'block'; + notifyElement.innerHTML = message; +} + +function dismissNotify(message, timeout) { + var notifyElement = document.getElementById('mw-js-notify'); + if ( notifyElement ) { + if ( timeout == 0 ) { + notifyElement.style.display = 'none'; + } else { + notify(message); + setTimeout("dismissNotify('', 0)", timeout); + } + } +} + +function createNotify() { + var div = document.createElement("div"); + var txt = '###PLACEHOLDER###' + var txtNode = document.createTextNode(txt); + div.appendChild(txtNode); + div.id = 'mw-js-notify'; + // TODO: move styles to css + div.setAttribute('style', + 'display: none; position: fixed; bottom: 0px; right: 0px; color: white; background-color: DarkRed; z-index: 5; padding: 0.1em 1em 0.1em 1em; font-size: 120%;'); + var body = document.getElementsByTagName('body')[0]; + body.appendChild(div); +} + + + +/* Helper function similar to wfMsgReplaceArgs() */ +function i18n(message, keys) { + var localMessage = message; + if ( !keys ) { return localMessage; } + for( var i = 0; i < keys.length; i++) { + var myregexp = new RegExp("\\$"+(i+1), 'g'); + localMessage = localMessage.replace(myregexp, keys[i]); + } + return localMessage; +}
\ No newline at end of file |