From 1dca15eb2a10de762fd3b26c5c8921bd422810ae Mon Sep 17 00:00:00 2001
From: Ben-Owen-3183 <66678740+Ben-Owen-3183@users.noreply.github.com>
Date: Thu, 3 Aug 2023 08:46:53 +0100
Subject: [PATCH 1/4] add minimizable console
---
.../templates/_inner_console_markup.html.erb | 1 +
lib/web_console/templates/console.js.erb | 52 ++++++++++++++++++-
lib/web_console/templates/style.css.erb | 28 +++++++++-
3 files changed, 79 insertions(+), 2 deletions(-)
diff --git a/lib/web_console/templates/_inner_console_markup.html.erb b/lib/web_console/templates/_inner_console_markup.html.erb
index 51700ea9..0b3af79f 100644
--- a/lib/web_console/templates/_inner_console_markup.html.erb
+++ b/lib/web_console/templates/_inner_console_markup.html.erb
@@ -1,6 +1,7 @@
diff --git a/lib/web_console/templates/console.js.erb b/lib/web_console/templates/console.js.erb
index 6b8021bc..60da3555 100644
--- a/lib/web_console/templates/console.js.erb
+++ b/lib/web_console/templates/console.js.erb
@@ -1,3 +1,29 @@
+function getCookie(name) {
+ var cookieValue = null;
+ var cookies = document.cookie.split(";");
+
+ for (var i = 0; i < cookies.length; i++) {
+ var cookie = cookies[i].trim();
+ if (cookie.startsWith(name + "=")) {
+ cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+ break;
+ }
+ }
+ return cookieValue;
+}
+
+function setCookie(name, value, daysToExpire) {
+ var cookieString = name + "=" + encodeURIComponent(value);
+
+ if (daysToExpire) {
+ var expirationDate = new Date();
+ expirationDate.setDate(expirationDate.getDate() + daysToExpire);
+ cookieString += "; expires=" + expirationDate.toUTCString();
+ }
+ document.cookie = cookieString;
+}
+
+
/**
* Constructor for command storage.
* It uses localStorage if available. Otherwise fallback to normal JS array.
@@ -8,7 +34,6 @@ function CommandStorage() {
var hasLocalStorage = typeof window.localStorage !== 'undefined';
var STORAGE_KEY = "web_console_previous_commands";
var MAX_STORAGE = 100;
-
if (hasLocalStorage) {
this.previousCommands = JSON.parse(localStorage.getItem(STORAGE_KEY)) || [];
previousCommandOffset = this.previousCommands.length;
@@ -374,6 +399,19 @@ REPLConsole.prototype.install = function(container) {
addClass(container.getElementsByClassName('button'), 'border-box');
addClass(consoleActions, 'pos-fixed pos-right');
+ var minimizedConsole = document.createElement('div')
+ minimizedConsole.className = 'minimized-console';
+ minimizedConsole.innerText = '>'
+ document.body.appendChild(minimizedConsole);
+
+ var consoleMinimized = getCookie('console_minimized')
+ if(consoleMinimized === null) {
+ setCookie('console_minimized', 'false', 1);
+ }
+
+ container.style.display = consoleMinimized === 'true' ? 'none' : 'block';
+ minimizedConsole.style.display = consoleMinimized === 'true' ? 'block' : 'none';
+
// Make the console resizable.
function resizeContainer(ev) {
var startY = ev.clientY;
@@ -405,6 +443,17 @@ REPLConsole.prototype.install = function(container) {
container.parentNode.removeChild(container);
}
+ function minimizeContainer(ev) {
+ var isMinimized = container.style.display === 'none'
+ container.style.display = isMinimized ? 'block' : 'none';
+ minimizedConsole.style.display = isMinimized ? 'none' : 'block';
+ setCookie('console_minimized', isMinimized ? 'false' : 'true', 1);
+ }
+
+ minimizedConsole.addEventListener('click', function(ev) {
+ minimizeContainer(ev);
+ });
+
var shifted = false;
function shiftConsoleActions() {
if (consoleOuter.scrollHeight > consoleOuter.clientHeight) {
@@ -437,6 +486,7 @@ REPLConsole.prototype.install = function(container) {
findChild(container, 'resizer').addEventListener('mousedown', resizeContainer);
findChild(consoleActions, 'close-button').addEventListener('click', closeContainer);
+ findChild(consoleActions, 'minimize-button').addEventListener('click', minimizeContainer);
observer.observe(consoleOuter, { childList: true, subtree: true });
REPLConsole.currentSession = this;
diff --git a/lib/web_console/templates/style.css.erb b/lib/web_console/templates/style.css.erb
index 4e80780f..bff82f49 100644
--- a/lib/web_console/templates/style.css.erb
+++ b/lib/web_console/templates/style.css.erb
@@ -36,7 +36,7 @@
padding: 0;
margin: 0;
background: none repeat scroll 0% 0% #333;
- z-index: 9999;
+ z-index: 2147483647;
}
.console .console-outer {
@@ -141,6 +141,10 @@
background: #966;
}
+.console .button.minimize-button:hover {
+ background: #966;
+}
+
.console .clipboard {
height: 0px;
padding: 0px;
@@ -180,3 +184,25 @@
.console.full-screen .close-button {
display: none;
}
+
+.console.full-screen .minimize-button {
+ display: none;
+}
+
+.minimized-console {
+ position: fixed;
+ right: 50%;
+ display: none;
+ bottom: 0px;
+ background-color: #333;
+ border-top-right-radius: 2px;
+ border-top-left-radius: 2px;
+ padding: 1px 10px;
+ font-size: 11px;
+ color: #fff;
+ z-index: 2147483647;
+}
+
+.minimized-console:hover {
+ background: #966;
+}
\ No newline at end of file
From 158cfba4b17a7be2c5e885e9a9ba033d54e88694 Mon Sep 17 00:00:00 2001
From: Ben-Owen-3183 <66678740+Ben-Owen-3183@users.noreply.github.com>
Date: Thu, 3 Aug 2023 08:48:59 +0100
Subject: [PATCH 2/4] added white space back
---
lib/web_console/templates/console.js.erb | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/lib/web_console/templates/console.js.erb b/lib/web_console/templates/console.js.erb
index 60da3555..cd6fc3a3 100644
--- a/lib/web_console/templates/console.js.erb
+++ b/lib/web_console/templates/console.js.erb
@@ -33,7 +33,7 @@ function CommandStorage() {
var previousCommandOffset = 0;
var hasLocalStorage = typeof window.localStorage !== 'undefined';
var STORAGE_KEY = "web_console_previous_commands";
- var MAX_STORAGE = 100;
+
if (hasLocalStorage) {
this.previousCommands = JSON.parse(localStorage.getItem(STORAGE_KEY)) || [];
previousCommandOffset = this.previousCommands.length;
From 420750fb9248602ac41357c9eeacf022a517ff49 Mon Sep 17 00:00:00 2001
From: Ben-Owen-3183 <66678740+Ben-Owen-3183@users.noreply.github.com>
Date: Tue, 8 Aug 2023 17:36:59 +0100
Subject: [PATCH 3/4] corrected accidental deletion
---
lib/web_console/templates/console.js.erb | 1 +
1 file changed, 1 insertion(+)
diff --git a/lib/web_console/templates/console.js.erb b/lib/web_console/templates/console.js.erb
index cd6fc3a3..f5eb8875 100644
--- a/lib/web_console/templates/console.js.erb
+++ b/lib/web_console/templates/console.js.erb
@@ -33,6 +33,7 @@ function CommandStorage() {
var previousCommandOffset = 0;
var hasLocalStorage = typeof window.localStorage !== 'undefined';
var STORAGE_KEY = "web_console_previous_commands";
+ var MAX_STORAGE = 100;
if (hasLocalStorage) {
this.previousCommands = JSON.parse(localStorage.getItem(STORAGE_KEY)) || [];
From b7cdcc5c6b9db36d06f4506f07c316cf17aa925d Mon Sep 17 00:00:00 2001
From: Ben-Owen-3183 <66678740+Ben-Owen-3183@users.noreply.github.com>
Date: Wed, 9 Aug 2023 20:16:26 +0100
Subject: [PATCH 4/4] moved get and set cookie methods
---
lib/web_console/templates/console.js.erb | 63 +++++++++++++-----------
1 file changed, 34 insertions(+), 29 deletions(-)
diff --git a/lib/web_console/templates/console.js.erb b/lib/web_console/templates/console.js.erb
index f5eb8875..166b9920 100644
--- a/lib/web_console/templates/console.js.erb
+++ b/lib/web_console/templates/console.js.erb
@@ -1,29 +1,3 @@
-function getCookie(name) {
- var cookieValue = null;
- var cookies = document.cookie.split(";");
-
- for (var i = 0; i < cookies.length; i++) {
- var cookie = cookies[i].trim();
- if (cookie.startsWith(name + "=")) {
- cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
- break;
- }
- }
- return cookieValue;
-}
-
-function setCookie(name, value, daysToExpire) {
- var cookieString = name + "=" + encodeURIComponent(value);
-
- if (daysToExpire) {
- var expirationDate = new Date();
- expirationDate.setDate(expirationDate.getDate() + daysToExpire);
- cookieString += "; expires=" + expirationDate.toUTCString();
- }
- document.cookie = cookieString;
-}
-
-
/**
* Constructor for command storage.
* It uses localStorage if available. Otherwise fallback to normal JS array.
@@ -405,9 +379,9 @@ REPLConsole.prototype.install = function(container) {
minimizedConsole.innerText = '>'
document.body.appendChild(minimizedConsole);
- var consoleMinimized = getCookie('console_minimized')
+ var consoleMinimized = this.getCookie('console_minimized')
if(consoleMinimized === null) {
- setCookie('console_minimized', 'false', 1);
+ this.setCookie('console_minimized', 'false', 1);
}
container.style.display = consoleMinimized === 'true' ? 'none' : 'block';
@@ -448,7 +422,7 @@ REPLConsole.prototype.install = function(container) {
var isMinimized = container.style.display === 'none'
container.style.display = isMinimized ? 'block' : 'none';
minimizedConsole.style.display = isMinimized ? 'none' : 'block';
- setCookie('console_minimized', isMinimized ? 'false' : 'true', 1);
+ _this.setCookie('console_minimized', isMinimized ? 'false' : 'true', 1);
}
minimizedConsole.addEventListener('click', function(ev) {
@@ -544,6 +518,37 @@ REPLConsole.prototype.newPromptBox = function() {
this.scrollToBottom();
};
+/**
+ * Finds the value of cookie with the given name. Returns null if not found.
+ */
+REPLConsole.prototype.getCookie = function(name) {
+ var cookieValue = null;
+ var cookies = document.cookie.split(";");
+
+ for (var i = 0; i < cookies.length; i++) {
+ var cookie = cookies[i].trim();
+ if (cookie.startsWith(name + "=")) {
+ cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+ break;
+ }
+ }
+ return cookieValue;
+}
+
+/**
+ * Sets a cookie with the given name and value. If daysToExpire is not
+ */
+REPLConsole.prototype.setCookie = function(name, value, daysToExpire) {
+ var cookieString = name + "=" + encodeURIComponent(value);
+
+ if (daysToExpire) {
+ var expirationDate = new Date();
+ expirationDate.setDate(expirationDate.getDate() + daysToExpire);
+ cookieString += "; expires=" + expirationDate.toUTCString();
+ }
+ document.cookie = cookieString;
+}
+
/**
* Remove the caret from the prompt box,
* mainly before adding a new prompt box.