clp/better-think-editor
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

set the language attribute for the code editor

Browse source 
I've also added the Elm highlighter from @codemirror/legacy-modes
This commit is contained in:
Christian Lawson-Perfect 2025-02-09 20:29:06 +00:00
parent 90a3f2388b
commit 33769c8d1e
5 changed files with 37312 additions and 83 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored
View file

@ -1,5 +1,4 @@
.make.*
dist/code-editor.mjs
dist/think-editor.js
elm-stuff
jj/status

37206
dist/code-editor.mjs vendored Normal file
View file

File diff suppressed because one or more lines are too long

7
dist/think-editor.css vendored
View file

@ -9,6 +9,7 @@
--editor-size: 50%;
--background: hsl(70,100%,95%);
--default-background: white;
--color: black;
--button-bg: #ddd;
}
@ -16,6 +17,7 @@
@media (prefers-color-scheme: dark) {
body {
--background: hsl(70,100%,8%);
--default-background: black;
--color: white;
--button-bg: #333;
}
@ -237,10 +239,9 @@ input {
z-index: 1;
}
& #code-editor {
& code-editor {
background: var(--default-background);
display: block;
max-width: 50vw;
padding-bottom: 10em;
}
}

8
index.html
View file

@ -17,11 +17,13 @@
"slug": "loaded-thing",
"files": [
{"path": ".", "is_dir": true, "name": ".."},
{"path": "src/poo.elm", "is_dir": false, "name": "poo.elm"}
{"path": "src/poo.elm", "is_dir": false, "name": "poo.elm"},
{"path": "src/poo.js", "is_dir": false, "name": "poo.js"},
{"path": "src/poo.py", "is_dir": false, "name": "poo.py"}
],
"file_path": "src/poo.elm",
"file_path": "src/poo.js",
"is_dir": false,
"file_content": "this\nis\nmy\nfile",
"file_content": "function x() {\n return 1;\n}",
"csrf_token": "arg",
"elm_packages": [
{

173
src/App.elm
View file

@ -2,6 +2,7 @@ port module App exposing (..)
import Browser
import Browser.Navigation
import Dict
import File exposing (File)
import Html as H exposing (Html)
import Html.Attributes as HA
@ -523,89 +524,109 @@ main_nav model =
]
editor_pane model =
H.section
[ HA.id "editor"
, HE.preventDefaultOn "drop" (JD.at ["dataTransfer", "files"] (JD.list File.decoder) |> JD.map (\f -> (DropFiles Content f, True)) )
, HE.preventDefaultOn "dragover" (JD.succeed (NoOp,True))
]
[ H.nav
[ HA.id "editor-controls" ]
[ H.span
[ HA.id "file-path"
, HA.class "file-path"
]
[ H.text model.file_path ]
, H.span
[ HA.id "file-changed-status"
, HA.classList
[ ("changed", model.content_changed) ]
]
[ H.text <| if model.content_changed then "changed" else "saved" ]
, H.details
[]
[ H.summary
let
extension =
model.file_path
|> String.split "."
|> List.drop 1
|> List.head
|> Maybe.withDefault ""
languages = Dict.fromList
[ ("js", "javascript")
, ("mjs", "javascript")
, ("py", "python")
, ("r", "r")
, ("R", "r")
, ("elm", "elm")
]
language = Dict.get extension languages |> Maybe.withDefault ""
in
H.section
[ HA.id "editor"
, HE.preventDefaultOn "drop" (JD.at ["dataTransfer", "files"] (JD.list File.decoder) |> JD.map (\f -> (DropFiles Content f, True)) )
, HE.preventDefaultOn "dragover" (JD.succeed (NoOp,True))
]
[ H.nav
[ HA.id "editor-controls" ]
[ H.span
[ HA.id "file-path"
, HA.class "file-path"
]
[ H.text model.file_path ]
, H.span
[ HA.id "file-changed-status"
, HA.classList
[ ("changed", model.content_changed) ]
]
[ H.text <| if model.content_changed then "changed" else "saved" ]
, H.details
[]
[ H.text "Actions" ]
, form model
[ HA.method "POST"
, HA.action "delete-file"
]
[ H.input
[ HA.type_ "hidden"
, HA.name "path"
, HA.value model.file_path
]
[ H.summary
[]
, H.button
[ HA.type_ "submit" ]
[ H.text "Delete" ]
]
, form model
[ HA.method "POST"
, HA.action "rename-file"
]
[ H.input
[ HA.type_ "hidden"
, HA.name "path"
, HA.value model.file_path
[ H.text "Actions" ]
, form model
[ HA.method "POST"
, HA.action "delete-file"
]
[]
, H.input
[ HA.type_ "text"
, HA.name "newpath"
, HA.value model.file_path
[ H.input
[ HA.type_ "hidden"
, HA.name "path"
, HA.value model.file_path
]
[]
, H.button
[ HA.type_ "submit" ]
[ H.text "Delete" ]
]
, form model
[ HA.method "POST"
, HA.action "rename-file"
]
[ H.input
[ HA.type_ "hidden"
, HA.name "path"
, HA.value model.file_path
]
[]
, H.input
[ HA.type_ "text"
, HA.name "newpath"
, HA.value model.file_path
]
[]
, H.button
[ HA.type_ "submit" ]
[ H.text "Rename" ]
]
[]
, H.button
[ HA.type_ "submit" ]
[ H.text "Rename" ]
]
]
, form model
[ HA.id "file-form"
, HA.method "POST"
, HA.action "save-file"
]
[ H.node "code-editor"
[ HE.on "change" (JD.at ["target", "value"] JD.string |> JD.map SetFileContent)
, HA.attribute "content" model.file_content
, HA.attribute "language" language
]
[ H.text model.file_content ]
, H.input
[ HA.name "path"
, HA.value model.file_path
, HA.type_ "hidden"
]
[]
, H.input
[ HA.name "content"
, HA.value model.file_content
, HA.type_ "hidden"
]
[]
]
]
, form model
[ HA.id "file-form"
, HA.method "POST"
, HA.action "save-file"
]
[ H.node "code-editor"
[ HE.on "change" (JD.at ["target", "value"] JD.string |> JD.map SetFileContent)
, HA.attribute "content" model.file_content
]
[ H.text model.file_content ]
, H.input
[ HA.name "path"
, HA.value model.file_path
, HA.type_ "hidden"
]
[]
, H.input
[ HA.name "content"
, HA.value model.file_content
, HA.type_ "hidden"
]
[]
]
]
log_pane : Model -> Html Msg
log_pane model =