Skip to content
Permalink
Browse files

Merge branch 't/13434'

  • Loading branch information...
Reinmar committed Jul 3, 2015
2 parents 9b72d86 + 7abcfce commit 7c8521b7616a09055013d08be83be9a1092a0434
Showing with 78 additions and 57 deletions.
  1. +4 −0 CHANGES.md
  2. +13 −9 plugins/dialog/plugin.js
  3. +52 −43 tests/plugins/dialog/manual/state.html
  4. +9 −5 tests/plugins/dialog/manual/state.md
@@ -3,6 +3,10 @@ CKEditor 4 Changelog

## CKEditor 4.5.2

Fixed Issues:

* [#13434](http://dev.ckeditor.com/ticket/13434): Dialog state indicator broken in Right–To–Left environments.

## CKEditor 4.5.1

Fixed Issues:
@@ -1453,15 +1453,19 @@ CKEDITOR.DIALOG_STATE_BUSY = 2;
if ( state == CKEDITOR.DIALOG_STATE_BUSY ) {
// Insert the spinner on demand.
if ( !this.parts.spinner ) {
this.parts.spinner = CKEDITOR.document.createElement( 'div', {
attributes: {
'class': 'cke_dialog_spinner'
},
styles: {
'float': 'left',
'margin-right': '8px'
}
} );
var dir = this.getParentEditor().lang.dir,
spinnerDef = {
attributes: {
'class': 'cke_dialog_spinner'
},
styles: {
'float': dir == 'rtl' ? 'right' : 'left'
}
};

spinnerDef.styles[ 'margin-' + ( dir == 'rtl' ? 'left' : 'right' ) ] = '8px';

this.parts.spinner = CKEDITOR.document.createElement( 'div', spinnerDef );

this.parts.spinner.setHtml( '⌛' );
this.parts.spinner.appendTo( this.parts.title, 1 );
@@ -1,5 +1,9 @@
<div>
<textarea cols="80" id="editor1" name="editor1" rows="10">
<h2>LTR Editor</h2>
<textarea cols="80" name="en" id="editor1" name="editor1" rows="10">
</textarea>
<h2>RTL Editor</h2>
<textarea cols="80" name="he" id="editor2" name="editor2" rows="10">
</textarea>
<style>
.cke_button__state_label {
@@ -11,57 +15,62 @@
}
</style>
<script>
CKEDITOR.replace( 'editor1', {
on: {
pluginsLoaded: function() {
CKEDITOR.dialog.add( 'state', function() {
return {
title: 'Dialog with state indicator',
minWidth: 250,
minHeight: 50,
onLoad: function( evt ) {
this.getContentElement( 'info', 'busy' ).on( 'click', function() {
this.setState( CKEDITOR.DIALOG_STATE_BUSY );
}, this );
CKEDITOR.on( 'instanceLoaded', function( evt ) {
CKEDITOR.dialog.add( 'state', function() {
return {
title: 'Dialog with state indicator',
minWidth: 250,
minHeight: 50,
onLoad: function( evt ) {
this.getContentElement( 'info', 'busy' ).on( 'click', function() {
this.setState( CKEDITOR.DIALOG_STATE_BUSY );
}, this );
this.getContentElement( 'info', 'idle' ).on( 'click', function() {
this.setState( CKEDITOR.DIALOG_STATE_IDLE );
}, this );
},
contents: [
this.getContentElement( 'info', 'idle' ).on( 'click', function() {
this.setState( CKEDITOR.DIALOG_STATE_IDLE );
}, this );
},
contents: [
{
id: 'info',
label: 'Info Tab',
elements: [
{
id: 'info',
label: 'Info Tab',
elements: [
type: 'hbox',
children: [
{
type: 'button',
id: 'busy',
label: 'Set dialog busy'
},
{
type: 'hbox',
children: [
{
type: 'button',
id: 'busy',
label: 'Set dialog busy'
},
{
type: 'button',
id: 'idle',
label: 'Set dialog idle'
}
]
type: 'button',
id: 'idle',
label: 'Set dialog idle'
}
]
}
]
};
} );
}
]
};
} );
} );
this.addCommand( 'state', new CKEDITOR.dialogCommand( 'state' ) );
CKEDITOR.replaceAll( function( el, config ) {
CKEDITOR.tools.extend( config, {
language: el.getAttribute( 'name' ),
on: {
pluginsLoaded: function() {
this.addCommand( 'state', new CKEDITOR.dialogCommand( 'state' ) );
this.ui.addButton( 'state', {
label: 'Show a dialog with state indicator',
command: 'state',
} );
this.ui.addButton( 'state', {
label: 'Show a dialog with state indicator',
command: 'state',
} );
}
}
}
} );
} );
</script>
</div>
</div>
@@ -1,22 +1,26 @@
@bender-tags: dialog
@bender-tags: dialog, 13434
@bender-ui: collapsed
@bender-ckeditor-plugins: wysiwygarea, toolbar, dialog

## Observe dialog state change

1. Click the toolbar button.
1. Click "Set dialog busy". A **spinning** indicator should appear in the **upper left corner** of the dialog, before the title.
1. Click "Set dialog busy". A **spinning** indicator should appear in the **upper left corner** (**upper _right_ corner** in RTL mode) of the dialog, before the title.
1. Click the **OK** button. Nothing should happen. It supposed to be disabled.
1. Click "Set dialog idle". The spinner should disappear.
1. Click the **OK** button. The dialog should disappear.
1. Re–open the dialog. Click each of the buttons multiple times. There should be no errors in console. Nothing extra should happen except of
* the spinner appearing and disappearing
* **OK** button being locked and unlocked
* the spinner appearing and disappearing
* **OK** button being locked and unlocked

## Dialog state reset on hide

1. Re–open the dialog.
1. Click "Set dialog busy".
1. Click **Cancel**.
1. Re–open the dialog.
1. The dialog should be idle (**OK** button **enabled**, no spinner).
1. The dialog should be idle (**OK** button **enabled**, no spinner).

## Notes

* Expect the "Ok" and "Cancel" buttons and their tooltips in RTL mode to be in Hebrew.

0 comments on commit 7c8521b

Please sign in to comment.
You can’t perform that action at this time.