mirror of
https://codeberg.org/nobody/LocalCDN.git
synced 2025-02-02 12:27:27 +01:00
Improved button for "show more injections"
This commit is contained in:
parent
33ca848b74
commit
a5e86ab045
@ -29,11 +29,12 @@ header {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.panel:not(:last-child) {
|
.panel:not(:last-child) {
|
||||||
border-bottom: 1px solid #d8d8d8;
|
padding: 10px 8px 0px 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.subpanel {
|
.subpanel {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
padding-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
@ -41,6 +42,16 @@ footer {
|
|||||||
padding: 8px;
|
padding: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#more-injections-section {
|
||||||
|
padding: 10px 8px;
|
||||||
|
font-weight: bold;
|
||||||
|
border-bottom: 1px solid #d8d8d8;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* #more-injections-section > p {
|
||||||
|
padding: 0px;
|
||||||
|
} */
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Fonts
|
* Fonts
|
||||||
*/
|
*/
|
||||||
@ -117,6 +128,7 @@ footer {
|
|||||||
|
|
||||||
.sublist:last-child {
|
.sublist:last-child {
|
||||||
border-bottom: 1px solid #e0e0e0;
|
border-bottom: 1px solid #e0e0e0;
|
||||||
|
margin-bottom: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sublist-item {
|
.sublist-item {
|
||||||
@ -130,11 +142,13 @@ footer {
|
|||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#get-stats-btn {
|
#get-more-injections-btn {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
color: #737373;
|
||||||
}
|
}
|
||||||
|
|
||||||
#get-stats-btn:hover {
|
#get-more-injections-btn:hover {
|
||||||
color: #a3a3a3;
|
color: #a3a3a3;
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
@ -67,6 +67,8 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="more-injections-section"></div>
|
||||||
|
|
||||||
<div id="extension-context" class="panel">
|
<div id="extension-context" class="panel">
|
||||||
|
|
||||||
<div id="injection-counter" class="counter">0</div>
|
<div id="injection-counter" class="counter">0</div>
|
||||||
|
@ -18,6 +18,7 @@
|
|||||||
* Popup
|
* Popup
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
let counterFrameworks = 0;
|
||||||
var popup = {};
|
var popup = {};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -284,13 +285,14 @@ popup._createInjectionOverviewElement = function (groupedInjections) {
|
|||||||
let injectionGroupHeaderElement, injectionGroupElement, cdn;
|
let injectionGroupHeaderElement, injectionGroupElement, cdn;
|
||||||
|
|
||||||
cdn = groupedInjections[source];
|
cdn = groupedInjections[source];
|
||||||
|
if (counterFrameworks < 3) {
|
||||||
injectionGroupHeaderElement = popup._createInjectionGroupHeaderElement(source, cdn);
|
injectionGroupHeaderElement = popup._createInjectionGroupHeaderElement(source, cdn);
|
||||||
injectionGroupElement = popup._createInjectionGroupElement(source, cdn);
|
injectionGroupElement = popup._createInjectionGroupElement(source, cdn);
|
||||||
|
|
||||||
injectionOverviewElement.appendChild(injectionGroupHeaderElement);
|
injectionOverviewElement.appendChild(injectionGroupHeaderElement);
|
||||||
injectionOverviewElement.appendChild(injectionGroupElement);
|
injectionOverviewElement.appendChild(injectionGroupElement);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return injectionOverviewElement;
|
return injectionOverviewElement;
|
||||||
};
|
};
|
||||||
@ -330,49 +332,51 @@ popup._createInjectionGroupElement = function (source, cdn) {
|
|||||||
injectionGroupElement = document.createElement('ul');
|
injectionGroupElement = document.createElement('ul');
|
||||||
injectionGroupElement.setAttribute('class', 'sublist');
|
injectionGroupElement.setAttribute('class', 'sublist');
|
||||||
|
|
||||||
count = 0;
|
|
||||||
oversized = false;
|
oversized = false;
|
||||||
for (let injection of filtered) {
|
for (let injection of filtered) {
|
||||||
|
|
||||||
if(count < 3){
|
if(counterFrameworks < 3){
|
||||||
let injectionElement = popup._createInjectionElement(injection);
|
let injectionElement = popup._createInjectionElement(injection);
|
||||||
injectionGroupElement.appendChild(injectionElement);
|
injectionGroupElement.appendChild(injectionElement);
|
||||||
} else {
|
} else {
|
||||||
oversized = true;
|
oversized = true;
|
||||||
}
|
}
|
||||||
count++;
|
counterFrameworks++;
|
||||||
}
|
}
|
||||||
if (oversized) {
|
if (oversized) {
|
||||||
let injectionElement = popup._createInjectionElement(filtered, count-3, true);
|
let injectionElement = popup._createInjectionElement(filtered, true);
|
||||||
injectionGroupElement.appendChild(injectionElement);
|
let moreInjectionsSection = document.getElementById('more-injections-section');
|
||||||
|
moreInjectionsSection.appendChild(injectionElement);
|
||||||
}
|
}
|
||||||
count = 0;
|
|
||||||
return injectionGroupElement;
|
return injectionGroupElement;
|
||||||
};
|
};
|
||||||
|
|
||||||
popup._createInjectionElement = function (injection, counter = 0, oversized = false) {
|
popup._createInjectionElement = function (injection, oversized = false) {
|
||||||
|
|
||||||
let injectionElement, filename, name, nameTextNode, noteElement, noteTextNode;
|
let injectionElement, filename, name, nameTextNode, noteElement, noteTextNode;
|
||||||
|
|
||||||
injectionElement = document.createElement('li');
|
|
||||||
injectionElement.setAttribute('class', 'sublist-item');
|
|
||||||
|
|
||||||
if(oversized) {
|
if(oversized) {
|
||||||
|
|
||||||
|
let lastElement = document.createElement('p');
|
||||||
let moreInjections = document.createElement('span');
|
let moreInjections = document.createElement('span');
|
||||||
|
|
||||||
nameTextNode = document.createTextNode(`... and ${counter} more`);
|
nameTextNode = document.createTextNode(`... and more`);
|
||||||
moreInjections.setAttribute('id', 'get-stats-btn');
|
moreInjections.setAttribute('id', 'get-more-injections-btn');
|
||||||
|
|
||||||
moreInjections.addEventListener('mouseup', function() {
|
moreInjections.addEventListener('mouseup', function() {
|
||||||
popup._onMoreInjectionsButton();
|
popup._onMoreInjectionsButton();
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
moreInjections.appendChild(nameTextNode);
|
moreInjections.appendChild(nameTextNode);
|
||||||
injectionElement.appendChild(moreInjections);
|
lastElement.appendChild(moreInjections);
|
||||||
|
|
||||||
return injectionElement;
|
return lastElement;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
injectionElement = document.createElement('li');
|
||||||
|
injectionElement.setAttribute('class', 'sublist-item');
|
||||||
|
|
||||||
filename = helpers.extractFilenameFromPath(injection.path);
|
filename = helpers.extractFilenameFromPath(injection.path);
|
||||||
|
|
||||||
// If bundle empty, use filename
|
// If bundle empty, use filename
|
||||||
@ -454,6 +458,7 @@ popup._onOptionsButtonClicked = function () {
|
|||||||
};
|
};
|
||||||
|
|
||||||
popup._onDonationButtonClicked = function () {
|
popup._onDonationButtonClicked = function () {
|
||||||
|
|
||||||
if (event.button === 0 || event.button === 1) {
|
if (event.button === 0 || event.button === 1) {
|
||||||
|
|
||||||
chrome.tabs.create({
|
chrome.tabs.create({
|
||||||
|
Loading…
x
Reference in New Issue
Block a user