Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added container image set widget showcase. #9

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions controllers/ContainerImageSetController.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<?php

namespace humhub\modules\devtools\controllers;


use humhub\modules\devtools\models\ContainerImageSetModel;
use humhub\widgets\ModalClose;
use Yii;

class ContainerImageSetController extends DevtoolsController
{
public function actionIndex()
{
$model = new ContainerImageSetModel();
if ($model->load(Yii::$app->request->post())) {
return $this->renderAjax('../widgets/image_set/result', ['model' => $model]);
}

return ModalClose::widget(['error', 'Could not load form data!']);
}
}
111 changes: 111 additions & 0 deletions models/ContainerImageSetModel.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
<?php

namespace humhub\modules\devtools\models;

class ContainerImageSetModel extends \yii\base\Model
{
/**
* @var string the instance of items to render
*/

public $instance;

/**
* @var int the amount of visible items to render
*/
public $max;

/**
* @var int the width of the visible imageamount of visible items to render
*/
public $width;

/**
* @var int the height of the visible image
*/
public $height;

/**
* @var array html options for the generated tag
*/
public $htmlOptions;

/**
* @var boolean create link to the space or user profile
*/
public $link;

/**
* @var array Html Options of the link
*/
public $linkOptions;

/**
* @var string show tooltip with further information about the space or the user (Only available when link is true)
* @since 1.3
*/
public $tooltip;

/**
* @var array optional html options for the image tag
*/
public $imageOptions;

/**
* @var int number of characters used in the acronym (for spaces only)
*/
public $acronymCount;

/**
* @var int the width of the hidden image
*/
public $hiddenImageWidth;

/**
* @var int the height of the hidden image
*/
public $hiddenImageHeight;


public function rules()
{
return [
[['instance'], 'in', 'range' => ['user', 'space']],
[['max', 'width', 'height', 'acronymCount', 'hiddenImageWidth', 'hiddenImageHeight'], 'integer'],
[['link', 'tooltip'], 'boolean'],
[['htmlOptions', 'linkOptions', 'imageOptions', 'instance'], 'string']
];
}

public function attributeHints()
{
return [
'instance' => 'Select instance of items.',
'max' => 'Maximal amount of visible items to render.',
'width' => 'The width of the visible image in pixels. Default 50px.',
'height' => 'The height of the visible image in pixels. Equals to width if empty.',
'htmlOptions' => 'Html options for the generated tag.',
'link' => 'Create link to the space or user profile.',
'linkOptions' => 'Html Options of the link.',
'tooltip' => 'Show tooltip with further information about the space or the user (Only available when link is true).',
'imageOptions' => 'Optional html options for the image tag.',
'acronymCount' => 'Number of characters used in the acronym (for spaces only).',
'hiddenImageWidth' => 'The width of the hidden image in pixels. Default 24px.',
'hiddenImageHeight' => 'The height of the hidden image in pixels. Equals to width if empty.',
];
}

public function prepareOptions($prop)
{
$options = [];
$string = str_replace(['[', ']', '\'', '"'], '', $this->$prop);
foreach (explode(',', $string) as $item) {
$temp = explode('=>', $item);
$key = trim($temp[0]);
$value = trim($temp[1]);
$options[$key] = $value;
}

return $options;
}
}
2 changes: 1 addition & 1 deletion views/index/index.php
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@
PanelRow::widget([
'items' => [
['title' => Yii::t('DevtoolsModule.views_index_index', 'Forms'), 'url' => Url::to(['/devtools/showcase/view', 'id' => 'forms']), 'text' => Yii::t('DevtoolsModule.views_index_index', 'Learn how to submit form data.')],
['disabled' => true, 'title' => Yii::t('DevtoolsModule.views_index_index', 'Widgets'), 'url' => Url::to(['/devtools/showcase/view', 'id' => 'widgets']), 'text' => Yii::t('DevtoolsModule.views_index_index', 'Learn how implement ui widgets.')],
['disabled' => version_compare(Yii::$app->version, '1.4.dev', '<') ? true : false, 'title' => Yii::t('DevtoolsModule.views_index_index', 'Widgets'), 'url' => Url::to(['/devtools/showcase/view', 'id' => 'widgets']), 'text' => Yii::t('DevtoolsModule.views_index_index', 'Learn how implement ui widgets.')],
['disabled' => version_compare(Yii::$app->version, '1.3', '<') ? true : false, 'title' => Yii::t('DevtoolsModule.views_index_index', 'Richtext'), 'url' => Url::to(['/devtools/showcase/view', 'id' => 'richtext']), 'text' => Yii::t('DevtoolsModule.views_index_index', 'Learn how to use the Richtext widget and plugin system.')],
]
]);
Expand Down
32 changes: 32 additions & 0 deletions views/showcase/tabs/widgets_image_set/try.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
<?php

use humhub\widgets\ModalButton;
use yii\bootstrap\ActiveForm;
use humhub\widgets\RichtextField;
use \humhub\modules\user\widgets\UserPickerField;


if(!isset($model)) {
$model = new \humhub\modules\devtools\models\ContainerImageSetModel;
}

