mirror of
https://github.com/TryGhost/Ghost-Admin.git
synced 2023-12-14 02:33:04 +01:00
3d341e2dd6
refs https://github.com/TryGhost/Ghost/issues/9311 Koenig is being fully rebooted, first port of call is to focus on getting the rich-text only aspect of mobiledoc-kit working with our popup toolbar. - renames old koenig implementation (used for reference, will eventually be deleted) - new `{{koenig-editor}}` mobiledoc-kit component implementation based on ember-mobiledoc-editor - markdown text expansions - new `{{gh-koenig-edtor}}` that wraps our title+editor and handles keyboard navigation between the two - clicks below content will focus the editor - new `{{koenig-toolbar}}` component for the popup formatting toolbar with improved behaviour and simplified code
50 lines
1.4 KiB
JavaScript
50 lines
1.4 KiB
JavaScript
import Component from '@ember/component';
|
|
import layout from '../templates/components/koenig-toolbar-button';
|
|
import {computed} from '@ember/object';
|
|
|
|
export default Component.extend({
|
|
layout,
|
|
tagName: 'button',
|
|
|
|
attributeBindings: ['title'],
|
|
classNames: ['gh-toolbar-btn'],
|
|
// TODO: what do selected/primary/secondary classes relate to? Some tools
|
|
// have 'primary' added but none of them appear do anything/be used elsewhere
|
|
classNameBindings: [
|
|
'selected',
|
|
'buttonClass',
|
|
'visibilityClass'
|
|
],
|
|
|
|
// exernally set properties
|
|
tool: null,
|
|
editor: null,
|
|
|
|
buttonClass: computed('tool.class', function () {
|
|
return `gh-toolbar-btn-${this.get('tool.class')}`;
|
|
}),
|
|
|
|
// returns "primary" or null
|
|
visibilityClass: computed('tool.visibility', function () {
|
|
return this.get('tool.visibility');
|
|
}),
|
|
|
|
title: computed('tool.label', function () {
|
|
return this.get('tool.label');
|
|
}),
|
|
|
|
willRender() {
|
|
// TODO: "selected" doesn't appear to do anything for toolbar items -
|
|
// it's only used within card menus
|
|
this.set('selected', !!this.tool.selected);
|
|
|
|
// sets the primary/secondary/
|
|
if (this.tool.visibility) {
|
|
this.set(this.tool.visibility, true);
|
|
}
|
|
},
|
|
|
|
click() {
|
|
this.tool.onClick(this.get('editor'));
|
|
}
|
|
});
|