sshm0/index.html at main · DimitriGilbert/sshm0 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <!-- BOOTSTRAP -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"
    crossorigin="anonymous" referrerpolicy="no-referrer" />
  <!-- Code input -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/WebCoder49/code-input@1.5.1/code-input.min.css"
    crossorigin="anonymous" referrerpolicy="no-referrer" />
  <link id="import-theme" rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/themes/prism-okaidia.css" crossorigin="anonymous"
    referrerpolicy="no-referrer" />
  <!-- bootswatch theme -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/5.3.0/solar/bootstrap.min.css"
    crossorigin="anonymous" referrerpolicy="no-referrer" />
    <style>
      form > pre {
        font-size: 1.2rem !important;
      }
      .pa-answer {
        margin-bottom: 2rem;
      }
    </style>
  <title>sshm0</title>
</head>

<body>
  <div class="container">
    <h1>sshm0</h1>
    <div class="navbar navbar-expand-lg navbar-dark bg-dark sticky-top">
      <nav class="nav nav-tabs">
        <a href="#" class="nav-link active" id="nav-about" navTo="about">About</a>
        <a href="#" class="nav-link" id="nav-cmdform" navTo="cmdform">Command line generation form</a>
        <a id="nav-github" href="https://github.com/DimitriGilbert/sshm0" target="_blank">
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="40" height="40">
            <path
              d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z">
            </path>
          </svg>
        </a>
      </nav>
    </div>
    <div id="pa-about" class="pa-tab">
      <h2>What is sshm0 ?</h2>
      <div class="row justify-content-between pa-answer">
        It is a terminal based ssh connection manager, like Putty, but no gui ;).
        <br>
        Just like ssh, you can execute stuff directly (just put your command at the end), and the `cp` command is a wrapper for scp.
      </div>
      <h2>TLDR</h2>
      <div class="row justify-content-between pa-answer">
        <code-input># download the install script
curl -s https://raw.githubusercontent.com/DimitriGilbert/sshm0/main/utils/get_sshm0 -O;
# make it executable
chmod +x get_sshm0;
# install
./get_sshm0 --install;
# source bashrc, only needed once, modify according to your shell (if you don't know, it's the good one :D)
source "$HOME/.bashrc"

# create a server with password auth
sshm0 add my-server 192.168.1.25 my-user --auth password --password my-password
# connect to it
sshm0 connect my-server

