Uplaod Extension

pull/2/head
Guus van Meerveld 4 years ago
commit 2f178f5ae8

2
.gitignore vendored

@ -0,0 +1,2 @@
Magister Auto-Login.crx
Magister Auto-Login.pem

@ -0,0 +1,25 @@
body {
background-color: #282a2d;
}
* {
color: #c5c5c5!important;
}
.input-group-text {
color: #fff;
background-color: #1e2226;
border-color: #383f47;
}
.form-control, .bg-light {
background-color: #22262a!important;
color: #fff!important;
border-color: #383f47;
}
.btn-primary {
background-color: #0167d4;
}
.btn-primary:hover {
background-color: #0056b2;
}
.active.btn-primary {
background-color: #0052aa!important;
}

@ -0,0 +1,19 @@
chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
if (changeInfo.status == 'complete' && tab.active) {
chrome.tabs.executeScript(tab.ib, {
file: 'js/login.js'
});
}
});
chrome.runtime.onInstalled.addListener(function () {
// open options.html
window.open('/options/index.html', '_blank');
chrome.storage.sync.set({
"enabled": true
});
chrome.browserAction.setBadgeText({
text: 'ON'
});
});

@ -0,0 +1,53 @@
const d = document.getElementById.bind(document);
// user object moet gemaakt worden vanuit chrome.storage.sync
var snooze = ms => new Promise(res => setTimeout(res, ms));
function login() {
chrome.storage.sync.get(['number', 'password'], async function (result) {
console.log(result);
await waitForSel("username");
if (d("username") && result.number) {
d("username").value = result.number;
d("username").dispatchEvent(new Event("input"));
};
await waitForSel("username_submit")
if (d("username_submit")) {
d("username_submit").click();
};
await waitForSel("rswp_password")
if (d("rswp_password") && result.password) {
d("rswp_password").value = result.password;
d("rswp_password").dispatchEvent(new Event("input"));
};
await waitForSel("rswp_submit")
if (d("rswp_submit")) {
d("rswp_submit").click();
};
});
}
function waitForSel(s) {
return new Promise(res => {
setInterval(() => {
if (d(s)) {
res()
}
}, 10);
});
};
chrome.storage.sync.get(['enabled'], function (result){
if(result.enabled){
login();
};
});

@ -0,0 +1,84 @@
const d = document.getElementById.bind(document);
const qAll = document.querySelectorAll.bind(document);
d("save").addEventListener("click", save);
qAll(".login").forEach(s => {
s.addEventListener("keydown", e => {
if (e.key == "Enter") {
if (e.target.id == "number") {
d("password").focus()
};
if (e.target.id == "password") {
save()
};
}
});
});
function save() {
var number = d("number").value;
var password = d("password").value;
try {
chrome.storage.sync.set({
"number": number,
"password": password
});
d("save").innerHTML = "Saved!"
} catch (e) {
d("save").innerHTML = "Error"
d("save").className = "btn btn-danger float-right"
}
};
function onLoad() {
chrome.storage.sync.get(['number', 'password'], function (result) {
if (result.number !== undefined){
d("number").value = result.number
};
if (result.password !== undefined) {
d("password").value = result.password
};
});
chrome.storage.sync.get(['enabled'], function (result) {
d("switch").checked = result.enabled
});
chrome.storage.sync.get(['darkmode'], function (result) {
d("dark-mode").checked = result.darkmode
d("dark-link").disabled = d("dark-mode").checked ? false : true
});
d("switch").addEventListener("click", toggle)
d("dark-mode").addEventListener("click", darkMode)
};
function toggle() {
var checked = d("switch").checked;
chrome.storage.sync.set({
"enabled": checked
});
chrome.browserAction.setBadgeText({
text: checked ? "ON" : "OFF"
});
};
function darkMode() {
chrome.storage.sync.set({
"darkmode": d("dark-mode").checked
});
console.log(!d("dark-mode").checked);
d("dark-link").disabled = d("dark-mode").checked ? false : true
}
onLoad()

