Merge pull request #204 from SwiftFiddle/lookup

Rename Syntax to Lookup

Author: kishikawakatsumi

Public/css/common.css

@@ -39,7 +39,7 @@ body {
   overflow: auto;
 }
 
-#syntax-container {
+#lookup-container {
   font-family: Menlo, Consolas, "DejaVu Sans Mono", "Ubuntu Mono", monospace;
   font-size: 11pt;
   line-height: 1.4;

Public/css/syntax.css renamed to Public/css/lookup.css

@@ -78,9 +78,9 @@
                 </button>
               </li>
               <li class="nav-item lined" role="presentation">
-                <button type="button" class="nav-link" data-bs-toggle="tab" data-bs-target="#syntax-tab-pane" role="tab"
-                  aria-controls="syntax-tab-pane" aria-selected="false"><span class="fa-light fa-file-code"></span><span
-                    class="px-3">Syntax</span>
+                <button type="button" class="nav-link" data-bs-toggle="tab" data-bs-target="#lookup-tab-pane" role="tab"
+                  aria-controls="lookup-tab-pane" aria-selected="false"><span class="fa-light fa-file-code"></span><span
+                    class="px-3">Lookup</span>
                 </button>
               </li>
               <li class="nav-item lined" role="presentation">
@@ -105,8 +105,8 @@
               tabindex="0">
               <div id="structure" class="" role="document"></div>
             </div>
-            <div id="syntax-tab-pane" class="tab-pane" role="tabpanel" aria-labelledby="syntax-tab" tabindex="0">
-              <div id="syntax-container" class="" role="document"></div>
+            <div id="lookup-tab-pane" class="tab-pane" role="tabpanel" aria-labelledby="lookup-tab" tabindex="0">
+              <div id="lookup-container" class="" role="document"></div>
             </div>
             <div id="statistics-tab-pane" class="tab-pane" role="tabpanel" aria-labelledby="statistics-tab"
               tabindex="0">

Public/index.html

@@ -4,7 +4,7 @@ import { Tooltip } from "bootstrap";
 import { Editor } from "./editor.js";
 import { Balloon } from "./balloon.js";
 import { StructureView } from "./structure_view.js";
-import { SyntaxView } from "./syntax_view.js";
+import { LoopupView } from "./lookup_view.js";
 import { StatisticsView } from "./statistics_view.js";
 import { WebSocketClient } from "./websocket.js";
 import { debounce } from "./debounce.js";
@@ -24,8 +24,8 @@ export class App {
     this.structureView = new StructureView(
       document.getElementById("structure")
     );
-    this.syntaxView = new SyntaxView(
-      document.getElementById("syntax-container")
+    this.loopupView = new LoopupView(
+      document.getElementById("lookup-container")
     );
     this.statisticsView = new StatisticsView(
       document.getElementById("statistics-container")
@@ -117,7 +117,7 @@ export class App {
         );
 
         this.updateStructure(structureData);
-        this.updateSyntaxMap(data.syntaxHTML);
+        this.updateLookup(data.syntaxHTML);
 
         const statistics = structureData
           .filter((node) => node.token === undefined)
@@ -136,7 +136,7 @@ export class App {
       })
       .catch((error) => {
         this.structureView.error = error;
-        this.syntaxView.error = error;
+        this.loopupView.error = error;
         this.statisticsView.error = error;
       })
       .finally(() => {
@@ -163,8 +163,8 @@ export class App {
     };
   }
 
-  updateSyntaxMap(syntaxHTML) {
-    this.syntaxView.update(syntaxHTML);
+  updateLookup(syntaxHTML) {
+    this.loopupView.update(syntaxHTML);
   }
 
   updateStatistics(statistics) {
@@ -185,7 +185,7 @@ export class App {
     this.editor.refresh();
 
     document.getElementById("structure").style.height = this.contentViewHeight;
-    document.getElementById("syntax-container").style.height =
+    document.getElementById("lookup-container").style.height =
       this.contentViewHeight;
     document.getElementById("statistics-container").style.height =
       this.contentViewHeight;

Public/js/app.js

@@ -1,9 +1,9 @@
 "use strict";
 
 import { Popover } from "./popover.js";
-import "../css/syntax.css";
+import "../css/lookup.css";
 
-export class SyntaxView {
+export class LoopupView {
   set error(error) {
     this.container.innerHTML = `<div class="alert alert-danger m-3" role="alert">${error}</div>`;
   }