1.1.0

Pacote composer criado

README.md

@@ -15,13 +15,22 @@ https://github.com/kamranahmedse/driver.js?ref=producthunt
 
 ## Instalação
 
-Copie a classe "AutoTutorial.php" para a pasta app/controler/
 
-Copie essas 2 linhas e coloque no fim do seu arquivo app/templates/themeX/layout.html e no caso de utilizar no login ou cadastro no arquivo login.html
+Para instalar no Adianti Builder, vá na aba de "composer packages" e adicione:
 ```html
-<script src="https://unpkg.com/driver.js/dist/driver.min.js"></script>
-<link rel="stylesheet" href="https://unpkg.com/driver.js/dist/driver.min.css">
+andregasparin/autotutorial
 ```
+
+É necessário que você tenha o composer instalado.
+
+Abra seu cmd (prompt), com o comando "cd c:/pasta/do/projeto" navegue até a raiz do seu projeto em adianti.
+
+Execute o seguinte comando (podem variar no caso de usar linux ou mac, ex utilizar sudo no início):
+
+```html
+composer require andregasparin/autotutorial
+```
+
 ## Utilização
 
 Adicione a classe para iniciar o tutorial, ex:
@@ -64,7 +73,8 @@ Caso queira implementar algo no sistema, utilize os padrões do Adianti Framewor
 
 * 1.0.0
     * Projeto criado
-
+* 1.1.0
+    * Pacote composer criado
 ## Meta
 
 André Gasparin – [@andre-gasparin] – andre@gasparimsat.com.br / andre.gasparin@hotmail.com

composer.json

@@ -0,0 +1,18 @@
+{
+    "name": "andregasparin/autotutorial",
+    "description": "Gerador simples de auto tutorial para adianti.",
+    "type": "library",
+    "license": "MIT",
+    "authors": [
+        {
+            "name": "André Gasparin",
+            "email": "andre.gasparin@hotmail.com"
+        }
+    ],
+    "require": {},
+    "autoload": {
+        "psr-4": {
+            "AndreGasparin\\AutoTutorial\\": "src"
+        }
+    }
+}

src/AutoTutorial.php

@@ -0,0 +1,105 @@
+<?php
+namespace AndreGasparin\AutoTutorial;
+    /**
+     * Por: André Gasparin
+     */
+class AutoTutorial
+{
+    private $header; 
+    private $steps = array(); 
+    private $id;
+
+
+    public function __construct()
+    {
+		echo '
+			<script src="https://unpkg.com/driver.js/dist/driver.min.js"></script>
+			<link rel="stylesheet" href="https://unpkg.com/driver.js/dist/driver.min.css">
+		';
+
+        $this->id = uniqid();
+        $this->header = "function tutorial".$this->id."(){ const con".$this->id." = new Driver( {   animate: false, doneBtnText: 'Concluir', closeBtnText: 'Fechar', nextBtnText: 'Próximo',  prevBtnText: 'Anterior'} ); con".$this->id.".defineSteps([ ";
+    }
+
+    public function setStepsArray( $steps )
+    {
+        foreach($steps as $key=>$step )
+        {
+            $this->setStep($step, $key);
+        }
+    }
+
+    public function setStep($step, $key)
+    {
+        foreach($step as $item => $value )
+        {
+            $this->steps[$key][$item] = $value;
+        }
+        $this->createStep($key);
+    }
+
+    private function createStep($key)
+    {
+        $selector = $this->createElement($this->steps[$key]['selector'], $this->steps[$key]['selector_type']);
+        $position = isset($this->steps[$key]['position'])   == null ? 'bottom-center' : $this->steps[$key]['position'];
+        $onNext =   isset($this->steps[$key]['onNextPage']) == null ? null : ' onNext: () => { __adianti_load_page(\''.$this->steps[$key]['onNextPage'].'\');}';
+
+        $this->steps[$key]['content'] = " {";
+        $this->steps[$key]['content'] .= " element: '".$selector."',";
+        $this->steps[$key]['content'] .= " popover: {";
+        $this->steps[$key]['content'] .= " className: 'first-step-popover-class',";
+        $this->steps[$key]['content'] .= " title: '".$this->steps[$key]['title']."',";
+        $this->steps[$key]['content'] .= " description: '".$this->steps[$key]['description']."',";
+        $this->steps[$key]['content'] .= " position: '".$position."'";
+        $this->steps[$key]['content'] .= " },";
+        $this->steps[$key]['content'] .= $onNext;
+        $this->steps[$key]['content'] .= " },";      
+
+    }
+
+    private function createElement($selector, $selector_type)
+    {
+        if($selector_type == 'id')
+            $string_selector = '#'.$selector;
+        elseif($selector_type == 'class')
+            $string_selector = '.'.$selector;
+        else
+            $string_selector = '['. $selector_type.'="'.$selector.'"]';
+
+        return $string_selector;
+    }
+
+
+    public function run($debug = false)
+    {
+        $js  = $this->header;
+        $js .= $this->runSteps();
+        $js .=  ' ]); ';
+        $js .=  'con'.$this->id.'.start(); ';
+        $js .=  ' }';
+        $js .=  ' $( document ).ready(function() { ';
+        $js .=  ' tutorial'.$this->id.'(); ';
+        $js .=  ' });';
+
+        TScript::create($js);
+        echo "<style> .driver-highlighted-element { z-index: 100004 !important;   pointer-events: none !important;   }  </style>";
+        if($debug == true) echo 'JS: <pre>'.$js.'</pre>';
+    }
+
+    private function runSteps()
+    {
+        $js = '';
+        foreach($this->steps as $key => $value){
+            $js .= ' '.$this->steps[$key]['content'];
+        }
+        return $js;
+    }
+
+    public function debug()
+    {
+        echo '<pre>';
+        print_r($this->steps);
+        echo '</pre>';
+    }
+
+}