Newer
Older
EmailSender / index.html
0xRoM on 8 Sep 2023 5 KB first commit
<html>
  <head>
    <title>Emailer</title>

    <!-- Meta Tags -->
    <meta charset="UTF-8">
    <meta name="robots" content="index,follow">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="format-detection" content="telephone=no">
    <meta name="description" content="Fill out this form to send email">

    <link rel="stylesheet" href="bootstrap.min.css">
    <link rel="stylesheet" href="style.css">
    <script src="jquery.min.js"></script>
    <script src="bootstrap.min.js"></script>
    <script src="script.js" defer></script>

  </head>
  <body>

    <div class="wrapper">
      <h2 class="mb-3">Send Email</h2>

      <h4 id="result" style="color:red;"></h4>

      <form id="emailForm">
      <!-- Input type text -->
      <div class="form-group row ">
        <label for="pass" class="col-sm-1 col-form-label text-right">Password</label>
        <div class="col-sm-11">
          <input type="password" class="form-control form-control-sm" name="pass" id="pass" placeholder="Password" required>
        </div>
      </div>

      <!-- Input type text -->
      <div class="form-group row ">
        <label for="email" class="col-sm-1 col-form-label text-right">From</label>
        <div class="col-sm-11">
          <input type="email" class="form-control form-control-sm" name="from_email" id="from_email" placeholder="from@place.com" required>
        </div>
      </div>

      <!-- Input type text -->
      <div class="form-group row ">
        <label for="input_id_3" class="col-sm-1 col-form-label text-right">To</label>
        <div class="col-sm-11">
          <input type="email" class="form-control form-control-sm" name="to_email" id="to_email" placeholder="to@place.com" required>
        </div>
      </div>

      <!-- columns -->
      <div class="form-group row">
        <label class="col-sm-1 col-form-label text-right"></label>
        <div class="col-sm-11">
          <div class="header-row">
            <!-- The first header/value/delete form will be added dynamically when you click "Add Header" -->
          </div>
        </div>
      </div>

      <!-- button -->
      <div class="form-group row">
        <label for="button_id_8" class="col-sm-1 col-form-label text-right"></label>
        <div class="col-sm-11">
          <input type="hidden" id="headerCount" name="headerCount" value="0">
          <button type="button" class="btn btn-secondary btn-sm" id="addHeaderButton">Add Header</button>
        </div>
      </div>

      <!-- Input type file -->
      <div class="form-group row ">
        <label for="attachment" class="col-sm-1 col-form-label text-right">File</label>
        <div class="col-sm-11">
          <div class="custom-file">
          <input type="file" class="custom-file-input"  name="attachment" id="attachment">
          <label class="custom-file-label form-control form-control-sm" for="attachment">Choose File</label>
        </div>
        </div>
      </div>

      <!-- Input type text -->
      <div class="form-group row ">
        <label for="input_id_3" class="col-sm-1 col-form-label text-right">Subject</label>
        <div class="col-sm-11">
          <input type="text" class="form-control form-control-sm" name="subject" id="subject" placeholder="summary of email" required>
        </div>
      </div>

      <!-- columns -->
      <div class="form-group row content-form">
        <label class="col-sm-1 col-form-label text-right">Content</label>
        <div class="col-sm-11">
      
        <!-- nav options -->
        <ul class="nav nav-tabs mb-3 shadow-sm" id="pills-tab" role="tablist">
          <li class="nav-item">
            <a class="nav-link active" id="pills-plain-tab" data-toggle="tab" href="#pills-plain" role="tab" aria-controls="pills-plain" aria-selected="true">Plain</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" id="pills-html-tab" data-toggle="tab" href="#pills-html" role="tab" aria-controls="pills-html" aria-selected="false">HTML</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" id="pills-render-tab" data-toggle="tab" href="#pills-render" role="tab" aria-controls="pills-render" aria-selected="false">Render</a>
          </li>
        </ul>

          <!-- content -->
          <div class="tab-content" id="pills-tabContent p-3">
            <!-- 1st card -->
            <div class="tab-pane fade show active" id="pills-plain" role="tabpanel" aria-labelledby="pills-plain-tab">
              <div class="col-md-12 mb-3">
                <textarea class="form-control" rows="8" name="plaintext_content" id="plaintext_content" placeholder="email content goes here..." required></textarea>
              </div>
            </div>
            <!-- 2nd card -->
            <div class="tab-pane fade" id="pills-html" role="tabpanel" aria-labelledby="pills-html-tab">
              <div class="col-md-12 mb-3">
                <textarea class="form-control" rows="8" name="html_content" id="html_content" placeholder="<html>..." ></textarea>
              </div>
            </div>
            <!-- 3nd card -->
            <div class="tab-pane fade third" id="pills-render" style="height:auto; min-height:auto" role="tabpanel" aria-labelledby="pills-render-tab">
              <div class="col-md-12 mb-3">
                <iframe class="form-control resizable-iframe" style="height:auto; min-height:auto" id="iframe_id"></iframe>
              </div>
            </div>
          </div>
        

        </div>
      </div>
        
      <!-- button -->
      <div class="form-group row mt-auto">
        <label for="submit" class="col-sm-1 col-form-label text-right"></label>
        <div class="col-sm-11">
        <button type="button" class="btn btn-primary btn-block btn-sm" name="submit" id="submit"  onclick="submitForm()">Send</button>
        </div>
      </div>

      </form>
    </div>

  </body>
</html>