livewire working

Author: Andres Vargas

app/settings.py

@@ -125,5 +125,5 @@
 
 STATIC_URL = '/static/'
 
-
+CSRF_HEADER_NAME="HTTP_X_CSRF_TOKEN"
 

app/urls.py

@@ -1,9 +1,10 @@
 from django.contrib import admin
-from django.urls import path
+from django.urls import path, include
 from django.contrib.staticfiles.urls import staticfiles_urlpatterns
 from core.views import index
 
 urlpatterns = [
     path('admin/', admin.site.urls),
+    path('', include("livewire.urls")),
     path('', index),
 ] + staticfiles_urlpatterns()

core/views.py

@@ -1,6 +1,20 @@
 from django.shortcuts import render
-
+from livewire.views import LivewireComponent
 
 def index(request):
     context = {}
     return render(request, "base.html", context)
+
+
+
+class CounterLivewire(LivewireComponent):
+    component_name = "counter"
+    context = {
+        'count': 0
+    }
+    def decrement(self, *args):
+        self.context["count"] -=1
+
+    def increment(self, *args):
+        self.context["count"]+=1
+

livewire/templates/livewire/component.html

@@ -1,5 +1 @@
-
-<div wire:id="{{livewire.id}}" wire:initial-data='{{livewire.initial_data}}'>
-
-    {{ component|safe }}
-</div>
+{{ component|safe }}

livewire/templatetags/livewire_tags.py

@@ -1,41 +1,14 @@
 from django import template
-from django.template.loader import render_to_string
-import random
-import string
-import json
-
+from livewire.views import LivewireComponent
 register = template.Library()
 
-
 @register.inclusion_tag("livewire_scripts.html", takes_context=True)
 def livewire_scripts(context):
     return context
 
-@register.inclusion_tag("livewire/component.html")
+@register.simple_tag
 def livewire(component,**kwargs):
-    context =  kwargs.copy()
-    context["count"] = 0
-
-    component_render = render_to_string(f'{component}.livewire.html',context=context)
-    id = ''.join(random.choice(string.ascii_lowercase) for i in range(20))
-    initial_data = {
-        'id': id,
-        'name': component,
-        'redirectTo':"",
-        "events": [],
-        "eventQueue": [],
-        "dispatchQueue": [],
-        "data": {
-                    "count": 0
-                },
-        "children": [],
-        "checksum": "9e4c194bb6aabf5f152fe4358385b77c396d711ba4886ac5d41513f1eb6527d3"
-    }
-    context = {
-        'livewire': {
-            'id': id,
-            'initial_data': json.dumps(initial_data)
-        },
-        'component': component_render
-    }
-    return context
+    # TODO: register Components by livewire.register(ComponentLivewire)
+    from core.views import CounterLivewire
+    livewire_component = CounterLivewire()
+    return livewire_component.render_initial()

livewire/urls.py

@@ -0,0 +1,8 @@
+
+from django.urls import path
+from .views import livewire_message
+
+urlpatterns = [
+    path('livewire/message/<component_name>', livewire_message),
+]
+

livewire/views.py

@@ -1,3 +1,101 @@
 from django.shortcuts import render
+from django.template.loader import render_to_string
+from django.utils.encoding import smart_str
+from django.utils.safestring import mark_safe
+from django.http import JsonResponse
+import random
+import string
+import json
+import importlib
+import htmlement
+import xml.etree.ElementTree as ET
 
+def livewire_message(request, component_name):
+    from core.views import CounterLivewire
+    inst = CounterLivewire()
+    if request.method == "POST":
+        body = json.loads(request.body)
+        inst.parser_payload(body)
+    return JsonResponse(inst.render(), safe=False)
+
+def get_id():
+    return ''.join(random.choice(string.ascii_lowercase) for i in range(20))
+
+class LivewireComponent():
+    id = None
+    context = {}
+
+    def get_component_name(self):
+        return self.component_name.lower()
+
+    def get_context(self, **kwargs):
+        self.context.update(kwargs)
+        return self.context
+
+    def get_dom(self):
+        context = self.get_context()
+        return self._render_component(context)
+
+    def get_response(self):
+        dom = self.get_dom()
+        return {
+            'id': self.id,
+            'name': self.get_component_name(),
+            'dom': dom,
+            'fromPrefetch':'',
+            'redirectTo': '',
+            'children': [],
+            'dirtyInputs': [],
+            'data': self.get_context(),
+            'eventQueue': [],
+            'dispatchQueue': [],
+            'events': [],
+            'checksum': "c24"
+        }
+
+    def parser_payload(self, payload):
+        self.id = payload.get("id")
+        self.context.update(payload.get("data"))
+        action_queue = payload.get("actionQueue", [])
+        for action in action_queue:
+            action_type = action.get("type")
+            payload = action.get("payload")
+            if action_type == "callMethod":
+                method = payload.get("method")
+                params = payload.get("params",[])
+                local_method = getattr(self, method)
+                local_method(*params)
+
+    def render(self):
+        response = self.get_response()
+        return response
+
+    def _render_component(self, context, initial_data={} ):
+        component_name = self.get_component_name()
+        component_render = render_to_string(f'{component_name}.livewire.html',
+                                            context=self.get_context())
+        root = htmlement.fromstring(component_render).find("div")
+        root.set('wire:id', self.id)
+        if initial_data:
+            root.set("wire:initial-data",json.dumps(initial_data))
+        res = ET.tostring(root)
+        return  mark_safe(smart_str(res))
+
+
+    def render_initial(self):
+        self.id =  get_id()
+        component = self.get_component_name()
+        context = self.get_context()
+        initial_data = {
+            'id': self.id,
+            'name': component,
+            'redirectTo':"",
+            "events": [],
+            "eventQueue": [],
+            "dispatchQueue": [],
+            "data": context, 
+            "children": [],
+            "checksum": "9e4c194bb6aabf5f1" # TODO: checksum
+        }
+        return self._render_component(context, initial_data=initial_data)