# create a server with key auth on port 42069
sshm0 add my-server 192.168.1.25 my-user --auth key --key /path/to/my/key --port 42069
</code-input>
      </div>
      <h2>Backstory, maybe ?</h2>
      <div class="row justify-content-between pa-answer">
        <div class="col-8">
          A long time ago, in a galaxy far far away, I used to use windows (do not judge me, I am sure you have a bootable partition somewhere !), and for ssh, there was Putty.
          <br>
          Naturaly, while switching to a non crippling operating system, I was on the look for an alternative ssh connection manager and stumbled upon gnome-connection-manager, but it died...
          <br>
          I then just set to remember all IP addresses and ports and passwords, or key files and I never spent time lookiong for that, ever, truth ! I swear !
          <br>
          When someday I created [parseArger](https://github.com/DimitriGilbert/parseArger) and needed a project to test it on, and eventhough it was not a pain at all to manage my ssh connection (I promise it was not !), I thought, why not try to build something, and here we are !
          <br>
          More usefull then a standard `hello-world` project, and I can use it everyday !
        </div>
        <div class="col-3">
          <!-- <img src="https://media.tenor.com/h7pTjqI3gskAAAAM/wow-hillary-clinton.gif" alt="You made this, I made this" class="img-fluid">
          <a href="https://tenor.com/view/wow-hillary-clinton-amused-gif-5925072" target="_blank" rel="noopener noreferrer">Source</a> -->
        </div>
      </div>

      <h2>How do I install ?</h2>
      <div class="row justify-content-between pa-answer">
        There is a script for that !, just open up a terminal and run the following command :
        <code-input># download the install script
curl -s https://raw.githubusercontent.com/DimitriGilbert/sshm0/main/utils/get_sshm0 -O;
# Friendly reminder to please read scripts before running them on your machine, (you 'll) thank you !
cat get_sshm0;
# make it executable
chmod +x get_sshm0;
# standard install
./get_sshm0 --install;
# installer help
./get_sshm0 --help;
        </code-input>
      </div>

      <h2>How do I use it ?</h2>
      <div class="row justify-content-between pa-answer">
        <h3>add</h3>
        <code-input># no thrill
sshm0 add my-server 192.168.1.25 my-user

# password auth
sshm0 add my-server 192.168.1.25 my-user --auth password --password my-password

# key auth
sshm0 add my-server 192.168.1.25 my-user --auth key --key /path/to/my/key

# use port other than 22
sshm0 add my-server 192.168.1.25 my-user --port 42069
        </code-input>
        <h3>connect</h3>
        <code-input># connect to my-server added previously
sshm0 connect my-server

# execute a command
sshm0 connect my-server ls -la

# cd a directory before REPL
sshm0 connect my-server --cd /path/to/my/dir
# cd a directory before executing
sshm0 connect my-server --cd /path/to/my/dir ls -la

# execute before REPL
sshm0 connect my-server --exec-before "mkdir dummy_directory" ls -la
        </code-input>
      </div>
    </div>
    <div id="pa-cmdform" class="pa-tab d-none">

    </div>
    <script type="text/javascript">
      function sshm0_parse(__form) {
        let sshm0_frm = new FormData(__form);
        let out = 'sshm0';
        for (const inp of sshm0_frm.keys()) {
          const ielt = document.getElementById(inp);
          switch (ielt.getAttribute('pa-type')) {
            case 'pos':
              out += ' "' + sshm0_frm.get(inp) + '"';
              break;
            case 'opt':
              if (sshm0_frm.get(inp) !== '') {
                if (ielt.hasAttribute('pa-repeat')) {
                  for (const val of sshm0_frm.get(inp).split(`\n`)) {
                    out += ' --' + inp + ' "' + val + '"';
                  }
                } else {
                  out += ' --' + inp + ' ' + sshm0_frm.get(inp);
                }
              }
              break;
            case 'flag':
              if (ielt.checked === true) {
                out += ' --' + inp;
              } else {
                out += ' --no-' + inp;
              }
              break;
          }
        }
        document.getElementById('sshm0_result').innerHTML = out;
      }
      document.getElementById('sshm0').addEventListener('submit', function (e) {
        e.preventDefault();
        e.target.checkValidity();
        sshm0_parse(e.target);
      });
    </script>
  </div>
  <script>
    function navTo(where) {
      document.querySelectorAll(".nav-link").forEach((el) => {
        el.classList.remove("active");
      });
      document.querySelector("#nav-" + where).classList.add("active");
      document.querySelectorAll(".pa-tab").forEach((el) => {
        el.classList.add("d-none");
      });
      document
        .querySelector("#pa-" + where)
        .classList.remove("d-none");
    }
  </script>
  <script id="js-init">

    window.addEventListener("load", () => {
      codeInput.registerTemplate(
        "code-input",
        codeInput.templates.prism(Prism, [new codeInput.plugins.Indent()])
      );

      // initializing navigation
      document
        .querySelectorAll("[navTo]")
        .forEach((el) => {
          el.addEventListener("click", evt => {
            navTo(evt.target.getAttribute("navTo"));
          })
        });
    });
  </script>
  <!-- bootstrap -->
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"
    crossorigin="anonymous"></script>
  <!-- code-input -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/components/prism-core.min.js"
    crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.23.0/plugins/autoloader/prism-autoloader.min.js"
    crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/gh/WebCoder49/code-input@1.5.1/code-input.min.js"
    crossorigin="anonymous"></script>
  <script src="https://cdn.jsdelivr.net/gh/WebCoder49/code-input@1.5.1/plugins/indent.js"
    crossorigin="anonymous"></script>
</body>

</html>