state update via new file

Author: safwan39

Component.php

@@ -25,29 +25,21 @@ abstract class Component extends React{
     */
     private static $queue = []; //queue of components 
 
-    /**
-     * A flag that indicates when the queue is already set
-     * 
-     * @var bool
-    */
-    private static $isQueued = false; 
 
     /**
      * the post object when state is changes
      * 
      * @var object
     */
-    private static $post; 
+    private static $isSetState = false; 
 
     /** 
      * Setup the javascript of handling state
      * 
     */
     static function setup(): void {
-        self::$post = json_decode(@$_POST['phpreact']);
-
         //script tag to setup setState function
-        self::import('phpreact.min.js');
+        self::import('phpreact.js', '1.3');
     }
 
     /**  
@@ -56,7 +48,31 @@ static function setup(): void {
      * @return bool
     */
     static function isSetState(): bool{
-        return !!self::$post;
+        return self::$isSetState;
+    }
+
+    static function renderState(){
+        $post = json_decode(@$_POST['phpreact']);
+        if(!$post) return;
+        self::$isSetState = true;
+        self::$queue = $post->components;
+        $component = self::decode($post->current);
+        $oldState = $component->state;
+        $component->state = (object)array_merge((array)$oldState, (array)$post->state);
+        $component->componentDidUpdate($oldState, $component->state);
+        return $component->handleRender();
+    }
+
+    private static function decode(string $encode){
+        $arr = json_decode(base64_decode($encode));
+        include_once $arr->file;
+        return unserialize($arr->component);
+    }
+
+    private function encode(){
+        $ref = $this instanceof Func ? new \ReflectionFunction(get_class($this)) :  new \ReflectionClass($this);
+        $file = $ref->getFileName();
+        return base64_encode(json_encode(['file'=> $file, 'component'=> serialize($this)]));
     }
 
     /**  
@@ -66,7 +82,7 @@ static function isSetState(): bool{
     */
     private function getQueueComponent(){
         $encode = array_shift(self::$queue);
-        return $encode ? unserialize(base64_decode($encode)) : null;
+        return $encode ? self::decode($encode) : null;
     }
 
     /**  
@@ -75,22 +91,8 @@ private function getQueueComponent(){
      * @return string
     */
     private function stateManager(): string {
-        $component = null;
-
-        if(!self::$isQueued){
-            $post = self::$post;
-            self::$queue = $post->components;
-            self::$isQueued = true;
-            $component = $this->getQueueComponent();
-            $oldState = $component->state;
-            $component->state = (object)array_merge((array)$oldState, (array)$post->state);
-            $component->componentDidUpdate($oldState, $component->state);
-        }else{
-            $component = $this->getQueueComponent();
-        }
-
+        $component = $this->getQueueComponent();
         if(!$component) $component = $this;
-
         return $component->handleRender();
     }
 
@@ -104,7 +106,8 @@ private function handleRender(): string {
         $components = $this->render();
 
         if((array)$this->state && $components instanceof Tag){
-            $componentProps =  ['component'=> base64_encode(serialize($this)), 'component-state'=> $this->state];
+            // $componentProps =  ['component'=> base64_encode(serialize($this)), 'component-state'=> $this->state];
+            $componentProps =  ['component'=> $this->encode(), 'component-state'=> $this->state];
             $components->props = (object)array_merge((array)$components->props,$componentProps);
         }
 

React.php

@@ -69,6 +69,7 @@ private static function setup(): void {
      * @param string $class_name
     */
     static function register_class($class_name){
+        self::setup();
         $isTag = Tag::isValid($class_name);
         if(!$isTag && !function_exists($class_name)) return;
 
@@ -187,8 +188,6 @@ private function isProps(array $array): bool{
      * 
     */
     function __construct($args = [], $children = []){
-        self::setup();
-
         if(!is_array($args)) $args = [$args];
         if(!is_array($children)) $children = [$children];
 

phpreact.js

@@ -1,4 +1,5 @@
 ! function(t, e) {
+    var url = e.currentScript.src.replace(/(\.min)?\.js/,'.php');
     var n = function() {
             e.querySelectorAll("[component] *,[component]").forEach(function(t) {
                 t.setState || (t.getState = c, t.setState = o)
@@ -7,7 +8,7 @@
         o = function(t, o) {
             var c = this.hasAttribute("component") ? this : this.closest("[component]");
             if (c) {
-                var i = [c.getAttribute("component")],
+                var i = [],
                     r = this.getAttribute("key"),
                     s = (document.activeElement, this.value),
                     a = this.getState();
@@ -16,6 +17,7 @@
                 }), "function" == typeof t && (t = t(a));
                 var u = new XMLHttpRequest,
                     p = {
+                        current: c.getAttribute("component"),
                         components: i,
                         state: t
                     };
@@ -24,7 +26,7 @@
                         var t, i = e.createElement("div");
                         i.innerHTML = this.responseText, r && (t = i.querySelector("[key=\'" + r + "\']")), c.replaceWith(i.childNodes[0]), t && (t.focus(), s && (t.value = "", t.value = s)), "function" == typeof o && o(), n()
                     }
-                }, u.open("POST", location.href, !0), u.setRequestHeader("Content-type", "application/x-www-form-urlencoded"), u.send("phpreact=" + JSON.stringify(p))
+                }, u.open("POST", url, !0), u.setRequestHeader("Content-type", "application/x-www-form-urlencoded"), u.send("phpreact=" + JSON.stringify(p))
             }
         },
         c = function() {

phpreact.php

@@ -0,0 +1,9 @@
+<?php
+
+require_once 'React.php';
+require_once 'Component.php';
+require_once 'Tag.php';
+require_once 'Func.php';
+
+
+echo React\Component::renderState();