/** @var $model \humhub\modules\devtools\models\ContainerImageSetModel */

?>

<?php $form = ActiveForm::begin();?>
<?= $form->field($model, 'instance')->radioList(['user' => 'Users', 'space' => 'Spaces'], ['value' => 'user']);?>
<?= $form->field($model, 'max')->textInput(['value' => 5])?>
<?= $form->field($model, 'width')->textInput(['value' => 50])?>
<?= $form->field($model, 'height')->textInput()?>
<?= $form->field($model, 'htmlOptions')->textInput()?>
<?= $form->field($model, 'link')->checkboxList(['Yes'])?>
<?= $form->field($model, 'linkOptions')->textInput()?>
<?= $form->field($model, 'tooltip')->checkboxList(['Yes'])?>
<?= $form->field($model, 'imageOptions')->textInput()?>
<?= $form->field($model, 'acronymCount')->textInput()?>
<?= $form->field($model, 'hiddenImageWidth')->textInput()?>
<?= $form->field($model, 'hiddenImageHeight')->textInput()?>

<?= ModalButton::submitModal(['/devtools/container-image-set'], Yii::t('base', 'Submit')) ?>
<?php ActiveForm::end();?>
26 changes: 26 additions & 0 deletions views/showcase/tabs/widgets_image_set/view.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<?php humhub\modules\devtools\widgets\CodeView::begin(['type' => 'php']); ?>

<?= \humhub\modules\devtools\widgets\CodeView::PHP_START ?>

use \humhub\modules\ui\widgets\ContainerImageSet;

/** @var $items \humhub\modules\user\models\User || \humhub\modules\user\models\Space */

?>

<?= \humhub\modules\devtools\widgets\CodeView::PHP_START_ECHO ?> ContainerImageSet::widget([
'items' => $items,
'max' => 2, //Default 5
'width' => 50, // Default 50
'height' => null, // Default null
'htmlOptions' => [],
'link' => true, // Default false
'linkOptions' => ['class' => 'pull-left'], //Default []
'showTooltip' => true, // Default false
'imageOptions' => ['class' => 'img-rounded tt img_margin'], //Default []
'hiddenImageWidth' => 24, // Default 24
'hiddenImageWidth' => null // Default null
]);
?>

<?php humhub\modules\devtools\widgets\CodeView::end();
22 changes: 22 additions & 0 deletions views/showcase/widgets.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<?php
/**
* @link https://www.humhub.org/
* @copyright Copyright (c) 2017 HumHub GmbH & Co. KG
* @license https://www.humhub.com/licences
*
*/

$showcases = [
[
'id' => 'widgets_image_set',
'title' => Yii::t('DevtoolsModule.views_showcase_widgets', 'Container image set'),
'description' => Yii::t('DevtoolsModule.views_showcase_widgets', 'Learn how to include container image set into your page.'),
'tabs' => [
['id' => 'try', 'active' => true, 'title' => Yii::t('DevtoolsModule.base', 'Try')],
['id' => 'view', 'title' => Yii::t('DevtoolsModule.base', 'View')],
]
],
];
?>

<?= \humhub\modules\devtools\widgets\ShowcasePage::widget(['items' => $showcases])?>
39 changes: 39 additions & 0 deletions views/widgets/image_set/result.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
<?php
/**
* @link https://www.humhub.org/
* @copyright Copyright (c) 2017 HumHub GmbH & Co. KG
* @license https://www.humhub.com/licences
*
*/

use humhub\modules\devtools\models\ContainerImageSetModel;
use humhub\modules\space\models\Space;
use humhub\modules\ui\widgets\ContainerImageSet;
use humhub\modules\user\models\User;
use humhub\widgets\ModalButton;
use humhub\widgets\ModalDialog;

/* @var $this \humhub\components\View */
/* @var $model ContainerImageSetModel */
?>

<?php ModalDialog::begin(['header' => Yii::t('DevtoolsModule.views_client_result', 'Result')]); ?>
<div class="modal-body">
<?= ContainerImageSet::widget([
'items' => $model->instance === 'user' ? User::find()->indexBy('id')->all() : Space::find()->indexBy('id')->all(),
'max' => ! empty($model->max) ? $model->max : 5,
'width' => ! empty($model->width) ? $model->width : 50,
'height' => ! empty($model->height) ? $model->height : null,
'htmlOptions' => ! empty($model->htmlOptions) ? $model->prepareOptions('htmlOptions') : [],
'link' => $model->link,
'linkOptions' => ! empty($model->linkOptions) ? $model->prepareOptions('linkOptions') : [],
'showTooltip' => $model->tooltip,
'imageOptions' => ! empty($model->imageOptions) ? $model->prepareOptions('imageOptions') : [],
'hiddenImageWidth' => ! empty($model->hiddenImageWidth) ? $model->hiddenImageWidth : 24,
'hiddenImageHeight' => ! empty($model->hiddenImageHeight) ? $model->hiddenImageHeight : null,
]); ?>
</div>
<div class="modal-footer">
<?= ModalButton::cancel(Yii::t('base', 'Close')) ?>
</div>
<?php ModalDialog::end() ?>