init: add source code and documentation

Signed-off-by: Conrad Zelck <git@simpel.cc>

init: add source code and documentation
5fc5f210 · Conrad Zelck · 899d16d1 · 5fc5f210 · 5fc5f210 · 5fc5f210
Unverified Commit 5fc5f210 authored 3 years ago by Conrad Zelck
--- a/README.md
+++ b/README.md
+# Comment Syntax Finder
+Web page listing inline and block comments for about 150 programming and scripting languages.
+Filter this list with the search input.
+![screenshot](screenshot.png)
+## Remarks
+- search input filters both language and syntax
+- `~` is the replacement for the comment text itself
--- a/comments.csv
+++ b/comments.csv
+ABAP,&quot;
+ABAP,*
+ActionScript,//
+Ada,--
+APL,⍝
+AppleScript,--
+Assembler S/360,*
+Assembler,;
+AutoHotkey,;
+AutoIt,;
+AWK,#
+Bash,#
+Basic Plus,!
+BASIC,REM
+Batch files,::
+Batch files,REM
+BCPL,//
+Bourne shell,#
+C (C99),//
+C shell,#
+C#,//
+C++,//
+Cecil,--
+Cisco IOS,!
+Clojure,;
+cmd.exe,::
+COBOL 2002,*>
+COBOL 90,*>
+COBOL I to COBOL 85,*
+Cobra,#
+CoffeeScript,#
+COMMAND.COM,::
+Common Lisp,;
+Curl,||
+D,//
+DCL,$!
+Dylan,//
+E,#
+Eiffel,--
+Elixir,#
+Emacs Lisp,;
+Erlang,%
+Euphoria,--
+F#,//
+Fish shell,#
+Forth,\
+Fortran I to Fortran 77,C
+Fortran IV to Fortran 77,*
+Fortran,!
+Gambas,'
+GAMS,*
+GNU-bc,#
+GNU-sed,#
+Go,//
+Haskell,--
+Icon,#
+Inform,!
+INI-Datei,;
+Io,#
+Io,//
+J,NB.
+Java,//
+JavaScript,//
+JQuery,//
+Julia,#
+Kotlin,//
+LaTeX,%
+Lisp,;
+Logo,;
+Lua,--
+M4,dnl
+Make,#
+Maple,#
+MATLAB,%
+Mercury,%
+merd,#
+Monkey,'
+MUMPS,;
+Nim,#
+Object Pascal (Delphi),//
+Objective-C,//
+Occam,--
+Oz,%
+PAW,*
+Perl,#
+Perl6,#
+PHP,#
+PHP,//
+Pick Basic,!
+Pick Basic,*
+Pike,//
+PILOT,R:
+Pliant,#
+PostScript,%
+PowerFlex,//
+PowerShell,#
+Prolog,%
+PureScript,--
+Python,#
+R,#
+Raku,#
+Rebol,;
+Red,;
+Ruby,#
+Rust,//
+S-Lang,%
+SASS,//
+Sather,--
+Scala,//
+Scheme,;
+Scilab,//
+Seed7,#
+SGML,--
+SIMULA,--
+Small Basic,'
+SPARK,--
+SQL,--
+Swift,//
+Tcl,#
+TeX,%
+Texinfo,@c
+Texinfo,@comment
+TUTOR,$$
+TUTOR,*
+Unix shell,#
+VBScript,'
+VHDL,--
+Vimscript,&quot;
+Visual Basic,'
+Visual Prolog,%
+Xojo,'
+Xojo,//
+Xojo,rem
+YAML,#
+YCP,//
+Yorick,//
+ActionScript,/* ~ */
+ALGOL 60,comment ~ ;
+ALGOL 68,# ~ #
+ALGOL 68,co ~ co
+ALGOL 68,comment ~ comment
+ALGOL 68,¢ ~ ¢
+ALGOL 68,£ ~ £
+AppleScript,(* ~ *)
+AutoHotkey,/* ~ */
+AutoIt,#comments-start ~ #comments-end
+AutoIt,#cs ~ #ce
+AWK,<# ~ #>
+B,/* ~ */
+Bash,<# ~ #>
+Beta,(* ~ *)
+Bourne shell,<# ~ #>
+C shell,<# ~ #>
+C#,/* ~ */
+C++,/* ~ */
+C,#if 0 ~ #endif
+C,/* ~ */
+CHILL,/* ~ */
+Clojure,(comment ~ )
+Cobra,/# ~ #/
+CoffeeScript,### ~ ###
+ColdFusion,<!--- ~ --->
+CSS,/* ~ */
+Curl,|# ~ #|
+Curl,|TAG# ~ #TAG|
+D,/* ~ */
+D,/+ ~ +/
+Delphi,(* ~ *)
+Delphi,{ ~ }
+Dylan,/* ~ */
+F#,(* ~ *)
+Forth,( ~ )
+GNU-bc,/* ~ */
+Go,/* ~ */
+Handlebars,{{! ~ }}
+Handlebars,{{!-- ~ --}}
+Haskell,{- ~ -}
+HTML,<!-- ~ -->
+Io,/* ~ */
+Java,/* ~ */
+JavaScript,/* ~ */
+JQuery,/* ~ */
+JSP,<%-- ~ --%>
+Julia,#= ~ =#
+Kotlin,/* ~ */
+Lisp,#| ~ |#
+Lua,--[=[ ~ ]=]
+Lua,--[=…=[ ~ ]=…=]
+Lua,--[[ ~ ]]
+Maple,(* ~ *)
+Maple,<# ~ #>
+Mathematica,(* ~ *)
+MATLAB,%{ ~ %}
+Mercury,/* ~ */
+ML,(* ~ *)
+Modula-2,(* ~ *)
+Modula-3,(* ~ *)
+Mustache,{{! ~ }}
+Newspeak,(* ~ *)
+Nim,#[ ~ ]#
+Nunjucks,{# ~ #}
+Oberon,(* ~ *)
+Object Pascal,(* ~ *)
+Object Pascal,{ ~ }
+Objective-C,/* ~ */
+OCaml,(* ~ *)
+Oz,/* ~ */
+Pascal,(* ~ *)
+Pascal,{ ~ }
+Perl,=begin ~ =cut
+Perl,=pod ~ =cut
+Perl6,#[ ~ ]
+Perl6,=pod ~ =cut
+PHP,/* ~ */
+Pike,/* ~ */
+PL/I,/* ~ */
+PLZ/SYS,! ~ !
+PowerShell,<# ~ #>
+Prolog,/* ~ */
+Python,&quot;&quot;&quot; ~ &quot;&quot;&quot;
+Python,''' ~ '''
+R,<# ~ #>
+Racket,#| ~ |#
+Raku,#`( ~ )
+Raku,#`< ~ >
+Raku,#`[ ~ ]
+Raku,#`{ ~ }
+Raku,#`{{ ~ }}
+Rebol,comment [ ~ ]
+Rebol,comment { ~ }
+Red,{ ~ }
+Rexx,/* ~ */
+Ruby,=begin ~ =end
+Rust,/* ~ */
+S-Lang,#<TAG> ~ #</TAG>
+S-Lang,#if !true ~ #endif
+S-Lang,#if false ~ #endif
+S-Lang,#iffalse ~ #endif
+S-Lang,#ifntrue ~ #endif
+S-Lang,#stop ~ EOF
+SAS,/* ~ */
+SASS,/* ~ */
+Scala,/* ~ */
+Scheme,#| ~ |#
+Seed7,(* ~ *)
+SIMULA,comment ~ ;
+Smalltalk,&quot; ~ &quot;
+Smarty,(* ~ *)
+SQL,/* ~ */
+Standard ML,(* ~ *)
+Swift,/* ~ */
+Tcl,<# ~ #>
+Twig,{# ~ #}
+Visual Prolog,/* ~ */
+Wolfram Language,(* ~ *)
+XML,<!-- ~ -->
+YCP,/* ~ */
+Yorick,/* ~ */
--- a/index.php
+++ b/index.php
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="robots" content="noindex,nofollow">
+    <meta name="referrer" content="no-referrer">
+    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
+    <meta http-equiv="Pragma" content="no-cache">
+    <meta http-equiv="Expires" content="0">
+    <meta name="author" content="Simpel">
+    <meta name="copyright" content="MIT 2021 Simpel">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=yes user-scalable=no">
+    <title>Comment Syntax</title>
+    <link rel="stylesheet" href="style.css">
+  </head>
+  <body>
+    <header>
+      <nav>
+        <h1>Comment Syntax</h1>
+        <a id="logo" class="cursordefault" href="/"><img src="../Simpel.png" alt="simpel icon" height="48" width="48"></a>
+        <a id="github" href="https://github.com/SimpelMe/comment-syntax-finder" target="_blank" title="watch source code">
+          <img id="github-cat" src="../github-cat-white.png" alt="github logo">
+        </a>
+      </nav>
+    </header>
+    <main>
+      <div>
+        <label for="searchinput">Search language or comment syntax:</label>
+        <input type="text" id="searchinput" onkeyup="searchSyntax()" title="Type in a scripting language or comments syntax" placeholder="search string …" autofocus>
+        <table id="resulttable">
+          <thead>
+            <tr>
+              <th>programming / scripting language</th>
+              <th>comments syntax (~ represents text)</th>
+            </tr>
+          </thead>
+          <tbody>
+            <?php
+              $file = fopen("comments.csv", "r");
+              // Fetching data from csv file row by row
+              while (($data = fgetcsv($file)) !== false) {
+                // HTML tag for placing in row format
+                echo "<tr>";
+                foreach ($data as $i) {
+                  echo "<td>" . htmlspecialchars($i, ENT_QUOTES, 'UTF-8', false) . "</td>";
+                }
+                echo "</tr> \n";
+              }
+              fclose($file);
+            ?>
+          </tbody>
+        </table>
+      </div>
+    </main>
+    <footer>
+      <p>sources:</p>
+      <ul>
+        <li class="source"><a href="https://en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)" target="_blank">en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)</a></li>
+        <li class="source"><a href="http://rigaux.org/language-study/syntax-across-languages/Vrs.html" target="_blank">rigaux.org/language-study/syntax-across-languages/Vrs.html</a></li>
+      </ul>
+    </footer>
+  </body>
+  <script>
+  function searchSyntax() {
+    var input, filter, table, tr, tdOne, tdTwo, i, txtValue;
+    input = document.getElementById("searchinput");
+    filter = input.value.toUpperCase();
+    table = document.getElementById("resulttable");
+    tr = table.getElementsByTagName("tr");
+    for (i = 0; i < tr.length; i++) {
+      tdOne = tr[i].getElementsByTagName("td")[0];
+      tdTwo = tr[i].getElementsByTagName("td")[1];
+      if (tdOne || tdTwo) {
+        txtValue = tdOne.innerText;
+        txtValue += tdTwo.innerText;
+        if (txtValue.toUpperCase().indexOf(filter) > -1) {
+          tr[i].style.display = "";
+        } else {
+          tr[i].style.display = "none";
+        }
+      }
+    }
+  }
+  </script>
+</html>
--- a/screenshot.png
+++ b/screenshot.png
--- a/style.css
+++ b/style.css
+body {
+  min-height: 50vh;
+  font-family: helvetica, Arial, sans-serif;
+  font-size: 2vmin;
+  background-color: #555;
+  color: white;
+  margin: 3vmin 4vmin 2vmin 4vmin;
+}
+/* iPad portait */
+@media (max-width: 768px) {
+  body {
+    font-size: 3vmin;
+  }
+}
+/* iPhone landscape only */
+@media (max-width: 568px) {
+  body {
+    font-size: 4vmin;
+  }
+}
+/* iPhone portait only */
+@media (max-width: 320px) {
+  body {
+    font-size: 4vmin;
+  }
+}
+a {
+  color: #ffffff;
+  text-decoration: none;
+}
+h1 {
+  padding-left: 60px;
+  line-height: 52px;
+  margin-top: 3vmin;
+}
+#logo {
+  float: left;
+  position: absolute;
+  top: 3vmin;
+}
+#github {
+  position: absolute;
+  top: 3.3vmin;
+  right: 4vmin;
+}
+#github-cat {
+  height: 4vh;
+}
+main {
+    justify-content: center;
+    display: flex;
+}
+label, input, button, select {
+  display: block;
+}
+button, input, select {
+  font-size: medium;
+  height: 2.5em;
+  margin-top: 0.2em;
+  padding: 5px 10px;
+  color: white;
+  border: 2px solid;
+  cursor: pointer;
+  -webkit-border-radius: 5px;
+  border-radius: 5px;
+}
+/* makes input listening to height so input and select have the same height */
+input, select {
+  color: #333;
+  border-color: white;
+  background-color: white;
+  box-sizing: border-box;
+}
+input[type="text"], select {
+  width: 70ch;
+  max-width: calc(100vw - 8vmin);
+}
+table {
+  font-size: medium;
+  border: 1px solid white;
+  margin-top: 2vmin;
+  width: 70ch;
+  max-width: calc(100vw - 8vmin);
+  border-collapse: collapse;
+}
+table, td, th{
+	padding-left:10px;
+	padding-top:10px;
+	padding-bottom:10px;
+}
+tr:nth-child(even) {
+  background-color:#555;
+}
+tr:nth-child(odd) {
+  background-color:#555;
+}
+tr, th {
+ border-bottom: 1px solid white;
+}
+tr:last-child {
+ border-bottom: none;
+}
+td:first-child, th:first-child {
+ border-right: 1px solid white;
+}
+th {
+  text-align: left;
+  background-color: #444444;
+}
+th, td {
+  width: 35ch;
+}
+footer {
+  margin: auto;
+}
+.source a {
+  word-break: break-all;
+}
+.source a:hover {
+  text-decoration: underline;
+}