~ubuntu-branches/ubuntu/utopic/ldap-account-manager/utopic-proposed

« back to all changes in this revision

Viewing changes to templates/lib/extra/ckeditor/plugins/floatingspace/plugin.js

  • Committer: Package Import Robot
  • Author(s): Roland Gruber
  • Date: 2014-06-12 17:51:20 UTC
  • mfrom: (1.2.24)
  • Revision ID: package-import@ubuntu.com-20140612175120-grobhwyk369g9aod
Tags: 4.6-1
new upstream release

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/**
 
2
 * @license Copyright (c) 2003-2014, CKSource - Frederico Knabben. All rights reserved.
 
3
 * For licensing, see LICENSE.md or http://ckeditor.com/license
 
4
 */
 
5
 
 
6
( function() {
 
7
        var floatSpaceTpl = CKEDITOR.addTemplate( 'floatcontainer', '<div' +
 
8
                        ' id="cke_{name}"' +
 
9
                        ' class="cke {id} cke_reset_all cke_chrome cke_editor_{name} cke_float cke_{langDir} ' + CKEDITOR.env.cssClass + '"' +
 
10
                        ' dir="{langDir}"' +
 
11
                        ' title="' + ( CKEDITOR.env.gecko ? ' ' : '' ) + '"' +
 
12
                        ' lang="{langCode}"' +
 
13
                        ' role="application"' +
 
14
                        ' style="{style}"' +
 
15
                        ' aria-labelledby="cke_{name}_arialbl"' +
 
16
                        '>' +
 
17
                                '<span id="cke_{name}_arialbl" class="cke_voice_label">{voiceLabel}</span>' +
 
18
                                '<div class="cke_inner">' +
 
19
                                        '<div id="{topId}" class="cke_top" role="presentation">{content}</div>' +
 
20
                                '</div>' +
 
21
                        '</div>' ),
 
22
                win = CKEDITOR.document.getWindow(),
 
23
                pixelate = CKEDITOR.tools.cssLength;
 
24
 
 
25
        CKEDITOR.plugins.add( 'floatingspace', {
 
26
                init: function( editor ) {
 
27
                        // Add listener with lower priority than that in themedui creator.
 
28
                        // Thereby floatingspace will be created only if themedui wasn't used.
 
29
                        editor.on( 'loaded', function() {
 
30
                                attach( this );
 
31
                        }, null, null, 20 );
 
32
                }
 
33
        } );
 
34
 
 
35
        function scrollOffset( side ) {
 
36
                var pageOffset = side == 'left' ? 'pageXOffset' : 'pageYOffset',
 
37
                        docScrollOffset = side == 'left' ? 'scrollLeft' : 'scrollTop';
 
38
 
 
39
                return ( pageOffset in win.$ ) ?
 
40
                                win.$[ pageOffset ]
 
41
                        :
 
42
                                CKEDITOR.document.$.documentElement[ docScrollOffset ];
 
43
        }
 
44
 
 
45
        function attach( editor ) {
 
46
                var config = editor.config,
 
47
 
 
48
                        // Get the HTML for the predefined spaces.
 
49
                        topHtml = editor.fire( 'uiSpace', { space: 'top', html: '' } ).html,
 
50
 
 
51
                        // Re-positioning of the space.
 
52
                        layout = ( function() {
 
53
                                // Mode indicates the vertical aligning mode.
 
54
                                var mode, editable,
 
55
                                        spaceRect, editorRect, viewRect, spaceHeight, pageScrollX,
 
56
 
 
57
                                        // Allow minor adjustments of the float space from custom configs.
 
58
                                        dockedOffsetX = config.floatSpaceDockedOffsetX || 0,
 
59
                                        dockedOffsetY = config.floatSpaceDockedOffsetY || 0,
 
60
                                        pinnedOffsetX = config.floatSpacePinnedOffsetX || 0,
 
61
                                        pinnedOffsetY = config.floatSpacePinnedOffsetY || 0;
 
62
 
 
63
                                // Update the float space position.
 
64
                                function updatePos( pos, prop, val ) {
 
65
                                        floatSpace.setStyle( prop, pixelate( val ) );
 
66
                                        floatSpace.setStyle( 'position', pos );
 
67
                                }
 
68
 
 
69
                                // Change the current mode and update float space position accordingly.
 
70
                                function changeMode( newMode ) {
 
71
                                        var editorPos = editable.getDocumentPosition();
 
72
 
 
73
                                        switch ( newMode ) {
 
74
                                                case 'top':
 
75
                                                        updatePos( 'absolute', 'top', editorPos.y - spaceHeight - dockedOffsetY );
 
76
                                                        break;
 
77
                                                case 'pin':
 
78
                                                        updatePos( 'fixed', 'top', pinnedOffsetY );
 
79
                                                        break;
 
80
                                                case 'bottom':
 
81
                                                        updatePos( 'absolute', 'top', editorPos.y + ( editorRect.height || editorRect.bottom - editorRect.top ) + dockedOffsetY );
 
82
                                                        break;
 
83
                                        }
 
84
 
 
85
                                        mode = newMode;
 
86
                                }
 
87
 
 
88
                                return function( evt ) {
 
89
                                        // #10112 Do not fail on editable-less editor.
 
90
                                        if ( !( editable = editor.editable() ) )
 
91
                                                return;
 
92
 
 
93
                                        // Show up the space on focus gain.
 
94
                                        evt && evt.name == 'focus' && floatSpace.show();
 
95
 
 
96
                                        // Reset the horizontal position for below measurement.
 
97
                                        floatSpace.removeStyle( 'left' );
 
98
                                        floatSpace.removeStyle( 'right' );
 
99
 
 
100
                                        // Compute the screen position from the TextRectangle object would
 
101
                                        // be very simple, even though the "width"/"height" property is not
 
102
                                        // available for all, it's safe to figure that out from the rest.
 
103
 
 
104
                                        // http://help.dottoro.com/ljgupwlp.php
 
105
                                        spaceRect = floatSpace.getClientRect();
 
106
                                        editorRect = editable.getClientRect();
 
107
                                        viewRect = win.getViewPaneSize();
 
108
                                        spaceHeight = spaceRect.height;
 
109
                                        pageScrollX = scrollOffset( 'left' );
 
110
 
 
111
                                        // We initialize it as pin mode.
 
112
                                        if ( !mode ) {
 
113
                                                mode = 'pin';
 
114
                                                changeMode( 'pin' );
 
115
                                                // Call for a refresh to the actual layout.
 
116
                                                layout( evt );
 
117
                                                return;
 
118
                                        }
 
119
 
 
120
                                        // +------------------------ Viewport -+ \
 
121
                                        // |                                   |  |-> floatSpaceDockedOffsetY
 
122
                                        // | ................................. | /
 
123
                                        // |                                   |
 
124
                                        // |   +------ Space -+                |
 
125
                                        // |   |              |                |
 
126
                                        // |   +--------------+                |
 
127
                                        // |   +------------------ Editor -+   |
 
128
                                        // |   |                           |   |
 
129
                                        //
 
130
                                        if ( spaceHeight + dockedOffsetY <= editorRect.top )
 
131
                                                changeMode( 'top' );
 
132
 
 
133
                                        //     +- - - - - - - - -  Editor -+
 
134
                                        //     |                           |
 
135
                                        // +------------------------ Viewport -+ \
 
136
                                        // |   |                           |   |  |-> floatSpacePinnedOffsetY
 
137
                                        // | ................................. | /
 
138
                                        // |   +------ Space -+            |   |
 
139
                                        // |   |              |            |   |
 
140
                                        // |   +--------------+            |   |
 
141
                                        // |   |                           |   |
 
142
                                        // |   +---------------------------+   |
 
143
                                        // +-----------------------------------+
 
144
                                        //
 
145
                                        else if ( spaceHeight + dockedOffsetY > viewRect.height - editorRect.bottom )
 
146
                                                changeMode( 'pin' );
 
147
 
 
148
                                        //     +- - - - - - - - -  Editor -+
 
149
                                        //     |                           |
 
150
                                        // +------------------------ Viewport -+ \
 
151
                                        // |   |                           |   |  |-> floatSpacePinnedOffsetY
 
152
                                        // | ................................. | /
 
153
                                        // |   |                           |   |
 
154
                                        // |   |                           |   |
 
155
                                        // |   +---------------------------+   |
 
156
                                        // |   +------ Space -+                |
 
157
                                        // |   |              |                |
 
158
                                        // |   +--------------+                |
 
159
                                        //
 
160
                                        else
 
161
                                                changeMode( 'bottom' );
 
162
 
 
163
                                        var mid = viewRect.width / 2,
 
164
                                                alignSide =
 
165
                                                                ( editorRect.left > 0 && editorRect.right < viewRect.width && editorRect.width > spaceRect.width ) ?
 
166
                                                                                ( editor.config.contentsLangDirection == 'rtl' ? 'right' : 'left' )
 
167
                                                                        :
 
168
                                                                                ( mid - editorRect.left > editorRect.right - mid ? 'left' : 'right' ),
 
169
                                                offset;
 
170
 
 
171
                                        // (#9769) If viewport width is less than space width,
 
172
                                        // make sure space never cross the left boundary of the viewport.
 
173
                                        // In other words: top-left corner of the space is always visible.
 
174
                                        if ( spaceRect.width > viewRect.width ) {
 
175
                                                alignSide = 'left';
 
176
                                                offset = 0;
 
177
                                        }
 
178
                                        else {
 
179
                                                if ( alignSide == 'left' ) {
 
180
                                                        // If the space rect fits into viewport, align it
 
181
                                                        // to the left edge of editor:
 
182
                                                        //
 
183
                                                        // +------------------------ Viewport -+
 
184
                                                        // |                                   |
 
185
                                                        // |   +------------- Space -+         |
 
186
                                                        // |   |                     |         |
 
187
                                                        // |   +---------------------+         |
 
188
                                                        // |   +------------------ Editor -+   |
 
189
                                                        // |   |                           |   |
 
190
                                                        //
 
191
                                                        if ( editorRect.left > 0 )
 
192
                                                                offset = editorRect.left;
 
193
 
 
194
                                                        // If the left part of the editor is cut off by the left
 
195
                                                        // edge of the viewport, stick the space to the viewport:
 
196
                                                        //
 
197
                                                        //       +------------------------ Viewport -+
 
198
                                                        //       |                                   |
 
199
                                                        //       +---------------- Space -+          |
 
200
                                                        //       |                        |          |
 
201
                                                        //       +------------------------+          |
 
202
                                                        //  +----|------------- Editor -+            |
 
203
                                                        //  |    |                      |            |
 
204
                                                        //
 
205
                                                        else
 
206
                                                                offset = 0;
 
207
                                                }
 
208
                                                else {
 
209
                                                        // If the space rect fits into viewport, align it
 
210
                                                        // to the right edge of editor:
 
211
                                                        //
 
212
                                                        // +------------------------ Viewport -+
 
213
                                                        // |                                   |
 
214
                                                        // |         +------------- Space -+   |
 
215
                                                        // |         |                     |   |
 
216
                                                        // |         +---------------------+   |
 
217
                                                        // |   +------------------ Editor -+   |
 
218
                                                        // |   |                           |   |
 
219
                                                        //
 
220
                                                        if ( editorRect.right < viewRect.width )
 
221
                                                                offset = viewRect.width - editorRect.right;
 
222
 
 
223
                                                        // If the right part of the editor is cut off by the right
 
224
                                                        // edge of the viewport, stick the space to the viewport:
 
225
                                                        //
 
226
                                                        // +------------------------ Viewport -+
 
227
                                                        // |                                   |
 
228
                                                        // |             +------------- Space -+
 
229
                                                        // |             |                     |
 
230
                                                        // |             +---------------------+
 
231
                                                        // |                 +-----------------|- Editor -+
 
232
                                                        // |                 |                 |          |
 
233
                                                        //
 
234
                                                        else
 
235
                                                                offset = 0;
 
236
                                                }
 
237
 
 
238
                                                // (#9769) Finally, stick the space to the opposite side of
 
239
                                                // the viewport when it's cut off horizontally on the left/right
 
240
                                                // side like below.
 
241
                                                //
 
242
                                                // This trick reveals cut off space in some edge cases and
 
243
                                                // hence it improves accessibility.
 
244
                                                //
 
245
                                                // +------------------------ Viewport -+
 
246
                                                // |                                   |
 
247
                                                // |              +--------------------|-- Space -+
 
248
                                                // |              |                    |          |
 
249
                                                // |              +--------------------|----------+
 
250
                                                // |              +------- Editor -+   |
 
251
                                                // |              |                |   |
 
252
                                                //
 
253
                                                //                              becomes:
 
254
                                                //
 
255
                                                // +------------------------ Viewport -+
 
256
                                                // |                                   |
 
257
                                                // |   +----------------------- Space -+
 
258
                                                // |   |                               |
 
259
                                                // |   +-------------------------------+
 
260
                                                // |              +------- Editor -+   |
 
261
                                                // |              |                |   |
 
262
                                                //
 
263
                                                if ( offset + spaceRect.width > viewRect.width ) {
 
264
                                                        alignSide = alignSide == 'left' ? 'right' : 'left';
 
265
                                                        offset = 0;
 
266
                                                }
 
267
                                        }
 
268
 
 
269
                                        // Pin mode is fixed, so don't include scroll-x.
 
270
                                        // (#9903) For mode is "top" or "bottom", add opposite scroll-x for right-aligned space.
 
271
                                        var scroll = mode == 'pin' ?
 
272
                                                        0
 
273
                                                :
 
274
                                                        alignSide == 'left' ? pageScrollX : -pageScrollX;
 
275
 
 
276
                                        floatSpace.setStyle( alignSide, pixelate( ( mode == 'pin' ? pinnedOffsetX : dockedOffsetX ) + offset + scroll ) );
 
277
                                };
 
278
                        } )();
 
279
 
 
280
                if ( topHtml ) {
 
281
                        var floatSpace = CKEDITOR.document.getBody().append( CKEDITOR.dom.element.createFromHtml( floatSpaceTpl.output( {
 
282
                                        content: topHtml,
 
283
                                        id: editor.id,
 
284
                                        langDir: editor.lang.dir,
 
285
                                        langCode: editor.langCode,
 
286
                                        name: editor.name,
 
287
                                        style: 'display:none;z-index:' + ( config.baseFloatZIndex - 1 ),
 
288
                                        topId: editor.ui.spaceId( 'top' ),
 
289
                                        voiceLabel: editor.lang.editorPanel + ', ' + editor.name
 
290
                                } ) ) ),
 
291
 
 
292
                                // Use event buffers to reduce CPU load when tons of events are fired.
 
293
                                changeBuffer = CKEDITOR.tools.eventsBuffer( 500, layout ),
 
294
                                uiBuffer = CKEDITOR.tools.eventsBuffer( 100, layout );
 
295
 
 
296
                        // There's no need for the floatSpace to be selectable.
 
297
                        floatSpace.unselectable();
 
298
 
 
299
                        // Prevent clicking on non-buttons area of the space from blurring editor.
 
300
                        floatSpace.on( 'mousedown', function( evt ) {
 
301
                                evt = evt.data;
 
302
                                if ( !evt.getTarget().hasAscendant( 'a', 1 ) )
 
303
                                        evt.preventDefault();
 
304
                        } );
 
305
 
 
306
                        editor.on( 'focus', function( evt ) {
 
307
                                layout( evt );
 
308
                                editor.on( 'change', changeBuffer.input );
 
309
                                win.on( 'scroll', uiBuffer.input );
 
310
                                win.on( 'resize', uiBuffer.input );
 
311
                        } );
 
312
 
 
313
                        editor.on( 'blur', function() {
 
314
                                floatSpace.hide();
 
315
                                editor.removeListener( 'change', changeBuffer.input );
 
316
                                win.removeListener( 'scroll', uiBuffer.input );
 
317
                                win.removeListener( 'resize', uiBuffer.input );
 
318
                        } );
 
319
 
 
320
                        editor.on( 'destroy', function() {
 
321
                                win.removeListener( 'scroll', uiBuffer.input );
 
322
                                win.removeListener( 'resize', uiBuffer.input );
 
323
                                floatSpace.clearCustomData();
 
324
                                floatSpace.remove();
 
325
                        } );
 
326
 
 
327
                        // Handle initial focus.
 
328
                        if ( editor.focusManager.hasFocus )
 
329
                                floatSpace.show();
 
330
 
 
331
                        // Register this UI space to the focus manager.
 
332
                        editor.focusManager.add( floatSpace, 1 );
 
333
                }
 
334
        }
 
335
} )();
 
