<!DOCTYPE html>
<html>

<head>
  <title>{{ .Title }}</title>

  {{ template "header" }}



  <script src="/static/js/jquery.autogrowtextarea.min.js"></script>
  {{if .NoEdit}} {{else}}
  <script src="/static/js/websockets.js"></script> {{end}}

  <script>
    external_ip = '{{ .ExternalIP }}'
    title_name = '{{ .Title }}'
    socketType = '{{ .SocketType }}'
  </script>



  <style type="text/css">
    textarea {
      width: 100%;
      margin: 5px 0;
      padding: 10px;
      border: none;
      overflow: auto;
      outline: none;
      font-size: large;
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
      font-family: Tahoma, sans-serif;
    }

    body {
      margin: 0;
      background: #fff;
      max-width: 800px;
      margin: 0 auto;
    }

    @media (min-width: 1200px) {
      .container {
        max-width: 800px;
      }
    }
  </style>
  <script src="/static/js/sweetalert-dev.js"></script>
  <link rel="stylesheet" href="/static/css/sweetalert.css">

</head>

<body>




  <!-- Fixed navbar -->
  <nav class="navbar navbar-default navbar-fixed-bottom">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="/">{{ .Title }} &nbsp;<span id="saveInfo" class="glyphicon" aria-hidden="true"></span></a>
      </div>
      <div id="navbar" class="collapse navbar-collapse">
        <ul class="nav navbar-nav">
          <li class="dropdown active">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" class="active"><span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> Edit <span class="caret"></span></a>
            <ul class="dropdown-menu">
              <li class="dropdown-header">Time edited: {{ .TotalTime }}</li>
              <li role="separator" class="divider"></li>
              <li class="dropdown-header">Other versions</li>
              <li><a href="/{{ .Title }}?version=0">First</a></li>
              {{ range .Versions }}
              <li><a href="/{{ $.Title }}?version={{ .VersionNum }}">{{ .VersionDate }}</a></li>
              {{ end }}
              <li><a href="/{{ .Title }}">Current</a></li>
              <li role="separator" class="divider"></li>
              <li class="dropdown-header">Options</li>
              <li><a href="#" class="postencrypt">Encrypt</a></li>
              <li><a href="#" class="postlock">Lock</a></li>
              <li><a href="#" id="{{ .Title }}" class="deleteable">Erase</a></li>
            </ul>
          </li>
          <li><a href="/{{ .Title }}/view"><span class="glyphicon glyphicon-sunglasses" aria-hidden="true"></span> View</a></li>
          <li><a href="/{{ .Title }}/list"><span class="glyphicon glyphicon-align-left" aria-hidden="true"></span> List</a></li>
          <li><a href="/Help/view"><span class="glyphicon glyphicon-question-sign" aria-hidden="true"></span> Help</a></li>
        </ul>
      </div>
      <!--/.nav-collapse -->
    </div>
  </nav>


  <form action='#' id="emit" method="post" name="emit">

    <div>
      <textarea autofocus rows={{ .NumRows }} class='auto_submit_item' id="emit_data" name="emit_data" placeholder="Start typing, it will save automatically. Go to {{ .ExternalIP }}/{{ .Title }} to reload your note. Do not post anything private since anyone with the URL can access this note.">{{ .CurrentText }}</textarea>
    </div>

  </form>
  <script>
    $(document).ready(function() {
      $("#emit_data").autoGrow();
    });

    $(document).keydown(function(e) {
      if (e.which === 90 && e.ctrlKey && e.shiftKey) {
        console.log('control + shift + z');
        window.location = "/{{ .Title }}/view";
      }
    });

    $(document).keydown(function(e) {
      if (e.which === 76 && e.ctrlKey && e.shiftKey) {
        console.log('control + shift + l');
        window.location = "/{{ .Title }}/list";
      }
    });


        $('.postencrypt').click(function(event) {
          var pass1 = "";
          var pass2 = "";
          event.preventDefault();
          swal({
            title: "Encryption",
            text: "Enter your passphrase:",
            type: "input",
            showCancelButton: true,
            closeOnConfirm: false,
            animation: "slide-from-top",
            inputPlaceholder: "Write something"
          }, function(inputValue) {
            if (inputValue === false) return false;
            if (inputValue === "") {
              swal.showInputError("You need to write something!");
              return false
            }
            pass1 = inputValue;
              swal({
                title: "Encryption",
                text: "Enter your passphrase again:",
                type: "input",
                showCancelButton: true,
                closeOnConfirm: false,
                animation: "slide-from-top",
                inputPlaceholder: "Write something"
              }, function(inputValue) {
                if (inputValue === false) return false;
                if (inputValue === "") {
                  swal.showInputError("You need to write something!");
                  return false
                }
                pass2 = inputValue
                if (pass1 == pass2) {
                  swal("Encryption", "Passwords match!", "success");
                  $.ajax({
                      type: "POST",
                      //the url where you want to sent the userName and password to
                      url: '/{{ .Title }}/encrypt',
                      dataType: 'json',
                      data: JSON.stringify({
                        text: $('#emit_data').val(),
                        password: pass1
                      }),
                      success: function (data) {
                        if (data['success'] == true) {
                          swal("Encryption", "Encrypted!", "success");
                          window.location.href = '/{{ .Title }}/view?noprompt=1';
                        } else {
                          swal("Encryption", "Something went wrong.", "error");
                        }
                      }
                  });
                } else {
                  swal("Encryption", "Passwords do not match.", "error");
                }
              });
          });
        });




            $('.postlock').click(function(event) {
              var pass1 = "";
              var pass2 = "";
              event.preventDefault();
              swal({
                title: "Locking",
                text: "Enter your passphrase:",
                type: "input",
                showCancelButton: true,
                closeOnConfirm: false,
                animation: "slide-from-top",
                inputPlaceholder: "Write something"
              }, function(inputValue) {
                if (inputValue === false) return false;
                if (inputValue === "") {
                  swal.showInputError("You need to write something!");
                  return false
                }
                pass1 = inputValue;
                  swal({
                    title: "Locking",
                    text: "Enter your passphrase again:",
                    type: "input",
                    showCancelButton: true,
                    closeOnConfirm: false,
                    animation: "slide-from-top",
                    inputPlaceholder: "Write something"
                  }, function(inputValue) {
                    if (inputValue === false) return false;
                    if (inputValue === "") {
                      swal.showInputError("You need to write something!");
                      return false
                    }
                    pass2 = inputValue
                    if (pass1 == pass2) {
                      swal("Locking", "Passwords match!", "success");
                      $.ajax({
                          type: "POST",
                          //the url where you want to sent the userName and password to
                          url: '/{{ .Title }}/lock',
                          dataType: 'json',
                          data: JSON.stringify({
                            text: $('#emit_data').val(),
                            password: pass1
                          }),
                          success: function (data) {
                            if (data['success'] == true) {
                              swal("Locking", "Page locked!", "success");
                              window.location.href = '/{{ .Title }}/view';
                            } else {
                              swal("Locking", "Something went wrong.", "error");
                            }
                          }
                      });
                    } else {
                      swal("Encryption", "Passwords do not match.", "error");
                    }
                  });
              });
            });

    $('.deleteable').click(function(event) {
      event.preventDefault();
      var deleteName = $(this).attr('id')
      var href = $(this).attr('href')
      swal({
        title: "Are you sure?",
        text: "You will not be able to recover /{{ .Title }}!",
        type: "warning",
        showCancelButton: true,
        confirmButtonColor: "#DD6B55",
        confirmButtonText: "Yes, delete it!",
        closeOnConfirm: false
      }, function() {
        $.ajax({
          url: "/deletepage" + '?' + $.param({
            "DeleteName": deleteName,
            "AdminKey": "none"
          }),
          type: 'DELETE',
          success: function() {
            swal("Deleted!", "/{{ .Title }} has been deleted.", "success");
            setTimeout(function() {
              window.location.reload(true);
            }, 1000);

          }
        });

      });


    });
  </script>


</body>

</html>