@ -0,0 +1,28 @@
{
"name": "Magister Auto-Login",
"version": "1.0",
"manifest_version": 2,
"description": "Auto-Login for Magister 6 webapp.",
"options_page": "options/index.html",
"homepage_url": "http://mb-o.nl/autologin",
"background": {
"scripts": [
"js/background.js"
],
"persistent": true
},
"browser_action": {
"default_title": "Auto-login",
"default_popup": "/popup/index.html"
},
// "icons": {
// "16": "/img/icon16.png",
// "32": "/img/icon32.png",
// "48": "/img/icon48.png",
// "128": "/img/icon128.png"
// },
"permissions": [
"https://accounts.magister.net/*",
"storage"
]
}

@ -0,0 +1,46 @@
.material-switch > input[type="checkbox"] {
display: none;
}
.material-switch > label {
cursor: pointer;
margin-top: .8rem;
float: right;
height: 0px;
position: relative;
width: 40px;
}
.material-switch > label::before {
background: rgb(0, 0, 0);
box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
border-radius: 8px;
content: '';
height: 16px;
margin-top: -8px;
position:absolute;
opacity: 0.3;
transition: all 0.4s ease-in-out;
width: 40px;
}
.material-switch > label::after {
background: rgb(255, 255, 255);
border-radius: 16px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
content: '';
height: 24px;
left: -4px;
margin-top: -8px;
position: absolute;
top: -4px;
transition: all 0.3s ease-in-out;
width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
background: #007bff;
opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
background: #007bff;
left: 20px;
}

@ -0,0 +1,29 @@
.screen {
width: 100vw;
height: 100vh;
}
.copyright {
position: absolute;
margin: 7px;
right: 0;
bottom: 0;
}
.switch-span {
width: 2rem;
}
.enable {
position: absolute;
left: 1rem;
bottom: 1.7rem;
}
.darkcheck{
position: absolute;
margin: 7px;
right: 0px;
}
body {
min-width: 20rem;
}

@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang="en">
<head>
<title>Options | Magister Auto-Login</title>
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="/materials-switches.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" id="dark-link" disabled href="/dark-mode.css">
</head>
<body>
<input id="dark-mode" type="checkbox" class="darkcheck"></input>
<div class="d-flex align-items-center screen">
<div class="container mt-3">
<div class="row">
<h1 class="mb-3">Magister Auto-Login</h1>
<span class="position-relative switch-span">
<div class="material-switch pull-right enable">
<input id="switch" type="checkbox">
<label for="switch" class="label-primary"></label>
</div>
</span>
</div>
<div class="row">
<div class="col">
<label for="">Leerlingnummer:</label>
<input type="text" class="form-control mb-3 login" autofocus name="number" id="number"
placeholder="Enter leerlingnummer">
<hr class="bg-light mb-3">
<label for="">Password:</label>
<input type="password" class="form-control mb-3 login" name="password" id="password"
placeholder="Enter password">
<hr class="bg-light mb-3">
<button class="btn-primary btn float-right" id="save">Save</button>
</div>
</div>
</div>
<p class="copyright" title="Kleine credit naar Sam Taen">By Martijn Oosterhuis & Guus van Meerveld</p>
</div>
<script src="/js/save.js"></script>
</body>
</html>

@ -0,0 +1,18 @@
body {
min-width: 20rem;
min-height: 17rem;
}
.darkcheck{
position: absolute;
margin: 7px;
right: 0px;
}
.enable {
position: absolute;
bottom: 0;
left: 0;
margin-bottom: 10px;
margin-left: 20px;
}

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="index.css">
<link rel="stylesheet" href="/materials-switches.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" id="dark-link" disabled href="/dark-mode.css">
</head>
<body>
<input id="dark-mode" type="checkbox" class="darkcheck"></input>
<div class="d-flex align-items-center screen">
<div class="container fluid mt-3">
<div class="row">
</div>
<div class="row">
<div class="col">
<label for="">Leerlingnummer:</label>
<input type="text" class="form-control mb-3 login" autofocus name="number" id="number"
placeholder="Enter leerlingnummer">
<hr class="bg-light mb-3">
<label for="">Password:</label>
<input type="password" class="form-control mb-3 login" name="password" id="password"
placeholder="Enter password">
<hr class="bg-light mb-3">
<button class="btn-primary btn float-right" id="save">Save</button>
<div class="material-switch pull-right enable">
<input id="switch" type="checkbox">
<label for="switch" class="label-primary"></label>
</div>
</div>
</div>
</div>
</div>
<script src="/js/save.js"></script>
</body>
</html>
Loading…
Cancel
Save