Refactor of The Divided Times

divided_times.js

$(document).ready(function(){

	$('#primary-nav li').on('click', function(event) {
		event.preventDefault();
		var topic = $(this).attr('class').split(' ')[0];
		doNavigationEffect(topic);
	});

	function doNavigationEffect(theTopic) {
		// switching the active tab
		// switchActiveTab(theTopic);
		// revealing relevant articles
		// displayArticles(theTopic);

		var tab = $("#primary-nav ." + theTopic);
		var slideDown = $('#slide-down');
		var articleRow = $('#' + theTopic + '-drop'); // "tech" -> "#tech-drop"

		tab.siblings().removeClass('active');
		tab.toggleClass('active');

		var isTabActive = tab.hasClass('active');
		if(isTabActive) {
			var isSlideDownOpen = slideDown.hasClass('open');
			if(isSlideDownOpen) {
				slideDown.find('.drop.open').hide().removeClass('open');
				articleRow.show().addClass('open');
			} else {
				slideDown.find('.drop').hide();
				articleRow.show().addClass('open');
				slideDown.slideDown(500).addClass('open');
			}
		} else {
			slideDown.slideUp(500).removeClass('open');
		}
	};

	// var drops = $('#slide-down .drop') // find the element whose id is slide-down, and get anything below it whose own class is drop
	// var element = $('#slide-down');
	// var drops = element.find('.drop');

	// if($('#slide-down .drop').hasClass('active')) --> find the active element
});