phpMv UI

Biblioteca de componentes visuales (JQuery UI, Twitter Bootstrap, Semantic-UI) para frameworks php y php MVC

sitio web phpMv-UI

¿Qué es phpMv-UI?

phpMv-UI es una biblioteca de componentes visuales para php: un contenedor de php para componentes jQuery y UI (jQuery, Twitter Bootstrap, Semantic-UI).

Utilizando la inyección de dependencia, el objeto jQuery se puede inyectar en el contenedor del framework php , permitiendo la generación de scripts jQuery en los controladores, respetando el patrón de diseño MVC.

Requisitos/Dependencias

• PHP >= 7.0
• JQuery >= 2.0.3
• JQuery UI >= 1.10 [opcional]
• Twitter Bootstrap >= 3.3.2 [opcional]
• Semantic-UI >= 2.2 o Fomantic-UI >= 2.7 [opcional]

Recursos

• API
• Documentación/demostración
• Semántica-ui Fomantic-ui

Yo - Instalación

Instalación a través de Composer

Instale Composer en una ubicación común o en su proyecto:

curl -s http://getcomposer.org/installer | php

Cree el archivo compositor.json en el directorio de la aplicación de la siguiente manera:

{
    "require" : {
        "phpmv/php-mv-ui" : " ^2.3 "
    }
}

En el directorio de la aplicación, ejecute el instalador del compositor:

php composer.phar install

Instalación a través de Github

Simplemente clona el repositorio en una ubicación común o dentro de tu proyecto:

 git clone https://github.com/phpMv/phpMv-UI.git

II configuración de frameworks PHP

Cargando biblioteca

phpMv-UI cumple con las recomendaciones de PSR-4 para clases de carga automática. Cualquiera que sea el marco PHP utilizado, con "composer", basta con integrar el archivo de carga automática de Composer.

 require_once ( " vendor/autoload.php " );

Configuración de ubicuidad

Cargando biblioteca

La biblioteca ya está cargada de forma predeterminada en el archivo de configuración app/config/config.php :

	" di " => array (
			" @exec " => array ( " jquery " => function ( $ controller ){
						return  Ajax  php  ubiquity JsUtils:: diSemantic ( $ controller );
					})
			),

Uso en controladores

Ejemplo de creación de un botón de interfaz de usuario semántica

 /**
 * @property AjaxphpubiquityJsUtils $jquery
 */
class ExempleController extends Controller{
	public function index (){
		$ semantic = $ this -> jquery -> semantic ();
		$ button = $ semantic -> htmlButton ( " btTest " , " Test Button " );
		echo $ button ;
	}
}

Configuración de falcón

Cargando biblioteca

Sin Composer, es posible cargar la biblioteca con el archivo app/config/loader.php :

 $ loader = new  Phalcon  Loader ();
$ loader -> registerNamespaces ( array (
		' Ajax ' => __DIR__ . ' /../vendor/phpmv/php-mv-ui/Ajax/ '
))-> register ();

inyección del servicio

Es necesario inyectar el servicio JQuery al inicio de la aplicación, en el archivo de servicio app/config/services.php y, si es necesario, crear una instancia de Semantic, Bootstrap o Jquery-ui:

 $ di -> set ( " jquery " , function (){
    $ jquery = new Ajax  php  phalcon  JsUtils ();
    $ jquery -> semantic ( new Ajax  Semantic ()); //for Semantic UI
    return $ jquery ;
});

Uso en controladores

Ejemplo de creación de un botón de interfaz de usuario semántica

 use Phalcon  Mvc  Controller ;
use Ajax  php  phalcon  JsUtils ;
/**
 * @property JsUtils $jquery
 */
class ExempleController extends Controller{
	public function indexAction (){
		$ semantic = $ this -> jquery -> semantic ();
		$ button = $ semantic -> htmlButton ( " btTest " , " Test Button " );
		echo $ button ;
	}
}

Configuración de CodeIgniter

Cargando biblioteca

Si desea que CodeIgniter use un cargador automático de Composer, simplemente configure $config['composer_autoload'] en TRUE o una ruta personalizada en application/config/config.php .

Entonces es necesario crear una biblioteca para la clase JsUtils.

Creación de biblioteca

Cree la biblioteca XsUtils (el nombre es gratuito) en la carpeta aplicación/bibliotecas

 use Ajax  php  ci  JsUtils ;
class XsUtils extends Ajax  php  ci JsUtils{
	public function __construct (){
		parent :: __construct ([ " semantic " => true , " debug " => false ]);
	}
}

inyección del servicio

Agregue la carga de la biblioteca XsUtils en el archivo application/config/autoload.php

El miembro jquery será accesible en los controladores.

 $ autoload [ ' libraries ' ] = array ( ' XsUtils ' => ' jquery ' );

Una vez cargado, puedes acceder a tu clase en controladores usando el miembro $jquery :

 $ this -> jquery -> some_method ();

configuración de laravel

Cargando biblioteca

Si no utiliza el archivo de carga automática de Composer, también puede cargar phpMv-UI con compositor.json:

 "autoload" : {
    "classmap" : [
        ...
    ],
    "psr-4" : {
        "Ajax \ " : " vendor/phpmv/php-mv-ui/Ajax "
    }
},

inyección del servicio

Registre un Singleton en el archivo bootstrap/app.php :

 $ app -> singleton ( Ajax  php  laravel JsUtils::class, function ( $ app ){
	$ result = new Ajax  php  laravel  JsUtils ();
	$ result -> semantic ( new Ajax  Semantic ());
	return $ result ;
});

