markdown.note/note.html

<!DOCTYPE html>
<html>
<head>
  <meta charset='UTF-8'>
  <title>Markdown Note</title>

  <link href='css/markdown/note.css' rel='stylesheet'>
  <link href='css/markdown/themes/basic.css' rel='stylesheet'>

  <script src='js/lib3rd/jquery-2.0.1.min.js'></script>
  <script src='js/lib3rd/showdown.min.js'></script>
  <script src='js/lib3rd/pagedown.js'></script>

  <script src='js/markdown.api.js'></script>
  <script src='js/markdown.lib.js'></script>

  <script src='js/markdown.note.js'></script>
  <script>
    $(document).ready( function () {
       markdown_note_new();
    });
  </script>
</head>
<body>


<table width='100%'>
 <colgroup>
   <col width='50%'>
   <col width='50%'>
 </colgroup>
 <tr>
   <td>
     <!-- first column -->

      <div id='input'>
        <textarea id='note' class='black'></textarea>
      </div>

   </td>
   <td style='vertical-align: top;'>
     <!-- second column -->

      <div id='output' class='markdown'></div>
      <textarea id='output-source' readonly='readonly'></textarea>

   </td>
 </tr>
 <tr>
  <td>
    <!-- first column -->

    <span>
      Use <select id='note-lib'></select>
    </span>

    <a id='output-update' href='#'>[ Update ]</a>
    <a id='input-toggle' href='#'>[ Use White Color Theme ]</a>

     <!-- nb: div will break/start new line -->
     <div id='output-loading'></div>
  </td>
  <td style='vertical-align: top;'>
     <!-- second column -->
     <a id='output-toggle' href='#'>[ Show HTML ]</a>
     
  </td>
 </tr>
</table>

</body>
</html>