twitterSearchAngularJS/index.html at master · StackAndHeap/twitterSearchAngularJS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<!DOCTYPE html>
<html ng-app="TwitterSearch" style="height: 100%">

<head>
	<title>Twitter Search</title>

	<script type="text/javascript" src="lib/angular-1.0.0rc7.js"></script>
	<script type="text/javascript" src="lib/angular-cookies-1.0.0rc7.js"></script>
	<script type="text/javascript" src="lib/angular-resource-1.0.0rc7.js"></script>
	<script type="text/javascript" src="app.js"></script>

	<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css"/>
	<link rel="stylesheet" href="app.css">
</head>

<body style="height: 100%">
<div ng-controller="TwitterSearchController" class="mainView">

	<div class="sidePanel">
		<h3>Twitter Search</h3>

		<form class="form-horizontal">
			<input type="text" ng-model="searchText"/>
			<button class="btn" ng-click="search()">
				<i class="icon-search"></i>
			</button>
		</form>
		<hr>
		<ul class="nav nav-pills nav-stacked">
			<li ng-repeat="searchTerm in searchTerms"
			    class="{{getSearchTermClass(searchTerm)}}"
			    ng-mouseover="onSearchTermMouseOver($index)"
			    ng-mouseout="onSearchTermMouseOut()">
				<a href="#"
				   ng-click="search(searchTerm)">
					<div>{{searchTerm}}
						<div style="float: right">
							<i class="icon-remove"
							   ng-show="$index == rolloverSearchTermIndex"
							   ng-click="removeSearchTerm(searchTerm)"></i>
						</div>
					</div>
				</a>
			</li>
		</ul>
	</div>

	<div class="resultsPanel"
	     ng-show="hasActiveSearch(activeSearchTerm)">
		<h3 style="text-align: center">'{{searchResult.statuses.length}}' tweets about '{{activeSearchTerm}}'</h3>
		<br/>
		<table class="table table-bordered table-striped">
			<tr>
				<th>Author</th>
				<th>Message</th>
				<th>Date</th>
			</tr>
			<tr ng-repeat="tweet in searchResult.statuses">
				<td>{{tweet.user.name}}</td>
				<td>{{tweet.text}}</td>
				<td>{{tweet.created_at}}</td>
			</tr>
		</table>
	</div>

</div>
</body>
</html>