webgui/www/extras/wobject/Carousel/carousel.js

110 lines
2.9 KiB
JavaScript

if ( typeof WebGUI == 'undefined' ) {
WebGUI = {};
}
if ( typeof WebGUI.Carousel == 'undefined' ) {
WebGUI.Carousel = {};
}
WebGUI.Carousel.Editor
= function ( id, mceConfig, items, i18n ) {
this.id = id;
this.mceConfig = mceConfig;
this.items = items;
this.i18n = i18n;
// Initialize a tabview
this.tabView = new YAHOO.widget.TabView( this.id, {
orientation : "left"
} );
// Add a tab for each item
for ( var i = 0; i < this.items.length; i++ ) {
this.addTab( this.items[i] );
}
// We're new!
if ( this.items.length == 0 ) {
this.addTab( );
}
// Find the form and eventize it!
var form = document.getElementById( this.id );
while ( form.tagName != "FORM" ) {
form = form.parentNode;
}
YAHOO.util.Event.on( form, 'submit', this.handleSubmit, this, true );
};
WebGUI.Carousel.Editor.prototype.addTab
= function ( data ) {
var num = this.tabView.get('tabs').length + 1;
if ( !data ) {
data = { text : "", itemId : 'carousel_item_' + num };
}
var tab = new YAHOO.widget.Tab( {
label : num,
content : ''
} );
this.tabView.addTab( tab );
this.tabView.selectTab( num - 1 );
var el = tab.get('contentEl');
var delBtn = document.createElement( 'input' );
delBtn.type = "button";
delBtn.style.cssFloat = "right";
delBtn.value = this.i18n['delete'];
YAHOO.util.Event.on( delBtn, "click", function(){
this.tabView.removeTab( tab );
}, this, true );
el.appendChild( delBtn );
var input = document.createElement( 'input' );
input.type = "text";
input.value = data.itemId;
el.appendChild( document.createTextNode( "ID: " ) );
el.appendChild( input );
var ta = document.createElement( 'textarea' );
ta.className = "carouselInput";
ta.name = "carouselInput" + num;
ta.id = ta.name;
ta.style.height = "300px";
ta.appendChild( document.createTextNode( data.text ) );
el.appendChild( ta );
var conf = JSON.parse(JSON.stringify(this.mceConfig));
conf.mode = "exact";
conf.elements = ta.name;
tinyMCE.init( conf );
};
WebGUI.Carousel.Editor.prototype.handleSubmit
= function ( ) {
var tabs = this.tabView.get('tabs');
var items = [];
for ( var i = 0; i < tabs.length; i++ ) {
var item = { };
var tab = tabs[i];
var elem = tab.get('contentEl');
var id = elem.getElementsByTagName( 'input' )[1];
item.itemId = id.value;
var text = elem.getElementsByTagName( 'textarea' )[0];
// Force the TinyMCE to update the textarea
tinyMCE.getInstanceById( text.id ).save();
item.text = text.value;
item.sequenceNumber = i;
items.push( item );
}
var json = YAHOO.lang.JSON.stringify( items );
document.getElementById( 'items_formId' ).value = json;
};