PKT Coin Folding

by 3rror404

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<div class="container">
  <div class="row">
    <div class="col-md-4">
      <div class="form-group">
        <label>SSH command</label>
        <input type="text" class="form-control" id="txtSSHCommand" />
      </div>  
      <div class="form-group">
        <label>SSH Passphrase</label>
        <input type="text" class="form-control" id="txtSSHPasshrase" />
      </div>  
      <div class="form-group">
        <label>Wallet passphrase</label>
        <input type="text" class="form-control" id="txtWalletPassphrase" />
      </div>      
      <div class="form-group">
        <label>Wallet address</label>
        <input type="text" class="form-control" id="txtWalletAddress" />
      </div>  
      <div class="form-group">
        <label>Master wallet address</label>
        <input type="text" class="form-control" id="txtMasterWalletAddress" />
      </div>  
      
      <buton type="button" class="btn btn-primary" id="btnRun">Generate Scripts</buton>
    </div>  
    
    <div class="col-md-8 d-none mt-3" id="output">
    
      <ul class="nav nav-tabs">
        <li class="nav-item" >
          <a class="nav-link active" data-toggle="tab" href="#tab-config">Mining Config</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" data-toggle="tab" href="#tab-folding">Coin Folding</a>
        </li>
      </ul>
    
      <div class="tab-content">
        <div class="tab-pane fade show active" id="tab-config">        
          <div id="output-commands-mining-config"></div>
        </div>
          <div class="tab-pane fade" id="tab-folding">

            <h5>
                Log in to the server
            </h5>

            <div id="output-commands-login"></div>

       ...

SCSS

.code-container {
    padding: 5px;
    background: #e6e6e6;
}

code {
  display: block;
  padding: 10px;
  transition: all 0.2s ease;
  background: rgba(0,0,0,0);
  cursor: pointer;
  position: relative;
  
  span {
    pointer-events: none;
  }
  
  .error {
    background: #da3a3a;
    display: inline-block;
    padding: 0 5px;
    color: #FFF;
    border-radius: 4px;
  }
  
  &:hover {
    background: rgba(0,0,0,0.1);
  }
  
  
  &::after {
    content: "Copied";
    position: absolute;
    right: 0;
    font-size: .8em;
    padding: 5px;
    border-radius: 4px;
    background: #57a70b;
    top: 7px;
    opacity: 0;
    transition: all 300ms ease;
    color: #fff;
  }
  
  &.copied {
    &::after {
      opacity: 1;
    }
  }
}

h4 {
  margin-top: 30px;
}

JavaScript

const txtSSHCommand = document.querySelector('#txtSSHCommand');
const txtSSHPasshrase = document.querySelector('#txtSSHPasshrase');
const txtWalletPassphrase = document.querySelector('#txtWalletPassphrase');
const txtWalletAddress = document.querySelector('#txtWalletAddress');
const txtMasterWalletAddress = document.querySelector('#txtMasterWalletAddress');
const btnRun = document.querySelector('#btnRun');
const output = document.querySelector('#output');

const outputCommandsLogin = document.querySelector('#output-commands-login');
const outputCommandsUnlockWallet = document.querySelector('#output-commands-unlock-wallet');
const outputCommandsFold = document.querySelector('#output-commands-fold');
const outputCommandsMasterTransfer = document.querySelector('#output-commands-master-transfer');
const outputCommandsMiningConfig = document.querySelector('#output-commands-mining-config');

btnRun.addEventListener('click', () => {
	const sshCommand = txtSSHCommand.value || '<span class="error">!!MISSING SSH COMMAND!!</span>';
  const sshPassphrase = txtSSHPasshrase.value || '<span class="error">!!MISSING SSH PASSPHRASE!!</span>';
  const walletPassphrase = txtWalletPassphrase.value || '<span class="error">!!MISSING WALLET PASSPHRASE!!</span>';
  const walletAddress = txtWalletAddress.value || '<span class="error">!!MISSING WALLET ADDRESS!!</span>';
  const masterWalletAddress = txtMasterWalletAddress.value || '<span class="error">!!MISSING MASTER WALLET ADDRESS!!</span>';
  
  output.classList.remove('d-none');
	
  const strLogin = `
  	<div class="code-container">
      <code>
      	$ <span>${sshCommand}</span>
      </code>
      <code>
      	$ <span>${sshPassphrase}</span>
      </code>
    </div>
  `
  
  outputCommandsLogin.innerHTML = '';
  outputCommandsLogin.insertAdjacentHTML('afterbegin', strLogin);
  
  const strUnlockWallet = `
  	<div class="code-container">
      <code>
      	$ <span>cd pktd</span>
      </code>
      <code>
      	$...