Add theme managing.

Author: alxgh

DatePicker.php

@@ -17,26 +17,40 @@ class DatePicker extends InputWidget
 	 */
 	public $clientOptions = ['formatDate' => "YYYY/0M/0D"];
 
+	public $theme = 'default';
 	public function init()
 	{
 		parent::init();
 	}
 
 	function run()
 	{
-		$this->registerAsset();
-
 		echo $this->renderInput();
 
 		$this->renderJsCode();
 	}
 	/**
-	 * Register datepicker asset into view.
+	 * Register datepicker default theme asset into view.
+	 */
+	function registerDefaultThemeAsset()
+	{
+		DatePickerDefaultThemeAsset::register($this->getView());
+	}
+	/**
+	 * Register datepicker dark theme asset into view.
+	 */
+	function registerDarkThemeAsset()
+	{
+		DatePickerDarkThemeAsset::register($this->getView());
+	}
+	/**
+	 * Register datepicker assets without into view.
 	 */
-	function registerAsset()
+	function registerNoThemeAsset()
 	{
 		DatePickerAsset::register($this->getView());
 	}
+
 	/**
 	 * Render input.
 	 */
@@ -54,13 +68,23 @@ function renderInput()
 	function renderJsCode()
 	{
 		$name = 'persianDatepicker';
+
 		$id = $this->options['id'];
+
+		$this->clientOptions['theme'] = $this->theme;
+
 		if(! isset($this->clientOptions['onSelect'])) {
 			$this->clientOptions['onSelect'] = "function(){
 				$('#$id').trigger('change');
 			}";
 		}
 
+		if(in_array($this->theme, ['default', 'dark'])) {
+			$this->{"register" . ucfirst($this->theme) . "ThemeAsset"}();
+		} else {
+				$this->registerNoThemeAsset();
+		}
+
 		$onSelect = $this->clientOptions['onSelect'];
 
 		if(isset($this->clientOptions['onShow'])) {
@@ -91,7 +115,6 @@ function renderJsCode()
 			}
 			$options .= '}';
 		}
-
 		$js = "jQuery('#$id').$name($options);";
 
 		$this->getView()->registerJs($js);

DatePickerAsset.php

@@ -14,9 +14,6 @@ class DatePickerAsset extends AssetBundle
 	public $js = [
 		'js/persianDatepicker.min.js',
 	];
-	public $css = [
-		'css/persianDatepicker-default.css',
-	];
 	public $depends = [
 		'yii\web\JqueryAsset',
 	];

DatePickerDarkThemeAsset.php

@@ -0,0 +1,14 @@
+<?php
+
+namespace jDate;
+
+/**
+ * @author Mohammad Mahdi Gholomian.
+ * @copyright 2014 [email protected]
+ */
+class DatePickerDarkThemeAsset extends DatePickerAsset
+{
+	public $css = [
+		'css/persianDatepicker-dark.css',
+	];
+}

DatePickerDefaultThemeAsset.php

@@ -0,0 +1,14 @@
+<?php
+
+namespace jDate;
+
+/**
+ * @author Mohammad Mahdi Gholomian.
+ * @copyright 2014 [email protected]
+ */
+class DatePickerDefaultThemeAsset extends DatePickerAsset
+{
+	public $css = [
+		'css/persianDatepicker-default.css',
+	];
+}

README.md

@@ -80,8 +80,10 @@ Use in `active form`:
 <?= $form->field($model, 'fieldname')->widget(jDate\DatePicker::className()) ?>
 ```
 
-###Datepicker ClientOptions###
-> Add this to ClientOptions
+###Datepicker `ClientOptions`###
+
+> Add these to `ClientOptions` var.
+
 ####Change date picker size:
 
 ```php
@@ -99,7 +101,6 @@ Use in `active form`:
 ]
 ```
 
-
 ####Use english numbers in date picker:
 
 ```php
@@ -116,8 +117,19 @@ Use in `active form`:
 ]
 ```
 
+###Datepicker `Theme`###
+
+Now date picker have 2 theme `default` and `dark`.
+
+For set theme set `theme` var.
+
+```php
+<?= jDate\DatePicker::widget([
+	'model' => $model, 'attribute' => 'date', 'theme' => 'dark'
+]) ?>
+```
 
-###Datepicker Events#####
+###Datepicker `Events`#####
 
 > **NOTE** : If you want rewriting onSelect event and using `active form` add `options[id]` and add 
 >