______________________________________________________________________________
manifest.json
______________________________________________________________________________
{
"manifest_version": 3,
"name": "Cache Clearer",
"version": "1.0",
"action": {
"default_popup": "popup.html"
},
"permissions": [
"storage",
"activeTab",
"scripting",
"browsingData"
],
"host_permissions": [
"*://*/*"
],
"background": {
"service_worker": "background.js"
}
}
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
if (request.action === "clearData") {
// Call clearBrowserData and then send response
clearBrowserData(request.options).then(() => {
sendResponse({ action: "clearDataResponse" });
}).catch((error) => {
console.error("Error clearing data:", error);
sendResponse({ action: "clearDataResponse", error: error.message });
});
// Return true to keep the messaging channel open for the response
return true;
}
});
function clearBrowserData(options) {
return new Promise((resolve, reject) => {
var dataToRemove = {};
if (options.cache) dataToRemove.cache = true;
if (options.cookies) dataToRemove.cookies = true;
if (options.history) dataToRemove.history = true;
if (options.fileSystems) dataToRemove.fileSystems = true;
if (options.indexedDB) dataToRemove.indexedDB = true;
if (options.localStorage) dataToRemove.localStorage = true;
if (options.serviceWorkers) dataToRemove.serviceWorkers = true;
chrome.browsingData.remove({ "since": 0 }, dataToRemove, () => {
console.log("Selected data cleared bg.");
// sendResponse({ action: "clearDataResponse" });
resolve();
});
});
}
______________________________________________________________________________
background.js
______________________________________________________________________________
popup.html
<!DOCTYPE html>
<html>
<head>
<title>Cache Clearer</title>
<style>
/* Add your styling here */
#clearDataButton {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 10px;
text-align: center;
background-color: #f4f4f4;
color: #333;
width: 350px;
/* Adjust this value as needed */
margin: auto;
}
h1 {
color: #5a5a5a;
}
#dataOptions {
margin: 20px 0;
text-align: left;
}
#dataOptions div {
margin-bottom: 10px;
}
input[type="checkbox"] {
margin-right: 10px;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 16px;
transition: background-color 0.3s ease;
}
button:hover {
background-color: #45a049;
}
.cleared {
position: relative;
padding-left: 25px;
/* Adjust space for check mark */
}
.cleared::before {
content: '\2714';
/* Unicode check mark */
position: absolute;
left: 0;
color: green;
}
</style>
</head>
<body>
<h1>Browser cache clearer</h1>
<form id="dataOptions">
<div><input type="checkbox" id="selectAll"> Select All</div>
<hr>
<div><input type="checkbox" id="cache" checked> Cache</div>
<div><input type="checkbox" id="cookies"> Cookies</div>
<div><input type="checkbox" id="history"> Browsing History</div>
<div><input type="checkbox" id="fileSystems"> File Systems</div>
<div><input type="checkbox" id="indexedDB"> IndexedDB</div>
<div><input type="checkbox" id="localStorage"> Local Storage</div>
<div><input type="checkbox" id="serviceWorkers"> Service Workers</div>
<!-- Add more options as needed -->
</form>
<div id="statusMessage" style="margin-top: 10px;margin-bottom: 10px;"></div>
<button id="clearDataButton">Clear Selected Data</button>
<script src="popup.js"></script>
</body>
</html>
______________________________________________________________________________
popup.js
______________________________________________________________________________
document.addEventListener('DOMContentLoaded', function () {
var selectAllCheckbox = document.getElementById('selectAll');
var otherCheckboxes = document.querySelectorAll('#dataOptions input[type="checkbox"]:not(#selectAll)');
var clearDataButton = document.getElementById('clearDataButton');
var statusMessage = document.getElementById('statusMessage');
var checkboxes = document.querySelectorAll('#dataOptions input[type="checkbox"]');
selectAllCheckbox.addEventListener('change', function () {
checkboxes.forEach(checkbox => {
checkbox.checked = this.checked;
checkbox.parentElement.classList.remove('cleared'); // Remove cleared class if needed
document.getElementById('statusMessage').innerHTML = ''
});
});
checkboxes.forEach(function (checkbox) {
checkbox.addEventListener('change', function () {
// If any checkbox is unchecked, uncheck the selectAllCheckbox
if (!this.checked) {
selectAllCheckbox.checked = false;
}
});
});
clearDataButton.addEventListener('click', function () {
// Check if any checkbox is selected
var isAnyCheckboxSelected = Array.from(checkboxes).some(checkbox => checkbox.checked);
if (!isAnyCheckboxSelected) {
// Show 'nothing selected' message
statusMessage.textContent = "No selection(s) found!";
statusMessage.style.color = "red";
checkboxes.forEach(checkbox => {
checkbox.parentElement.classList.remove('cleared');
});
return; // Exit the function
}
var options = {
cache: document.getElementById('cache').checked,
cookies: document.getElementById('cookies').checked,
history: document.getElementById('history').checked,
fileSystems: document.getElementById('fileSystems').checked,
indexedDB: document.getElementById('indexedDB').checked,
localStorage: document.getElementById('localStorage').checked,
serviceWorkers: document.getElementById('serviceWorkers').checked
// ... add more options as needed
};
chrome.runtime.sendMessage({ action: "clearData", options: options });
// document.getElementById('statusMessage').textContent = "Selected data cleared from your browser!";
updateStatusMessage();
document.getElementById('statusMessage').style.color = "red";
var checkedItems = document.querySelectorAll('#dataOptions input[type="checkbox"]:checked:not(#selectAll)');
checkboxes.forEach(checkbox => {
checkbox.parentElement.classList.remove('cleared');
});
checkedItems.forEach(item => {
item.parentElement.classList.add('cleared');
});
});
});
function updateStatusMessage() {
var now = new Date();
var options = {
year: 'numeric', month: 'numeric', day: 'numeric',
hour: 'numeric', minute: 'numeric', second: 'numeric',
timeZoneName: 'short'
};
var dateString = new Intl.DateTimeFormat('en-US', options).format(now);
var message = "Selected data cleared from your browser<br>" + dateString;
document.getElementById('statusMessage').innerHTML = message;
}
______________________________________________________________________________
No comments:
Post a Comment