<template> | |
<div id="app" class="container-fluid"> | |
<nav class="navbar navbar-light bg-light"> | |
<div class="container"> | |
<a class="navbar-brand" href="#"> | |
<img src="./assets/logo.png" width="10%" height="10%" class="d-inline-block align-top" type="button" data-toggle="modal" data-target="#myModal"> | |
</a> | |
</div> | |
</nav> | |
<div class="input-group mb-3" v-if="unlocked_"> | |
<textarea class="form-control" id="exampleFormControlTextarea1" v-model="inputField" v-on:keyup.enter="save" v-on:click="update" width="50%" height="50%" rows="20"></textarea> | |
<div class="input-group-append"> | |
<button class="btn btn-outline-primary" type="button" v-on:click="save">SAVE</button> | |
</div> | |
</div> | |
<!-- The Modal --> | |
<div class="modal" id="myModal"> | |
<div class="modal-dialog"> | |
<div class="modal-content"> | |
<!-- Modal body --> | |
<div class="modal-body"> | |
<div class="input-group"> | |
<input id="password" type="password" v-model="password" class="form-control" name="password" placeholder="Password"> | |
</div> | |
</div> | |
<!-- Modal footer --> | |
<div class="modal-footer"> | |
<button type="button" class="btn btn-success col-12 text-center" data-dismiss="modal" v-on:click="unlock">DECRYPT</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
</div> | |
</template> | |
<script> | |
var CryptoJS = require("crypto-js"); | |
import Cookies from 'js-cookie' | |
var fb = require('./store.js'); | |
if (Cookies.get('key_')) { | |
var unlocked = true; | |
var key_ = Cookies.get('key_'); | |
} else if (!Cookies.get('key_')) { | |
var unlocked = false; | |
var key_ = null; | |
alert("¯\_(ツ)_/¯") | |
} | |
var inputField_; | |
export default { | |
name: 'App', | |
beforeCreate() { | |
fb.db.collection("bin").doc("paste") | |
.onSnapshot(function (doc) { | |
inputField_ = decrypt(doc.data().field); | |
this.inputField = decrypt(doc.data().field); | |
}); | |
}, | |
updated() { | |
inputField_ = this.inputField | |
}, | |
data() { | |
return { | |
unlocked_: unlocked, | |
inputField: inputField_, | |
password: null, | |
} | |
}, | |
methods: { | |
unlock: function (event) { | |
if (checkKey(this.password)) { | |
Cookies.set('key_', this.password, { | |
expires: 365 | |
}) | |
if (this.password) { | |
this.unlocked_ = true; | |
this.decrypted = true; | |
} | |
} | |
}, | |
save: function (event) { | |
// Add a new document in collection "cities" | |
fb.db.collection("bin").doc("paste").set({ | |
field: encrypt(this.inputField) | |
}) | |
.then(function () { | |
console.log("Document successfully written!"); | |
window.navigator.vibrate(200); | |
}) | |
.catch(function (error) { | |
console.error("Error writing document: ", error); | |
}); | |
}, | |
update: function (event) { | |
this.inputField = inputField_ | |
} | |
}, | |
computed: { | |
shit: function () { | |
alert(inputField_) | |
return inputField_; | |
} | |
} | |
} | |
function decrypt(data_) { | |
if (key_) { | |
try { | |
var decrypted = CryptoJS.AES.decrypt(data_, key_); | |
return decrypted.toString(CryptoJS.enc.Utf8); | |
} catch (e) { | |
return data_ | |
console.log(e) | |
} | |
} else { | |
return data_ | |
console.log(e) | |
} | |
} | |
function encrypt(data_) { | |
if (key_) { | |
var encrypted = CryptoJS.AES.encrypt(data_, key_); | |
return encrypted.toString(); | |
} else { | |
return data_ | |
console.log(e) | |
} | |
} | |
function checkKey(input_) { | |
var decrypted = CryptoJS.AES.decrypt('U2FsdGVkX19CZxyjXIRZeb3N+ffdvboRFIyQELM1ab0=', input_); | |
if (decrypted.toString(CryptoJS.enc.Utf8) == "aezakmi") { | |
return true; | |
} | |
} | |
</script> | |
<style> | |
.navbar-brand { | |
width: 100%; | |
left: 0; | |
top: 0; | |
text-align: center; | |
margin: auto; | |
} | |
</style> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment