keywords+autofilter

front/js/app.js

@@ -66,6 +66,14 @@ app.controller('main', function($scope,$http,$sce) {
 		q=q.toLowerCase();
 		return $scope.keywords.filter(function(e) { return e.toLowerCase().indexOf(q) > -1});
 	};
+	$scope.addKeyword = function(k) {
+
+		c=$scope.selected_kw.filter(function(el) { return el.text==k; }).length;
+		if (c>0)
+			return;
+		$scope.selected_kw.push({text:k});
+		$scope.filter();
+	};
 	$scope.getKeywords = function() {
 		$http.get("/pymnts/keywords").then(
 			function(data) {
@@ -87,6 +95,17 @@ app.controller('main', function($scope,$http,$sce) {
 			}
 		);
 	};
+	$scope.reset = function() {
+		$scope.mindate=undefined;
+		$scope.maxdate=undefined;
+		$scope.site=undefined;
+		$scope.kw=[];
+		$scope.minweight="1";
+		$scope.title=undefined;
+		$scope.category="-1";
+		$scope.filter();
+
+	};
 	$scope.filter = function(page) {
 		var kw = $scope.selected_kw.map(function(e){return e.text});
 		$http.post("/pymnts/articles/",{"mindate":$scope.mindate,

front/main.html

@@ -37,7 +37,7 @@
 					</li>
 					<li>
 						<label for="mindate">Keyword</label>
-						<tags-input ng-model="selected_kw" add-on-paste="true" add-from-autocomplete-only="true" replace-spaces-with-dashes="false">
+						<tags-input ng-model="selected_kw" add-on-paste="true" add-from-autocomplete-only="true" replace-spaces-with-dashes="false" on-tag-added="filter()" on-tag-removed="filter()">
 							<auto-complete source="filtered($query)"></auto-complete>
 						</tags-input>
 					</li>
@@ -48,6 +48,9 @@
 					<li class="">
 						<button ng-click="filter()">Filter</button>
 					</li>
+					<li class="">
+						<button ng-click="reset()">Reset Filter</button>
+					</li>
 				</ul>
 			</form>
 
@@ -72,7 +75,7 @@
 						<div class="read-more"><a ng-click="getArticle(n)"><i class="fa fa-share"></i> Read complete article</a></div>
 					</div>
 					<div class="labels">
-						<i class="fa fa-tags"></i> <div ng-repeat="k in n.kw">{{k}}</div>
+						<i class="fa fa-tags"></i> <div ng-repeat="k in n.kw" ng-click="addKeyword(k)">{{k}}</div>
 					</div>
 				</section>
 				<div class="pagination">

front/style.css

@@ -127,6 +127,7 @@ body {
 	border: none;
 	color: #c0c0c0;
 	transition-duration: 0.2s;
+	display:block;
 }
 
 .filter button:hover{
@@ -257,7 +258,7 @@ ul.news-meta li {
 }
 
 .title h4 {
-	width: 93%;
+	width: 92%;
 	float: left;
 	color: rgb(27, 77, 14);
 }