- First commit, work done on form input

composer.json

@@ -0,0 +1,18 @@
+{
+    "name": "mcnd/picea-ui",
+    "description": "A collection of various UI elements to integrate within Picea.",
+    "type": "library",
+    "license": "MIT",
+    "authors": [
+        {
+            "name": "Dave Mc Nicoll",
+            "email": "mcndave@gmail.com"
+        }
+    ],
+    "require": {},
+    "autoload": {
+        "psr-4": {
+            "Picea\\Ui\\": "src/"
+        }
+    }
+}

src/Common/UiElement.php

@@ -0,0 +1,426 @@
+<?php
+
+namespace Picea\Ui\Common;
+
+class UiElement implements \ArrayAccess, \Iterator, \JsonSerializable {
+
+    static array $config = [];
+
+    const INSERT_MODE_APPEND   = 1;
+    const INSERT_MODE_PREPEND  = 2;
+
+    public string $tag = 'div';
+
+    public array $attributes = [
+        'style' => [],
+        'class' => [],
+    ];
+
+    public array $childs = [];
+
+    /**
+     * supported options are for now :
+     *
+     *  key                  value           uses
+     *  --------------------------------------------------------------------------------------------
+     *  single-tag                           Only render a single tag. Cannot contains any childrens
+     *  force-tag-open       tag             Control the way the opening tag is rendered
+     *  force-tag-close      tag-close       "    "    "    "    closing   "    "    "
+     *  no-attr                              Attributes will not be rendered
+     *  no-id                                ID is not automatically given (* may be removed *)
+     *  escape-tag-end                       If you need to echo the Node inside another string, it may be useful to escape the "/" char using "\/"
+     */
+
+    public array $options  = [];
+
+    public $selected = null;
+
+    public string $content;
+
+    protected ?UiQuery $kwery = null;
+
+    public function __construct() {
+        if ( ! static::$config ) {
+            static::pushConfigArray( include(dirname(__FILE__) . "/taglist.php") );
+        }
+    }
+
+    public static function pushConfigArray(array $array) : void
+    {
+        static::$config = array_replace_recursive(static::$config, $array);
+    }
+
+    public static function createStylesheet(string $href, $attributes = [], $options = []) : self
+    {
+        return static::create('link', $attributes + [
+            'href'  => $href,
+            'rel'   => "stylesheet",
+            'type'  => "text/css"
+        ], [ 'tag-type' => 'single' ] + $options);
+    }
+
+    public static function createScript(string $src, array $attributes = [], array $options = []) : self
+    {
+        return static::create('script', $attributes + [
+            'src'  => $src,
+            'type' => 'text/javascript',
+        ], $options);
+    }
+
+    public static function createPhp(array $attributes = [], array $options = []) : self
+    {
+        return static::create('', $attributes, [
+            'force-tag-open'  => '<?php ',
+            'force-tag-close' => ' ?>'
+        ] + $options);
+    }
+
+    public static function createPhpEcho(array $attributes = [], array $options = []) : self
+    {
+        return static::create('', $attributes, [
+            'force-tag-open'  => '<?= ',
+            'force-tag-close' => ' ?>'
+        ] + $options);
+    }
+
+    public static function createSpan(string $text, array $attributes = [], array $options = []) : self
+    {
+        return static::create('span', $attributes, $options)->text($text);
+    }
+
+    public static function create(string $tag = "div", array $attributes = [], array $options = []) : self
+    {
+        $obj = new static();
+
+        if ( strpos($tag, '.') !== false ) {
+            $obj->attributes['class'] = explode('.', $tag);
+            $tag = array_shift($obj->attributes['class']);
+        }
+
+        $obj->tag = $tag;
+        $obj->name = $name;
+
+        if ( $attributes ) {
+            $obj->attributes($attributes);
+        }
+
+        if ( $custom = static::$config["tags"][$tag] ?? false ) {
+            if ( $custom['tag'] ?? false ) {
+                $obj->tag = $custom['tag'];
+            }
+
+            if ( $custom['attributes'] ?? false ) {
+                $obj->attributes($custom['attributes']);
+            }
+
+            if ( $custom['options'] ?? false ) {
+                $obj->options = array_replace_recursive($obj->options, $custom['options']);
+            }
+        }
+
+        return $obj;
+    }
+
+    public function createIn(string $tag, array $attributes = []) : self
+    {
+        $element = static::create($tag, $attributes);
+        $this->append($element);
+        return $element;
+    }
+
+    public function addClass(string $classname) : self
+    {
+        $this->attributes['class'] = $classname;
+        return $this;
+    }
+
+    public function removeClass($classname) {
+        if ( $key = array_search(strtolower($classname), array_map('strtolower', $this->attributes['class'])) ) {
+            unset($this->attributes['class'][$key]);
+        }
+
+        return $this;
+    }
+
+    public function option(string $var, $value = 1) {
+        $this->options[$var] = $value;
+        return $this;
+    }
+
+    public function render() {
+        $attributesList = [];
+
+        foreach ( $this->attr as $key => $value ) {
+
+            if ( is_array($value) ) {
+                if (empty($value)) continue;
+
+                if ($key === 'style') {
+                    $style = [];
+
+                    foreach($value as $k2 => $v2 ) {
+                        $style[] = "$k2:$v2";
+                    }
+
+                    $attributesList[] = "$key=\"".implode(';', $style).'"';
+
+                }
+                else {
+                    $attributesList[] = implode(' ', $value);
+                }
+            }else if ( !is_numeric($key) ) {
+                # will output something like  <tag $key=$value></tag>
+                $attributesList[] = "$key=\"$value\"";
+            }
+            else {
+                # will output something like  <tag $value></tag>
+                $attributesList[] = $value;
+            }
+
+        }
+
+        $content = "";
+
+        foreach ( $this->childs as $item ) {
+            if ( is_object($item) ) {
+                $content .= $item->render();
+            }
+            else if ( is_string($item) ) {
+                $content .= $item;
+            }
+        }
+
+        if ( $this->options->exist('no-tag') ) {
+            return $this->content . $content;
+        }
+        else {
+            $attributesstr = (count($attributesList) && !$this->options->exist('no-attr') ? " " . implode($attributesList, " ") : "");
+
+            # Force the node to contain a certain opening tag (php is a good example)
+            if ( $this->options->exist('force-tag-open') ) {
+                $opentag = $this->options['force-tag-open'] . $attributesstr;
+            }
+            else {
+                $opentag = $this->tag ? "<{$this->tag}" . $attributesstr . ">" : "";
+            }
+
+            if ( $this->options->exist('tag-type') ) {
+                if ( $this->options['tag-type'] === "single" ) {
+                    return $opentag;
+                }
+            }
+            else if ( $this->options->exist('force-tag-close') ) {
+                $closetag = $this->options['force-tag-close'];
+            }
+            else {
+                $closetag = $this->tag ? "<" . ($this->options->exist('escape-tag-end') ? "\/" : "/" ) . "{$this->tag}>" : "";
+            }
+
+            return $opentag . $this->content . $content . $closetag;
+        }
+    }
+
+    public function html($set = null) {
+        if ($set !== null) {
+            $this->content = $set;
+            return $this;
+        }
+
+        return $this->content;
+    }
+
+    public function text(?string $set = null) {
+        if ($set !== null) {
+            $this->content = htmlspecialchars( $args[0], ENT_NOQUOTES );
+            return $this;
+        }
+
+        return $this->content;
+    }
+
+    public function append( ...$arguments ) {
+        return $this->insert( self::INSERT_MODE_APPEND, ...$arguments);
+    }
+
+    public function prepend( ...$arguments ) {
+        return $this->insert( self::INSERT_MODE_PREPEND, ...(is_array($arguments) ? array_reverse($arguments) : $arguments));
+    }
+
+    public function insert($insert_mode = self::INSERT_MODE_APPEND, ...$arguments) {
+        if ( ! $arguments || !( $count = count($arguments) ) ) {
+            return $this;
+        }
+
+        $insert = function($content) use ( $insert_mode ) {
+            if ( self::is_node($content) ) {
+                if ($insert_mode === self::INSERT_MODE_APPEND ) {
+                    $this->childs[] = $content;
+                }
+                elseif ($insert_mode === self::INSERT_MODE_PREPEND ) {
+                    array_unshift($this->childs, $content);
+                }
+            }
+        };
+
+        if ( $count == 1 && !is_array($arguments) ) {
+            // Single node to add
+            $insert($arguments);
+        }
+        else {
+            // multiple node to add
+            foreach ( $arguments as $item ) {
+                if ( is_array($item) ) {
+                    foreach ( $item as $key => $value ) {
+                        if ( !is_numeric($key) ) {
+                            $value->name = $key;
+                        }
+
+                        $this->insert($insert_mode, $value);
+                    }
+                }
+                else {
+                    $insert($item);
+                }
+            }
+        }
+
+        return $this;
+    }
+
+    public function attributes(array $attributes) : self
+    {
+        foreach($attributes as $key => $value) {
+            switch($key) {
+                case 'class' :
+                    $this->addClass($value);
+                break;
+
+                case 'style' :
+                    foreach($value as $var => $val) {
+                        $this->css($var, $val);
+                    }
+                break;
+
+                default:
+                    if ( is_numeric($key) ) {
+                        $this->attributes[] = $value;
+                    }
+                    elseif ( is_array($this->attributes[$key] ?? false) ) {
+                        $this->attributes[$key] = array_replace($value, $this->attributes[$key]);
+                    }
+
+                    $this->attributes[$key] = $value;
+                break;
+            }
+        }
+
+        return $this;
+    }
+
+    public function hasAttributes($key) {
+        return isset( $this->attributes[$key] );
+    }
+
+    /**
+     * Recursive function, allowing both $array as param and $key, $value
+     */
+    public function css(...$arguments) {
+        foreach($arguments as $item) {
+
+            if ( is_array($item) ) {
+                foreach($item as $key => $value) {
+                    $this->css($key, $value);
+                }
+            }
+            else {
+                $this->attributes['style'][$arguments[0]] = $arguments[1];
+            }
+        }
+
+        return $this;
+    }
+
+    public function hasClass(string $className) : bool
+    {
+        return array_search(strtolower($className), array_map('strtolower', $this->attributes['class']), true);
+    }
+
+    public function delete() {
+
+    }
+
+    public function count() {
+        return count($this->childs);
+    }
+
+    public function jsonSerialize() {
+        return [
+            'tag' => $this->tag,
+            'attr' => $this->attr,
+            'childs' => $this->childs,
+            'options' => $this->options,
+        ];
+    }
+
+    public function offsetSet($offset, $value) {
+        if ( is_numeric($offset) ) {
+            return $this->selected[$offset] = $value;
+        }
+        elseif ( is_null($offset) ) {
+            return $this->childs[] = $value;
+        }
+        else {
+            return $this->childs[$offset] = $value;
+        }
+    }
+
+    public function offsetExists($query) : bool
+    {
+        return count($this->kwery()->find($query)) > 0;
+    }
+
+    public function offsetUnset($query) : void
+    {
+        $this->kwery()->find($query)->remove();
+    }
+
+    public function offsetGet($query) : self
+    {
+        return $this->kwery()->find($query);
+    }
+
+    public function rewind() : void
+    {
+        reset($this->childs);
+    }
+
+    public function current() : self
+    {
+        return current($this->childs);
+    }
+
+    public function key() : int
+    {
+        return key($this->childs);
+    }
+
+    public function next() : self
+    {
+        return next($this->childs);
+    }
+
+    public function valid() : bool
+    {
+        return ! in_array(key($this->childs), [ NULL, FALSE ], true);
+    }
+
+    public static function is_node($obj) : bool
+    {
+        return is_object($obj) && get_class($obj) === static::class;
+    }
+
+    public function __toString() : string
+    {
+        return $this->render();
+    }
+}

