Permalink
Browse files

added 'Capture for'

  • Loading branch information...
1 parent 2d5b743 commit 2358f754bff7dff3d5c72307fe4d890e32a80651 nash committed Feb 4, 2012
Showing with 95 additions and 33 deletions.
  1. +3 −3 main.html
  2. +92 −30 main.js
View
6 main.html
@@ -15,7 +15,7 @@
font-size: 10.5pt;
word-break: break-all;
/* height: 100%; */
- padding-top: 25px;
+ padding-top: 55px;
overflow: hidden;
}
.path {
@@ -48,7 +48,7 @@
top: 0;
left: 0;
width: 100%;
- height: 20px;
+ height: 40px;
padding: 5px 5px;
background-color: white;
font-size: 9pt;
@@ -68,7 +68,7 @@
</head>
<body>
<div id="header">
-HTTP Observer | <a href="javascript:location.reload()">Clear</a> | <a href="javascript:(function() { var el=document.getElementById('control'); isCapture=!isCapture; el.innerHTML = isCapture ? 'Capturing…' : 'Capture';})();" id="control">Capturing…</a> | <span class="sent">●</span>: Sent Headers, <span class="ok">●</span>: Completed, <span class="error">●</span>: An error occurred | Jump to <a href="javascript:$('div#list').animate({scrollTop:0}, 800);">top</a>, <a href="javascript:$('div#list').animate({scrollTop:$('div#list').get(0).scrollHeight}, 800);">bottom</a> | <input type="checkbox" id="as">Auto Scroll</input>
+HTTP Observer | <a href="javascript:location.reload()">Clear</a> | <a href="javascript:(function() { var el=document.getElementById('control'); isCapture=!isCapture; el.innerHTML = isCapture ? 'Capturing…' : 'Capture';})();" id="control">Capturing…</a> | <span class="sent">●</span>: Sent Headers, <span class="ok">●</span>: Completed, <span class="error">●</span>: An error occurred | Jump to <a href="javascript:$('div#list').animate({scrollTop:0}, 800);">top</a>, <a href="javascript:$('div#list').animate({scrollTop:$('div#list').get(0).scrollHeight}, 800);">bottom</a> | <input type="checkbox" id="as">Auto Scroll</input><br />Capture for: <select id="target"></select>
<hr /></div>
<div id="list"></div>
<div id="content"></div>
View
122 main.js
@@ -1,20 +1,45 @@
+/* TODO
+ * onTabsChangedの実装が雑なのでそのうち直す
+ * $('#list').children().hide()あたりの実装が非常によろしくない感じ
+*/
+
const statusIcon = '<span class="sent">●</span>';
const request = '<b><span class="r">Request Headers</span></b>: <br />';
const response = '<b><span class="r">Response Headers</span></b>: <br />';
const statusline = '<b><span class="r">Status Line</span></b>: <br />';
const ext_version = 0.2;
var isCapture = true;
+var captureTarget = 'all';
$(document).ready(function() {
setTimeout(function() {
- $('div#list').css('height', $(document).height() - 35 + 'px');
- $('div#content').css('height', $(document).height() - 35 + 'px');
+ $('div#list').css('height', $(document).height() - 65 + 'px');
+ $('div#content').css('height', $(document).height() - 65 + 'px');
}, 100);
if (ext_version < version) {
$('div#header hr').before(' | <a href="javascript:chrome.tabs.create({url:\'' + download + '\', selected:true});">New version available!</a>');
}
+
+ $('<option>').attr('value', 'all')
+ .html('All')
+ .appendTo($('#target'));
+
+ chrome.windows.getAll({ populate: true } , function(windows) {
+ for (var i=0; i<windows.length; i++) {
+ var tabs = windows[i].tabs;
+ for (var j=0; j<tabs.length; j++) {
+ $('<option>').attr('value', tabs[j].id)
+ .html(text(tabs[j].title))
+ .appendTo($('#target'));
+ }
+ }
+ });
+
+ $('#target').change(function() {
+ captureTarget = $('#target option:checked').attr('value');
+ });
});
chrome.experimental.webRequest.onSendHeaders.addListener(onSendHeaders, { }, ['requestHeaders']);
@@ -23,6 +48,12 @@ chrome.experimental.webRequest.onCompleted.addListener(onCompleted, { }, ['respo
chrome.experimental.webRequest.onErrorOccurred.addListener(onErrorOccurred, { });
+chrome.tabs.onRemoved.addListener(onTabsChanged);
+
+chrome.tabs.onCreated.addListener(onTabsChanged);
+
+chrome.tabs.onUpdated.addListener(onTabsChanged);
+
function text(str) {
str = str.split('&').join('&amp;'); //.replace('&', '&amp;');
str = str.split('"').join('&quot;'); //.replace('"', '&quot;');
@@ -83,37 +114,68 @@ function onCompleted(details) {
}
function onSendHeaders(details) {
- if (isCapture) {
- var str = '';
- for (var key in details.requestHeaders) {
- str += '<b>' + text(details.requestHeaders[key].name) + '</b>: ' + text(details.requestHeaders[key].value) + '<br />';
+ if (!isCapture) return;
+ if (captureTarget != 'all' && details.tabId != parseInt($('#target').val())) return;
+
+ var str = '';
+ for (var key in details.requestHeaders) {
+ str += '<b>' + text(details.requestHeaders[key].name) + '</b>: ' + text(details.requestHeaders[key].value) + '<br />';
+ }
+
+ var parseURL = text(details.url).split('/');
+ var fileName = parseURL[parseURL.length - 1] ? parseURL[parseURL.length - 1] : parseURL[parseURL.length - 2];
+ delete parseURL[parseURL.length - 1];
+ var pathName = parseURL.join('/');
+
+ $('<div>').html(statusIcon + fileName + '<br /><span class="path">' + pathName + '</span>')
+ .addClass('caption')
+ .attr('id', details.requestId)
+ .click(function() {
+// いちいちDOM Element持ってるのはめんどくさいのでそのうち直す
+ $('div#content').children().hide();
+ $('div#' + $(this).attr('id') + 'content').toggle();
+ }).appendTo($('div#list'));//$(document.body));
+
+ $('<div>').html(request + str)
+ .attr('id', details.requestId + 'content')
+ .addClass('detail')
+ .css('display', 'none')
+ .appendTo($('div#content'));//$(document.body));
+
+ if ($('#as').attr('checked')) {
+ _scroll($('div#list').get(0).scrollHeight, 0);
+ }
+}
+
+function onTabsChanged() {
+// 一旦全部削除
+ $('#target').children().remove();
+
+// Allをつける
+ $('<option>').attr('value', 'all')
+ .html('All')
+ .appendTo($('#target'));
+
+// またoptionを付け直す(あとで直す)
+ chrome.windows.getAll({ populate: true } , function(windows) {
+ for (var i=0; i<windows.length; i++) {
+ var tabs = windows[i].tabs;
+ for (var j=0; j<tabs.length; j++) {
+ $('<option>').attr('value', tabs[j].id)
+ .html(text(tabs[j].title))
+ .appendTo($('#target'));
+ }
}
-
- var parseURL = text(details.url).split('/');
- var fileName = parseURL[parseURL.length - 1] ? parseURL[parseURL.length - 1] : parseURL[parseURL.length - 2];
- delete parseURL[parseURL.length - 1];
- var pathName = parseURL.join('/');
-
- $('<div>').html(statusIcon + fileName + '<br /><span class="path">' + pathName + '</span>')
- .addClass('caption')
- .attr('id', details.requestId)
- .click(function() {
- $('div#content').children().hide();
- $('div#' + $(this).attr('id') + 'content').toggle();
- }).appendTo($('div#list'));//$(document.body));
-
- $('<div>').html(request + str)
- .attr('id', details.requestId + 'content')
- .addClass('detail')
- .css('display', 'none')
- .appendTo($('div#content'));//$(document.body));
-
- if ($('#as').attr('checked')) {
- _scroll($('div#list').get(0).scrollHeight, 0);
+// 変更前に選択したものが残っていればそれを選択状態にする
+ if ($('#target option[value=' + captureTarget + ']').length == 1) {
+ $('#target').val(captureTarget);
+ } else {
+ $('#target').val('all');
+ captureTarget = 'all';
}
- }
+ });
}
function _scroll(height, duration) {
- $('div#list').animate({scrollTop:height}, duration);
+ $('div#list').animate({ scrollTop : height }, duration);
}

0 comments on commit 2358f75

Please sign in to comment.