Feature/js modal rev

demos/Session.php

@@ -0,0 +1,173 @@
+<?php
+
+/***
+ * Temp Class Session
+ * Copied from previous ATK4 4.3
+ */
+
+class Session
+{
+    public $name;
+    public $is_initialized = false;
+
+    public function __construct($name = 'atk4')
+    {
+        $this->name = $name;
+        $this->initializeSession();
+    }
+
+    // {{{ Session management: http://agiletoolkit.org/doc/session
+
+    /**
+     * Remember data in object-relevant session data.
+     *
+     * @param string $key   Key for the data
+     * @param mixed  $value Value
+     *
+     * @return mixed $value
+     */
+    public function memorize($key, $value)
+    {
+        if (!session_id()) {
+            $this->initializeSession();
+        }
+
+        if ($value instanceof Model) {
+            unset($_SESSION['o'][$this->name][$key]);
+            $_SESSION['s'][$this->name][$key] = serialize($value);
+
+            return $value;
+        }
+
+        unset($_SESSION['s'][$this->name][$key]);
+        $_SESSION['o'][$this->name][$key] = $value;
+
+        return $value;
+    }
+
+    /**
+     * Similar to memorize, but if value for key exist, will return it.
+     *
+     * @param string $key     Data Key
+     * @param mixed  $default Default value
+     *
+     * @return mixed Previously memorized data or $default
+     */
+    public function learn($key, $default = null)
+    {
+        if (!session_id()) {
+            $this->initializeSession(false);
+        }
+
+        if (!isset($_SESSION['o'][$this->name][$key])
+            || is_null($_SESSION['o'][$this->name][$key])
+        ) {
+            if (is_callable($default)) {
+                $default = call_user_func($default);
+            }
+
+            return $this->memorize($key, $default);
+        } else {
+            return $this->recall($key);
+        }
+    }
+
+    /**
+     * Forget session data for arg $key. If $key is omitted will forget all
+     * associated session data.
+     *
+     * @param string $key Optional key of data to forget
+     *
+     * @return AbstractObject $this
+     */
+    public function forget($key = null)
+    {
+        if (!session_id()) {
+            $this->initializeSession(false);
+        }
+
+        if (is_null($key)) {
+            unset($_SESSION['o'][$this->name]);
+            unset($_SESSION['s'][$this->name]);
+        } else {
+            unset($_SESSION['o'][$this->name][$key]);
+            unset($_SESSION['s'][$this->name][$key]);
+        }
+
+        return $this;
+    }
+
+    /**
+     * Returns session data for this object. If not previously set, then
+     * $default is returned.
+     *
+     * @param string $key     Data Key
+     * @param mixed  $default Default value
+     *
+     * @return mixed Previously memorized data or $default
+     */
+    public function recall($key, $default = null)
+    {
+        if (!session_id()) {
+            $this->initializeSession(false);
+        }
+
+        if (!isset($_SESSION['o'][$this->name][$key])
+            || is_null($_SESSION['o'][$this->name][$key])
+        ) {
+            if (!isset($_SESSION['s'][$this->name][$key])) {
+                return $default;
+            }
+            $v = $this->add(unserialize($_SESSION['s'][$this->name][$key]));
+            $v->init();
+
+            return $v;
+        }
+
+        return $_SESSION['o'][$this->name][$key];
+    }
+
+    public function initializeSession($create = true)
+    {
+        /* Attempts to re-initialize session. If session is not found,
+           new one will be created, unless $create is set to false. Avoiding
+           session creation and placing cookies is to enhance user privacy.
+        Call to memorize() / recall() will automatically create session */
+
+        if ($this->is_initialized || session_id()) {
+            return;
+        }
+
+        // Change settings if defined in settings file
+        $params = session_get_cookie_params();
+
+        $params['httponly'] = true;   // true by default
+
+        if ($create === false && !isset($_COOKIE[$this->name])) {
+            return;
+        }
+        $this->is_initialized = true;
+        session_set_cookie_params(
+            $params['lifetime'],
+            $params['path'],
+            $params['domain'],
+            $params['secure'],
+            $params['httponly']
+        );
+        session_name($this->name);
+        session_start();
+    }
+
+    /** Completely destroy existing session */
+    public function destroySession()
+    {
+        if ($this->is_initialized) {
+            $_SESSION = [];
+            if (isset($_COOKIE[$this->name])) {
+                setcookie($this->name, '', time() - 42000, '/');
+            }
+            session_destroy();
+            $this->is_initialized = false;
+        }
+    }
+}

