Skip to content

Commit

Permalink
floating repl bugfix
Browse files Browse the repository at this point in the history
  • Loading branch information
awb99 committed Nov 23, 2024
1 parent c8a08a0 commit 7875f2f
Show file tree
Hide file tree
Showing 3 changed files with 93 additions and 119 deletions.
12 changes: 3 additions & 9 deletions demo/resources/ext/demo.edn
Original file line number Diff line number Diff line change
@@ -1,18 +1,12 @@
{:name "demo"
:lazy true
:depends-on #{:reval-ui}
:cljs-namespace [;demo.page.frepl

]
:cljs-namespace [demo.page.frepl]

:cljs-ns-bindings {;'demo.page.frepl {'page demo.page.frepl/page}
}
:cljs-ns-bindings {'demo.page.frepl {'page demo.page.frepl/page}}

:cljs-routes {"" reval.page.viewer/viewer-page
"repl" reval.page.repl/repl-page
;"frepl" demo.page.overlay/overlay-page

}
"frepl" demo.page.frepl/page}

;
}
8 changes: 4 additions & 4 deletions reval-ui/resources/ext/reval-ui.edn
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,12 @@
reval.kernel.protocol
reval.type.converter
reval.type.cljs ; side-effects; load protocols for cljs and sci

; pages
reval.page.viewer
reval.page.repl
;reval.notebook-ui.editor
;reval.frepl
; floating repl
reval.frepl
]
:cljs-ns-bindings {; dali plot
reval.dali.plot.type {'simplevalue->dali reval.dali.plot.type/simplevalue->dali
Expand Down Expand Up @@ -48,8 +48,8 @@
'reval.page.viewer {'viewer-page reval.page.viewer/viewer-page}
'reval.page.repl {'repl-page reval.page.repl/repl-page}
;'reval.notebook-ui.editor {'block-for reval.notebook-ui.editor/block-for}
;'reval.frepl {'show-floating-repl reval.frepl/show-floating-repl
; 'show-floating-repl-namespace reval.frepl/show-floating-repl-namespace}
'reval.frepl {'show-floating-repl reval.frepl/show-floating-repl
'show-floating-repl-namespace reval.frepl/show-floating-repl-namespace}
}

; run
Expand Down
192 changes: 86 additions & 106 deletions reval-ui/src/reval/frepl.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,18 @@
[taoensso.timbre :refer-macros [debugf info warn warnf error]]
[reagent.core :as r]
[promesa.core :as p]
[nano-id.core :refer [nano-id]]
[ui.overlay :refer [overlay-add overlay-remove]]
[ui.rnd :refer [rnd]]
[nano-id.core :refer [nano-id]]
[clojure.string :refer [blank?]]
; codemirror
; codemirror
[ui.codemirror.api :as api]
[ui.codemirror.codemirror :refer [codemirror get-editor]]
; kernel
; clj service
[goldly.service.core :refer [clj]]
; kernel
[reval.kernel.protocol :refer [kernel-eval]]
[reval.kernel.clj-remote] ; side effects
[reval.viz.show :refer [show-data]]
[reval.helper.ui-helper :refer [text2]]
[reval.notebook-ui.clj-result :refer [evalerr]]
; clj service
[goldly.service.core :refer [clj]]))
[reval.dali.viewer.notebook :refer [segment]]))

;; codemirror

Expand All @@ -32,10 +29,17 @@

(def cm-opts {:lineWrapping false})

(defn cm-editor [editor-id]
[:<>
(defn cm-editor [editor-id show-data-a]

;[theme/style-codemirror-fullscreen] ; fullscreen is not correct name, 100% width/height is better name.
])
[:div {:style {:max-height "100%"
:max-width "100%"
:min-height "100%"
:min-width "100%"
:height "100%"
:width "100%"
:display (when @show-data-a "none")}}
[codemirror editor-id cm-opts]])

;; eval cljs

Expand All @@ -51,117 +55,93 @@
(p/catch (fn [err]
(info "eval code error: " (pr-str err)))))))

