@@ -46,7 +28,7 @@ function App() {
} />
} />
} />
-
} />
+
} />
} />
} />
} />
diff --git a/src/components/note.jsx b/src/components/note.jsx
new file mode 100644
index 0000000..e10f44b
--- /dev/null
+++ b/src/components/note.jsx
@@ -0,0 +1,22 @@
+import RenderMarkdown from "../components/markdown";
+import printDate from "./utils";
+
+function Note({ note }) {
+ return (
+
+
+
+ {note.name}
+
+
+ {printDate(note.time)}
+
+
+
+ {note.text}
+
+
+ );
+}
+
+export default Note;
diff --git a/src/components/socket.js b/src/components/socket.js
new file mode 100644
index 0000000..3e0f109
--- /dev/null
+++ b/src/components/socket.js
@@ -0,0 +1,21 @@
+import { io } from "socket.io-client";
+
+const socket = io();
+
+function onConnect() {
+ console.log("Socket connected");
+}
+
+function onDisconnect() {
+ console.log("Socket disconnected, local mode only");
+}
+
+function onFooEvent() {
+ console.log("bar");
+}
+
+socket.on("connect", onConnect);
+socket.on("disconnect", onDisconnect);
+socket.on("foo", onFooEvent);
+
+export default socket;
diff --git a/src/pages/create.jsx b/src/pages/create.jsx
index b9d8d48..7421383 100644
--- a/src/pages/create.jsx
+++ b/src/pages/create.jsx
@@ -4,6 +4,14 @@ import { CheckBox } from "../components/checkbox";
import { useState } from "react";
import RenderMarkdown from "../components/markdown";
import printDate from "../components/utils";
+import rehypeRemark from "rehype-remark/lib";
+import ContentEditable from "react-contenteditable";
+import ReactDOMServer from "react-dom/server";
+import { unified } from "unified";
+import rehypeParse from "rehype-parse";
+import remarkStringify from "remark-stringify";
+import remarkGfm from "remark-gfm";
+import remarkMath from "remark-math";
function CreateNote() {
const [preview, setPreview] = useState(false);
@@ -13,11 +21,25 @@ function CreateNote() {
const [date, setDate] = useState(Date.now());
- setInterval(() => {
- if (preview) {
- setDate(Date.now());
- }
- }, 1000);
+ // setInterval(() => {
+ // if (preview) {
+ // setDate(Date.now());
+ // }
+ // }, 1000);
+
+ async function previewChange(val) {
+ let md = await unified()
+ .use(remarkGfm)
+ .use(remarkMath)
+ .use(rehypeParse)
+ .use(rehypeRemark)
+ .use(remarkStringify)
+ .process(val.target.value);
+
+ md = md.value.trim();
+
+ localStorage.setItem("NoteText", md);
+ }
let inputStyle = `form-control block px-3 py-1.5 text-base font-normal text-gray-700 dark:text-white bg-white dark:bg-zinc-900 bg-clip-padding border border-solid border-gray-300 rounded-lg transition ease-in-out focus:border-blue-600 focus:outline-none`;
return (
@@ -30,7 +52,10 @@ function CreateNote() {
className="justify-self-center lg:justify-self-end"
label="Предпросмотр"
id="preview"
- onClick={() => setPreview(!preview)}
+ onClick={() => {
+ setText(localStorage.getItem("NoteText"));
+ setPreview(!preview);
+ }}
/>
@@ -75,7 +100,13 @@ function CreateNote() {
)}
{preview && (