Skip to content

Commit d3e092f

Browse files
uncleadunclead
authored
Merge pull request #230 from dbd5/master
Integrating font awesome and other Icon libraries
2 parents 556a3fb + 3c84bc5 commit d3e092f

File tree

8 files changed

+168
-8
lines changed

8 files changed

+168
-8
lines changed

‎CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,12 @@ Yii2 multiple input change log
55
=======================
66
- #220 fixed error message for clientValidation and ajaxValidation (antkaz)
77

8+
2.15.1 (for review)
9+
=======================
10+
- #228 added `iconMap` and `iconSource`property for MultipleInput and TabularInput
11+
- #228 changed the following methods to support icon class:
12+
BaseColumn->renderDragColumn(), TableRenderer->renderCellContent(), BaseRenderer->prepareButtons()
13+
814
2.15.0
915
=======================
1016
- #217 added `layoutConfig` property for the ListRenderer (antkaz)

‎README.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -153,6 +153,41 @@ use unclead\multipleinput\MultipleInput;
153153
])->label(false);
154154
```
155155

156+
## Using other icon libraries
157+
Multiple input and Tabular input widgets now support FontAwesome and indeed any other icon library you chose to integrate to your project.
158+
159+
To take advantage of this, please proceed as follows:
160+
1. Include the preferred icon library into your project. If you wish to use fontAwesome, you can use the included FontAwesomeAsset which will integrate the free fa from their CDN;
161+
2. Add a mapping for your preferred icon library if its not in the iconMap array of the widget, like the following;
162+
```
163+
public $iconMap = [
164+
'glyphicons' => [
165+
'drag-handle' => 'glyphicon glyphicon-menu-hamburger',
166+
'remove' => 'glyphicon glyphicon-remove',
167+
'add' => 'glyphicon glyphicon-plus',
168+
'clone' => 'glyphicon glyphicon-duplicate',
169+
],
170+
'fa' => [
171+
'drag-handle' => 'fa fa-bars',
172+
'remove' => 'fa fa-times',
173+
'add' => 'fa fa-plus',
174+
'clone' => 'fa fa-files-o',
175+
],
176+
'my-amazing-icons' => [
177+
'drag-handle' => 'my my-bars',
178+
'remove' => 'my my-times',
179+
'add' => 'my my-plus',
180+
'clone' => 'my my-files',
181+
]
182+
];
183+
```
184+
3. Set the preffered icon source
185+
```
186+
public $iconSource = 'my-amazing-icons';
187+
```
188+
If you do none of the above, the default behavior which assumes you are using glyphicons is retained.
189+
190+
156191
## Documentation
157192

158193
You can find a full version of documentation in [wiki](https://github.com/unclead/yii2-multiple-input/wiki/)

‎src/MultipleInput.php

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -160,6 +160,30 @@ class MultipleInput extends InputWidget
160160
*/
161161
public $extraButtons;
162162

163+
/**
164+
* @var array
165+
* --icon library classes mapped for various controls
166+
*/
167+
public $iconMap = [
168+
'glyphicons' => [
169+
'drag-handle' => 'glyphicon glyphicon-menu-hamburger',
170+
'remove' => 'glyphicon glyphicon-remove',
171+
'add' => 'glyphicon glyphicon-plus',
172+
'clone' => 'glyphicon glyphicon-duplicate',
173+
],
174+
'fa' => [
175+
'drag-handle' => 'fa fa-bars',
176+
'remove' => 'fa fa-times',
177+
'add' => 'fa fa-plus',
178+
'clone' => 'fa fa-files-o',
179+
],
180+
];
181+
/**
182+
* @var string
183+
* --name of default icon library
184+
*/
185+
public $iconSource = 'glyphicons';
186+
163187
/**
164188
* Initialization.
165189
*
@@ -255,7 +279,11 @@ private function createRenderer()
255279

256280
array_unshift($this->columns, $drag);
257281
}
258-
282+
283+
/**
284+
* set default icon map
285+
*/
286+
$iconmap = array_key_exists($this->iconSource, $this->iconMap) ? $this->iconMap[$this->iconSource] : $this->iconMap['glyphicons'];
259287
$config = [
260288
'id' => $this->getId(),
261289
'columns' => $this->columns,
@@ -273,6 +301,7 @@ private function createRenderer()
273301
'enableError' => $this->enableError,
274302
'cloneButton' => $this->cloneButton,
275303
'extraButtons' => $this->extraButtons,
304+
'iconMap' => $iconmap,
276305
];
277306

278307
if ($this->removeButtonOptions !== null) {

‎src/TabularInput.php

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -148,6 +148,30 @@ class TabularInput extends Widget
148148
*/
149149
public $layoutConfig = [];
150150

151+
/**
152+
* @var array
153+
* --icon library classes mapped for various controls
154+
*/
155+
public $iconMap = [
156+
'glyphicons' => [
157+
'drag-handle' => 'glyphicon glyphicon-menu-hamburger',
158+
'remove' => 'glyphicon glyphicon-remove',
159+
'add' => 'glyphicon glyphicon-plus',
160+
'clone' => 'glyphicon glyphicon-duplicate',
161+
],
162+
'fa' => [
163+
'drag-handle' => 'fa fa-bars',
164+
'remove' => 'fa fa-times',
165+
'add' => 'fa fa-plus',
166+
'clone' => 'fa fa-files-o',
167+
],
168+
];
169+
/**
170+
* @var string
171+
* --name of default icon library
172+
*/
173+
public $iconSource = 'glyphicons';
174+
151175
/**
152176
* Initialization.
153177
*
@@ -200,6 +224,10 @@ public function run()
200224
*/
201225
private function createRenderer()
202226
{
227+
/**
228+
* set default icon map
229+
*/
230+
$iconmap = array_key_exists($this->iconSource, $this->iconMap) ? $this->iconMap[$this->iconSource] : $this->iconMap['glyphicons'];
203231
$config = [
204232
'id' => $this->getId(),
205233
'columns' => $this->columns,
@@ -216,6 +244,7 @@ private function createRenderer()
216244
'sortable' => $this->sortable,
217245
'enableError' => $this->enableError,
218246
'layoutConfig' => $this->layoutConfig,
247+
'iconMap' => $iconmap,
219248
];
220249

221250
if ($this->removeButtonOptions !== null) {

‎src/assets/FontAwesomeAsset.php

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<?php
2+
3+
/**
4+
* @link https://github.com/unclead/yii2-multiple-input
5+
* @copyright Copyright (c) 2014 unclead
6+
* @license https://github.com/unclead/yii2-multiple-input/blob/master/LICENSE.md
7+
*/
8+
9+
namespace unclead\multipleinput\assets;
10+
11+
use yii\web\AssetBundle;
12+
13+
/**
14+
* Class FontAwesomeAsset
15+
* @package unclead\multipleinput\assets
16+
*/
17+
class FontAwesomeAsset extends AssetBundle
18+
{
19+
public $depends = [
20+
];
21+
22+
public $css = [
23+
['//use.fontawesome.com/releases/v5.2.0/css/all.css', 'type'=>'text/css', 'integrity'=>'sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ', 'crossorigin'=>'anonymous', 'media'=>'all', 'id'=>'font-awesome', 'rel'=>'stylesheet'],
24+
];
25+
26+
}

‎src/components/BaseColumn.php

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -467,7 +467,17 @@ protected function renderStatic($name, $value, $options)
467467
*/
468468
protected function renderDragColumn($name, $value, $options)
469469
{
470-
return Html::tag('span', null, ['class' => 'glyphicon glyphicon-menu-hamburger drag-handle']);
470+
/**
471+
* Class was passed into options by TableRenderer->renderCellContent(),
472+
* we can extract it here
473+
*/
474+
$class = '';
475+
if (array_key_exists('class', $options)) {
476+
$class = ArrayHelper::remove($options, 'class');
477+
}
478+
$dragClass = implode(" ", [$class, 'drag-handle']);
479+
480+
return Html::tag('span', null, ['class' => $dragClass]);
471481
}
472482

473483
/**

‎src/renderers/BaseRenderer.php

Lines changed: 20 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,8 @@ abstract class BaseRenderer extends BaseObject implements RendererInterface
166166
*/
167167
public $layoutConfig = [];
168168

169+
public $iconMap;
170+
169171
/**
170172
* @inheritdoc
171173
*/
@@ -248,23 +250,23 @@ private function prepareButtons()
248250
}
249251

250252
if (!array_key_exists('label', $this->removeButtonOptions)) {
251-
$this->removeButtonOptions['label'] = Html::tag('i', null, ['class' => 'glyphicon glyphicon-remove']);
253+
$this->removeButtonOptions['label'] = Html::tag('i', null, ['class' => $this->getIconClass('remove')]);
252254
}
253255

254256
if (!array_key_exists('class', $this->addButtonOptions)) {
255257
$this->addButtonOptions['class'] = 'btn btn-default';
256258
}
257259

258260
if (!array_key_exists('label', $this->addButtonOptions)) {
259-
$this->addButtonOptions['label'] = Html::tag('i', null, ['class' => 'glyphicon glyphicon-plus']);
261+
$this->addButtonOptions['label'] = Html::tag('i', null, ['class' => $this->getIconClass('add')]);
260262
}
261263

262264
if (!array_key_exists('class', $this->cloneButtonOptions)) {
263265
$this->cloneButtonOptions['class'] = 'btn btn-info';
264266
}
265267

266268
if (!array_key_exists('label', $this->cloneButtonOptions)) {
267-
$this->cloneButtonOptions['label'] = Html::tag('i', null, ['class' => 'glyphicon glyphicon-duplicate']);
269+
$this->cloneButtonOptions['label'] = Html::tag('i', null, ['class' => $this->getIconClass('clone')]);
268270
}
269271
}
270272

@@ -489,4 +491,19 @@ protected function prepareJsAttributes()
489491

490492
return $attributes;
491493
}
494+
495+
/**
496+
* @param $action - the control parameter, used as key into allowed types
497+
* @return string - the relevant icon class
498+
*/
499+
protected function getIconClass($action) {
500+
if (in_array($action, ['add', 'remove', 'clone', 'drag-handle'])) {
501+
return $this->iconMap[$action];
502+
}
503+
504+
if (YII_DEBUG) {
505+
throw new InvalidConfigException('Out of bounds, "' . $action . '" not found in your iconMap');
506+
}
507+
return '';
508+
}
492509
}

‎src/renderers/TableRenderer.php

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -253,9 +253,17 @@ public function renderCellContent($column, $index)
253253
{
254254
$id = $column->getElementId($index);
255255
$name = $column->getElementName($index);
256-
$input = $column->renderInput($name, [
257-
'id' => $id
258-
]);
256+
257+
/**
258+
* This class inherits iconMap from BaseRenderer
259+
* If the input to be rendered is a drag column, we give it the appropriate icon class
260+
* via the $options array
261+
*/
262+
$options = ['id' => $id];
263+
if (substr($id, -4) === 'drag') {
264+
$options = ArrayHelper::merge($options, ['class' => $this->iconMap['drag-handle']]);
265+
}
266+
$input = $column->renderInput($name, $options);
259267

260268
if ($column->isHiddenInput()) {
261269
return $input;

0 commit comments

Comments
 (0)