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