Skip to content

Commit 4ac9c55

Browse files
authored
Merge pull request #1 from Kitware/add-vue3-textmate
feat(vue23): Working for both vue client
2 parents efac4ab + 83cfb97 commit 4ac9c55

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+19746
-16512
lines changed

example/read-only/viewer_vue3.py

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
from trame.app import get_server
2+
from trame.ui.vuetify3 import SinglePageWithDrawerLayout
3+
from trame.widgets import vuetify3, code
4+
5+
from pathlib import Path
6+
7+
# -----------------------------------------------------------------------------
8+
# Trame setup
9+
# -----------------------------------------------------------------------------
10+
11+
server = get_server()
12+
server.client_type = "vue3"
13+
state, ctrl = server.state, server.controller
14+
15+
16+
def path_to_node(path_item, node_map):
17+
_id = str(path_item.absolute())
18+
parent_id = str(path_item.absolute().parent.absolute())
19+
20+
node = dict(id=_id, name=path_item.name, children=[])
21+
node_map[node.get("id")] = node
22+
23+
if parent_id in node_map:
24+
children = node_map[parent_id].get("children")
25+
children.append(node)
26+
27+
return node
28+
29+
30+
def update_tree(base_path):
31+
files = {}
32+
root = Path(base_path)
33+
root_node = path_to_node(root, files)
34+
for file in root.rglob("*"):
35+
path_to_node(file, files)
36+
37+
state.tree_files = root_node.get("children")
38+
39+
40+
def load_file(full_paths):
41+
if full_paths:
42+
item = Path(full_paths[0])
43+
if item.is_file():
44+
if item.name.endswith(".py"):
45+
state.editor_lang = "python"
46+
else:
47+
state.editor_lang = "plaintext"
48+
49+
with open(item) as content:
50+
state.editor_content = content.read()
51+
52+
53+
# -----------------------------------------------------------------------------
54+
# GUI
55+
# -----------------------------------------------------------------------------
56+
57+
state.trame__title = "Viewer"
58+
59+
with SinglePageWithDrawerLayout(server) as layout:
60+
layout.title.set_text("Viewer")
61+
62+
with layout.toolbar as toolbar:
63+
toolbar.dense = True
64+
vuetify3.VSpacer()
65+
vuetify3.VSelect(
66+
v_model=("editor_lang", "plaintext"),
67+
items=("editor_langs", ["plaintext", "python", "javascript", "html"]),
68+
density="compact",
69+
hide_details=True,
70+
style="max-width: 150px;",
71+
classes="mx-2",
72+
)
73+
vuetify3.VSelect(
74+
v_model=("editor_theme", "vs-dark"),
75+
items=("editor_themes", ["vs", "vs-dark", "hc-black", "hc-light"]),
76+
density="compact",
77+
hide_details=True,
78+
style="max-width: 200px;",
79+
)
80+
81+
with layout.drawer:
82+
vuetify3.VBtn(
83+
"Load",
84+
click=(
85+
load_file,
86+
"[['/Users/sebastien.jourdain/Documents/code/web/trame-suite/trame-code/example/read-only/viewer.py']]",
87+
),
88+
)
89+
# vuetify3.VTreeview(
90+
# activatable=True,
91+
# density="compact",
92+
# items=("tree_files", []),
93+
# update_active=(load_file, "[$event]"),
94+
# )
95+
96+
with layout.content:
97+
with vuetify3.VContainer(fluid=True, classes="fill-height pa-0"):
98+
editor = code.Editor(
99+
style="width: 100%",
100+
value=("editor_content", ""),
101+
options=("editor_options", {}),
102+
language=("editor_lang", "plaintext"),
103+
theme=("editor_theme", "vs-dark"),
104+
)
105+
106+
107+
# -----------------------------------------------------------------------------
108+
# Main
109+
# -----------------------------------------------------------------------------
110+
111+
if __name__ == "__main__":
112+
update_tree(".")
113+
server.start()

example/textmate/app.py

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
from trame.app import get_server
2+
from trame.ui.vuetify import SinglePageWithDrawerLayout
3+
from trame.widgets import vuetify, code
4+
5+
from pathlib import Path
6+
7+
import sys
8+
9+
sys.path.append(str(Path(__file__).parent.absolute()))
10+
11+
import langs # noqa: E402
12+
13+
# -----------------------------------------------------------------------------
14+
# Trame setup
15+
# -----------------------------------------------------------------------------
16+
17+
server = get_server()
18+
state, ctrl = server.state, server.controller
19+
20+
21+
def load_python():
22+
load_file("python", Path(__file__).parent / "files" / "python_example.py")
23+
24+
25+
def load_moose():
26+
load_file("moose", Path(__file__).parent / "files" / "moose_example.i")
27+
28+
29+
def load_javascript():
30+
load_file("javascript", Path(__file__).parent / "files" / "javascript_example.js")
31+
32+
33+
def load_latex():
34+
load_file("latex", Path(__file__).parent / "files" / "latex_example.tex")
35+
36+
37+
def load_file(lang, file_path):
38+
state.editor_lang = lang
39+
state.editor_content = file_path.read_text()
40+
41+
42+
# -----------------------------------------------------------------------------
43+
# Textmate grammar definition
44+
# -----------------------------------------------------------------------------
45+
46+
state.editor_textmate = langs.to_dict()
47+
48+
# -----------------------------------------------------------------------------
49+
# GUI
50+
# -----------------------------------------------------------------------------
51+
52+
state.trame__title = "Textmate grammar"
53+
54+
with SinglePageWithDrawerLayout(server) as layout:
55+
layout.title.set_text(state.trame__title)
56+
57+
with layout.toolbar as toolbar:
58+
toolbar.dense = True
59+
vuetify.VSpacer()
60+
vuetify.VSelect(
61+
v_model=("editor_lang", "plaintext"),
62+
items=(
63+
"editor_langs",
64+
["plaintext", "python", "javascript", "html", "moose"],
65+
),
66+
dense=True,
67+
hide_details=True,
68+
style="max-width: 150px;",
69+
classes="mx-2",
70+
)
71+
vuetify.VSelect(
72+
v_model=("editor_theme",),
73+
items=(
74+
"editor_themes",
75+
["vs", "vs-dark", "hc-black", "hc-light", "textmate"],
76+
),
77+
dense=True,
78+
hide_details=True,
79+
style="max-width: 200px;",
80+
)
81+
82+
with layout.drawer:
83+
with vuetify.VCol():
84+
vuetify.VBtn("Python", classes="mb-2", block=True, click=load_python)
85+
vuetify.VBtn("Moose", classes="mb-2", block=True, click=load_moose)
86+
vuetify.VBtn(
87+
"JavaScript", classes="mb-2", block=True, click=load_javascript
88+
)
89+
vuetify.VBtn("Latex", classes="mb-2", block=True, click=load_latex)
90+
91+
with layout.content:
92+
with vuetify.VContainer(fluid=True, classes="fill-height pa-0"):
93+
editor = code.Editor(
94+
style="width: 100%",
95+
value=("editor_content", ""),
96+
options=("editor_options", {}),
97+
language=("editor_lang", "plaintext"),
98+
theme=("editor_theme", "vs-dark"),
99+
textmate=("editor_textmate", None),
100+
)
101+
102+
103+
# -----------------------------------------------------------------------------
104+
# Main
105+
# -----------------------------------------------------------------------------
106+
107+
if __name__ == "__main__":
108+
load_python()
109+
server.start()

0 commit comments

Comments
 (0)