add more to notebook

mentat-collective · Nov 6, 2022 · b11f9ef · b11f9ef
1 parent 67b851d
commit b11f9ef
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 27 deletions.
diff --git a/dev/mathlive/notebook.clj b/dev/mathlive/notebook.clj
@@ -80,21 +80,56 @@ math-field:focus-within {
                 ;; TODO helper methods for getting out MathJSON, examining
                 ;; expression.
                 (swap! state assoc
-                       :text (.getValue (.-target x))
+                       :text   (.getValue (.-target x))
+                       :simple (.-latex (.simplify (.-expression (.-target x))))
                        :mathjson
-                       (js->clj
-                        (.-json (.-expression (.-target x))))))}
+                       (ml/->math-json (.-target x))))}
   (:text @state)])
 
 ;; And round-tripped as TeX:
 
 (cljs
  (v/tex (:text @state)))
 
+;; using simplification... not very good.
+
+(cljs
+ (v/tex (:simple @state)))
+
 ;; We can see the MathJSON version here:
 
 (cljs
  (v/code
   (:mathjson @state)))
 
 ;; Demo shows how to go back and forth... https://cortexjs.io/mathlive/demo/
+
+;; ## Changing the Content
+;;
+;; This is the demo from ["changing the
+;; content"](https://cortexjs.io/mathlive/guides/interacting/#changing-the-content-of-a-mathfield).
+
+(cljs
+ (reagent/with-let
+   [text (reagent/atom
+          "x=\\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}")
+    on-change #(reset! text (.. % -target -value))]
+   [:<>
+    [:h4 "Math Field"]
+    [ml/Mathfield
+     {:on-change on-change}
+     @text]
+    [:h4 "Text Area"]
+    [:textarea
+     {:style {:width "100%" :border "0.5px solid"}
+      :value @text
+      :on-change on-change}]]))
+
+;; TODO go look at how textarea is implemented and give the same exceptions etc!@ https://github.com/facebook/react/blob/main/packages/react-dom-bindings/src/client/ReactDOMTextarea.js
+;;
+;; and the component https://github.com/facebook/react/blob/8e2bde6f2751aa6335f3cef488c05c3ea08e074a/packages/react-dom-bindings/src/client/ReactDOMComponent.js
+
+
+;; ## Fill In the Blank
+;;
+;; This has to feel a bit different.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "mathlive.cljs",
   "version": "0.0.1",
   "dependencies": {
-    "mathlive": "^0.83.0"
+    "mathlive": "^0.84.0"
   },
   "devDependencies": {
     "@babel/core": "^7.17.9",

diff --git a/src/mathlive_cljs/core.cljs b/src/mathlive_cljs/core.cljs
@@ -5,14 +5,15 @@
 
 ;; TODO:
 ;;
-;; - fn or map for opts, test!!
-
-;; - setvalue if vector? test@!
-
-;;
+;; - Change to :default-value and :value, log a warning under "error" if children are set.
+;; - test fn or map for opts
 ;; - ticket to convert jsxgraph to function components
 ;; - functions to get value out as clj
 ;; - docs for all of the field things from html, https://cortexjs.io/docs/mathlive/?q=fints-dire, options
+;; - test the fonts directory thing, can we really set it to nil?
+;;
+;; - add the ability for the value to be MathJSON also.
+
 
 (defn- update-options! [mf opts-or-f]
   (let [updated (cond
@@ -44,10 +45,11 @@
 
     (react/useEffect
      (fn mount []
-       ;; TODO make sure this doesn't trigger much. Why does this thing fire? what is changing??
+       ;; TODO make sure this doesn't trigger much. Why does this thing fire?
+       ;; what is changing??
        ;;
        ;; TODO ask Chris if there is a way to prevent re-mount every time the
-       ;; children change...
+       ;; children change... check if his does it
        (js/console.log "why am I firing??")
        (when-let [opts (and mf options)]
          (update-options! mf opts)))
@@ -56,21 +58,21 @@
     (react/useEffect
      (fn mount []
        (when mf
-         (let [v    (.getValue mf)
+         (let [v (.getValue mf)
                text (if (vector? children)
-                      (reduce str children)
+                      (reduce str "" children)
                       children)]
            (when (not= v text)
-             (.setValue mf text)
-             ;; TODO ask Chris about this. It doesn't do anything if you are
-             ;; directly typing... so why have it here?
-             (when (and text
-                        (.endsWith text "?")
-                        (not (.endsWith v "?")))
-               (.executeCommand ^js mf "moveToPreviousWord"))))
+             (.setValue mf text))
+           ;; TODO ask Chris about this. It doesn't do anything if you are
+           ;; directly typing... so why have it here? i was getting the error
+           ;; even when typing?
+           (when (.endsWith text "?")
+             (.executeCommand ^js mf "moveToPreviousWord")))
          nil)))
 
     (react/useImperativeHandle ref (fn [] mf))
+
     (r/as-element
      [:math-field
       (assoc props