Skip to content

Commit 033d23d

Browse files
localjolocaljo
committed
clarify info panel, and switch tab on fail
1 parent 0468157 commit 033d23d

4 files changed

Lines changed: 72 additions & 40 deletions

File tree

‎background.js‎

Lines changed: 23 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -26,14 +26,15 @@ chrome.runtime.onConnect.addListener(function (port) {
2626
chrome.tabs.onUpdated.addListener(function (tabId, changes) {
2727
if (tabId === tabInspected && changes.status === 'complete') {
2828
getJsonResource(tabId);
29+
notifyDevtools('action', 'reload');
2930
}
3031
});
3132

3233
// Function to send a message to main.js
33-
function notifyDevtools(msgType, msg) {
34+
function notifyDevtools(msgType, payload) {
3435
var packagedMessage = {};
3536
packagedMessage.msgType = msgType;
36-
packagedMessage.msg = msg;
37+
packagedMessage.payload = payload;
3738
ports.forEach(function (port) {
3839
port.postMessage(packagedMessage);
3940
});
@@ -45,24 +46,27 @@ function getJsonResource(tabID) {
4546
var xhr = new XMLHttpRequest();
4647
xhr.open('GET', jsonResourceURL, true);
4748
xhr.onreadystatechange = function() {
48-
var isSolidus, errMsg;
49-
isSolidus = (xhr.getResponseHeader('X-Powered-By').match(/Solidus/i));
50-
notifyDevtools('info', xhr.getResponseHeader('X-Powered-By'));
51-
if (xhr.readyState === 4 && isSolidus) { // Is complete Solidus response?
52-
if(xhr.status !== 200){ // Check that Solidus response didn't fail
53-
errMsg = 'Failed to get Solidus context. Status: ' + xhr.status;
54-
notifyDevtools('error', errMsg);
55-
} else {
56-
try {
57-
// Send Solidus JSON to devpanel
58-
notifyDevtools('context', JSON.parse(xhr.responseText));
59-
} catch (e) {
60-
notifyDevtools('error', e);
61-
}
49+
if (xhr.readyState !== 4) return; //quickly return if not complete request
50+
var xpbHeader = xhr.getResponseHeader('X-Powered-By');
51+
if (!xpbHeader.match(/Solidus/i)) { //quickly return if not solidus
52+
notifyDevtools('error', 'No Solidus header detected.');
53+
notifyDevtools('status', '<b>not</b> running Solidus 0.1.7 or greater');
54+
notifyDevtools('action', 'shutdown');
55+
return;
56+
}
57+
notifyDevtools('status', 'running ' + xpbHeader);
58+
if (xhr.status !== 200) {
59+
notifyDevtools('error', 'Solidus JSON status: ' + xhr.status);
60+
notifyDevtools('action', 'shutdown');
61+
return;
62+
}
63+
if (xhr.status === 200) {
64+
try {
65+
notifyDevtools('context', JSON.parse(xhr.responseText));
66+
notifyDevtools('action', 'reload');
67+
} catch (e) {
68+
notifyDevtools('error', e);
6269
}
63-
} else {
64-
errMsg = 'Looks like you\'re not inspecting a Solidus Page.';
65-
notifyDevtools('error', errMsg);
6670
}
6771
};
6872
xhr.send();

‎views/devpanel.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,10 @@ body, html {
3232
padding-bottom: 30px;
3333
}
3434

35+
.tab-pane :first-child {
36+
margin-top: 0;
37+
}
38+
3539
.inspector-json {
3640
padding: 0;
3741
}

‎views/devpanel.html‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
</head>
1515
<body>
1616
<div class="sidetab-column col-xs-3">
17-
<ul class="nav nav-tabs tabs-left">
17+
<ul class="nav nav-tabs tabs-left" id="panelTabs">
1818
<li><a href="#context" data-toggle="tab">Context</a></li>
1919
<li><a href="#logs" data-toggle="tab">Logs</a></li>
2020
<li><a href="#info" data-toggle="tab">Info</a></li>
@@ -32,7 +32,9 @@
3232
<pre id="serverlogs" class="scroll-panel"></pre>
3333
</div>
3434
<div class="tab-pane" id="info">
35-
<div id="messageholder" class="alert alert-info" role="alert"></div>
35+
<h3>Solidus DevTools v0.1.0</h3>
36+
<p>The site you are inspecting is <span id="pluginstatus">a mystery</span>.</p>
37+
<div id="messageholder"></div>
3638
</div>
3739
</div>
3840
</div>

‎views/devpanel.js‎

Lines changed: 41 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -6,22 +6,46 @@
66
// Tell JSHint that processMainIncomingMessage is definedhere but used elsewhere
77
/* exported processMainIncomingMessage */
88
// Tell JSHint about the socket.io global
9-
/* global io */
9+
/* global io, $ */
1010

1111
var inspector;
1212

13+
var socket = io('http://localhost:8081');
14+
socket.on('connect', function(){
15+
socket.on('log', function(data){
16+
addToLog(data.message);
17+
});
18+
socket.on('disconnect', function(){
19+
document.querySelector('#serverlogs').innerHTML = 'Socket Disconnected';
20+
});
21+
});
22+
1323
function processMainIncomingMessage(msg) {
1424
switch(msg.msgType) {
1525
case 'context':
16-
setupInspector(msg.msg);
26+
setupInspector(msg.payload);
1727
break;
1828
case 'error':
19-
destroyInspector();
20-
showAlert(msg.msg, 'Error:');
21-
//activateTab('info');
29+
showAlert(msg.payload, 'Error:', 'danger');
2230
break;
2331
case 'status':
24-
updateStatus(msg.msg);
32+
updateStatus(msg.payload);
33+
break;
34+
case 'action':
35+
36+
switch (msg.payload) {
37+
case 'shutdown':
38+
destroyInspector();
39+
$('#panelTabs a[href="#info"]').tab('show');
40+
var contextPane = document.querySelector('#pagecontext');
41+
contextPane.innerHTML = 'No context. See Info tab.';
42+
break;
43+
case 'reload':
44+
clearAlerts();
45+
break;
46+
default:
47+
}
48+
2549
break;
2650
default:
2751
console.log('Unhandled Message', msg);
@@ -47,9 +71,9 @@ function destroyInspector() {
4771
}
4872

4973
function createAlert(info, label, alertClass) { //Create a Bootstrap HTML alert
50-
var infoClass = alertClass?alertClass:'alert-info';
74+
var infoClass = alertClass?alertClass:'info';
5175
var infoLabel = label?'<strong>' + label +'</strong> ':'';
52-
return '<div class="alert ' + infoClass +
76+
return '<div class="alert alert-' + infoClass +
5377
' alert-dismissible" role="alert"><button type="button" class="close"' +
5478
' data-dismiss="alert"><span aria-hidden="true">&times;</span>' +
5579
'<span class="sr-only">Close</span></button>' + infoLabel + info + '</div>';
@@ -60,21 +84,19 @@ function showAlert(message, label, alertClass){ //Show an alert
6084
document.querySelector('#messageholder').innerHTML += theAlert;
6185
}
6286

87+
function clearAlerts(){
88+
document.querySelector('#messageholder').innerHTML = '';
89+
}
90+
6391
function updateStatus(status) { //Update status panel in footer
6492
document.querySelector('#pluginstatus').innerHTML = status;
6593
}
6694

67-
var socket = io('http://localhost:8081');
68-
socket.on('connect', function(){
69-
socket.on('log', function(data){
70-
var logContainer = document.querySelector('#serverlogs');
71-
logContainer.innerHTML += data.message + '\n';
72-
logContainer.scrollTop = logContainer.scrollHeight;
73-
});
74-
socket.on('disconnect', function(){
75-
document.querySelector('#serverlogs').innerHTML = 'Socket Disconnected';
76-
});
77-
});
95+
function addToLog(msg) {
96+
var logContainer = document.querySelector('#serverlogs');
97+
logContainer.innerHTML += msg + '\n';
98+
logContainer.scrollTop = logContainer.scrollHeight;
99+
}
78100

79101
function clearLog() {
80102
document.querySelector('#serverlogs').innerHTML = '';

0 commit comments

Comments
 (0)