From 40bb640b169656dd33b15c189eb4146e05118ecd Mon Sep 17 00:00:00 2001
From: terminaldweller <thabogre@gmail.com>
Date: Thu, 31 Mar 2022 17:58:41 +0430
Subject: moved everything into one class

---
 spring-front/src/App.js               |  6 +--
 spring-front/src/components/Editor.js | 95 +++++++++++++++++++++++++++++++++++
 spring-front/src/components/Left.js   | 90 ---------------------------------
 spring-front/src/components/Right.js  | 17 -------
 4 files changed, 97 insertions(+), 111 deletions(-)
 create mode 100644 spring-front/src/components/Editor.js
 delete mode 100644 spring-front/src/components/Left.js
 delete mode 100644 spring-front/src/components/Right.js

(limited to 'spring-front')

diff --git a/spring-front/src/App.js b/spring-front/src/App.js
index 492930e..e965d51 100644
--- a/spring-front/src/App.js
+++ b/spring-front/src/App.js
@@ -1,6 +1,5 @@
 import React from "react";
-import Left from "./components/Left.js";
-import Right from "./components/Right.js";
+import Editor from "./components/Editor.js";
 
 export default class App extends React.Component {
   constructor(props) {
@@ -10,8 +9,7 @@ export default class App extends React.Component {
   render() {
     return (
       <div>
-        <Left />
-        <Right />
+        <Editor />
       </div>
     );
   }
diff --git a/spring-front/src/components/Editor.js b/spring-front/src/components/Editor.js
new file mode 100644
index 0000000..330f15c
--- /dev/null
+++ b/spring-front/src/components/Editor.js
@@ -0,0 +1,95 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import hljs from "highlight.js/lib/core";
+import "highlight.js/styles/devibeans.css";
+import markdown from "highlight.js/lib/languages/markdown.js";
+import "../index.css";
+
+hljs.registerLanguage("markdown", markdown);
+
+export default class Editor extends React.Component {
+  constructor(props) {
+    super(props);
+    this.handleInput = this.handleInput.bind(this);
+    this.handleScroll = this.handleScroll.bind(this);
+    this.handleKeyDown = this.handleKeyDown.bind(this);
+    this.updateCodeSyntaxHighlighting =
+      this.updateCodeSyntaxHighlighting.bind(this);
+    this.handleChange = this.handleChange.bind(this);
+    this.state = { value: "" };
+  }
+
+  updateCodeSyntaxHighlighting() {
+    document.querySelectorAll("pre code").forEach((block) => {
+      console.log("block:", block);
+      console.log("blockt text:", block.textContent);
+      hljs.highlightElement(block);
+    });
+  }
+
+  handleChange(event) {
+    this.setState({ value: event.target.value });
+  }
+
+  handleInput(event) {
+    let text = this.state.value;
+    let result_element = document.getElementById("highlight-content");
+    result_element.textContent = text;
+    this.updateCodeSyntaxHighlighting();
+    let result_element_2 = document.querySelector("#highlight");
+    result_element_2.scrollTop = event.currentTarget.scrollTop;
+    result_element_2.scrollLeft = event.currentTarget.scrollLeft;
+  }
+
+  handleScroll(event) {
+    let result_element = document.querySelector("#highlight");
+    result_element.scrollTop = event.currentTarget.scrollTop;
+    result_element.scrollLeft = event.currentTarget.scrollLeft;
+  }
+
+  handleKeyDown(event) {
+    let element = event.currentTarget;
+    let code = this.state.value;
+    if (event.key == "Tab") {
+      event.preventDefault();
+      let before_tab = code.slice(0, element.selectionStart);
+      let after_tab = code.slice(element.selectionEnd, element.value.length);
+      let cursor_pos = element.selectionEnd + 1;
+      element.value = before_tab + "\t" + after_tab;
+      element.selectionStart = cursor_pos;
+      element.selectionEnd = cursor_pos;
+      this.handleInput(element.value, element);
+    }
+  }
+
+  render() {
+    return (
+      <div>
+        <div>
+          <pre id="highlight" aria-hidden="true" direction="rtl">
+            <code
+              id="highlight-content"
+              class="language-markdown"
+              direction="rtl"
+            ></code>
+          </pre>
+          <textarea
+            spellcheck="false"
+            name="editor"
+            className="editor"
+            id="editor"
+            value={this.state.value}
+            onChange={this.handleChange.bind(this)}
+            onInput={this.handleInput.bind(this)}
+            onScroll={this.handleScroll.bind(this)}
+            onKeyDown={this.handleKeyDown.bind(this)}
+            direction="rtl"
+          ></textarea>
+        </div>
+        <div class="split right">
+          <p class="markdown-placeholder">Parsed Markdown goes here!!!</p>
+        </div>
+      </div>
+    );
+  }
+}
diff --git a/spring-front/src/components/Left.js b/spring-front/src/components/Left.js
deleted file mode 100644
index dc1bbd5..0000000
--- a/spring-front/src/components/Left.js
+++ /dev/null
@@ -1,90 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import hljs from "highlight.js/lib/core";
-import "highlight.js/styles/devibeans.css";
-import markdown from "highlight.js/lib/languages/markdown.js";
-import "../index.css";
-
-hljs.registerLanguage("markdown", markdown);
-
-export default class Editor extends React.Component {
-  constructor(props) {
-    super(props);
-    this.handleInput = this.handleInput.bind(this);
-    this.handleScroll = this.handleScroll.bind(this);
-    this.handleKeyDown = this.handleKeyDown.bind(this);
-    this.updateCodeSyntaxHighlighting =
-      this.updateCodeSyntaxHighlighting.bind(this);
-    this.handleChange = this.handleChange.bind(this);
-    this.state = { value: "" };
-  }
-
-  updateCodeSyntaxHighlighting() {
-    document.querySelectorAll("pre code").forEach((block) => {
-      console.log("block:", block);
-      console.log("blockt text:", block.textContent);
-      hljs.highlightElement(block);
-    });
-  }
-
-  handleChange(event) {
-    this.setState({ value: event.target.value });
-  }
-
-  handleInput(event) {
-    let text = this.state.value;
-    let result_element = document.getElementById("highlight-content");
-    result_element.textContent = text;
-    this.updateCodeSyntaxHighlighting();
-    let result_element_2 = document.querySelector("#highlight");
-    result_element_2.scrollTop = event.currentTarget.scrollTop;
-    result_element_2.scrollLeft = event.currentTarget.scrollLeft;
-  }
-
-  handleScroll(event) {
-    let result_element = document.querySelector("#highlight");
-    result_element.scrollTop = event.currentTarget.scrollTop;
-    result_element.scrollLeft = event.currentTarget.scrollLeft;
-  }
-
-  handleKeyDown(event) {
-    let element = event.currentTarget;
-    let code = this.state.value;
-    if (event.key == "Tab") {
-      event.preventDefault();
-      let before_tab = code.slice(0, element.selectionStart);
-      let after_tab = code.slice(element.selectionEnd, element.value.length);
-      let cursor_pos = element.selectionEnd + 1;
-      element.value = before_tab + "\t" + after_tab;
-      element.selectionStart = cursor_pos;
-      element.selectionEnd = cursor_pos;
-      this.handleInput(element.value, element);
-    }
-  }
-
-  render() {
-    return (
-      <div>
-        <pre id="highlight" aria-hidden="true" direction="rtl">
-          <code
-            id="highlight-content"
-            class="language-markdown"
-            direction="rtl"
-          ></code>
-        </pre>
-        <textarea
-          spellcheck="false"
-          name="editor"
-          className="editor"
-          id="editor"
-          value={this.state.value}
-          onChange={this.handleChange.bind(this)}
-          onInput={this.handleInput.bind(this)}
-          onScroll={this.handleScroll.bind(this)}
-          onKeyDown={this.handleKeyDown.bind(this)}
-          direction="rtl"
-        ></textarea>
-      </div>
-    );
-  }
-}
diff --git a/spring-front/src/components/Right.js b/spring-front/src/components/Right.js
deleted file mode 100644
index 4bfe073..0000000
--- a/spring-front/src/components/Right.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from "react";
-import "../index.css";
-
-export default class Right extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = { value: "" };
-  }
-
-  render() {
-    return (
-      <div class="split right">
-        <p class="markdown-placeholder">Parsed Markdown goes here!!!</p>
-      </div>
-    );
-  }
-}
-- 
cgit v1.2.3