phpMv UI

مكتبة المكونات المرئية (JQuery UI، Twitter Bootstrap، Semantic-UI) لأطر عمل php وphp MVC

موقع phpMv-UI

ما هو phpMv-UI؟

phpMv-UI هي مكتبة مكونات مرئية لـ php: غلاف php لمكونات jQuery وواجهة المستخدم (jQuery، Twitter Bootstrap، Semantic-UI).

باستخدام حقن التبعية، يمكن حقن كائن jQuery في حاوية إطار عمل php ، مما يسمح بإنشاء نصوص jQuery في وحدات التحكم، مع احترام نمط تصميم MVC.

المتطلبات / التبعيات

• بي إتش بي >= 7.0
• مسج>= 2.0.3
• واجهة مستخدم JQuery >= 1.10 [اختياري]
• Twitter Bootstrap >= 3.3.2 [اختياري]
• واجهة المستخدم الدلالية >= 2.2 أو واجهة المستخدم اللغوية >= 2.7 [اختياري]

موارد

• واجهة برمجة التطبيقات
• التوثيق/العرض التوضيحي
• واجهة المستخدم الدلالية

أنا - التثبيت

التثبيت عبر الملحن

قم بتثبيت Composer في مكان مشترك أو في مشروعك:

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

قم بإنشاء ملف Composer.json في دليل التطبيق كما يلي:

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

في دليل التطبيق، قم بتشغيل مُثبت الملحن:

php composer.phar install

التثبيت عبر جيثب

ما عليك سوى استنساخ المستودع في موقع مشترك أو داخل مشروعك:

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

II تكوين أطر PHP

تحميل المكتبة

يتوافق phpMv-UI مع توصيات PSR-4 لفئات التحميل التلقائي. مهما كان إطار عمل php المستخدم، مع "composer"، يكفي دمج ملف التحميل التلقائي لـ Composer.

 require_once ( " vendor/autoload.php " );

التكوين في كل مكان

تحميل المكتبة

تم تحميل المكتبة بالفعل افتراضيًا في ملف التكوين app/config/config.php :

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

استخدامها في وحدات التحكم

مثال على إنشاء زر Semantic-UI

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

تكوين فالكون

تحميل المكتبة

بدون Composer، من الممكن تحميل المكتبة بالملف app/config/loader.php :

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

حقن الخدمة

من الضروري إدخال خدمة JQuery عند بدء تشغيل التطبيق، في ملف الخدمة app/config/services.php ، وإذا لزم الأمر، قم بإنشاء مثيل Semantic أو Bootstrap أو Jquery-ui :

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

استخدامها في وحدات التحكم

مثال على إنشاء زر Semantic-UI

 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 ;
	}
}

تكوين كود إشعال

تحميل المكتبة

إذا كنت تريد أن يستخدم CodeIgniter برنامج تحميل Composer التلقائي، فما عليك سوى تعيين $config['composer_autoload'] على TRUE أو مسار مخصص في application/config/config.php .

ثم، من الضروري إنشاء مكتبة لفئة JsUtils

إنشاء المكتبة

قم بإنشاء مكتبة XsUtils (الاسم مجاني) في المجلد application/libraries

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

حقن الخدمة

قم بإضافة تحميل مكتبة XsUtils في الملف application/config/autoload.php

سيتم الوصول إلى عضو jquery في وحدات التحكم

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

بمجرد التحميل، يمكنك الوصول إلى فصلك في وحدات التحكم باستخدام العضو $jquery :

 $ this -> jquery -> some_method ();

تكوين لارافيل

تحميل المكتبة

إذا كنت لا تستخدم ملف Composer autoloader، فيمكنك أيضًا تحميل phpMv-UI باستخدام Composer.json :

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

حقن الخدمة

قم بتسجيل Singleton في ملف 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 ;
});

ومن الممكن بعد ذلك حقن فئة JsUtils في مُنشئ وحدات تحكم الفئة الأساسية:

 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 ;
    }
}

تكوين يي

تحميل المكتبة

يمكن تحميل الفئات الموجودة في حزم Composer المثبتة تلقائيًا باستخدام برنامج تحميل Composer التلقائي. تأكد من أن برنامج الإدخال الخاص بتطبيقك يحتوي على الأسطر التالية لتثبيت أداة التحميل التلقائي للمؤلف:

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

في نفس الملف، قم بتسجيل تبعية جديدة:

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

حقن الخدمة

يمكن بعد ذلك حقن المفردة JsUtils في وحدات التحكم

 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 ;
	}
}

تكوين سيمفوني

تحميل المكتبة

إذا كنت لا تستخدم ملف أداة التحميل التلقائي Composer، فيمكنك أيضًا تحميل phpMv-UI باستخدام 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 ();

سيمفوني 4

إنشاء خدمة وراثة من JquerySemantic

 namespace App  Services  semantic ;

use Ajax  php  symfony  JquerySemantic ;

class SemanticGui extends JquerySemantic{
}

تأكد من تنشيط التوصيل التلقائي في config/services.yml :

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

يمكنك بعد ذلك استخدام حقن التبعية على الخصائص أو المنشئات أو المستوطنين:

 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 " );
    }
}

سيمفوني 3

حقن الخدمة

قم بإنشاء خدمتين في الملف app/config/services.yml :

• الأول لمثيل JsUtils
• والثاني للتحكم

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

من الممكن بعد ذلك إدخال حاوية Symfony وخدمة JsUtils في مُنشئ وحدة التحكم:

 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 ;
	}
}

تكوين CakePhp

إنشاء المكون

انسخ الملف JsUtilsComponent.php الموجود في المورد/phpmv/php-mv-ui/Ajax/php/cakephp إلى مجلد src/controller/component الخاص بمشروعك

تحميل المكونات في وحدات التحكم

أضف تحميل مكون JsUtils في طريقة التهيئة لوحدة التحكم الأساسية AppController ، الموجودة في src/controller/appController.php

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

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

الاستخدام

سيكون كائن jquery في وحدة التحكم متاحًا للوصول إلى $this->JsUtils->jquery

إكمال التعليمات البرمجية في IDE

مع معظم بيئات التطوير (مثل Eclipse أو phpStorm)، للحصول على إكمال التعليمات البرمجية على مثيل $jquery ، يجب عليك إضافة الخاصية التالية في وثائق وحدة التحكم:

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