(defn show-data-extended [{:keys [_id _ns _src err err-sci out data render-fn] :as segment}]
(let [scode (:code segment)]
[:div.flex.flex-col
;(pr-str segment)
;(when scode [highlightjs scode])
(when err
[evalerr err])
#_(when err-sci
[evalerr-sci err-sci])
(when (not (blank? out))
[:div.bg-blue-200.max-w-full.overflow-x-auto
[text2 out]])
(when render-fn
[:div.mt-1.mb-1
[show-data render-fn data]])]))
(defn menu [id opts data-a show-data-a]
(let [eval-to-result (fn []
(let [rp (eval-code id opts data-a)]
(p/then rp (fn [res]
(reset! show-data-a true)))))]

[:div {:display "flex"
:width "100%"
:flexdirection "column"
:justifycontent "space-between"
:class "bg-gray-300"}
[:style ".toolbar-item {
padding: 1px;
cursor: pointer;
margin-right: 5px;
border-radius: 3px;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);}
.toolbar-item:hover {
background: rgb(228, 228, 228);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}"]
[:style ".CodeMirror {
font-family: monospace;
height: 100%;
min-height: 100%;
max-height: 100%;
width: 100%;
}"]

[:span.toolbar-item
{:on-click #(swap! show-data-a not)}
(if @show-data-a "code" "result")]
(when-not @show-data-a
[:button.bg-gray-400.m-1.p-1.toolbar-item {:on-click #(eval-to-result)
;#(eval-code id opts data-a)
}"eval"])
;[:span.toolbar-item "menu"]
[:button
{:class "bg-gray-400 m-1 p-1 toolbar-item"
:style {;:margin-left "auto" ; align one flex child to the right
:float "right"}
:on-click #(overlay-remove id)} "x"]]))

(defn result [data-a show-data-a]
[:div {:style {:overflow "hidden"
;:box-shadow "0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23)"
:max-height "100%"
:max-width "100%"
:min-height "100%"
:min-width "100%"
:height "100%"
:width "100%"
:display (when-not @show-data-a "none")}}
[segment (dissoc @data-a :code)]])

(defn floating-window [id {:keys [kernel ns render-fn data]
:or {kernel :clj}}]
(let [data-a (r/atom {:data data :render-fn render-fn})
opts {:ns ns :kernel kernel}
show-data-a (r/atom false)
eval-to-result (fn []
(let [rp (eval-code id opts data-a)]
(p/then rp (fn [res]
(reset! show-data-a true)))))]
show-data-a (r/atom false)]
(fn [id _ _]
(let [{:keys [data render-fn err out]} @data-a]
[:div {:style {:display "grid"
:grid-template-rows "34px 1fr"
:width "100%"
:height "100%"}}
[:style ".my-codemirror > .CodeMirror {
font-family: monospace;
height: 100%;
min-height: 100%;
max-height: 100%;
}"]
[:style ".toolbar-item {
padding: 1px;
cursor: pointer;
margin-right: 5px;
border-radius: 3px;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);}
.toolbar-item:hover {
background: rgb(228, 228, 228);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}"]

;; TOOLBAR MENU
[:div {:display "flex"
:width "100%"
:flexdirection "column"
:justifycontent "space-between"
:class "bg-gray-300"}
[:span.toolbar-item
{:on-click #(swap! show-data-a not)}
(if @show-data-a "code" "result")]
(when-not @show-data-a
[:button.bg-gray-400.m-1.p-1.toolbar-item {:on-click #(eval-to-result)
;#(eval-code id opts data-a)
}"eval"])
;[:span.toolbar-item "menu"]
[:button
{:class "bg-gray-400 m-1 p-1 toolbar-item"
:style {;:margin-left "auto" ; align one flex child to the right
:float "right"}
:on-click #(overlay-remove id)} "x"]]
;; CODEMIRROR
;[cm-editor id]
[:div.my-codemirror.w-full.h-full {:style {:max-height "100%"
:max-width "100%"
:height "100%"
:width "100%"
:display (when @show-data-a "none")}}
[codemirror id cm-opts]]
;; RESULT
[:div {:style {:overflow "hidden"
:box-shadow "0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23)"
:max-height "100%"
:max-width "100%"
:height "100%"
:width "100%"
:display (when-not @show-data-a "none")}}
(cond
(or (and data render-fn)
out
err)
;[show-data render-fn data]
[show-data-extended @data-a]
render-fn [:div "no viz data"]
:else [:div "no render-fn"])]]))))
[:<>
[menu id opts data-a show-data-a]
[result data-a show-data-a]
[cm-editor id show-data-a]]))))

(defn show-floating-repl [{:keys [kernel code ns data render-fn]
:or {kernel :clj
code ""} :as opts}]
(let [id (str (nano-id 5))]
(overlay-add id [rnd {:bounds "window"
:default {:width 200
:height 400
:x 50
:y 60}
:style {:display "flex"
;:alignItems "center"
:justifyContent "center"
:border "solid 2px #ddd"
:background "#f0f0f0"}}
:default {:width 200 :height 400 :x 50 :y 60}
:style {:border "solid 2px blue"
:background "#f0f0f0"
:display "grid"
:grid-template-rows "0px 34px 1fr"
:width "100%"
:height "100%"
:max-height "100%"
:max-width "100%"}}

[floating-window id opts]])
(cm-set-code id code)))

(defn show-floating-repl-namespace
[{:keys [kernel ns data render-fn]
[{:keys [kernel ns]
:as opts}]
(info "loading namespace source: " kernel ns)
(-> (clj {:timeout 1000} 'reval.document.notebook/load-src ns kernel)
Expand Down

0 comments on commit 7875f2f

Please sign in to comment.