Skip to content
This repository has been archived by the owner on Nov 16, 2017. It is now read-only.

t/103: Update components once UI architecture has been stripped of Controller class #104

Merged
merged 50 commits into from
Nov 8, 2016

Conversation

oleq
Copy link
Member

@oleq oleq commented Nov 2, 2016

Closes #103.

Requires ckeditor/ckeditor5-ui#100.

@@ -0,0 +1,63 @@
/**
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

createDropdown - camelCase in file name.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

* The label of the dropdown.
*
* @observable
* @member {String} ui.dropdown.DropdownView#label
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move docs of class properties to the class constructor.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done.

*
* @observable
* @member {Boolean} ui.dropdown.DropdownModel#withText
*/
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can't find docs for ui.dropdown.DropdownModel#items

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, now I see that there is a createListDropdown helper

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yep. We'll need to figure out the right way to document stuff here. But ATM I see no better solution than Model @interface.

}

return label;
} );
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I remember we agreed that the title should be built in the ButtonView. It should have title property, which, if set, is used. Otherwise, a label with a keystroke (if exists) is used.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Then, the whole createButton helper is not needed anymore. In fact, we should avoid the need to create a createButton helper and try to keep the whole logic inside the view class.

@@ -64,64 +146,62 @@ export default class ButtonView extends View {
// We can't make the button disabled using the disabled attribute, because it won't be focusable.
// Though, shouldn't this condition be moved to the button controller?
if ( this.isEnabled ) {
this.fire( 'click' );
this.fire( 'execute' );
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not click?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Because you can do the same with keyboard Return/Space keys, touch it on your smartphone, etc. click events are limited to the mouse and developers who use ButtonView don't actually need to know what kind of interaction executed the button. execute is an interface which is uniform and brings no confusion.

@@ -18,8 +21,87 @@ export default class ButtonView extends View {
/**
* @inheritDoc
*/
constructor() {
super();
constructor( locale ) {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The second parameter with options (properties) would be nice, so I can create a button with label, instead of creating anonymous button and adding label later.

const buttonView = new ButtonView( locale, {
    laber: 'foo',
    withText: true
} );

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

OTOH, you can always

const buttonView = new ButtonView( locale );
buttonView.set( {
    laber: 'foo',
    withText: true
} );

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yea, but it means that you create a view with empty properties and then add properties to it. It means that button is in the invalid state for a moment. If we would add assertions to check if the view is not in the invalid state it would throw in this case. And, even if it is fine for the button to have no label nor image, it might be not fine for other views to have an undefined initial state.

@Reinmar Reinmar merged commit b8e62e9 into master Nov 8, 2016
@Reinmar Reinmar deleted the t/103 branch November 8, 2016 15:30
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants