293 lines
14 KiB
HTML
293 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
<link rel="icon" type="image/x-icon" href="https://assets-cdn.github.com/favicon.ico">
|
|
|
|
<title>Easy File Encryptor/Decryptor</title>
|
|
|
|
<script src="js/jquery.min.js"></script>
|
|
<script src="js/bootstrap.min.js"></script>
|
|
<script src="js/openpgp.min.js"></script>
|
|
|
|
<script type="text/javascript" src="js/main.js"></script>
|
|
|
|
<link href="./css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="./css/jumbotron-narrow.css" rel="stylesheet">
|
|
<link href="./css/dragAndDrop.css" rel="stylesheet">
|
|
|
|
</head>
|
|
|
|
<body style="color: #4a4a4a">
|
|
|
|
<div class="container">
|
|
<div class="header clearfix">
|
|
<nav>
|
|
<ul class="nav nav-pills pull-right">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="" onclick="window.location.reload(true)">Refresh</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="https://github.com/pRizz/Easy-File-Encryptor-Decryptor">Source</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<h3 class="text-muted">Easy File Encryptor/Decryptor</h3>
|
|
</div>
|
|
<div class="row marketing">
|
|
<div class="col-md-6">
|
|
<div class="panel panel-primary" style="text-align: center">
|
|
<div class="panel-heading">
|
|
<h2><strong>Encrypt</strong> your text</h2>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div class="form-group">
|
|
<h3>Write your text here</h3>
|
|
<textarea class="form-control" id="dataToEncrypt" rows="3"></textarea>
|
|
</div>
|
|
<div class="form-group">
|
|
<h3>Encrypt with Password</h3>
|
|
<input type="password" class="form-control input-lg" id="dataToEncryptPassword" placeholder="Password">
|
|
</div>
|
|
<a id="encryptLink" role="button" class="btn btn-success btn-lg btn-block" onclick="encryptData()">
|
|
Encrypt
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-primary" style="text-align: center">
|
|
<div class="panel-heading">
|
|
<h2><strong>Encrypt</strong> your text file</h2>
|
|
</div>
|
|
<div class="panel-body">
|
|
<form id="fileToEncryptForm" novalidate class="box">
|
|
<div class="box__input">
|
|
<svg class="box__icon" xmlns="http://www.w3.org/2000/svg" width="50" height="43" viewBox="0 0 50 43"><path d="M48.4 26.5c-.9 0-1.7.7-1.7 1.7v11.6h-43.3v-11.6c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v13.2c0 .9.7 1.7 1.7 1.7h46.7c.9 0 1.7-.7 1.7-1.7v-13.2c0-1-.7-1.7-1.7-1.7zm-24.5 6.1c.3.3.8.5 1.2.5.4 0 .9-.2 1.2-.5l10-11.6c.7-.7.7-1.7 0-2.4s-1.7-.7-2.4 0l-7.1 8.3v-25.3c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v25.3l-7.1-8.3c-.7-.7-1.7-.7-2.4 0s-.7 1.7 0 2.4l10 11.6z"></path></svg>
|
|
<input type="file" name="files[]" id="file" class="box__file" data-multiple-caption="{count} files selected" multiple />
|
|
<label for="file"><strong>Choose a file</strong><span class="box__dragndrop"> or drag it here</span>.</label>
|
|
</div>
|
|
<div class="box__success">Done! <a href="https://css-tricks.com/examples/DragAndDropFileUploading//?" class="box__restart" role="button">Upload more?</a></div>
|
|
<div class="box__error">Error! <span></span>. <a href="https://css-tricks.com/examples/DragAndDropFileUploading//?" class="box__restart" role="button">Try again!</a></div>
|
|
</form>
|
|
<div class="form-group">
|
|
<h3>Encrypt with Password</h3>
|
|
<input type="password" class="form-control input-lg" id="fileToEncryptPassword" placeholder="Password">
|
|
</div>
|
|
<a id="fileEncyrptLink" role="button" class="btn btn-success btn-lg btn-block" onclick="encryptFileData()">
|
|
Encrypt
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="panel panel-primary" style="text-align: center">
|
|
<div class="panel-heading">
|
|
<h2><strong>Decrypt</strong> your file</h2>
|
|
</div>
|
|
<div class="panel-body">
|
|
<form id="fileToDecryptForm" novalidate class="box">
|
|
<div class="box__input">
|
|
<svg class="box__icon" xmlns="http://www.w3.org/2000/svg" width="50" height="43" viewBox="0 0 50 43"><path d="M48.4 26.5c-.9 0-1.7.7-1.7 1.7v11.6h-43.3v-11.6c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v13.2c0 .9.7 1.7 1.7 1.7h46.7c.9 0 1.7-.7 1.7-1.7v-13.2c0-1-.7-1.7-1.7-1.7zm-24.5 6.1c.3.3.8.5 1.2.5.4 0 .9-.2 1.2-.5l10-11.6c.7-.7.7-1.7 0-2.4s-1.7-.7-2.4 0l-7.1 8.3v-25.3c0-.9-.7-1.7-1.7-1.7s-1.7.7-1.7 1.7v25.3l-7.1-8.3c-.7-.7-1.7-.7-2.4 0s-.7 1.7 0 2.4l10 11.6z"></path></svg>
|
|
<input type="file" name="files[]" id="fileToDecryptInput" class="box__file" data-multiple-caption="{count} files selected" multiple />
|
|
<label for="fileToDecryptInput"><strong>Choose a file</strong><span class="box__dragndrop"> or drag it here</span>.</label>
|
|
</div>
|
|
<div class="box__success">Done! <a href="https://css-tricks.com/examples/DragAndDropFileUploading//?" class="box__restart" role="button">Upload more?</a></div>
|
|
<div class="box__error">Error! <span></span>. <a href="https://css-tricks.com/examples/DragAndDropFileUploading//?" class="box__restart" role="button">Try again!</a></div>
|
|
</form>
|
|
<div class="form-group">
|
|
<h3>Decrypt with Password</h3>
|
|
<input type="password" class="form-control input-lg" id="fileToDecryptPassword" placeholder="Password">
|
|
</div>
|
|
<a id="fileDecryptLink" role="button" class="btn btn-success btn-lg btn-block" onclick="decryptFileData('download')">
|
|
⇩ Download Decrypted
|
|
</a>
|
|
<a id="fileViewDecryptedLink" role="button" class="btn btn-success btn-lg btn-block" onclick="decryptFileData('view')">
|
|
🔍 View Decrypted
|
|
</a>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="panel panel-info" id="" style="text-align: center">
|
|
<div class="panel-heading">
|
|
<h2>Secure Usage of this Webapp</h2>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div>
|
|
<h3>
|
|
This webapp does not store or transmit your data. But to be safe, in case of malware, or rogue browser extensions, follow these steps:
|
|
</h3>
|
|
<h3>
|
|
- <a href="https://github.com/pRizz/Easy-File-Encryptor-Decryptor/archive/master.zip">Download this webapp</a> for offline use
|
|
</h3>
|
|
<h3>
|
|
- Disconnect from the internet
|
|
</h3>
|
|
<h3>
|
|
- Open this webapp (the index.html file) in incognito, or private browsing mode, with no extensions, or all extensions disabled
|
|
</h3>
|
|
<h3>
|
|
- Encrypt and Decrypt
|
|
</h3>
|
|
<h3>
|
|
- Quit your browser
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>Benefits of Using this Webapp</h1>
|
|
<h2>
|
|
Simple
|
|
</h2>
|
|
<h3>
|
|
No knowledge of encrypting, decrypting, or the terminal is needed
|
|
</h3>
|
|
<h2>
|
|
Easy to Use
|
|
</h2>
|
|
<h3>
|
|
No need to download external clients or interact with package managers
|
|
</h3>
|
|
<h2>
|
|
Platform Independent
|
|
</h2>
|
|
<h3>
|
|
Works anywhere in any web browser
|
|
</h3>
|
|
<h2>
|
|
Offline Usage
|
|
</h2>
|
|
<h3>
|
|
This webapp does not need internet to work
|
|
</h3>
|
|
<h2>
|
|
Secure
|
|
</h2>
|
|
<h3>
|
|
Uses the PGP standard which has gone through decades of improvements and testing
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>How does this work?</h1>
|
|
<h2>
|
|
Easy File Encryptor/Decryptor utilizes symmetric encryption from the <a href="https://en.wikipedia.org/wiki/Pretty_Good_Privacy">PGP protocol</a>. Your password acts as the symmetric key during the encryption and decryption process.
|
|
</h2>
|
|
<h2>
|
|
The PGP implementation used in this project comes from the open source project <a href="https://github.com/openpgpjs/openpgpjs">OpenPGP.js</a>
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>Encrypting and Decrypting on the Terminal</h1>
|
|
<h2>First, you must install a PGP client on your computer. GNU's implementation, <a href="https://gnupg.org/download/index.html">GPG</a>, is quite popular and available on most common platforms.</h2>
|
|
<h2>Here is how to encrypt files on the terminal</h2>
|
|
<pre class="text-left">
|
|
$ gpg --symmetric file.txt</pre>
|
|
<h2>You are then asked to enter the encryption passphrase.</h2>
|
|
<h2>Decrypting is similar; just pass the encrypted file to gpg</h2>
|
|
<pre class="text-left">
|
|
$ gpg file.txt.pgp</pre>
|
|
<h2>And enter in the passphrase</h2>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>Disclaimer</h1>
|
|
<h2>
|
|
You use this software at your own risk. I, Peter Ryszkiewicz, am not responsible for any misuse or abuse of this software. See the MIT License below for more details.
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>About the Author</h1>
|
|
<h2>
|
|
This project was originally created by Peter Ryszkiewicz (<a href="https://github.com/pRizz">pRizz@Github</a>), software engineer in Chicago, IL. Beware of copycats.
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<h1>About the Project</h1>
|
|
<h2>
|
|
This project is hosted on GitHub at <a href="https://github.com/pRizz/Easy-File-Encryptor-Decryptor">https://github.com/pRizz/Easy-File-Encryptor-Decryptor</a> under the MIT license.
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row marketing text-center">
|
|
<div class="col-md-8 col-md-offset-2">
|
|
<pre>
|
|
MIT License
|
|
|
|
Copyright (c) 2017 Peter Ryszkiewicz
|
|
|
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
of this software and associated documentation files (the "Software"), to deal
|
|
in the Software without restriction, including without limitation the rights
|
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
copies of the Software, and to permit persons to whom the Software is
|
|
furnished to do so, subject to the following conditions:
|
|
|
|
The above copyright notice and this permission notice shall be included in all
|
|
copies or substantial portions of the Software.
|
|
|
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
SOFTWARE.
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
<footer class="footer">
|
|
<p><a href="https://github.com/pRizz/Easy-File-Encryptor-Decryptor">Fork this on GitHub!</a></p>
|
|
<p><a href="https://github.com/pRizz/Easy-File-Encryptor-Decryptor/archive/master.zip">Download this webapp</a> for offline use
|
|
</p>
|
|
<p>
|
|
If you found this useful, consider donating IOTA to:
|
|
</p>
|
|
<pre>ARDPDHLZPQZRDBPKTZBIK9OFKCJMGCHFQJTQEXL9KRIVSHNRGHJCEOCMRFXGJMQXDVGNFTTS9GUIOJXXW9RONFYJKW</pre>
|
|
<p>© Peter Ryszkiewicz 2017</p>
|
|
</footer>
|
|
|
|
<div class="modal fade" id="decryptedTextModal" role="dialog">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title">Decrypted Text</h4>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<pre id="decryptedTextModalBody"></pre>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div> <!-- /container -->
|
|
|
|
</body>
|
|
<script src="js/dragAndDrop.js"></script>
|
|
</html> |