handle middle clicks and ctrl clicks on entries (#4)

src/main/webapp/css/app.css

@@ -61,20 +61,6 @@
 	margin: 5px 0px 5px 0px;
 }
 
-#feed-accordion .collapse {
-	-webkit-transition: none;
-	-moz-transition: none;
-	transition: none;
-}
-
-#feed-accordion .accordion-group {
-	margin-bottom: 0px;
-	border: none;
-	-webkit-border-radius: none;
-	-moz-border-radius: none;
-	border-radius: 0px;
-}
-
 #feed-accordion .entry {
 	border-bottom: 1px solid #CCCCCC;
 }
@@ -85,12 +71,15 @@
 	margin-top: 80px;
 }
 
-#feed-accordion .accordion-inner {
-	padding: 0px;
-}
-
 #feed-accordion .entry-heading {
 	padding: 6px 0px;
+	display: block;
+	color: black;
+	cursor: pointer;
+}
+
+#feed-accordion a.entry-heading:hover {
+	text-decoration: none;
 }
 
 #feed-accordion .entry-heading.open {
@@ -101,17 +90,7 @@
 	background-color: #EBEBEB;
 }
 
-#feed-accordion a.accordion-toggle {
+#feed-accordion .entry-heading.unread {
-	color: black;
-	display: block;
-	padding: 0px;
-}
-
-#feed-accordion a.accordion-toggle:hover {
-	text-decoration: none;
-}
-
-#feed-accordion a.accordion-toggle .unread {
 	font-weight: bold;
 }
 

src/main/webapp/js/controllers.js

@@ -7,8 +7,8 @@ module.run(function($rootScope) {
 	});
 });
 
-module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location, $route,
+module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
-		SubscriptionService) {
+		$route, SubscriptionService) {
 
 	$scope.$on('$routeChangeSuccess', function() {
 		$scope.selectedType = $routeParams._type;
@@ -51,7 +51,7 @@ module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
 	}
 
 	$scope.feedClicked = function(id) {
-		if($scope.selectedType == 'feed' && id == $scope.selectedId) {
+		if ($scope.selectedType == 'feed' && id == $scope.selectedId) {
 			$route.reload();
 		} else {
 			$location.path('/feeds/view/feed/' + id);
@@ -59,7 +59,7 @@ module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
 	};
 
 	$scope.categoryClicked = function(id) {
-		if($scope.selectedType == 'category' && id == $scope.selectedId) {
+		if ($scope.selectedType == 'category' && id == $scope.selectedId) {
 			$route.reload();
 		} else {
 			$location.path('/feeds/view/category/' + id);
@@ -116,7 +116,7 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
 	};
 
 	$scope.loadMoreEntries = function() {
-		if(!$scope.hasMore)
+		if (!$scope.hasMore)
 			return;
 		if (!$scope.entryList || !$scope.entryList.entries)
 			return;
@@ -155,14 +155,19 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
 		}
 	};
 
-	$scope.isOpen = false
+	$scope.isOpen = false;
-	$scope.toggle = function(entry) {
+	$scope.entryClicked = function(entry, event) {
-		if ($scope.current != entry) {
+		console.log('click !')
-			$scope.isOpen = true;
-		} else {
-			$scope.isOpen = !$scope.isOpen;
-		}
-		$scope.current = entry;
 		$scope.mark(entry, true);
+		if (!event.ctrlKey && event.which != 2) {
+			event.preventDefault();
+			event.stopPropagation();
+			if ($scope.current != entry) {
+				$scope.isOpen = true;
+			} else {
+				$scope.isOpen = !$scope.isOpen;
+			}
+			$scope.current = entry;
+		}
 	}
 });

src/main/webapp/templates/feeds.html

@@ -4,25 +4,21 @@
 		<h3><span>{{entryList.name}}&nbsp;</span><span ng-show="entryList.name && selectedType == 'category'"> &#187;</span></h3>
 	</div>
 	
-	<div id="feed-accordion" infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy" infinite-scroll-distance="1">
+	<div infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy" infinite-scroll-distance="1" id="feed-accordion">
-		<accordion close-others="true">
+		<div ng-repeat="entry in entryList.entries" class="entry">
-			<accordion-group ng-repeat="entry in entryList.entries" class="entry">
+			<a href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="entryClicked(entry, $event)" ng-class="{unread: entry.read == false, open: current == entry, closed: current != entry}">
-				<accordion-heading>
+				<span ng-show="selectedType == 'category'">{{entry.feedName}}
-					<div class="entry-heading" ng-click="toggle(entry)" ng-class="{unread: entry.read == false, open: current == entry, closed: current != entry}">
+					- </span>{{entry.title}} <span class="pull-right">{{entry.date}}</span>
-						<span ng-show="selectedType == 'category'">{{entry.feedName}}
+			</a>
-							- </span>{{entry.title}} <span class="pull-right">{{entry.date}}</span>
+			<div class="entry-body" ui-if="isOpen && current == entry">
-					</div>
+				<div>
-				</accordion-heading>
+					<h4>
-				<div class="entry-body">
+						<a href="{{entry.url}}" target="_blank">{{entry.title}}</a>
-					<div>
+					</h4>
-						<h4>
-							<a href="{{entry.url}}" target="_blank">{{entry.title}}</a>
-						</h4>
-					</div>	
-					<div ng-bind-html-unsafe="entry.content" ui-if="isOpen && current == entry"></div>
 				</div>	
-			</accordion-group>
+				<div ng-bind-html-unsafe="entry.content"></div>
-		</accordion>
+			</div>
+		</div>
 		<div class="no-entries" ng-show="entryList.entries.length == 0">"{{entryList.name}}" has no unread items.</div>
 		<div ng-show="busy">Loading data...</div>
 	</div>