demos/modal2.php

@@ -0,0 +1,163 @@
+<?php
+
+require 'Session.php';
+require 'init.php';
+
+$session = new Session();
+
+/********** VIRTUAL ******************/
+
+$layout->add(['Header', 'Virtual Page in modal']);
+
+$modal_vp1 = $layout->add(['Modal', 'title' =>'Lorem Ipsum from a virutal page']);
+$modal_vp2 = $layout->add(['Modal', 'title' =>'Message from a virutal page'])->addClass('small');
+
+$vp = $layout->add('VirtualPage'); // this page will not be visible unless you trigger it specifically
+$vp->add(['Header', 'Contens of your pop-up here']);
+$vp->add(['LoremIpsum', 'size'=>2]);
+$vp->add('Button')->set('Open next virutal page')->on('click', $modal_vp2->show());
+
+$vp1 = $layout->add('VirtualPage'); // this page will not be visible unless you trigger it specifically
+$vp1->add('Message')->text->addParagraph('This text belong to a second virtual page');
+
+$modal_vp1->addVirtualPage($vp);
+$modal_vp2->addVirtualPage($vp1);
+
+$bar = $layout->add(['View', 'ui'=>'buttons']);
+$b = $bar->add('Button')->set('Open first Virtual page');
+$b->on('click', $modal_vp1->show());
+
+/********** ANIMATION ***************/
+
+$menu_items = [
+    'scale'  => [],
+    'flip'   => ['horizontal flip', 'vertical flip'],
+    'fade'   => ['fade up', 'fade down', 'fade left', 'fade right'],
+    'drop'   => [],
+    'fly'    => ['fly left', 'fly right', 'fly up', 'fly down'],
+    'swing'  => ['swing left', 'swing right', 'swing up', 'swing down'],
+    'slide'  => ['slide left', 'slide right', 'slide up', 'slide down'],
+    'browse' => ['browse', 'browse right'],
+    'static' => ['jiggle', 'flash', 'shake', 'pulse', 'tada', 'bounce'],
+];
+
+$layout->add(['Header', 'Modal Animation']);
+
+$modal_transition = $layout->add(['Modal', 'title' =>'Animated modal']);
+$modal_transition->add('Message')->set('A lot of animated transition available');
+$modal_transition->duration(1000);
+
+$menu_bar = $layout->add(['View', 'ui'=>'buttons']);
+$main = $menu_bar->add('Menu');
+$tm = $main->addMenu('Select Transition');
+
+foreach ($menu_items as $key=>$items) {
+    if (!empty($items)) {
+        $sm = $tm->addMenu($key);
+        foreach ($items as $item) {
+            $smi = $sm->addItem($item);
+            $smi->on('click', $modal_transition->js()->modal('setting', 'transition', $smi->js()->text())->modal('show'));
+        }
+    } else {
+        $mi = $tm->addItem($key);
+        $mi->on('click', $modal_transition->js()->modal('setting', 'transition', $mi->js()->text())->modal('show'));
+    }
+}
+
+/************** DENY APPROVE *********/
+
+$layout->add(['Header', 'Modal Options']);
+
+$modal_da = $layout->add(['Modal', 'title'=>'Deny / Approve actions']);
+$modal_da->add('Message')->set('This modal is only closable via the green button');
+$modal_da->addDenyAction('No', new \atk4\ui\jsExpression('function(){window.alert("Can\'t do that."); return false;}'));
+$modal_da->addApproveAction('Yes', new \atk4\ui\jsExpression('function(){window.alert("You\'re good to go!");}'));
+$modal_da->notClosable();
+
+$menu_bar = $layout->add(['View', 'ui'=>'buttons']);
+$b = $menu_bar->add('Button')->set('Show Deny/Approve');
+$b->on('click', $modal_da->show());
+
+/************** MULTI STEP *********/
+
+$layout->add(['Header', 'Modal Multi Step']);
+
+$modal_step = $layout->add(['Modal', 'title'=>'Multi step actions']);
+$modal_step->setOption('observeChanges', true);
+
+$action = new \atk4\ui\View(['ui'=>'buttons']);
+$prev_action = new \atk4\ui\Button(['Prev', 'labeled', 'icon' =>'left arrow']);
+$next_action = new \atk4\ui\Button(['Next', 'iconRight' =>'right arrow']);
+
+$action->add($prev_action);
+$action->add($next_action);
+
+$modal_step->addButtonAction($action);
+
+$vp_step = $layout->add('VirtualPage');
+$vp_step->set(function ($vp_step) use ($modal_step, $session, $prev_action, $next_action) {
+    $page = $session->recall('page', 1);
+    $success = $session->recall('success', false);
+    if (isset($_GET['move'])) {
+        if ($_GET['move'] === 'next' && $success) {
+            ++$page;
+        }
+        if ($_GET['move'] === 'prev' && $page > 1) {
+            --$page;
+        }
+        $session->memorize('success', false);
+        $success = false;
+    } else {
+        $page = 1;
+    }
+    $session->memorize('page', $page);
+    if ($page === 1) {
+        $vp_step->add('Message')->set('Thanks for choosing us. We will be asking some questions along the way.');
+        $session->memorize('success', true);
+        $vp_step->js(true, $prev_action->js(true)->show());
+        $vp_step->js(true, $next_action->js(true)->show());
+        $vp_step->js(true, $prev_action->js()->addClass('disabled'));
+        $vp_step->js(true, $next_action->js(true)->removeClass('disabled'));
+    } elseif ($page === 2) {
+        $a = [];
+        $m_register = new \atk4\data\Model(new \atk4\data\Persistence_Array($a));
+        $m_register->addField('name', ['caption'=>'Please enter your name (John)']);
+
+        $f = $vp_step->add(new \atk4\ui\Form(['segment'=>true]));
+        $f->setModel($m_register);
+
+        $f->onSubmit(function ($f) use ($next_action, $session) {
+            if ($f->model['name'] != 'John') {
+                return $f->error('name', 'Your name is not John! It is "'.$f->model['name'].'". It should be John. Pleeease!');
+            } else {
+                $session->memorize('success', true);
+                $session->memorize('name', $f->model['name']);
+                $js[] = $f->success('Thank you, '.$f->model['name'].' you can go on!');
+                $js[] = $next_action->js()->removeClass('disabled');
+
+                return $js;
+            }
+        });
+        $vp_step->js(true, $prev_action->js()->removeClass('disabled'));
+        $vp_step->js(true, $next_action->js(true)->addClass('disabled'));
+    } elseif ($page === 3) {
+        $name = $session->recall('name');
+        $vp_step->add('Message')->set("Thank you ${name} for visiting us! We will be in touch");
+        $session->memorize('success', true);
+        $vp_step->js(true, $prev_action->js(true)->hide());
+        $vp_step->js(true, $next_action->js(true)->hide());
+    }
+    $modal_step->js(true)->modal('refresh');
+});
+
+$modal_step->addVirtualPage($vp_step);
+$next_action->on('click', $modal_step->js()->reloadView(
+    ['uri' => $vp_step->getURL('cut'), 'uri_options' => ['json' => true, 'move' => 'next']]
+));
+$prev_action->on('click', $modal_step->js()->reloadView(
+    ['uri' => $vp_step->getURL('cut'), 'uri_options' => ['json' => true, 'move' => 'prev']]
+));
+
+$menu_bar = $layout->add(['View', 'ui'=>'buttons']);
+$b = $menu_bar->add('Button')->set('Multi Step Modal');
+$b->on('click', $modal_step->show());