V.3 Changes (#34)

* Integration with v.3 * Update README.md and remove jquery and font-awesome dependency * Update readme * Add code to use third party plugins * Update README.md for font-awesome
froala · Apr 17, 2019 · 9b04d54 · 9b04d54
1 parent 5b241de
commit 9b04d54
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 19 deletions.
diff --git a/README.md b/README.md
@@ -61,6 +61,11 @@ or use with a model:
 ]); ?>
 ```
 
+add Font-awesome cdn for font-awesome plugin
+```php
+<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+```
+
 ## Upload example
 
 Using the basic Yii template make a new folder under /web/ called uploads.
@@ -166,8 +171,8 @@ In the view:
 In /basic/assets/alert.js:
 
 ```js
-$.FroalaEditor.DefineIcon('alert', {NAME: 'info'});
-$.FroalaEditor.RegisterCommand('alert', {
+FroalaEditor.DefineIcon('alert', {NAME: 'info'});
+FroalaEditor.RegisterCommand('alert', {
         title: 'Hello',
         focus: false,
         undo: false,

diff --git a/composer.json b/composer.json
@@ -1,20 +1,18 @@
 {
     "name": "froala/yii2-froala-editor",
-    "version": "2.9.3",
-    "description": "A beautiful jQuery WYSIWYG HTML text editor based on HTML5 technology. Cross browser, with mobile support, high performance and Retina Ready modern design.",
+    "version": "3.0.0-beta.1",
+    "description": "A beautiful WYSIWYG HTML text editor based on HTML5 technology. Cross browser, with mobile support, high performance and Retina Ready modern design.",
     "type": "yii2-extension",
     "keywords": [
         "froala",
         "html",
         "text",
         "editor",
         "wysiwyg",
-        "jquery-plugin",
         "rich editor",
         "rich text editor",
         "rte",
-        "javascript",
-        "jquery"
+        "javascript"
     ],
     "license": "MIT",
     "authors": [

diff --git a/src/FroalaEditorAsset.php b/src/FroalaEditorAsset.php
@@ -40,15 +40,6 @@ class FroalaEditorAsset extends AssetBundle
         'css/froala_style.min.css',
     ];
 
-    /**
-     * @var array
-     */
-    public $depends = [
-        // use depends instead of direct CDNs
-        '\yii\web\JqueryAsset',
-        '\rmrevin\yii\fontawesome\AssetBundle',
-    ];
-
     /**
      * @var array
      */
@@ -125,14 +116,25 @@ public function registerClientPlugins($clientPlugins, $excludedPlugins)
     public function registerPlugin($pluginName, $checkJs = true, $checkCss = true)
     {
         $jsFile = "js/plugins/$pluginName.min.js";
-        if ($checkJs || $this->isPluginJsFileExist($pluginName)) {
+        if ($checkJs && $this->isPluginJsFileExist($pluginName)) {
             $this->addJs($jsFile);
             $cssFile = "css/plugins/$pluginName.min.css";
             if (!$checkCss || $this->isPluginCssFileExist($pluginName)) {
                 $this->addCss($cssFile);
             }
         } else {
-            throw new Exception("plugin '$pluginName' is not supported, if you trying to set custom plugin, please set 'js' and 'css' options for your plugin");
+            $thirdPartyJsFile = "js/third_party/$pluginName.min.js";
+            if($checkJs && $this->isThirdPartyPluginJsFileExist($pluginName)) {
+                $this->addJs($thirdPartyJsFile);
+                $thirdPartyCssFile = "css/third_party/$pluginName.min.css";
+                if (!$checkCss || $this->isThirdPartyPluginCssFileExist($pluginName)) {
+                    $this->addCss($thirdPartyCssFile);
+                }
+            }
+            else {
+                throw new Exception("plugin '$pluginName' is not supported, if you trying to set custom plugin, please set 'js' and 'css' options for your plugin");
+            }
+
         }
     }
 
@@ -157,6 +159,11 @@ public function isPluginJsFileExist($pluginName)
         return is_file($this->sourcePath . '/' . $this->getDefaultJsUrl($pluginName));
     }
 
+    public function isThirdPartyPluginJsFileExist($pluginName)
+    {
+        return is_file($this->sourcePath . '/' . $this->getDefaultThirdPartyJsUrl($pluginName));
+    }
+
     /**
      * @param $pluginName
      * @return bool
@@ -166,6 +173,11 @@ public function isPluginCssFileExist($pluginName)
         return is_file($this->sourcePath . '/' . $this->getDefaultCssUrl($pluginName));
     }
 
+    public function isThirdPartyPluginCssFileExist($pluginName)
+    {
+        return is_file($this->sourcePath . '/' . $this->getDefaultThirdPartyCssUrl($pluginName));
+    }
+
     /**
      * @param $pluginName
      * @param $excludedPlugins
@@ -201,6 +213,11 @@ public function getDefaultCssUrl($pluginName)
         return "css/plugins/{$pluginName}.min.css";
     }
 
+    public function getDefaultThirdPartyCssUrl($pluginName)
+    {
+        return "css/third_party/{$pluginName}.min.css";
+    }
+
     /**
      * @param $pluginName
      * @return string
@@ -209,4 +226,9 @@ private function getDefaultJsUrl($pluginName)
     {
         return "js/plugins/{$pluginName}.min.js";
     }
+
+    private function getDefaultThirdPartyJsUrl($pluginName)
+    {
+        return "js/third_party/{$pluginName}.min.js";
+    }
 }
diff --git a/src/FroalaEditorWidget.php b/src/FroalaEditorWidget.php
@@ -108,6 +108,6 @@ public function registerClientScript()
         $jsOptions = array_merge($this->clientOptions, $pluginsEnabled ? ['pluginsEnabled' => $pluginsEnabled] : []);
         $jsOptions = Json::encode($jsOptions);
 
-        $view->registerJs("\$('#$id').froalaEditor($jsOptions);");
+        $view->registerJs("new FroalaEditor('#$id',$jsOptions);");
     }
 }