ultimix
tabs_ex.js
Go to the documentation of this file.
1 
6 if( !ultimix )
7 {
8  ultimix = {};
9 }
10 
16 if( !ultimix.tab_control )
17 {
18  ultimix.tab_control = {};
19  ultimix.tab_control.TabCounter = 1;
20  ultimix.tab_control.AddTabFlag = 0;
21  ultimix.tab_control.AddContentId = '_unexisting_id';
22  ultimix.tab_control.InitialTabWasDeleted = new Array();
23  ultimix.tab_control.SelectCreated = false;
24  ultimix.tab_control.InsertIndex = -1;
25  ultimix.tab_control.AutoSelect = false;
26 }
27 
35 ultimix.tab_control.tab_control_create_setup = function( ControlId )
36 {
37  jQuery( '#' + ControlId ).tabs(
38  {
39  select : function( event , ui )
40  {
41  if( ultimix.tab_control.AddTabFlag == 0 )
42  {
43  jQuery.cookie( ControlId + '-active-tab-id' , ui.tab.hash.replace( '#' , '' ) );
44  return;
45  }
46  ultimix.tab_control.AddTabFlag = 0;
47  } ,
48  show : function( event , ui )
49  {
50  ultimix.windows.auto_fit_div( ui.panel );
51  }
52  }
53  );
54 
55  ultimix.tab_control.set_add_tab_handler( ControlId );
56 }
57 
65 ultimix.tab_control.create_tab = function( ControlId )
66 {
67  var TabId = 'tabs' + ultimix.tab_control.TabCounter++;
68  jQuery( '#' + ControlId ).html( '<ul><li><a href="#' + TabId + '"></a></li></ul><div id="' + TabId + '"></div>' );
69 
70  jQuery( '#' + ControlId ).tabs();
71 
72  ultimix.tab_control.tab_control_create_setup( ControlId );
73 
74  ultimix.tab_control.InitialTabWasDeleted[ ControlId ] = false;
75 }
76 
86 ultimix.tab_control.on_close_tab = function( ControlId , Tab )
87 {
88  var index = jQuery( '#' + ControlId ).children( 'ul' ).children( 'li' ).index( jQuery( Tab ).parent() );
89  jQuery( '#' + ControlId ).tabs( 'remove' , index );
90 }
91 
101 ultimix.tab_control.set_closable = function( ControlId , TabCursor )
102 {
103  if( TabCursor )
104  {
105  var Item = jQuery( '#' + ControlId + '>.ui-tabs-nav>li>a' ).eq( TabCursor );
106  }
107  else
108  {
109  var Item = jQuery( '#' + ControlId + '>.ui-tabs-nav>li>a' ).last();
110  }
111 
112  if( jQuery( Item ).next().length )
113  {
114  jQuery( Item ).next().remove();
115  }
116 
117  jQuery( Item ).after(
118  '<span class="ui-icon ui-icon-close" onclick="ultimix.tab_control.on_close_tab( \'' + ControlId +
119  '\' , this );" title="' + ultimix.get_string( 'close_tab' ) + '">&nbsp;</span>'
120  );
121 }
122 
130 ultimix.tab_control.try_auto_select_tab = function( ControlId )
131 {
132  if( ultimix.tab_control.AutoSelect == false )
133  {
134  return;
135  }
136  var ActiveTabId = jQuery.cookie( ControlId + '-active-tab-id' );
137  ActiveTabId = ActiveTabId ? ActiveTabId : 'tabs1';
138 
139  if( jQuery( '#' + ControlId ).find( '#' + ActiveTabId ).length )
140  {
141  var Items = jQuery( '#' + ControlId + '>.ui-tabs-nav>li>a' );
142  for( var i = 0 ; i < Items.length ; i++ )
143  {
144  if( jQuery( Items[ i ] ).attr( 'href' ) == '#' + ActiveTabId )
145  {
146  jQuery( '#' + ControlId ).tabs( "select" , i );
147  ultimix.tab_control.AddTabFlag = 0;
148  }
149  }
150  }
151 }
152 
160 ultimix.tab_control.set_add_tab_handler = function( ControlId )
161 {
162  jQuery( '#' + ControlId ).tabs(
163  'option' , 'add' ,
164  function( event , ui )
165  {
166  jQuery( ui.panel ).append( jQuery( '#' + ultimix.tab_control.AddContentId ) );
167 
168  if( ultimix.tab_control.SelectCreated )
169  {
170  var TabIndex = ultimix.tab_control.count_of_tabs( ControlId ) - 1;
171  TabIndex = ultimix.tab_control.InsertIndex == -1 ? TabIndex : ultimix.tab_control.InsertIndex;
172  jQuery( '#' + ControlId ).tabs( "select" , TabIndex );
173  }
174  else
175  {
176  ultimix.tab_control.try_auto_select_tab( ControlId );
177  }
178  }
179  );
180 }
181 
193 ultimix.tab_control.post_process_tab = function( TabSelector , TabId , Selected )
194 {
195  jQuery( TabSelector ).html(
196  ultimix.string_utilities.str_replace( '[tab_id]' , TabId , jQuery( TabSelector ).html() )
197  );
198 
199  if( Selected )
200  {
201  ultimix.windows.auto_fit_div( jQuery( '#' + ultimix.tab_control.AddContentId ).parent() );
202  }
203 }
204 
220 ultimix.tab_control.add_simple_tab = function( ControlId , Title , Index , ContentId , Selected )
221 {
222  ultimix.tab_control.AddTabFlag = 1;
223  ultimix.tab_control.AddContentId = ContentId;
224  ultimix.tab_control.SelectCreated = Selected;
225  ultimix.tab_control.InsertIndex = Index;
226 
227  var TabId = 'tabs' + ( ultimix.tab_control.TabCounter );
228  var TabSelector = '#tabs' + ( ultimix.tab_control.TabCounter++ );
229 
230  if( Index >= 0 )
231  {
232  jQuery( '#' + ControlId ).tabs( 'add' , TabSelector , ultimix.get_string( Title ) , Index );
233  }
234  else
235  {
236  jQuery( '#' + ControlId ).tabs( 'add' , TabSelector , ultimix.get_string( Title ) );
237  }
238 
239  ultimix.tab_control.post_process_tab( TabSelector , TabId , Selected );
240 }
241 
257 ultimix.tab_control.add_simple_tab_from_content = function( ControlId , Title , Index , Content , Selected )
258 {
259  var ContentId = "content_" + ultimix.core.GetCurrentMilliseconds();
260 
261  jQuery( 'body' ).append( '<div id="' + ContentId + '" style=\"height: 100%;\">' + Content + '</div>' );
262 
263  ultimix.tab_control.add_simple_tab( ControlId , Title , Index , ContentId , Selected );
264 }
265 
283 ultimix.tab_control.add_tab = function( ControlId , Title , Index , ContentId , Closable , Selected )
284 {
285  ultimix.tab_control.add_simple_tab( ControlId , Title , Index , ContentId , Selected );
286 
287  if( ultimix.tab_control.InitialTabWasDeleted[ ControlId ] == false )
288  {
289  var TabIndex = ultimix.tab_control.InsertIndex == -1 ? 0 : 1;
290  jQuery( '#' + ControlId ).tabs( 'remove' , TabIndex );
291  ultimix.tab_control.InitialTabWasDeleted[ ControlId ] = true;
292  }
293 
294  if( Closable )
295  {
296  ultimix.tab_control.set_closable( ControlId );
297  }
298 }
299 
317 ultimix.tab_control.add_tab_from_content = function( ControlId , Title , Index , Content , Closable , Selected )
318 {
319  var ContentId = "content_" + ultimix.core.GetCurrentMilliseconds();
320 
321  jQuery( 'body' ).append( '<div id="' + ContentId + '" style=\"height: 100%;\">' + Content + '</div>' );
322 
323  ultimix.tab_control.add_tab( ControlId , Title , Index , ContentId , Closable , Selected );
324 }
325 
345 ultimix.tab_control.add_iframe_tab = function( ControlId , Title , Index , URL , Closable , Height , Selected )
346 {
347  var TabFrameId = ultimix.tab_control.TabCounter++;
348 
349  jQuery( 'body' ).append( '<iframe style="width: 100%; border: 0px; height: ' + Height + ';" id="tab_frame_' +
350  TabFrameId + '" src="' + URL + '"></iframe>' );
351 
352  ultimix.tab_control.add_tab( ControlId , Title , Index , "tab_frame_" + TabFrameId , Closable , Selected )
353 }
354 
362 ultimix.tab_control.create_tab_control_from_markup = function( ControlId )
363 {
364  jQuery( '#' + ControlId ).tabs();
365 
366  ultimix.tab_control.tab_control_create_setup( ControlId );
367 }
368 
384 ultimix.tab_control.create_tab_control_with_tab = function( ParentSelector , ControlId , Title , Content , Closable )
385 {
386  /* preparing markup */
387  jQuery( ParentSelector ).append(
388  '<div id="' + ControlId +
389  '"><ul><li><a href="#tabs-1">' + ultimix.get_string( Title ) + '</a></li></ul><div id="tabs-1">' +
390  Content + '</div></div>'
391  );
392 
393  /* creating tab */
394  ultimix.tab_control.create_tab_control_from_markup( ControlId );
395 
396  if( Closable )
397  {
398  ultimix.tab_control.set_closable( ControlId );
399  }
400 }
401 
421 ultimix.tab_control.add_tab_for_existing_control = function( ParentSelector , ControlId , Title , Index , Content ,
422  Closable , Selected )
423 {
424  if( jQuery( '#' + ControlId ).length )
425  {
426  /* control exists */
427  ultimix.tab_control.add_tab_from_content( ControlId , Title , Index , Content , Closable , Selected );
428  }
429  else
430  {
431  /* control does not exist */
432  ultimix.tab_control.create_tab_control_with_tab( ParentSelector , ControlId , Title , Content , Closable );
433  }
434 }
435 
457 ultimix.tab_control.add_iframe_tab_for_existing_control = function( ParentSelector , ControlId , Title , Index , URL ,
458  Closable , Height , Selected )
459 {
460  if( jQuery( '#' + ControlId ).length )
461  {
462  /* control exists */
463  ultimix.tab_control.add_iframe_tab( ControlId , Title , Index , URL , Closable , Height );
464  }
465  else
466  {
467  var ContentId = "content_" + ultimix.core.GetCurrentMilliseconds();
468 
469  /* control does not exist */
470  var Content = '<iframe style="width: 100%; border: 0px; height: ' + Height + ';" id="tab_frame_' +
471  TabFrameId + '" src="' + URL + '"></iframe>';
472 
473  ultimix.tab_control.create_tab_control_with_tab(
474  ParentSelector , ControlId , Title , Content , Closable , Selected
475  );
476  }
477 }
478 
479 
489 ultimix.tab_control.count_of_tabs = function( ControlId )
490 {
491  return( jQuery( '#' + ControlId + '>.ui-tabs-nav>li>a' ).length );
492 }
493 
505 ultimix.tab_control.get_tab_content_acceptor_success = function( TabId , Data )
506 {
507  return(
508  function( Content )
509  {
510  Content = ultimix.string_utilities.str_replace( '[tab_id]' , TabId , Content );
511  jQuery( Data.CreatedTab ).html( Content );
512  }
513  );
514 }
515 
535 ultimix.tab_control.get_tab_content_acceptor = function( ControlId , Title , Index , Closable , Selected )
536 {
537  var Data = { 'CreatedTab' : false };
538  var TabId = 'tabs' + ultimix.tab_control.TabCounter;
539 
540  return(
541  {
542  before_request : function()
543  {
544  ultimix.tab_control.add_tab_from_content(
545  ControlId , Title , Index , ultimix.std_dialogs.loading_img_widget() , Closable , Selected
546  );
547  Index = Index == -1 ? ultimix.tab_control.count_of_tabs( ControlId ) - 1 : Index;
548  Data.CreatedTab = jQuery( '#' + ControlId ).children( 'div' ).eq( Index );
549  } ,
550  success : ultimix.tab_control.get_tab_content_acceptor_success( TabId , Data )
551  }
552  );
553 }
554 
578 ultimix.tab_control.open_record_in_tab = function( ControlId , Title , Index ,
579  Closable , Selected , ContentProvider , RecordId )
580 {
581  var TabId = 'tabs' + ultimix.tab_control.TabCounter;
582 
583  ultimix.tab_control.add_tab_from_content(
584  ControlId , Title , Index , ultimix.std_dialogs.loading_img_widget() , Closable , Selected
585  );
586 
587  Index = Index == -1 ? ultimix.tab_control.count_of_tabs( ControlId ) - 1 : Index;
588 
589  ContentProvider( RecordId , jQuery( '#' + ControlId ).children( 'div' ).eq( Index ) );
590 }