From 7e952ff312f5ab859041651fd647b22a77e98afe Mon Sep 17 00:00:00 2001
From: lance <lance@lzatech.org>
Date: Sun, 10 Mar 2019 23:19:07 -0700
Subject: [PATCH] more hacking...somewhat usable

---
 _includes/create_form.html   |   6 +-
 _includes/response.html      |   6 ++
 _includes/retrieve_form.html |   1 -
 assets/css/main.css          |  26 +++++-
 assets/js/main.js            | 166 +++++++++++++----------------------
 index.html                   |   1 +
 retrieve.html                |   1 +
 7 files changed, 95 insertions(+), 112 deletions(-)
 create mode 100644 _includes/response.html

diff --git a/_includes/create_form.html b/_includes/create_form.html
index 00b8bde..fa04dca 100644
--- a/_includes/create_form.html
+++ b/_includes/create_form.html
@@ -9,11 +9,15 @@
     </div>
     <div class="form-input">
       <input type="text" id="secret-expiration" placeholder="Expiration Date/Time"/>
+      <div class="checkbox">
+        <input type="checkbox" id="secret-expire-on-read">
+        <label for="secret-expire-on-read">Expire on Read</label>
+      </div>
     </div>
     <div class="form-submit">
       <input type="submit" id="secret-submit" value="Create Secret" />
     </div>
   </form>
-  <p id="secret-response"></p>
+
   <a href="/retrieve/"><button class="switch_context">Retrieve Secret -></button></a>
 </div>
diff --git a/_includes/response.html b/_includes/response.html
new file mode 100644
index 0000000..750b535
--- /dev/null
+++ b/_includes/response.html
@@ -0,0 +1,6 @@
+<div id="secret-response" class="hidden">
+  <label for="response-username">Username</label><p id="response-username"></p>
+  <label for="response-password">Password</label><p id="response-password"></p>
+  <label for="response-message">Message</label><p id="response-message"></p>
+  <label for="response-expiration">Expiration</label><p id="response-expiration"></p>
+</div>
diff --git a/_includes/retrieve_form.html b/_includes/retrieve_form.html
index 3b07c7c..63562e7 100644
--- a/_includes/retrieve_form.html
+++ b/_includes/retrieve_form.html
@@ -8,7 +8,6 @@
     </div>
   </form>
   <div>
-    <p id="secret-response"></p>
     <a href="/"><button class="switch_context">Create Secret -></button></a>
   </div>
 </div>
diff --git a/assets/css/main.css b/assets/css/main.css
index a2022da..9a75ac1 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1193,8 +1193,8 @@ input, select, textarea {
 		@media screen and (max-width: 1680px) {
 
 			#footer {
-				bottom: 3.5em;
-				left: 3.5em;
+				bottom: 2em;
+				left: 2em;
 			}
 
 		}
@@ -1229,7 +1229,6 @@ input, select, textarea {
 		}
 
 
-/* Switch Context */
 .switch_context {
 	font-size: 1em;
 	position: absolute;
@@ -1240,5 +1239,24 @@ input, select, textarea {
 }
 
 #secret-response {
-	width: 51%;
+	width: 70%;
+	overflow: auto;
+	border-radius: 8px;
+	border: 1px solid white;
+	background-color: rgb(153, 153, 153, .2);
+	margin-left: .5em;
+	margin-bottom: 2em;
+}
+
+#secret-response p, #secret-response label {
+	margin: 0 !important;
+}
+
+.checkbox {
+	padding: .5em 0 0 1em;
+}
+
+.hidden {
+	visibility: hidden;
+	transition: opacity 2s ease-in-out;
 }
diff --git a/assets/js/main.js b/assets/js/main.js
index ce859c2..f230ee1 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -2,111 +2,65 @@
 # front matter in order to pull in the api endpoint from config
 ---
 
