babelmark3 | Compare Markdown Implementations
')); var groupContentBodyHtml = $("
", {class: "row"}); groupHtml.append(groupContentBodyHtml); $('#results').append(groupHtml); var groupNames = $("
", {class: "four columns result-names"}); group.elements.sort(function(a, b) { return (a.name + a.version).localeCompare(b.name + b.version); }); // output names for (var j = 0; j " + escapeHtml(json.name) + " " + escapeHtml(json.version) + "" + json.lang + "" + (json.cmark?" " : "") + "")); } groupContentBodyHtml.append(groupNames); // output results var groupResult = $('
'); groupContentBodyHtml.append(groupResult); if (group.text === '') { groupResult.append(getInfoDiv("Warning, result is empty", "warning")); } else if (group.error) { groupResult.append(getInfoDiv(group.text, "error")); } else { var preElement = $('
')
      var codeElement = $('' + escapeHtml(group.text) + "' + group.text_safe + '
'))
      Prism.highlightElement(codeElement[0]);
	}
  }
}

function getInfoDiv(message, type)
{
	return $("
" + message + "
");
}

xhrid = 0;


function clearResults()
{
	// Clears the actual results
	globalResults = [];
	$('#results').html("");
}

function sendRequestFromInput()
{
  sendRequest($('#markdown').val(), true);
}

function sendRequest(markdownText, shouldPushHistory)
{
	clearResults();
	
    // Update browser query
	if (!markdownText || markdownText === '')
	{
      $('#markdown').val('');
	  if (shouldPushHistory || markdownText === '')
	  {
        history.pushState(markdownText, '', '/');
	  }
	  return;
	}
	
	// Update the input box
	if ($('#markdown').val() != markdownText)
	{
	  $('#markdown').val(markdownText);
	}	
	if (shouldPushHistory)
	{
	  history.pushState(markdownText, '', "?" + $.param({text: markdownText}));
	}
	
	var xhr = new XMLHttpRequest()
	$('#query-spin').show();
	xhr.timeout = 30000; 
	xhr.open("GET", "https://web.archive.org/web/20201112043521/https://babelmark.azurewebsites.net/api/get?text=" + encodeURIComponent(markdownText), true)
	xhrid++;
	var xhrid_copy = xhrid;

    xhr.onload = function() {
       $('#query-spin').hide();
	}
	
	xhr.onprogress = function () {
      if (xhr.readyState != 2 && xhr.readyState != 3 && xhr.readyState != 4)
        return;
      if (xhr.readyState == 3 && xhr.status != 200)
        return;	
		
	  // If we have already another request going on, don't do anything, not super reliable
	  if (xhrid_copy != xhrid)
	  {
	    return;
	  }

	  // Because I haven't been able to find a correct way to seek into the correct
	  // chunk position (unreliable), we reparse all results from the beginning
	  // This is not a big issue, as we have to re-display all of them anyway
	  
      // Accumulate results locally	  
	  var localResults = [];
	  var slice = xhr.responseText;
	  var textResults = slice.split("\n\n");
	  for(var i = 0; i ", {class: "row"});
		var divColumns = $("
", {class: "twelve columns"});
	    divRow.append(divColumns);
		divColumns.append(getInfoDiv("An unexpected error occured when trying to contact babelmark-proxy. Reason: " + escapeHtml(xhr.responseText ? xhr.responseText : (xhr.status === 0 ? "timeout" : "unknown" )) + ", Error status: " + escapeHtml('' + xhr.status), "error"));		
        $('#results').append(divRow);
	    $('#query-spin').hide();
	};
	
	xhr.ontimeout = function()
	{
	  // If we have already another request going on, don't do anything, not super reliable
	  if (xhrid_copy != xhrid)
	  {
	    return;
	  }
	    var divRow = $("
", {class: "row"});
		var divColumns = $("
", {class: "twelve columns"});
	    divRow.append(divColumns);
		divColumns.append(getInfoDiv("The request has timeout", "warning"));		
        $('#results').append(divRow);
	    $('#query-spin').hide();
	};
	
	xhr.onabort = function()
	{
	  // If we have already another request going on, don't do anything, not super reliable
	  if (xhrid_copy != xhrid)
	  {
	    return;
	  }
	    $('#query-spin').hide();
	};
	
	xhr.send()

    // jsonpipe.flow('https://web.archive.org/web/20201112043521/http://localhost:55312/api/get?test=xxx', {
	// 	"success": function(data) {
	// 	   console.log(data);
	// 	   $('#results').append("
" + data.id + "
");
    //     }
	// });
}

window.addEventListener('popstate', function(event) {
  sendRequest(event.state, false);
}, false);

$( document ).ready(function() {
  sendRequest($.QueryString.text, false);
  
  $('#markdown').keydown(function (e) {
    if ((e.keyCode == 10 || e.keyCode == 13) && e.ctrlKey) {
      sendRequestFromInput();
    }
  });
});

//var simplemde = new SimpleMDE({ element: document.getElementById("markdown"), spellChecker: false });