From ee1db16bcfdad55c928883984c718e4c7be3f99e Mon Sep 17 00:00:00 2001 From: Fabio Pliger Date: Wed, 20 Apr 2022 13:30:08 -0500 Subject: [PATCH] move templates to interpreter --- pyscriptjs/examples/pylist.py | 123 ++------------------------------ pyscriptjs/src/interpreter.ts | 129 ++++++++++++++++++++++++++++++++++ 2 files changed, 134 insertions(+), 118 deletions(-) diff --git a/pyscriptjs/examples/pylist.py b/pyscriptjs/examples/pylist.py index 53fa845..cfb6cdf 100644 --- a/pyscriptjs/examples/pylist.py +++ b/pyscriptjs/examples/pylist.py @@ -3,116 +3,6 @@ from xml.dom.pulldom import END_ELEMENT from js import console, HTMLElement, document -def add_classes(element, class_list): - for klass in class_list.split(' '): - element.classList.add(klass) - -def create(what, id_=None, classes=''): - element = document.createElement(what) - if id_: - element.id = id_ - add_classes(element, classes) - return Element(id_, element) - -class PyWidgetTheme: - def __init__(self, main_style_classes): - self.main_style_classes = main_style_classes - - def theme_it(self, widget): - for klass in self.main_style_classes.split(' '): - widget.classList.add(klass) - - -class PyListTemplate: - theme = PyWidgetTheme("flex flex-col-reverse mt-4") - - - def __init__(self, parent): - self.parent = parent - self._children = [] - self.id = self.parent.id - - def connect(self): - self.md = main_div = document.createElement('div'); - main_div.id = self.id + "-list-tasks-container" - - if self.theme: - self.theme.theme_it(main_div) - - self.parent.appendChild(main_div) - - def add(self, data, labels): - child = PyItem(self, data, labels) - return self._add(child) - - def _add(self, child_elem): - console.log("appending child", child_elem.element) - self.pre_child_append(child_elem) - child_elem.pre_append() - self._children.append(child_elem) - self.md.appendChild(child_elem.create().element) - child_elem.post_append() - self.child_appended(child_elem) - return child_elem - - def pre_child_append(self, child): - pass - - def child_appended(self, child): - """Overwrite me to define logic""" - pass - - -class PyItemTemplate(Element): - def __init__(self, parent, data, labels): - self._parent = parent - self.id = f"{self._parent.id}-c-{len(self._parent._children)}" - self.data = data - self.data['id'] = self.id - self.labels = labels - - super().__init__(self.id) - - def create(self): - console.log('creating section') - new_child = create('section', self.id, "task bg-white my-1") - console.log('creating values') - values = ' - '.join([self.data[f] for f in self.labels]) - console.log('creating innerHtml') - new_child._element.innerHTML = f""" - - """ - - # check = new_child.select('input').element - # check.onclick = self.check_task - console.log('returning') - return new_child - - def on_click(self, evt): - pass - - def pre_append(self): - pass - - def post_append(self): - self.element.click = self.on_click - self.element.onclick = self.on_click - - self._post_append() - - def _post_append(self): - pass - - def strike(self, value): - if value: - self.add_class("line-through") - else: - self.remove_class("line-through") - - class PyList(PyListTemplate): pass @@ -124,14 +14,11 @@ class PyItem(PyItemTemplate): self.select('input').element.checked = self.data['done'] + def display(self): + return self.data['content'] + def add_task(*ags, **kws): - console.log(new_task_content.value) - console.log('adding1', myList) - task = { - "content": new_task_content.value, - "done": False, - "created_at": dt.now() - } - myList.add(task, ['content']) + task = { "content": new_task_content.value, "done": False, "created_at": dt.now() } + myList.add(PyItem(task, labels=['content'], state_key="done")) new_task_content.clear() diff --git a/pyscriptjs/src/interpreter.ts b/pyscriptjs/src/interpreter.ts index cc18477..f2d368c 100644 --- a/pyscriptjs/src/interpreter.ts +++ b/pyscriptjs/src/interpreter.ts @@ -51,6 +51,10 @@ class Element: self._id = element_id self._element = element + @property + def id(self): + return self._id + @property def element(self): """Return the dom element""" @@ -115,6 +119,131 @@ class Element: def add_class(self, classname): self.element.classList.add(classname) +def add_classes(element, class_list): + for klass in class_list.split(' '): + element.classList.add(klass) + +def create(what, id_=None, classes=''): + element = document.createElement(what) + if id_: + element.id = id_ + add_classes(element, classes) + return Element(id_, element) + +class PyWidgetTheme: + def __init__(self, main_style_classes): + self.main_style_classes = main_style_classes + + def theme_it(self, widget): + for klass in self.main_style_classes.split(' '): + widget.classList.add(klass) + + +class PyListTemplate: + theme = PyWidgetTheme("flex flex-col-reverse mt-4") + + + def __init__(self, parent): + self.parent = parent + self._children = [] + self._id = self.parent.id + + def connect(self): + self.md = main_div = document.createElement('div'); + main_div.id = self._id + "-list-tasks-container" + + if self.theme: + self.theme.theme_it(main_div) + + self.parent.appendChild(main_div) + + def add(self, child): + child.register_parent(self) + return self._add(child) + + def _add(self, child_elem): + console.log("appending child", child_elem.element) + self.pre_child_append(child_elem) + child_elem.pre_append() + self._children.append(child_elem) + self.md.appendChild(child_elem.create().element) + child_elem.post_append() + self.child_appended(child_elem) + return child_elem + + def pre_child_append(self, child): + pass + + def child_appended(self, child): + """Overwrite me to define logic""" + pass + + +class PyItemTemplate(Element): + label_fields = None + + def __init__(self, data, labels=None, state_key=None, parent=None): + self.data = data + + self.register_parent(parent) + + if not labels: + labels = list(self.data.keys()) + self.labels = labels + + self.state_key = state_key + + super().__init__(self._id) + + def register_parent(self, parent): + self._parent = parent + if parent: + self._id = f"{self._parent._id}-c-{len(self._parent._children)}" + self.data['id'] = self._id + else: + self._id = None + + def create(self): + console.log('creating section') + new_child = create('section', self._id, "task bg-white my-1") + console.log('creating values') + + console.log('creating innerHtml') + new_child._element.innerHTML = f""" + + """ + + console.log('returning') + return new_child + + def on_click(self, evt): + pass + + def pre_append(self): + pass + + def post_append(self): + self.element.click = self.on_click + self.element.onclick = self.on_click + + self._post_append() + + def _post_append(self): + pass + + def strike(self, value): + if value: + self.add_class("line-through") + else: + self.remove_class("line-through") + + def render_content(self): + return ' - '.join([self.data[f] for f in self.labels]) + + class OutputCtxManager: def __init__(self, out=None, output_to_console=True, append=True): self._out = out