src/Common/taglist.php

@@ -0,0 +1,60 @@
+<?php
+
+return [
+    "tags" => [
+        "js" => [
+            "tag"  => "script",
+            "attributes" => [ "type" => "text/javascript" ]
+        ],
+        "css" => [
+            "tag"  => "link",
+            "attributes" => [ "rel" => "stylesheet" , "type" => "text/css" ]
+        ],
+        "!doctype" => [
+            "attributes" => [ "html" ],
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "document" => [
+            "options" => [ "no-tag" => true ]
+        ],
+        "link" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "meta" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "img" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "input" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "br" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "hr" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "iframe" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "area" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "col" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "frame" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "param" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "video" => [
+            "options" => [ "tag-type" => "single" ]
+        ],
+        "wbr" => [
+            "options" => [ "tag-type" => "single" ]
+        ]
+    ]
+];

src/Common/ui-element.json

@@ -0,0 +1,58 @@
+{
+    "tags" : {
+        "js" : {
+            "tag"  : "script",
+            "attributes" : { "type" : "text/javascript" }
+        },
+        "css" : {
+            "tag"  : "link",
+            "attributes" : { "rel" : "stylesheet" , "type" : "text/css" }
+        },
+        "!doctype" : {
+            "attributes" : [ "html" ],
+            "options" : { "tag-type" : "single" }
+        },
+        "document" : {
+            "options" : { "no-tag" : true }
+        },
+        "link" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "meta" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "img" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "input" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "br" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "hr" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "iframe" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "area" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "col" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "frame" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "param" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "video" : {
+            "options" : { "tag-type" : "single" }
+        },
+        "wbr" : {
+            "options" : { "tag-type" : "single" }
+        }
+    }
+}

src/Form/UiCheckbox.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiCheckbox extends UiInput {
+
+   public string $token = "ui.checkbox";
+
+   public array $attributes = [
+       'class' => "ui-checkbox",
+       'type'  => "checkbox",
+   ];
+}

src/Form/UiColor.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiColor extends UiInput {
+
+   public string $token = "ui.color";
+
+   public array $attributes = [
+       'class' => "ui-color",
+       'type'  => "color",
+   ];
+}

src/Form/UiDate.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiDate extends UiInput {
+
+   public string $token = "ui.date";
+
+   public array $attributes = [
+       'class' => "ui-date",
+       'type'  => "date",
+   ];
+}

src/Form/UiEmail.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiEmail extends UiInput {
+
+   public string $token = "ui.email";
+
+   public array $attributes = [
+       'class' => "ui-email",
+       'type'  => "email",
+   ];
+}

src/Form/UiFile.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiFile extends UiInput {
+
+   public string $token = "ui.file";
+
+   public array $attributes = [
+       'class' => "ui-file",
+       'type'  => "file",
+   ];
+}

src/Form/UiForm.php

@@ -0,0 +1,58 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+use Picea\Ui\Common\UiElement;
+use Picea\Extension\Extension;
+
+class UiForm extends UiElement implements Extension {
+
+    public string $defaultMethod = "get";
+
+    public string $token = "ui.form";
+
+    public string $tag = "form";
+
+    public array $attributes = [
+       'class' => 'ui-form',
+    ];
+
+    public function parse(/*\Picae\Compiler\Context*/ &$context, ?string $arguments, string $token) : string
+    {
+       list($action, $options) = array_pad(explode(',', $arguments), 2, null);
+
+       switch($token) {
+           case "ui.form.get":
+               $this->attributes['method'] = "get";
+           break;
+
+           case "ui.form.post":
+               $this->attributes['method'] = "post";
+           break;
+
+           default:
+           case $this->token:
+               $this->attributes['method'] = $this->defaultMethod;
+           break;
+       }
+
+       $this->attributes['action'] = $action;
+       $this->attributes($this->parseAttributes($options));
+       return $this->render();
+    }
+
+    protected function parseAttributes(string $options) : array
+    {
+        if ( $options ?? false ) {
+            $attributes = eval($options);
+
+            if ( ! is_array($attributes) ) {
+               throw new InvalidArgumentException("Given options `$options` is not a valid attributes array.");
+            }
+
+            return $attributes;
+        }
+
+       return [];
+    }
+}

src/Form/UiHidden.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiHidden extends UiInput {
+
+   public string $token = "ui.hidden";
+
+   public array $attributes = [
+       'class' => "ui-hidden",
+       'type'  => "hidden",
+   ];
+}

src/Form/UiInput.php

@@ -0,0 +1,47 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+use Picea\Ui\Common\UiElement;
+use Picea\Extension\Extension;
+
+class UiInput extends UiElement implements Extension {
+
+    public string $token = "ui.input";
+
+    public string $tag = "input";
+
+    public array $attributes = [
+       'class' => 'ui-input',
+    ];
+
+    public function parse(/*\Picae\Compiler\Context*/ &$context, ?string $arguments, string $token) : string
+    {
+        list($name, $value, $options) = array_pad(explode(',', $arguments), 3, null);
+
+        $this->attributes['name'] = $name;
+        $this->setValue($value);
+        $this->attributes($this->parseAttributes($options));
+        return $this->render();
+    }
+
+    protected function parseAttributes(string $options) : array
+    {
+        if ( $options ?? false ) {
+            $attributes = eval($options);
+
+            if ( ! is_array($attributes) ) {
+               throw new InvalidArgumentException("Given options `$options` is not a valid attributes array.");
+            }
+
+            return $attributes;
+        }
+
+        return [];
+    }
+
+    protected function setValue($value) : void
+    {
+        $this->attributes['value'] = $value;
+    }
+}

src/Form/UiNumeric.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiNumeric extends UiInput {
+
+   public string $token = "ui.numeric";
+
+   public array $attributes = [
+       'class' => "ui-numeric",
+       'type'  => "numeric",
+   ];
+}

src/Form/UiPassword.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiPassword extends UiInput {
+
+   public string $token = "ui.password";
+
+   public array $attributes = [
+       'class' => "ui-password",
+       'type'  => "password",
+   ];
+}

src/Form/UiRadio.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiRadio extends UiInput {
+
+   public string $token = "ui.radio";
+
+   public array $attributes = [
+       'class' => "ui-radio",
+       'type'  => "radio",
+   ];
+}

src/Form/UiRange.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiRange extends UiInput {
+
+   public string $token = "ui.range";
+
+   public array $attributes = [
+       'class' => "ui-range",
+       'type'  => "range",
+   ];
+}

src/Form/UiSearch.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiSearch extends UiInput {
+
+   public string $token = "ui.search";
+
+   public array $attributes = [
+       'class' => "ui-search",
+       'type'  => "search",
+   ];
+}

src/Form/UiTel.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiTel extends UiInput {
+
+   public string $token = "ui.tel";
+
+   public array $attributes = [
+       'class' => "ui-tel",
+       'type'  => "tel",
+   ];
+
+   public string $defaultPattern = "[0-9]{1}-[0-9]{3}-[0-9]{3}-[0-9]{4}";
+
+   protected function parseAttributes(string $options) : array
+   {
+       return parent::parseAttributes($options) + [ 'pattern' => $this->defaultPattern ];
+   }
+}

src/Form/UiText.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiText extends UiInput {
+
+   public string $token = "ui.text";
+
+   public array $attributes = [
+       'class' => "ui-text",
+       'type'  => "text",
+   ];
+}

src/Form/UiTextarea.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiTextarea extends UiInput {
+
+    public string $token = "ui.textarea";
+
+    public string $tag = "textarea";
+
+    public array $attributes = [
+       'class' => "ui-textarea",
+    ];
+
+    protected function setValue($value) : void
+    {
+        $this->html($value);
+    }
+}

src/Form/UiTime.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiTime extends UiInput {
+
+   public string $token = "ui.time";
+
+   public array $attributes = [
+       'class' => "ui-time",
+       'type'  => "time",
+   ];
+}

src/Form/UiUrl.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiUrl extends UiInput {
+
+   public string $token = "ui.url";
+
+   public array $attributes = [
+       'class' => "ui-url",
+       'type'  => "url",
+   ];
+}

src/Form/UiWeek.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Picea\Ui\Form;
+
+class UiWeek extends UiInput {
+
+   public string $token = "ui.week";
+
+   public array $attributes = [
+       'class' => "ui-week",
+       'type'  => "week",
+   ];
+}

src/Ui.php

@@ -0,0 +1,33 @@
+<?php
+
+namespace Picea\Ui;
+
+use Picea\Compiler;
+
+class Ui {
+
+    public function registerFormExtension(Compiler $compiler) : self
+    {
+        $compiler->registerExtension(new Form\UiForm());
+        $compiler->registerExtension(new Form\UiInput());
+        $compiler->registerExtension(new Form\UiCheckbox());
+        $compiler->registerExtension(new Form\UiColor());
+        $compiler->registerExtension(new Form\UiDate());
+        $compiler->registerExtension(new Form\UiEmail());
+        $compiler->registerExtension(new Form\UiFile());
+        $compiler->registerExtension(new Form\UiHidden());
+        $compiler->registerExtension(new Form\UiNumeric());
+        $compiler->registerExtension(new Form\UiPassword());
+        $compiler->registerExtension(new Form\UiRadio());
+        $compiler->registerExtension(new Form\UiRange());
+        $compiler->registerExtension(new Form\UiSearch());
+        $compiler->registerExtension(new Form\UiTel());
+        $compiler->registerExtension(new Form\UiText());
+        $compiler->registerExtension(new Form\UiTextarea());
+        $compiler->registerExtension(new Form\UiTime());
+        $compiler->registerExtension(new Form\UiUrl());
+        $compiler->registerExtension(new Form\UiWeek());
+
+        return $this;
+    }
+}