-/*
-	Eventually by HTML5 UP
-	html5up.net | @ajlkn
-	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
 
-(function() {
-
-	"use strict";
-
-	var	$body = document.querySelector('body');
-
-	// Methods/polyfills.
-
-		// classList | (c) @remy | github.com/remy/polyfills | rem.mit-license.org
-			!function(){function t(t){this.el=t;for(var n=t.className.replace(/^\s+|\s+$/g,"").split(/\s+/),i=0;i<n.length;i++)e.call(this,n[i])}function n(t,n,i){Object.defineProperty?Object.defineProperty(t,n,{get:i}):t.__defineGetter__(n,i)}if(!("undefined"==typeof window.Element||"classList"in document.documentElement)){var i=Array.prototype,e=i.push,s=i.splice,o=i.join;t.prototype={add:function(t){this.contains(t)||(e.call(this,t),this.el.className=this.toString())},contains:function(t){return-1!=this.el.className.indexOf(t)},item:function(t){return this[t]||null},remove:function(t){if(this.contains(t)){for(var n=0;n<this.length&&this[n]!=t;n++);s.call(this,n,1),this.el.className=this.toString()}},toString:function(){return o.call(this," ")},toggle:function(t){return this.contains(t)?this.remove(t):this.add(t),this.contains(t)}},window.DOMTokenList=t,n(Element.prototype,"classList",function(){return new t(this)})}}();
-
-		// canUse
-			window.canUse=function(p){if(!window._canUse)window._canUse=document.createElement("div");var e=window._canUse.style,up=p.charAt(0).toUpperCase()+p.slice(1);return p in e||"Moz"+up in e||"Webkit"+up in e||"O"+up in e||"ms"+up in e};
-
-		// window.addEventListener
-			(function(){if("addEventListener"in window)return;window.addEventListener=function(type,f){window.attachEvent("on"+type,f)}})();
-
-	// Play initial animations on page load.
-		window.addEventListener('load', function() {
-			window.setTimeout(function() {
-				$body.classList.remove('is-preload');
-			}, 100);
+$( document ).ready(function(){
+    $('body').removeClass('is-preload');
+});
+
+$('#create-secret').on('submit', function(event) {
+	event.stopPropagation();
+	event.preventDefault();
+	window.setTimeout(function() {
+
+		var data = {
+			username: $('#secret-username').val(),
+			password: $('#secret-password').val(),
+			message: $('#secret-message').val(),
+			expiration: $('#secret-expiration').val(),
+			expire_on_read: $('#secret-expire-on-read')[0].checked
+		}
+
+		$.ajax({
+			method: 'POST',
+			url: '{{ site.secret_endpoint }}',
+			crossDomain: 'true',
+			contentType: 'application/json',
+			data: JSON.stringify(data),
+			success: function (res){
+				$('#create-secret').trigger('reset');
+				$('#secret-response').html('Secret token: ' + res['token']);
+				$('#secret-response').removeClass('hidden');
+			},
+			error: function (res){
+				$('#secret-response').html('Something went wrong: ' + JSON.stringify(res.responseJSON));
+			}
 		});
-
-
-	// (function() {
-	//
-	// })
-
-
-	// Form handling
-		(function() {
-
-			// Vars.
-				var $form = document.querySelectorAll('.secret-form')[0],
-					$message;
-
-			// Bail if addEventListener isn't supported.
-				if (!('addEventListener' in $form))
-					return;
-
-
-				$('#retrieve-secret').on('submit', function(event) {
-					var token = $('#secret-token').val()
-					event.stopPropagation();
-					event.preventDefault();
-					window.setTimeout(function() {
-						$.ajax({
-							method: 'GET',
-							url: '{{ site.secret_endpoint }}?token=' + token,
-							crossDomain: 'true',
-							contentType: 'application/json',
-							success: function (res){
-								$('#retrieve-secret').trigger('reset');
-								$('#secret-response').html('Secret token: ' + JSON.stringify(res));
-							},
-							error: function (res){
-								console.log(res);
-								$('#secret-response').html('failure Something went wrong. Please try again.' + res);
-							}
-						})
-					}, 750)
-				})
-
-			// Events
-				$('#create-secret').on('submit', function(event) {
-					event.stopPropagation();
-					event.preventDefault();
-						window.setTimeout(function() {
-
-							var data = {
-						    username: $('#secret-username').val(),
-						    password: $('#secret-password').val(),
-						    message: $('#secret-message').val(),
-								expiration: $('#secret-expiration').val()
-						  }
-
-						  $.ajax({
-						    method: 'POST',
-						    url: '{{ site.secret_endpoint }}',
-								crossDomain: 'true',
-						    contentType: 'application/json',
-						    data: JSON.stringify(data),
-						    success: function (res){
-									$('#create-secret').trigger('reset');
-									$('#secret-response').html('Secret token: ' + res['token']);
-									// $submit.disabled = true;
-								},
-						    error: function (res){
-									console.log(res);
-									$message._show('failure', 'Something went wrong. Please try again.');
-						    }
-						  });
-
-
-						}, 750);
-
-				});
-
-		})();
-
-})();
+	}, 750);
+});
+
+$('#retrieve-secret').on('submit', function(event) {
+	event.stopPropagation();
+	event.preventDefault();
+	window.setTimeout(function() {
+
+		var token = $('#secret-token').val();
+		
+		$.ajax({
+			method: 'GET',
+			url: '{{ site.secret_endpoint }}?token=' + token,
+			crossDomain: 'true',
+			contentType: 'application/json',
+			success: function (res){
+				$('#retrieve-secret').trigger('reset');
+				$('#secret-response').removeClass('hidden');
+				$('#response-username').html(res['username']);
+				$('#response-password').html(res['password']);
+				$('#response-message').html(res['message']);
+				$('#response-expiration').html(res['expiration']);
+			},
+			error: function (res){
+				$('#secret-response').html('Something went wrong: ' + JSON.stringify(res.responseJSON));
+			}
+		})
+	}, 750);
+});
diff --git a/index.html b/index.html
index bf8b6cb..ee92ff1 100644
--- a/index.html
+++ b/index.html
@@ -9,6 +9,7 @@ description: Generate a new secret using the form below.
 		<div id="bg"></div>
 		{% include header.html %}
 		{% include create_form.html %}
+		{% include response.html %}
 		{% include footer.html %}
 		{% include scripts.html %}
 	</body>
diff --git a/retrieve.html b/retrieve.html
index bf7ee79..577263e 100644
--- a/retrieve.html
+++ b/retrieve.html
@@ -10,6 +10,7 @@ description: Retrieve an existing secret with your token.
 		<div id="bg"></div>
 		{% include header.html %}
 		{% include retrieve_form.html %}
+		{% include response.html %}
 		{% include footer.html %}
 		{% include scripts.html %}
 	</body>