clean up
This commit is contained in:
parent
24e55d946f
commit
209274018c
694
common.css
694
common.css
@ -1,694 +0,0 @@
|
||||
/*
|
||||
// Sshwifty - A Web SSH client
|
||||
//
|
||||
// Copyright (C) 2019-2023 Ni Rui <ranqus@gmail.com>
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU Affero General Public License as
|
||||
// published by the Free Software Foundation, either version 3 of the
|
||||
// License, or (at your option) any later version.
|
||||
//
|
||||
// This program is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU Affero General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
@import "~normalize.css";
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #444;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 1em;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* Tabs */
|
||||
.tab1 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-items: center;
|
||||
list-style: none;
|
||||
list-style-position: inside;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.tab1 > li {
|
||||
padding: 0 15px;
|
||||
color: #999;
|
||||
white-space: nowrap;
|
||||
word-wrap: none;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
flex: initial;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab1 > li.active {
|
||||
background: #444;
|
||||
}
|
||||
|
||||
.tab1.tab1-list {
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.tab1.tab1-list > li {
|
||||
flex: 0 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-items: center;
|
||||
list-style: none;
|
||||
list-style-position: inside;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
color: #aaa;
|
||||
border-bottom: 1px solid #a56;
|
||||
background: #333;
|
||||
padding: 0 10px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tab2::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
box-shadow: 0 -3px 3px #0003;
|
||||
}
|
||||
|
||||
.tab2 > li {
|
||||
flex: auto;
|
||||
cursor: pointer;
|
||||
border-color: transparent;
|
||||
border-width: 1px 1px 0 1px;
|
||||
border-style: solid;
|
||||
padding: 7px 10px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.tab2 > li.active {
|
||||
color: #fff;
|
||||
background: #644;
|
||||
margin-bottom: -1px;
|
||||
border-color: #a56;
|
||||
border-style: solid;
|
||||
box-shadow: 0 -2px 2px #0002;
|
||||
}
|
||||
|
||||
/* List */
|
||||
.lst-nostyle {
|
||||
list-style: none;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
.hlst {
|
||||
}
|
||||
|
||||
.hlst > li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.lst1 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.lst1 > li {
|
||||
border-bottom: 1px solid #555;
|
||||
}
|
||||
|
||||
.lst1 > li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.lst1 > li .lst-wrap {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.hlst.lstcl1 {
|
||||
list-style: none;
|
||||
list-style-position: inside;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.hlst.lstcl1 > li {
|
||||
width: 33%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hlst.lstcl1 > li .lst-wrap {
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
background: #333;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
box-shadow: 2px 2px 0 0 #222;
|
||||
}
|
||||
|
||||
.hlst.lstcl1 > li .lst-wrap:hover {
|
||||
background: #3a3a3a;
|
||||
box-shadow: 2px 2px 0 0 #222;
|
||||
}
|
||||
|
||||
.hlst.lstcl1 > li .lst-wrap:active {
|
||||
background: #333;
|
||||
}
|
||||
|
||||
.hlst.lstcl2 {
|
||||
list-style: none;
|
||||
list-style-position: inside;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.hlst.lstcl2 > li {
|
||||
width: 33%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hlst.lstcl2 > li .lst-wrap {
|
||||
padding: 10px;
|
||||
margin: 5px;
|
||||
background: #333;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Icon */
|
||||
.icon {
|
||||
line-height: 1;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.icon.icon-close1 {
|
||||
margin-top: -2.5px;
|
||||
font-size: 26px;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.icon.icon-close1::before {
|
||||
content: "\00d7";
|
||||
font-weight: bold;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.icon.icon-plus1 {
|
||||
color: #fff;
|
||||
background: #a56;
|
||||
}
|
||||
|
||||
.icon.icon-plus1::before {
|
||||
content: "+";
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.icon.icon-more1 {
|
||||
color: #fff;
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.icon.icon-more1::before {
|
||||
content: "\2261";
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.icon.icon-warning1 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.icon.icon-warning1::after {
|
||||
content: "!";
|
||||
font-weight: bold;
|
||||
background: #e11;
|
||||
padding: 3px 13px;
|
||||
}
|
||||
|
||||
.icon.icon-point1 {
|
||||
position: relative;
|
||||
text-shadow: 0 0 3px #fff;
|
||||
}
|
||||
|
||||
.icon.icon-point1::after {
|
||||
content: "\25CF";
|
||||
}
|
||||
|
||||
.icon.icon-keyboardkey1 {
|
||||
background: #fff;
|
||||
color: #999;
|
||||
padding: 4px 6px;
|
||||
display: inline-block;
|
||||
border-radius: 3px;
|
||||
box-shadow: 1px 1px 0 2px #0003;
|
||||
}
|
||||
|
||||
.icon.icon-iconed-bottom1 {
|
||||
padding: 4px 6px;
|
||||
display: inline-block;
|
||||
border-radius: 3px;
|
||||
text-align: center;
|
||||
}
|
||||
.icon.icon-iconed-bottom1 > i {
|
||||
font-style: normal;
|
||||
display: block;
|
||||
margin: 3px;
|
||||
font-size: 2em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
/* Windows */
|
||||
.window {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.window.window1 {
|
||||
background: #a56;
|
||||
box-shadow: 0 0 5px #0006;
|
||||
color: #fff;
|
||||
font-size: 1em;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.window.window1.display {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.window.window1::before {
|
||||
top: -5px;
|
||||
position: absolute;
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #a56;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.window.window1 .window-frame {
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.window.window1 .window-title {
|
||||
font-size: 0.9em;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
color: #e9a;
|
||||
}
|
||||
|
||||
.window.window1 .window-close {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
border-color: #844;
|
||||
cursor: pointer;
|
||||
}
|
||||
.window.window1 .window-close::after {
|
||||
border-color: #844;
|
||||
}
|
||||
|
||||
/* Form1 */
|
||||
.form1 {
|
||||
}
|
||||
|
||||
.form1 > fieldset,
|
||||
.form1 > fieldset * {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
color: #fff;
|
||||
outline: none;
|
||||
border: 0;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field {
|
||||
color: #ccc;
|
||||
display: block;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.horizontal {
|
||||
width: auto;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .items {
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.horizontal.item {
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.horizontal:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field,
|
||||
.form1 > fieldset .field input,
|
||||
.form1 > fieldset .field select,
|
||||
.form1 > fieldset .field textarea,
|
||||
.form1 > fieldset .field button {
|
||||
vertical-align: middle;
|
||||
font-size: 1.05em;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field {
|
||||
font-size: 0.95em;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .textinfo {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .textinfo > .info {
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
font-size: 1.1em;
|
||||
background: #292929;
|
||||
border: 1px solid #444;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input,
|
||||
.form1 > fieldset .field > select,
|
||||
.form1 > fieldset .field > textarea,
|
||||
.form1 > fieldset .field > button {
|
||||
box-sizing: border-box;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input::placeholder {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input:focus::placeholder {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input[type="text"],
|
||||
.form1 > fieldset .field > input[type="file"],
|
||||
.form1 > fieldset .field > input[type="email"],
|
||||
.form1 > fieldset .field > input[type="number"],
|
||||
.form1 > fieldset .field > input[type="search"],
|
||||
.form1 > fieldset .field > input[type="tel"],
|
||||
.form1 > fieldset .field > input[type="url"],
|
||||
.form1 > fieldset .field > input[type="password"],
|
||||
.form1 > fieldset .field > select,
|
||||
.form1 > fieldset .field > textarea {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: 0;
|
||||
background: #2e2e2e;
|
||||
margin-top: 5px;
|
||||
border-bottom: 2px solid #3e3e3e;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > textarea {
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.error > .error {
|
||||
margin-top: 5px;
|
||||
color: #f55;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .message {
|
||||
margin-top: 5px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .message * {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .message > p {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > .message > a {
|
||||
color: #e9a;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.highlight > input[type="text"],
|
||||
.form1 > fieldset .field.highlight > input[type="file"],
|
||||
.form1 > fieldset .field.highlight > input[type="email"],
|
||||
.form1 > fieldset .field.highlight > input[type="number"],
|
||||
.form1 > fieldset .field.highlight > input[type="search"],
|
||||
.form1 > fieldset .field.highlight > input[type="tel"],
|
||||
.form1 > fieldset .field.highlight > input[type="url"],
|
||||
.form1 > fieldset .field.highlight > input[type="password"],
|
||||
.form1 > fieldset .field.highlight > select,
|
||||
.form1 > fieldset .field.highlight > textarea {
|
||||
background: #666;
|
||||
border-bottom: 2px solid #ccc;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field.error > input[type="text"],
|
||||
.form1 > fieldset .field.error > input[type="file"],
|
||||
.form1 > fieldset .field.error > input[type="email"],
|
||||
.form1 > fieldset .field.error > input[type="number"],
|
||||
.form1 > fieldset .field.error > input[type="search"],
|
||||
.form1 > fieldset .field.error > input[type="tel"],
|
||||
.form1 > fieldset .field.error > input[type="url"],
|
||||
.form1 > fieldset .field.error > input[type="password"],
|
||||
.form1 > fieldset .field.error > select,
|
||||
.form1 > fieldset .field.error > textarea {
|
||||
background: #483535;
|
||||
border-bottom: 2px solid #a83333;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input:disabled,
|
||||
.form1 > fieldset .field > select:disabled,
|
||||
.form1 > fieldset .field > textarea:disabled,
|
||||
.form1 > fieldset .field > button:disabled {
|
||||
opacity: 0.35;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input:disabled:active,
|
||||
.form1 > fieldset .field > select:disabled:active,
|
||||
.form1 > fieldset .field > textarea:disabled:active,
|
||||
.form1 > fieldset .field > button:disabled:active {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input[type="checkbox"],
|
||||
.form1 > fieldset .field > input[type="radio"] {
|
||||
background: #2e2e2e;
|
||||
margin: 1px 3px 1px 1px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input[type="checkbox"]:active,
|
||||
.form1 > fieldset .field > input[type="radio"]:active,
|
||||
.form1 > fieldset .field > input[type="checkbox"]:focus,
|
||||
.form1 > fieldset .field > input[type="radio"]:focus {
|
||||
outline: 1px solid #e9a;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > input[type="text"]:focus,
|
||||
.form1 > fieldset .field > input[type="email"]:focus,
|
||||
.form1 > fieldset .field > input[type="number"]:focus,
|
||||
.form1 > fieldset .field > input[type="search"]:focus,
|
||||
.form1 > fieldset .field > input[type="tel"]:focus,
|
||||
.form1 > fieldset .field > input[type="url"]:focus,
|
||||
.form1 > fieldset .field > input[type="password"]:focus,
|
||||
.form1 > fieldset .field > select:focus,
|
||||
.form1 > fieldset .field > textarea:focus {
|
||||
background: #222;
|
||||
border-bottom: 2px solid #e9a;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button {
|
||||
padding: 8px 13px;
|
||||
font-weight: normal;
|
||||
background: #c78;
|
||||
border-color: #c78;
|
||||
border-width: 2px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button:focus,
|
||||
.form1 > fieldset .field > button:hover {
|
||||
border-color: #a56;
|
||||
background: #c78;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button:active {
|
||||
background: #a56;
|
||||
border-color: #a56;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button.secondary {
|
||||
float: right;
|
||||
background: transparent;
|
||||
color: #eee;
|
||||
border-color: #eee;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button.secondary:focus,
|
||||
.form1 > fieldset .field > button.secondary:hover {
|
||||
border-color: #ddd;
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > button.secondary:active {
|
||||
border-color: #666;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions {
|
||||
background: #262626;
|
||||
box-shadow: 0 0 3px #0006;
|
||||
border: 1px solid #666;
|
||||
position: relative;
|
||||
margin: 3px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions::before,
|
||||
.form1 > fieldset .field > ul.input-suggestions::after {
|
||||
top: -5px;
|
||||
left: 5px;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #262626;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions::after {
|
||||
top: -6px;
|
||||
z-index: 0;
|
||||
background: #666;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid #222;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li:hover,
|
||||
.form1 > fieldset .field > ul.input-suggestions > li.current {
|
||||
background: #555;
|
||||
border-bottom: 1px solid #555;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li:first-child:hover::before,
|
||||
.form1
|
||||
> fieldset
|
||||
.field
|
||||
> ul.input-suggestions
|
||||
> li.current:first-child::before {
|
||||
top: -6px;
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
left: 5px;
|
||||
display: block;
|
||||
content: " ";
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background: #555;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li > .sugt-title {
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.form1 > fieldset .field > ul.input-suggestions > li > .sugt-value {
|
||||
color: #fdd;
|
||||
font-size: 0.9em;
|
||||
margin: 0 5px;
|
||||
}
|
||||
54
history.js
54
history.js
@ -1,54 +0,0 @@
|
||||
// Sshwifty - A Web SSH client
|
||||
//
|
||||
// Copyright (C) 2019-2023 Ni Rui <ranqus@gmail.com>
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU Affero General Public License as
|
||||
// published by the Free Software Foundation, either version 3 of the
|
||||
// License, or (at your option) any later version.
|
||||
//
|
||||
// This program is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU Affero General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
export class Records {
|
||||
/**
|
||||
* constructor
|
||||
*
|
||||
* @param {array} data Data space
|
||||
*/
|
||||
constructor(data) {
|
||||
this.data = data;
|
||||
}
|
||||
|
||||
/**
|
||||
* Insert new item into the history records
|
||||
*
|
||||
* @param {number} newData New value
|
||||
*/
|
||||
update(newData) {
|
||||
this.data.shift();
|
||||
this.data.push({ data: newData, class: "" });
|
||||
}
|
||||
|
||||
/**
|
||||
* Set all existing data as expired
|
||||
*/
|
||||
expire() {
|
||||
for (let i = 0; i < this.data.length; i++) {
|
||||
this.data[i].class = "expired";
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Return data
|
||||
*
|
||||
*/
|
||||
get() {
|
||||
return this.data;
|
||||
}
|
||||
}
|
||||
@ -1,58 +0,0 @@
|
||||
// Sshwifty - A Web SSH client
|
||||
//
|
||||
// Copyright (C) 2019-2023 Ni Rui <ranqus@gmail.com>
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU Affero General Public License as
|
||||
// published by the Free Software Foundation, either version 3 of the
|
||||
// License, or (at your option) any later version.
|
||||
//
|
||||
// This program is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU Affero General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
import { History } from "./commands/history.js";
|
||||
|
||||
export function build(ctx) {
|
||||
let rec = [];
|
||||
|
||||
// This renames "knowns" to "sshwifty-knowns"
|
||||
// TODO: Remove this after some few years
|
||||
try {
|
||||
let oldStore = localStorage.getItem("knowns");
|
||||
|
||||
if (oldStore) {
|
||||
localStorage.setItem("sshwifty-knowns", oldStore);
|
||||
localStorage.removeItem("knowns");
|
||||
}
|
||||
} catch (e) {
|
||||
// Do nothing
|
||||
}
|
||||
|
||||
try {
|
||||
rec = JSON.parse(localStorage.getItem("sshwifty-knowns"));
|
||||
|
||||
if (!rec) {
|
||||
rec = [];
|
||||
}
|
||||
} catch (e) {
|
||||
alert("Unable to load data of Known remotes: " + e);
|
||||
}
|
||||
|
||||
return new History(
|
||||
rec,
|
||||
(h, d) => {
|
||||
try {
|
||||
localStorage.setItem("sshwifty-knowns", JSON.stringify(d));
|
||||
ctx.connector.knowns = h.all();
|
||||
} catch (e) {
|
||||
alert("Unable to save remote history due to error: " + e);
|
||||
}
|
||||
},
|
||||
64,
|
||||
);
|
||||
}
|
||||
@ -1,223 +0,0 @@
|
||||
// Sshwifty - A Web SSH client
|
||||
//
|
||||
// Copyright (C) 2019-2023 Ni Rui <ranqus@gmail.com>
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU Affero General Public License as
|
||||
// published by the Free Software Foundation, either version 3 of the
|
||||
// License, or (at your option) any later version.
|
||||
//
|
||||
// This program is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU Affero General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
import * as history from "./history.js";
|
||||
import { ECHO_FAILED } from "./socket.js";
|
||||
|
||||
export function build(ctx) {
|
||||
const connectionStatusNotConnected = "Sshwifty is ready to connect";
|
||||
const connectionStatusConnecting =
|
||||
"Connecting to Sshwifty backend server. It should only take " +
|
||||
"less than a second, or two";
|
||||
const connectionStatusDisconnected =
|
||||
"Sshwifty is disconnected from it's backend server";
|
||||
const connectionStatusConnected =
|
||||
"Sshwifty is connected to it's backend server, user interface operational";
|
||||
const connectionStatusUnmeasurable =
|
||||
"Unable to measure connection delay. The connection maybe very " +
|
||||
"busy or already lost";
|
||||
|
||||
const connectionDelayGood =
|
||||
"Connection delay is low, operation should be very responsive";
|
||||
const connectionDelayFair =
|
||||
"Experiencing minor connection delay, operation should be responded " +
|
||||
"within a reasonable time";
|
||||
const connectionDelayMedian =
|
||||
"Experiencing median connection delay, consider to slow down your input " +
|
||||
"to avoid misoperation";
|
||||
const connectionDelayHeavy =
|
||||
"Experiencing bad connection delay, operation may freeze at any moment. " +
|
||||
"Consider to pause your input until remote is responsive";
|
||||
|
||||
const buildEmptyHistory = () => {
|
||||
let r = [];
|
||||
|
||||
for (let i = 0; i < 32; i++) {
|
||||
r.push({ data: 0, class: "" });
|
||||
}
|
||||
|
||||
return r;
|
||||
};
|
||||
|
||||
let isClosed = false,
|
||||
inboundPerSecond = 0,
|
||||
outboundPerSecond = 0,
|
||||
trafficPreSecondNextUpdate = new Date(),
|
||||
inboundPre10Seconds = 0,
|
||||
outboundPre10Seconds = 0,
|
||||
trafficPre10sNextUpdate = new Date(),
|
||||
inboundHistory = new history.Records(buildEmptyHistory()),
|
||||
outboundHistory = new history.Records(buildEmptyHistory()),
|
||||
trafficSamples = 0;
|
||||
|
||||
let delayHistory = new history.Records(buildEmptyHistory()),
|
||||
delaySamples = 0,
|
||||
delayPerInterval = 0;
|
||||
|
||||
return {
|
||||
update(time) {
|
||||
if (isClosed) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (time >= trafficPreSecondNextUpdate) {
|
||||
trafficPreSecondNextUpdate = new Date(time.getTime() + 1000);
|
||||
inboundPre10Seconds += inboundPerSecond;
|
||||
outboundPre10Seconds += outboundPerSecond;
|
||||
|
||||
this.status.inbound = inboundPerSecond;
|
||||
this.status.outbound = outboundPerSecond;
|
||||
|
||||
inboundPerSecond = 0;
|
||||
outboundPerSecond = 0;
|
||||
|
||||
trafficSamples++;
|
||||
}
|
||||
|
||||
if (time >= trafficPre10sNextUpdate) {
|
||||
trafficPre10sNextUpdate = new Date(time.getTime() + 10000);
|
||||
|
||||
if (trafficSamples > 0) {
|
||||
inboundHistory.update(inboundPre10Seconds / trafficSamples);
|
||||
outboundHistory.update(outboundPre10Seconds / trafficSamples);
|
||||
|
||||
inboundPre10Seconds = 0;
|
||||
outboundPre10Seconds = 0;
|
||||
trafficSamples = 0;
|
||||
}
|
||||
|
||||
if (delaySamples > 0) {
|
||||
delayHistory.update(delayPerInterval / delaySamples);
|
||||
|
||||
delaySamples = 0;
|
||||
delayPerInterval = 0;
|
||||
}
|
||||
}
|
||||
},
|
||||
classStyle: "",
|
||||
windowClass: "",
|
||||
message: "",
|
||||
status: {
|
||||
description: connectionStatusNotConnected,
|
||||
delay: 0,
|
||||
delayHistory: delayHistory.get(),
|
||||
inbound: 0,
|
||||
inboundHistory: inboundHistory.get(),
|
||||
outbound: 0,
|
||||
outboundHistory: outboundHistory.get(),
|
||||
},
|
||||
connecting() {
|
||||
isClosed = false;
|
||||
|
||||
this.message = "--";
|
||||
this.classStyle = "working";
|
||||
this.windowClass = "";
|
||||
this.status.description = connectionStatusConnecting;
|
||||
},
|
||||
connected() {
|
||||
isClosed = false;
|
||||
|
||||
this.message = "??";
|
||||
this.classStyle = "working";
|
||||
this.windowClass = "";
|
||||
this.status.description = connectionStatusConnected;
|
||||
},
|
||||
traffic(inb, outb) {
|
||||
inboundPerSecond += inb;
|
||||
outboundPerSecond += outb;
|
||||
},
|
||||
echo(delay) {
|
||||
delayPerInterval += delay > 0 ? delay : 0;
|
||||
delaySamples++;
|
||||
|
||||
if (delay == ECHO_FAILED) {
|
||||
this.status.delay = -1;
|
||||
this.message = "";
|
||||
this.classStyle = "red flash";
|
||||
this.windowClass = "red";
|
||||
this.status.description = connectionStatusUnmeasurable;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
let avgDelay = Math.round(delayPerInterval / delaySamples);
|
||||
|
||||
this.message = Number(avgDelay).toLocaleString() + "ms";
|
||||
this.status.delay = avgDelay;
|
||||
|
||||
if (avgDelay < 30) {
|
||||
this.classStyle = "green";
|
||||
this.windowClass = "green";
|
||||
this.status.description =
|
||||
connectionStatusConnected + ". " + connectionDelayGood;
|
||||
} else if (avgDelay < 100) {
|
||||
this.classStyle = "yellow";
|
||||
this.windowClass = "yellow";
|
||||
this.status.description =
|
||||
connectionStatusConnected + ". " + connectionDelayFair;
|
||||
} else if (avgDelay < 300) {
|
||||
this.classStyle = "orange";
|
||||
this.windowClass = "orange";
|
||||
this.status.description =
|
||||
connectionStatusConnected + ". " + connectionDelayMedian;
|
||||
} else {
|
||||
this.classStyle = "red";
|
||||
this.windowClass = "red";
|
||||
this.status.description =
|
||||
connectionStatusConnected + ". " + connectionDelayHeavy;
|
||||
}
|
||||
},
|
||||
close(e) {
|
||||
isClosed = true;
|
||||
delayHistory.expire();
|
||||
inboundHistory.expire();
|
||||
outboundHistory.expire();
|
||||
|
||||
ctx.connector.inputting = false;
|
||||
|
||||
if (e === null) {
|
||||
this.message = "";
|
||||
this.classStyle = "";
|
||||
this.status.description = connectionStatusDisconnected;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
this.status.delay = -1;
|
||||
this.message = "ERR";
|
||||
this.classStyle = "red flash";
|
||||
this.windowClass = "red";
|
||||
this.status.description = connectionStatusDisconnected + ": " + e;
|
||||
},
|
||||
failed(e) {
|
||||
isClosed = true;
|
||||
|
||||
ctx.connector.inputting = false;
|
||||
|
||||
if (e.code) {
|
||||
this.message = "E" + e.code;
|
||||
} else {
|
||||
this.message = "E????";
|
||||
}
|
||||
|
||||
this.status.delay = -1;
|
||||
this.classStyle = "red flash";
|
||||
this.windowClass = "red";
|
||||
this.status.description = connectionStatusDisconnected + ". Error: " + e;
|
||||
},
|
||||
};
|
||||
}
|
||||
22
sshwifty.svg
22
sshwifty.svg
@ -1,22 +0,0 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
|
||||
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
|
||||
width="100.000000pt" height="75.000000pt" viewBox="0 0 100.000000 75.000000"
|
||||
preserveAspectRatio="xMidYMid meet">
|
||||
|
||||
<g transform="translate(0.000000,75.000000) scale(0.100000,-0.100000)"
|
||||
fill="#000000" stroke="none">
|
||||
<path d="M104 557 c-62 -43 -85 -82 -89 -154 -6 -87 4 -137 39 -195 33 -56 71
|
||||
-74 95 -45 9 12 4 25 -24 67 -34 50 -35 55 -35 148 l0 96 49 45 c45 43 56 71
|
||||
26 71 -7 0 -35 -15 -61 -33z"/>
|
||||
<path d="M870 575 c-14 -16 -11 -28 24 -120 9 -24 15 -74 16 -126 0 -105 14
|
||||
-127 56 -88 26 23 26 26 20 113 -6 90 -35 176 -73 218 -20 22 -27 22 -43 3z"/>
|
||||
<path d="M251 537 c-59 -72 -51 -266 14 -327 l25 -24 21 20 20 20 -27 47 c-21
|
||||
38 -26 61 -26 117 -1 38 5 83 12 99 20 49 -9 84 -39 48z"/>
|
||||
<path d="M636 511 c-17 -19 -17 -22 9 -65 24 -41 26 -53 23 -133 -3 -84 -2
|
||||
-88 19 -91 49 -7 81 138 49 223 -16 40 -56 85 -76 85 -4 0 -15 -9 -24 -19z"/>
|
||||
<path d="M412 469 c-32 -21 -52 -63 -52 -109 0 -40 63 -94 99 -85 35 8 81 59
|
||||
81 91 0 45 -40 102 -81 117 -9 3 -30 -4 -47 -14z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
54
xhr.js
54
xhr.js
@ -1,54 +0,0 @@
|
||||
// Sshwifty - A Web SSH client
|
||||
//
|
||||
// Copyright (C) 2019-2023 Ni Rui <ranqus@gmail.com>
|
||||
//
|
||||
// This program is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU Affero General Public License as
|
||||
// published by the Free Software Foundation, either version 3 of the
|
||||
// License, or (at your option) any later version.
|
||||
//
|
||||
// This program is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU Affero General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU Affero General Public License
|
||||
// along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
function send(method, url, headers) {
|
||||
return new Promise((res, rej) => {
|
||||
let authReq = new XMLHttpRequest();
|
||||
|
||||
authReq.addEventListener("readystatechange", () => {
|
||||
if (authReq.readyState !== authReq.DONE) {
|
||||
return;
|
||||
}
|
||||
|
||||
res(authReq);
|
||||
});
|
||||
|
||||
authReq.addEventListener("error", (e) => {
|
||||
rej(e);
|
||||
});
|
||||
|
||||
authReq.addEventListener("timeout", (e) => {
|
||||
rej(e);
|
||||
});
|
||||
|
||||
authReq.open(method, url, true);
|
||||
|
||||
for (let h in headers) {
|
||||
authReq.setRequestHeader(h, headers[h]);
|
||||
}
|
||||
|
||||
authReq.send();
|
||||
});
|
||||
}
|
||||
|
||||
export function get(url, headers) {
|
||||
return send("GET", url, headers);
|
||||
}
|
||||
|
||||
export function options(url, headers) {
|
||||
return send("OPTIONS", url, headers);
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user
