github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2024-12-01 22:43:41 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add custom icon functionality

Browse Source 
Add database 'icon' column
Add admin modal icon field
Add icon render to TagHero, tagLabel
Change tagIcon helper functionality
This commit is contained in:
NomisCZ 2019-06-04 20:49:16 +02:00
parent 6d0de4b29c
commit 11fae08b50
11 changed files with 55 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
extensions/tags/js/src/admin/components/EditTagModal.js
View File

@ -19,6 +19,7 @@ export default class EditTagModal extends Modal {
this.slug = m.prop(this.tag.slug() || '');
this.description = m.prop(this.tag.description() || '');
this.color = m.prop(this.tag.color() || '');
this.icon = m.prop(this.tag.icon() || '');
this.isHidden = m.prop(this.tag.isHidden() || false);
}
@ -30,7 +31,8 @@ export default class EditTagModal extends Modal {
return this.name()
? tagLabel({
name: this.name,
color: this.color
color: this.color,
icon: this.icon,
})
: app.translator.trans('flarum-tags.admin.edit_tag.title');
}
@ -71,6 +73,14 @@ export default class EditTagModal extends Modal {
<input className="FormControl" placeholder="#aaaaaa" value={this.color()} oninput={m.withAttr('value', this.color)}/>
</div>, 20);
items.add('icon', <div className="Form-group">
<label>{app.translator.trans('core.admin.edit_group.icon_label')}</label>
<div className="helpText">
{app.translator.trans('core.admin.edit_group.icon_text', {a: <a href="https://fontawesome.com/icons?m=free" tabindex="-1"/>})}
</div>
<input className="FormControl" placeholder="fas fa-bolt" value={this.icon()} oninput={m.withAttr('value', this.icon)}/>
</div>, 10);
items.add('hidden', <div className="Form-group">
<div>
<label className="checkbox">
@ -103,6 +113,7 @@ export default class EditTagModal extends Modal {
slug: this.slug(),
description: this.description(),
color: this.color(),
icon: this.icon(),
isHidden: this.isHidden()
};
}

16
extensions/tags/js/src/common/helpers/tagIcon.js
View File

@ -1,12 +1,20 @@
export default function tagIcon(tag, attrs = {}) {
attrs.className = 'icon TagIcon ' + (attrs.className || '');
export default function tagIcon(tag, attrs = {}, settings = {}) {
const hasIcon = tag && tag.icon();
attrs.className = hasIcon ? 'icon ' + tag.icon() + ' ' + (attrs.className || '') : 'icon TagIcon ' + (attrs.className || '');
if (tag) {
attrs.style = attrs.style || {};
attrs.style.backgroundColor = tag.color();
if (hasIcon) {
attrs.style.color = settings.disableColors ? '' : tag.color();
} else {
attrs.style.backgroundColor = tag.color();
}
} else {
attrs.className += ' untagged';
}
return <span {...attrs}/>;
return hasIcon ? <i {...attrs}/> : <span {...attrs}/>;
}

5
extensions/tags/js/src/common/helpers/tagLabel.js
View File

@ -1,10 +1,12 @@
import extract from 'flarum/utils/extract';
import tagIcon from './tagIcon';
export default function tagLabel(tag, attrs = {}) {
attrs.style = attrs.style || {};
attrs.className = 'TagLabel ' + (attrs.className || '');
const link = extract(attrs, 'link');
let tagText = tag ? tag.name() : app.translator.trans('flarum-tags.lib.deleted_tag_text');
if (tag) {
const color = tag.color();
@ -21,11 +23,10 @@ export default function tagLabel(tag, attrs = {}) {
} else {
attrs.className += ' untagged';
}
return (
m((link ? 'a' : 'span'), attrs,
<span className="TagLabel-text">
{tag ? tag.name() : app.translator.trans('flarum-tags.lib.deleted_tag_text')}
{tag.icon() && tagIcon(tag, {}, {disableColors: true})} {tagText}
</span>
)
);

1
extensions/tags/js/src/common/models/Tag.js
View File

@ -10,6 +10,7 @@ export default class Tag extends mixin(Model, {
color: Model.attribute('color'),
backgroundUrl: Model.attribute('backgroundUrl'),
backgroundMode: Model.attribute('backgroundMode'),
icon: Model.attribute('icon'),
position: Model.attribute('position'),
parent: Model.hasOne('parent'),

3
extensions/tags/js/src/forum/components/TagHero.js
View File

@ -1,4 +1,5 @@
import Component from 'flarum/Component';
import tagIcon from '../../common/helpers/tagIcon';
export default class TagHero extends Component {
view() {
@ -10,7 +11,7 @@ export default class TagHero extends Component {
style={color ? {color: '#fff', backgroundColor: color} : ''}>
<div className="container">
<div className="containerNarrow">
<h2 className="Hero-title">{tag.name()}</h2>
<h2 className="Hero-title">{tag.icon() && tagIcon(tag, {}, { disableColors: true })} {tag.name()}</h2>
<div className="Hero-subtitle">{tag.description()}</div>
</div>
</div>

2
extensions/tags/less/admin/TagsPage.less
View File

@ -31,7 +31,7 @@
cursor: move;
}
.TagIcon {
.TagIcon, .icon {
margin-right: 10px;
}
}

16
extensions/tags/migrations/2019_04_21_000000_add_icon_to_tags_table.php Normal file
View File

@ -0,0 +1,16 @@
<?php
/*
* This file is part of Flarum.
*
* (c) Toby Zerner <toby.zerner@gmail.com>
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
*/
use Flarum\Database\Migration;
return Migration::addColumns('tags', [
'icon' => ['string', 'length' => 100, 'nullable' => true]
]);

1
extensions/tags/src/Api/Serializer/TagSerializer.php
View File

@ -33,6 +33,7 @@ class TagSerializer extends AbstractSerializer
'color' => $tag->color,
'backgroundUrl' => $tag->background_path,
'backgroundMode' => $tag->background_mode,
'icon' => $tag->icon,
'iconUrl' => $tag->icon_path,
'discussionCount' => (int) $tag->discussion_count,
'position' => $tag->position === null ? null : (int) $tag->position,

1
extensions/tags/src/Command/CreateTagHandler.php
View File

@ -48,6 +48,7 @@ class CreateTagHandler
array_get($data, 'attributes.slug'),
array_get($data, 'attributes.description'),
array_get($data, 'attributes.color'),
array_get($data, 'attributes.icon'),
array_get($data, 'attributes.isHidden')
);

4
extensions/tags/src/Command/EditTagHandler.php
View File

@ -72,6 +72,10 @@ class EditTagHandler
$tag->color = $attributes['color'];
}
if (isset($attributes['icon'])) {
$tag->icon = $attributes['icon'];
}
if (isset($attributes['isHidden'])) {
$tag->is_hidden = (bool) $attributes['isHidden'];
}

3
extensions/tags/src/Tag.php
View File

@ -54,7 +54,7 @@ class Tag extends AbstractModel
* @param bool $isHidden
* @return static
*/
public static function build($name, $slug, $description, $color, $isHidden)
public static function build($name, $slug, $description, $color, $icon, $isHidden)
{
$tag = new static;
@ -62,6 +62,7 @@ class Tag extends AbstractModel
$tag->slug = $slug;
$tag->description = $description;
$tag->color = $color;
$tag->icon = $icon;
$tag->is_hidden = (bool) $isHidden;
return $tag;