Entonces es posible inyectar la clase JsUtils en el constructor de controladores de clase base:

 use Ajax  php  laravel  JsUtils ;
class Controller extends BaseController{
    use AuthorizesRequests, AuthorizesResources, DispatchesJobs, ValidatesRequests;
    protected $ jquery ;

    public function __construct ( JsUtils $ js ){
    	$ this -> jquery = $ js ;
    }

    public function getJquery () {
    	return $ this -> jquery ;
    }
}

configuración yii

Cargando biblioteca

Las clases de los paquetes Composer instalados se pueden cargar automáticamente utilizando el cargador automático de Composer. Asegúrese de que el script de entrada de su aplicación contenga las siguientes líneas para instalar el cargador automático de Composer:

 require ( __DIR__ . ' /../vendor/autoload.php ' );
require ( __DIR__ . ' /../vendor/yiisoft/yii2/Yii.php ' );

En el mismo archivo, registre una nueva dependencia:

Yii:: $ container -> setSingleton ( " AjaxphpyiiJsUtils " ,[ " bootstrap " => new Ajax  Semantic ()]);

inyección del servicio

El singleton de JsUtils luego se puede inyectar en los controladores.

 namespace app  controllers ;

use yii  web  Controller ;
use Ajax  php  yii  JsUtils ;

class SiteController extends Controller{
	protected $ jquery ;

	public function __construct ( $ id , $ module , JsUtils $ js ){
		parent :: __construct ( $ id , $ module );
		$ this -> jquery = $ js ;
	}
}

Configuración de Symfony

Cargando biblioteca

Si no utiliza el archivo del cargador automático de Composer, también puede cargar phpMv-UI con Ps4ClassLoader:

 use Symfony  Component  ClassLoader  Psr4ClassLoader ;

require __DIR__ . ' /lib/ClassLoader/Psr4ClassLoader.php ' ;

$ loader = new Psr4ClassLoader ();
$ loader -> addPrefix ( ' Ajax \' , __DIR__ . ' /lib/phpmv/php-mv-ui/Ajax ' );
$ loader -> register ();

Symfony 4

Crear un servicio heredado de JquerySemantic

 namespace App  Services  semantic ;

use Ajax  php  symfony  JquerySemantic ;

class SemanticGui extends JquerySemantic{
}

Compruebe que el cableado automático esté activado en config/services.yml :

 services :
    # default configuration for services in *this* file
    _defaults :
        autowire : true      # Automatically injects dependencies in your services.

Luego puede usar la inyección de dependencia en propiedades, constructores o definidores:

 namespace App  Controller ;

use Symfony  Bundle  FrameworkBundle  Controller  AbstractController ;
use App  Services  semantic  SemanticGui ;

BarController extends AbstractController{
	/**
	 * @var SemanticGui
	 */
	protected $ gui ;

    public function loadViewWithAjaxButtonAction (){
    	$ bt = $ this -> gui -> semantic ()-> htmlButton ( ' button1 ' , ' a button ' );
    	$ bt -> getOnClick ( " /url " , ' #responseElement ' );
    	return $ this -> gui -> renderView ( " barView.html.twig " );
    }
}

Symfony 3

inyección del servicio

Cree 2 servicios en el archivo app/config/services.yml :

• El primero para la instancia de JsUtils.
• El segundo para el controlador.

 parameters :
    jquery.params :
        semantic : true
services :
    jquery :
        class : AjaxphpsymfonyJsUtils 
        arguments : [%jquery.params%,'@router']
        scope : request
    app.default_controller :
        class : AppBundleControllerDefaultController 
        arguments : ['@service_container','@jquery']

Entonces es posible inyectar el contenedor Symfony y el servicio JsUtils en el constructor del controlador:

 namespace AppBundle  Controller ;

use Sensio  Bundle  FrameworkExtraBundle  Configuration  Route ;
use Symfony  Bundle  FrameworkBundle  Controller  Controller ;
use Symfony  Component  DependencyInjection  ContainerInterface ;
use Ajax  php  symfony  JsUtils ;
use AppBundle  AppBundle ;

/**
 * @Route(service="app.default_controller")
 */
class DefaultController extends Controller{
	/**
	 * @var AjaxphpsymfonyJsUtils
	 */
	protected $ jquery ;

	public function __construct ( ContainerInterface $ container , JsUtils $ js ){
		$ this -> container = $ container ;
		$ this -> jquery = $ js ;
	}
}

Configuración de CakePhp

Creación de componentes

Copie el archivo JsUtilsComponent.php ubicado en seller/phpmv/php-mv-ui/Ajax/php/cakephp a la carpeta src/controller/component de su proyecto

Carga de componentes en controladores.

Agregue la carga del componente JsUtils en el método de inicialización del controlador base AppController , ubicado en src/controller/appController.php

    public function initialize (){
        parent :: initialize ();

        $ this -> loadComponent ( ' RequestHandler ' );
        $ this -> loadComponent ( ' Flash ' );
        $ this -> loadComponent ( ' JsUtils ' ,[ " semantic " => true ]);
    }

Uso

Se podrá acceder al objeto jquery en el controlador en $this->JsUtils->jquery

Finalización de código en IDE

Con la mayoría de los IDE (como Eclipse o phpStorm), para completar el código en la instancia $jquery , debe agregar la siguiente propiedad en la documentación del controlador:

 /**
  * @property AjaxJsUtils $jquery
  */
class MyController{
}