Ext.ns("xJukebox.Doc");
Ext.ns("xJukebox.Example");

// NicoNico VideoID Validator
Ext.apply(Ext.form.VTypes, {
	nicovideoid : function(val, field) {
		var reg = new RegExp("[a-z]{2}[0-9]+", "i"); 
		return val.toString().match(reg);
	}
});

// NicoInfo Example
xJukebox.Example.NicoInfo = function(config) {
	this.id = config.applyTo;
	this.tpl = new Ext.XTemplate(
		'<tpl for=".">',
		'<ul class="url-list">',
			'<li><a href="{apibase}/nicoinfo/{videoid}.atom" target="_blank">{apibase}/nicoinfo/{videoid}.atom</a></li>',
			'<li><a href="{apibase}/nicoinfo/{videoid}.rss" target="_blank">{apibase}/nicoinfo/{videoid}.rss</a></li>',
			'<li><a href="{apibase}/nicoinfo/{videoid}.xml" target="_blank">{apibase}/nicoinfo/{videoid}.xml</a></li>',
			'<li><a href="{apibase}/nicoinfo/{videoid}.json" target="_blank">{apibase}/nicoinfo/{videoid}.json</a></li>',
			'<li><a href="{apibase}/nicoinfo/{videoid}.json?callback=callback" target="_blank">{apibase}/nicoinfo/{videoid}.json?callback=callback</a></li>',
		'</ul>',
		'</tpl>'
	);
	
	this.submit = new Ext.Button({
		text:'Create Request URLs',
		handler:function(){this.execute();},
		scope:this
	});
	this.form = new Ext.form.FormPanel({
		layout:'table',
		width:config.width,
		onSubmit: Ext.emptyFn,
		border:false,
		items: [
			{
				xtype: 'label',
				text:'videoid:'
			},
			{
				xtype:'textfield',
				vtype:'nicovideoid',
				id:'nicoinfo_videoid',
				name:'nicoinfo_videoid',
				fieldLabel: 'videoid',
				value:config.videoid,
				allowBlank:false,
				width:120
			},
			this.submit
		]
	});
	Ext.apply(config,{
		items:[
			this.form,
			{
					id: this.id+'-urls',
					border:false,
					width:config.width
				}
		]
	});
	xJukebox.Example.NicoInfo.superclass.constructor.call(this, config);
}
Ext.extend(xJukebox.Example.NicoInfo, Ext.Panel, {
	execute: function() {
		var f = this.form.getForm();
			//console.log(f.getValues(true));
			if (f.isValid()) {
				var params = f.getValues();
				var data = {apibase:_config.apibase,videoid:params.nicoinfo_videoid};
				var el = Ext.getCmp(this.id+'-urls').body;
				this.tpl.overwrite(el, data);
			}
	}
});

Ext.onReady(function(){
	Ext.QuickTips.init();
	
	/*
	// api-content
	var getvideo = new xJukebox.Doc.ApiPanel({id:"getvideo",loc:"jp"});
	var nicoinfo = new xJukebox.Doc.ApiPanel({id:"nicoinfo",loc:"jp"});
	var youtubemp4 = new xJukebox.Doc.ApiPanel({id:"youtubemp4",loc:"jp"});
	Ext.get('getvideo').on('click', function(){getvideo.toggle();});
	Ext.get('nicoinfo').on('click', function(){nicoinfo.toggle();});
	Ext.get('youtubemp4').on('click', function(){youtubemp4.toggle();});
	*/
	
	// examples
	var ex1 = new xJukebox.Example.NicoInfo({
		height:120,
		width:600,
		applyTo: 'nicoinfo-example',
		videoid: 'sm542750'
	});
	ex1.execute();
}, null, {delay: 100}); // delay for Firefox3 in windows