orionsoft-react-scripts
Version:
Orionsoft Configuration and scripts for Create React App.
130 lines (120 loc) • 3.01 kB
JavaScript
var $ = require("jquery");
var stripAnsi = require('strip-ansi');
var socket = require('./socket');
require("./style.css");
var hot = false;
var currentHash = "";
$(function() {
$("body").html(require("./page.jade")());
var status = $("#status");
var okness = $("#okness");
var $errors = $("#errors");
var iframe = $("#iframe");
var header = $(".header");
var contentPage = window.location.pathname.substr("/webpack-dev-server".length) + window.location.search;
status.text("Connecting to sockjs server...");
$errors.hide();
iframe.hide();
header.css({
borderColor: "#96b5b4"
});
var onSocketMsg = {
hot: function() {
hot = true;
iframe.attr("src", contentPage + window.location.hash);
},
invalid: function() {
okness.text("");
status.text("App updated. Recompiling...");
header.css({
borderColor: "#96b5b4"
});
$errors.hide();
if(!hot) iframe.hide();
},
hash: function(hash) {
currentHash = hash;
},
"still-ok": function() {
okness.text("");
status.text("App ready.");
header.css({
borderColor: ""
});
$errors.hide();
if(!hot) iframe.show();
},
ok: function() {
okness.text("");
$errors.hide();
reloadApp();
},
warnings: function() {
okness.text("Warnings while compiling.");
$errors.hide();
reloadApp();
},
errors: function(errors) {
status.text("App updated with errors. No reload!");
okness.text("Errors while compiling.");
$errors.text("\n" + stripAnsi(errors.join("\n\n\n")) + "\n\n");
header.css({
borderColor: "#ebcb8b"
});
$errors.show();
iframe.hide();
},
"proxy-error": function(errors) {
status.text("Could not proxy to content base target!");
okness.text("Proxy error.");
$errors.text("\n" + stripAnsi(errors.join("\n\n\n")) + "\n\n");
header.css({
borderColor: "#ebcb8b"
});
$errors.show();
iframe.hide();
},
close: function() {
status.text("");
okness.text("Disconnected.");
$errors.text("\n\n\n Lost connection to webpack-dev-server.\n Please restart the server to reestablish connection...\n\n\n\n");
header.css({
borderColor: "#ebcb8b"
});
$errors.show();
iframe.hide();
}
};
socket("/sockjs-node", onSocketMsg);
iframe.load(function() {
status.text("App ready.");
header.css({
borderColor: ""
});
iframe.show();
});
function reloadApp() {
if(hot) {
status.text("App hot update.");
try {
iframe[0].contentWindow.postMessage("webpackHotUpdate" + currentHash, "*");
} catch(e) {
console.warn(e);
}
iframe.show();
} else {
status.text("App updated. Reloading app...");
header.css({
borderColor: "#96b5b4"
});
try {
var old = iframe[0].contentWindow.location + "";
if(old.indexOf("about") == 0) old = null;
iframe.attr("src", old || (contentPage + window.location.hash));
old && iframe[0].contentWindow.location.reload();
} catch(e) {
iframe.attr("src", contentPage + window.location.hash);
}
}
}
});