1 /* 2 Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved. 3 For licensing, see LICENSE.html or http://ckeditor.com/license 4 */ 5 6 CKEDITOR.plugins.add( 'listblock', 7 { 8 requires : [ 'panel' ], 9 10 onLoad : function() 11 { 12 CKEDITOR.ui.panel.prototype.addListBlock = function( name, multiSelect ) 13 { 14 return this.addBlock( name, new CKEDITOR.ui.listBlock( this.getHolderElement(), multiSelect ) ); 15 }; 16 17 CKEDITOR.ui.listBlock = CKEDITOR.tools.createClass( 18 { 19 base : CKEDITOR.ui.panel.block, 20 21 $ : function( blockHolder, multiSelect ) 22 { 23 // Call the base contructor. 24 this.base( blockHolder ); 25 26 this.multiSelect = !!multiSelect; 27 28 var keys = this.keys; 29 keys[ 40 ] = 'next'; // ARROW-DOWN 30 keys[ 9 ] = 'next'; // TAB 31 keys[ 38 ] = 'prev'; // ARROW-UP 32 keys[ CKEDITOR.SHIFT + 9 ] = 'prev'; // SHIFT + TAB 33 keys[ 32 ] = 'click'; // SPACE 34 35 this._.pendingHtml = []; 36 this._.items = {}; 37 this._.groups = {}; 38 }, 39 40 _ : 41 { 42 close : function() 43 { 44 if ( this._.started ) 45 { 46 this._.pendingHtml.push( '</ul>' ); 47 delete this._.started; 48 } 49 }, 50 51 getClick : function() 52 { 53 if ( !this._.click ) 54 { 55 this._.click = CKEDITOR.tools.addFunction( function( value ) 56 { 57 var marked = true; 58 59 if ( this.multiSelect ) 60 marked = this.toggle( value ); 61 else 62 this.mark( value ); 63 64 if ( this.onClick ) 65 this.onClick( value, marked ); 66 }, 67 this ); 68 } 69 return this._.click; 70 } 71 }, 72 73 proto : 74 { 75 add : function( value, html, title ) 76 { 77 var pendingHtml = this._.pendingHtml, 78 id = 'cke_' + CKEDITOR.tools.getNextNumber(); 79 80 if ( !this._.started ) 81 { 82 pendingHtml.push( '<ul class=cke_panel_list>' ); 83 this._.started = 1; 84 } 85 86 this._.items[ value ] = id; 87 88 pendingHtml.push( 89 '<li id=', id, ' class=cke_panel_listItem>' + 90 '<a _cke_focus=1 hidefocus=true' + 91 ' title="', title || value, '"' + 92 ' href="javascript:void(\'', value, '\')"' + 93 ' onclick="CKEDITOR.tools.callFunction(', this._.getClick(), ',\'', value, '\');">', 94 html || value, 95 '</a>' + 96 '</li>' ); 97 }, 98 99 startGroup : function( title ) 100 { 101 this._.close(); 102 103 var id = 'cke_' + CKEDITOR.tools.getNextNumber(); 104 105 this._.groups[ title ] = id; 106 107 this._.pendingHtml.push( '<h1 id=', id, ' class=cke_panel_grouptitle>', title, '</h1>' ); 108 }, 109 110 commit : function() 111 { 112 this._.close(); 113 this.element.appendHtml( this._.pendingHtml.join( '' ) ); 114 }, 115 116 toggle : function( value ) 117 { 118 var isMarked = this.isMarked( value ); 119 120 if ( isMarked ) 121 this.unmark( value ); 122 else 123 this.mark( value ); 124 125 return !isMarked; 126 }, 127 128 hideGroup : function( groupTitle ) 129 { 130 var group = this.element.getDocument().getById( this._.groups[ groupTitle ] ), 131 list = group && group.getNext(); 132 133 if ( group ) 134 { 135 group.setStyle( 'display', 'none' ); 136 137 if ( list && list.getName() == 'ul' ) 138 list.setStyle( 'display', 'none' ); 139 } 140 }, 141 142 hideItem : function( value ) 143 { 144 this.element.getDocument().getById( this._.items[ value ] ).setStyle( 'display', 'none' ); 145 }, 146 147 showAll : function() 148 { 149 var items = this._.items, 150 groups = this._.groups, 151 doc = this.element.getDocument(); 152 153 for ( var value in items ) 154 { 155 doc.getById( items[ value ] ).setStyle( 'display', '' ); 156 } 157 158 for ( title in groups ) 159 { 160 var group = doc.getById( groups[ title ] ), 161 list = group.getNext(); 162 163 group.setStyle( 'display', '' ); 164 165 if ( list && list.getName() == 'ul' ) 166 list.setStyle( 'display', '' ); 167 } 168 }, 169 170 mark : function( value ) 171 { 172 if ( !this.multiSelect ) 173 this.unmarkAll(); 174 175 this.element.getDocument().getById( this._.items[ value ] ).addClass( 'cke_selected' ); 176 }, 177 178 unmark : function( value ) 179 { 180 this.element.getDocument().getById( this._.items[ value ] ).removeClass( 'cke_selected' ); 181 }, 182 183 unmarkAll : function() 184 { 185 var items = this._.items, 186 doc = this.element.getDocument(); 187 188 for ( var value in items ) 189 { 190 doc.getById( items[ value ] ).removeClass( 'cke_selected' ); 191 } 192 }, 193 194 isMarked : function( value ) 195 { 196 return this.element.getDocument().getById( this._.items[ value ] ).hasClass( 'cke_selected' ); 197 }, 198 199 focus : function( value ) 200 { 201 this._.focusIndex = -1; 202 203 if ( value ) 204 { 205 var selected = this.element.getDocument().getById( this._.items[ value ] ).getFirst(); 206 207 var links = this.element.getElementsByTag( 'a' ), 208 link, 209 i = -1; 210 211 while( ( link = links.getItem( ++i ) ) ) 212 { 213 if ( link.equals( selected ) ) 214 { 215 this._.focusIndex = i; 216 break; 217 } 218 } 219 220 setTimeout( function() 221 { 222 selected.focus(); 223 }, 224 0 ); 225 } 226 } 227 } 228 }); 229 } 230 }); 231