// Browser content
var browser = Class.create();
Object.extend(browser.prototype, {
	initialize: function() {
		this.sendReq();
	},
	
	sendReq: function() { 
		var send = new Ajax.Request('/lae/iphone/tips/feeds/guide.json', {
			method: 'GET',
			onComplete: this.acknowledgeComplete.bind(this)
		})
	},
	
	scopedEval: function(stringValue) {
		try {
			//alert(stringValue);
			return (function() {return eval("("+stringValue+")");})();
		}
		catch(e) {
			//alert('Error: '+e);
			return null;
		}
	},

	acknowledgeComplete: function(request) {
		var jsonText = request.responseText;
		var result = this.scopedEval(jsonText);
		if(result) {
			this.sections = result;
			this.setColumns();
		}
	},
	
	setColumns: function() {
		// First browser column
		var firstColumn = new TipsSlider('firstcolumn');
		var subFeatures = [];
		
		for(var i=0, section; section=this.sections[i]; i++) {
			var sectionId = section.id;
			var topics = section.topics;
			var title = Builder.node('a',{
				className:'sub-nav-link',
				id:sectionId,
				href:'#'+sectionId
				},[Builder.node('span',[section.title+' ('+topics.length+')'])]);

			var sliderItem = new AC.SliderItem(title);
			firstColumn.items.push(sliderItem);

			var subNavContent = Builder.node('div', {
				id:sectionId,
				className:'section-content'
			});
			
			$('maskedcontent').appendChild(subNavContent);
			
			// Second browser column
			var secondColumn = new TipsSlider(sectionId);
			var firstTopic = '';
			for(var k=0, topic; topic=topics[k]; k++) {
				var topicId = sectionId+'_'+topic.file.split('.html')[0];
				var topicName = topic.name.truncate(28);
				var topicAnchor = Builder.node('a', {className:'content-link',id:topicId,name:topicId,href:'/lae/iphone/tips/content/'+topic.file}, [Builder.node('span',[topicName])]);
				var subNavItem = new AC.SliderItem(topicAnchor);

				secondColumn.items.push(subNavItem);
				if(k==0) firstTopic = topicId;
			}

			subFeatures[i] = {
				id:sectionId,
				initialTopic:firstTopic
			};
			
			secondColumn.render(18);
			secondColumn.resetPages();
		}
		
		for(var j=0; j<subFeatures.length; j++) {
			subFeatures[subFeatures[j].id] = subFeatures[j];
		}
		
		var firstId = this.sections[0].title.gsub(/\s+/,'-').toLowerCase()+'-content';
		
		firstColumn.render(9);
		firstColumn.resetPages();
		var subFeatureViewer = new SubFeatureViewer(
			null,
			'tipcontent',
			'content-link',
			{
				initialId: subFeatures[0].initialTopic,
				shouldAnimateContentChange: false,
				silentTriggers: true
			}
		);
		
		var featureViewer = new FeatureViewer(
			$$('.section-content'),
			'secondcolumn',
			'sub-nav-link',
			{
				initialId:firstId,
				shouldAnimateContentChange:false,
				silentTriggers: true,
				subViewer: subFeatureViewer
			}
		);

	}

});

Event.onDOMReady(function() {	
	new browser();
});