336
 
 
337
/**
 
338
 * Along with {@link #floatSpaceDockedOffsetY} it defines the
 
339
 * amount of offset (in pixels) between float space and the editable left/right
 
340
 * boundaries when space element is docked at either side of the editable.
 
341
 *
 
342
 *              config.floatSpaceDockedOffsetX = 10;
 
343
 *
 
344
 * @cfg {Number} [floatSpaceDockedOffsetX=0]
 
345
 * @member CKEDITOR.config
 
346
 */
 
347
 
 
348
/**
 
349
 * Along with {@link #floatSpaceDockedOffsetX} it defines the
 
350
 * amount of offset (in pixels) between float space and the editable top/bottom
 
351
 * boundaries when space element is docked at either side of the editable.
 
352
 *
 
353
 *              config.floatSpaceDockedOffsetY = 10;
 
354
 *
 
355
 * @cfg {Number} [floatSpaceDockedOffsetY=0]
 
356
 * @member CKEDITOR.config
 
357
 */
 
358
 
 
359
/**
 
360
 * Along with {@link #floatSpacePinnedOffsetY} it defines the
 
361
 * amount of offset (in pixels) between float space and the view port boundaries
 
362
 * when space element is pinned.
 
363
 *
 
364
 *              config.floatSpacePinnedOffsetX = 20;
 
365
 *
 
366
 * @cfg {Number} [floatSpacePinnedOffsetX=0]
 
367
 * @member CKEDITOR.config
 
368
 */
 
369
 
 
370
/**
 
371
 * Along with {@link #floatSpacePinnedOffsetX} it defines the
 
372
 * amount of offset (in pixels) between float space and the view port boundaries
 
373
 * when space element is pinned.
 
374
 *
 
375
 *              config.floatSpacePinnedOffsetY = 20;
 
376
 *
 
377
 * @cfg {Number} [floatSpacePinnedOffsetY=0]
 
378
 * @member CKEDITOR.config
 
379
 */