

<html>
<head>
<title>YourNewsFix.com</title>
<script type="text/javascript" src="js/mvc.js"></script>
<script type="text/javascript" src="js/generated.js"></script>

<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>


<script>

var page = 0;
var articlesPerPage = 12;
var categoryId = -1;

var categories = [
	{ name:"All", categoryId:0 }
	,{ name: "US", categoryId: 1}
	,{ name: "World", categoryId: 2}
	,{ name: "Politics", categoryId: 3}
	,{ name: "Business", categoryId: 4}
	,{ name: "Technology", categoryId: 5}
	,{ name: "Sports", categoryId: 6}
	,{ name: "Arts And Entertainment", categoryId: 7}
	,{ name: "Funny", categoryId: 8}

];

function setElement(elt,value) {
	document.getElementById(elt).innerHTML = value;
}

<!-- To show loading -->
var waitCount = 0;
function showLoading() {
	waitCount ++;
	document.getElementById("loadingGif").style.display="block";
}

function loadComplete() {
	waitCount--;
	if (waitCount<0) waitCount = 0;
	if (waitCount==0) {
		document.getElementById("loadingGif").style.display="none";
	}
}

function loadArticleSummaries() {
	showLoading();
	PortalWS.getArticleSummaries(categoryId,page);
}

function updateArticleSummaries(data) {
	var articleHtml = "";

	if (data.status==0) {
		if (data.articleSummaries!=null) {
			for(var i=0;i<data.articleSummaries.length;i++) {
				var m = data.articleSummaries[i];
				articleHtml = articleHtml + "<p>["+m.voteCount+"]&nbsp;&nbsp;&nbsp;<a target='window"+m.newsArticleId+"' href='OpenArticle?newsArticleId="+m.newsArticleId+"'>"+m.title+"</a>";
				articleHtml = articleHtml + "<br/><span style='font-size: 10px'>&nbsp;Submitted to category <b>"+m.categoryName+"</b> from feed <b>"+m.newsFeedName+"</b> at "+m.pubDate+".</span>";
				articleHtml = articleHtml + "</p>";
			}
			setElement('articleDisplay',articleHtml);
		} else {
			setElement('articleDisplay',"<h2><b>There's nothing to see here.</b></h2>");
		}
	}
	loadComplete();
	if (page > 0) {
		var prev = page - 1;
		setElement('prevPage',"<a href='javascript:setPage("+(page-1)+")'><<</a>");
	} else {
		setElement('prevPage',"<<");
	}
	var next = page+1;
	setElement('nextPage',"<a href='javascript:setPage("+(page+1)+")'>>></a>");
	setElement('currentPage',"<b>Page "+(page+1)+"</b>");
}

function selectCategory(c) {
	if (categoryId!=c) {
		categoryId = c;
		page = 0;
		controller.dispatch("refreshArticles");
	}
}

function setPage(p) {
	p = parseInt(p);
	if (p<0) p = 0;
	page = p;
	controller.dispatch("refreshArticles");
}

</script>

<style type="text/css">
	div#loadingGif
	{
    	display: none;
    	width:50px;
    	height:50px;
    	position: fixed;
    	top: 45%;
    	left: 45%;
	}
</style>

</head>
<body>
<table width="800" height="600" border="1">

<tr>
<td width="10%">&nbsp;</td>
<td width="80%" valign="top">

<h1>YourNewsFix.com</h1>

<table border="1" width="100%">
<tr height="10" style="background-color: red">
<td align="center"><a href="#" onclick="selectCategory(0);">All</a></td>

<td align="center"><a href="#" onclick="selectCategory(1);">US</a></td>

<td align="center"><a href="#" onclick="selectCategory(2);">World</a></td>

<td align="center"><a href="#" onclick="selectCategory(3);">Politics</a></td>

<td align="center"><a href="#" onclick="selectCategory(4);">Business</a></td>

<td align="center"><a href="#" onclick="selectCategory(5);">Technology</a></td>

<td align="center"><a href="#" onclick="selectCategory(6);">Sports</a></td>

<td align="center"><a href="#" onclick="selectCategory(7);">Arts And Entertainment</a></td>

<td align="center"><a href="#" onclick="selectCategory(8);">Funny</a></td>

</tr>
</table>

<div id="articleDisplay">
</div>
<table width="100%">
<tr>
<td align="right" width="25%"><div id="prevPage"></div></td>
<td align="center" width="50%"><div id="currentPage"></div></td>
<td align="left" width="25%"><div id="nextPage"></div></td>
</tr>
</table>
</td>
<td width="10%">&nbsp;</td>
</tr>

</table>
</body>
<div id="loadingGif" style="display:none">
<image width="50" height="50" src="images/loading.gif"/>
</div>

</html>

<script>
controller.addEventListener('refreshArticles',loadArticleSummaries);
selectCategory(0);
</script>

