external/uBlock
1
0
Fork 0
mirror of https://github.com/gorhill/uBlock.git synced 2024-11-10 01:02:08 +01:00
Code Issues Projects Releases Packages Wiki Activity

fine tuning visuals

Browse source
This commit is contained in:
gorhill 2014-06-24 01:20:59 -04:00
parent 2be9275524
commit c6c5926e6e
2 changed files with 50 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
js/popup.js
View file

@ -38,6 +38,33 @@ messaging.start('popup.js');
/******************************************************************************/
formatNumber = function(count) {
if ( typeof count !== 'number' ) {
return '';
}
var s = count.toFixed(0);
if ( count >= 1000 ) {
if ( count < 10000 ) {
s = s.slice(0,1) + '.' + s.slice(1,3) + 'K';
} else if ( count < 100000 ) {
s = s.slice(0,2) + '.' + s.slice(2,3) + 'K';
} else if ( count < 1000000 ) {
s = s.slice(0,3) + 'K';
} else if ( count < 10000000 ) {
s = s.slice(0,1) + '.' + s.slice(1,3) + 'M';
} else if ( count < 100000000 ) {
s = s.slice(0,2) + '.' + s.slice(2,3) + 'M';
} else if ( count < 1000000000 ) {
s = s.slice(0,3) + 'M';
} else {
s = s.slice(0,-9) + 'G';
}
}
return s;
};
/******************************************************************************/
var hasClassName = function(elem, className) {
var re = new RegExp('(^| )' + className + '( |$)', 'g');
return re.test(elem.className);
@ -71,12 +98,10 @@ var renderStats = function() {
elem.innerHTML = '0';
} else {
elem.innerHTML = [
blocked,
'<span class="dim">&nbsp;/&nbsp;',
total,
'&nbsp;\u21D2&nbsp;</span>',
formatNumber(blocked),
'<span class="dim">&nbsp;or&nbsp;',
(blocked * 100 / total).toFixed(0),
'%'
'%</span>'
].join('');
}
@ -87,12 +112,10 @@ var renderStats = function() {
elem.innerHTML = '0';
} else {
elem.innerHTML = [
blocked,
'<span class="dim">&nbsp;/&nbsp;',
total,
'&nbsp;\u21D2&nbsp;</span>',
formatNumber(blocked),
'<span class="dim">&nbsp;or&nbsp;',
(blocked * 100 / total).toFixed(0),
'%'
'%</span>'
].join('');
}
@ -143,8 +166,8 @@ var handleNetFilteringSwitch = function() {
/******************************************************************************/
var renderHeader = function() {
var hdr = document.querySelector('h1,h2,h3,h4');
hdr.innerHTML = hdr.innerHTML + '&ensp;v' + chrome.runtime.getManifest().version;
var hdr = document.getElementById('version');
hdr.innerHTML = hdr.innerHTML + 'v' + chrome.runtime.getManifest().version;
};

19
popup.html
View file

@ -20,8 +20,20 @@ h1,h2,h3,h4 {
background-color: #444;
text-align: center;
}
a {
color: inherit;
text-decoration: none;
}
*:focus {
outline: 0;
}
#version {
margin-left: 1em;
font-weight: normal;
font-size: 11px;
}
body > div {
padding: 4px 8px 0 8px;
padding: 4px 12px 0 12px;
}
p {
margin: 16px 0;
@ -53,7 +65,7 @@ p {
font-size: 12px;
}
.dim {
color: #aaa;
color: #888;
text-decoration: none;
}
</style>
@ -61,7 +73,7 @@ p {
</head>
<body>
<h4>µBlock</h4>
<h4><a href="dashboard.html" target="_blank" title="Click to open the dashboard">µBlock<span id="version"></span></a></h4>
<div>
<p id="switch"><span class="fa">&#xf011;</span></p>
<p style="font-size: 16px;" data-i18n="popupBlockedRequestPrompt"></p>
@ -69,7 +81,6 @@ p {
<p id="page-blocked">?</p>
<p id="stats" data-i18n="popupBlockedSinceInstallPrompt"></p>
<p id="total-blocked">?</p>
<p id="options"><a class="dim" href="dashboard.html" target="_blank">Options</a></p>
</div>
<script src="js/i18n.js"></script>