garrettmills/commafeed
1
0
Fork 0
forked from Archives/Athou_commafeed
Code Pull Requests Activity

styling

Browse Source
This commit is contained in:
Jeremie Panzer
2013-03-25 14:58:15 +01:00
parent 0443fbf267
commit 5b9e12a101
12 changed files with 177 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/java/com/commafeed/frontend/CommaFeedApplication.java
View File

@@ -30,6 +30,7 @@ import org.slf4j.LoggerFactory;
import com.commafeed.frontend.pages.HomePage;
import com.commafeed.frontend.pages.LoginPage;
import com.commafeed.frontend.pages.LogoutPage;
import com.commafeed.frontend.pages.SettingsPage;
import com.commafeed.frontend.utils.exception.DisplayExceptionPage;
public class CommaFeedApplication extends AuthenticatedWebApplication {
@@ -43,6 +44,7 @@ public class CommaFeedApplication extends AuthenticatedWebApplication {
mountPage("login", LoginPage.class);
mountPage("logout", LogoutPage.class);
mountPage("error", DisplayExceptionPage.class);
mountPage("settings", SettingsPage.class);
setupInjection();

35
src/main/java/com/commafeed/frontend/model/MarkRequest.java Normal file
View File

@@ -0,0 +1,35 @@
package com.commafeed.frontend.model;
import java.io.Serializable;
@SuppressWarnings("serial")
public class MarkRequest implements Serializable {
private String type;
private String id;
private boolean read;
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public boolean isRead() {
return read;
}
public void setRead(boolean read) {
this.read = read;
}
}

20
src/main/java/com/commafeed/frontend/pages/HomePage.html
View File

@@ -13,15 +13,17 @@
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">
<subscribe></subscribe>
<div class="css-treeview" ng-controller="CategoryTreeCtrl">
<ul>
<category node="SubscriptionService.subscriptions" feed-click="feedClicked(id)"
category-click="categoryClicked(id)" selected-type="selectedType"
selected-id="selectedId"
format-category-name="formatCategoryName(category)"
format-feed-name="formatFeedName(feed)"> </category>
</ul>
<div class="sidebar-nav-fixed">
<subscribe></subscribe>
<div class="css-treeview" ng-controller="CategoryTreeCtrl">
<ul>
<category node="SubscriptionService.subscriptions" feed-click="feedClicked(id)"
category-click="categoryClicked(id)" selected-type="selectedType"
selected-id="selectedId"
format-category-name="formatCategoryName(category)"
format-feed-name="formatFeedName(feed)"> </category>
</ul>
</div>
</div>
</div>
<div class="span10">

50
src/main/java/com/commafeed/frontend/pages/SettingsPage.html Normal file
View File

@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html xmlns:wicket="http://wicket.apache.org">
<head>
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="vendor/bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="vendor/angular-ui/angular-ui.min.css" rel="stylesheet">
<link href="vendor/csstreeview/css3-treeview.css" rel="stylesheet">
<link href="vendor/select2/select2.css" rel="stylesheet">
<link href="css/app.css" rel="stylesheet">
</head>
<body>
<div ng-app="commafeed">
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">
<subscribe></subscribe>
<div class="css-treeview" ng-controller="CategoryTreeCtrl">
<ul>
<category node="SubscriptionService.subscriptions" feed-click="feedClicked(id)"
category-click="categoryClicked(id)" selected-type="selectedType"
selected-id="selectedId"
format-category-name="formatCategoryName(category)"
format-feed-name="formatFeedName(feed)"> </category>
</ul>
</div>
</div>
<div class="span10">
<toolbar></toolbar>
<ng:view></ng:view>
</div>
</div>
</div>
</div>
<script src="vendor/jquery/jquery-1.9.1.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="vendor/select2/select2.min.js"></script>
<script src="vendor/angular/angular.min.js"></script>
<script src="vendor/angular/angular-resource.min.js"></script>
<script src="vendor/angular/angular-sanitize.min.js"></script>
<script src="vendor/angular-upload/ng-upload.min.js"></script>
<script src="vendor/angular-infinite-scroll/ng-infinite-scroll.min.js"></script>
<script src="vendor/angular-ui/angular-ui.min.js"></script>
<script src="vendor/angular-ui-bootstrap/ui-bootstrap-tpls-0.2.0.min.js"></script>
<script src="js/main.js"></script>
<script src="js/controllers.js"></script>
<script src="js/directives.js"></script>
<script src="js/services.js"></script>
</body>
</html>

8
src/main/java/com/commafeed/frontend/pages/SettingsPage.java Normal file
View File

@@ -0,0 +1,8 @@
package com.commafeed.frontend.pages;
import org.apache.wicket.markup.html.WebPage;
@SuppressWarnings("serial")
public class SettingsPage extends WebPage {
}

15
src/main/java/com/commafeed/frontend/rest/resources/EntriesREST.java
View File

@@ -65,13 +65,14 @@ public class EntriesREST extends AbstractREST {
}
});
int lastIndex = entries.getEntries().size()
- (entries.getEntries().isEmpty() ? 0 : 1);
int from = Math.min(lastIndex, offset);
int to = limit == -1 ? lastIndex : Math.min(lastIndex, offset + limit);
List<Entry> subList = entries.getEntries().subList(from, to);
entries.setEntries(Lists.newArrayList(subList));
if (limit > -1) {
int size = entries.getEntries().size();
System.out.println(size);
int to = Math.min(size, limit);
List<Entry> subList = entries.getEntries().subList(0, to);
entries.setEntries(Lists.newArrayList(subList));
System.out.println(entries.getEntries().size());
}
return entries;
}

29
src/main/webapp/css/app.css
View File

@@ -1,11 +1,38 @@
.sidebar-nav-fixed {
padding: 9px 0;
position:fixed;
left:20px;
top:60px;
width:250px;
}
.row-fluid > .span-fixed-sidebar {
margin-left: 290px;
}
.css-treeview {
font-size: inherit;
white-space: nowrap;
}
.css-treeview .selected {
color: #d14836;
}
.css-treeview .unread {
font-weight: bold;
}
.css-treeview a {
cursor: pointer;
color: black;
}
.accordion-heading .unread {
.css-treeview a:hover {
cursor: pointer;
color: black;
}
.entry-heading .unread {
font-weight: bold;
}

2
src/main/webapp/directives/category.html
View File

@@ -5,7 +5,7 @@
<ul>
<li ng-repeat="feed in node.feeds">
<a ng-click="feedClick({id: feed.id})"
ng-class="{selected: (feed.id == selectedId && selectedType == 'feed')}">{{formatFeedName({feed:feed})}}
ng-class="{selected: (feed.id == selectedId && selectedType == 'feed'), unread: feed.unread }">{{formatFeedName({feed:feed})}}
</a>
<div class="dropdown pull-right">
<a dropdown-toggle class="pull-right feed-menu-icon"><i class="icon icon-chevron-down"></i> </a>

2
src/main/webapp/directives/subscribe.html
View File

@@ -61,7 +61,7 @@
</div>
</div>
<div class="modal-footer">
<button class="btn btn-warning cancel" ng-click="closeImport()">Cancel</button>
<button type="button" class="btn btn-warning cancel" ng-click="closeImport()">Cancel</button>
<button class="btn btn-primary ok" type="submit" upload-submit="uploadComplete(contents, completed)">Import</button>
</div>
</form>

13
src/main/webapp/directives/toolbar.html
View File

@@ -6,6 +6,15 @@
<button type="button" class="btn" ng-model="settings.readingMode" btn-radio="'all'">All</button>
</div>
<button type="button" class="btn" ng-click="refresh()"><i class="icon icon-refresh"></i> Refresh</button>
<button type="button" class="btn"><i class="icon icon-ok"></i> Mark all as read</button>
<button type="button" class="btn" ng-click="refresh()"><i class="icon-refresh"></i> Refresh</button>
<button type="button" class="btn"><i class="icon-ok"></i> Mark all as read</button>
<div class="btn-group pull-right">
<a class="btn dropdown-toggle" data-toggle="dropdown" href="settings"><i class="icon-cog"></i><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="settings"><i class="icon-wrench"></i> Settings</a></li>
<li class="divider"></li>
<li><a href="logout"><i class="icon-user"></i> Logout</a></li>
</ul>
</div>
</div>

21
src/main/webapp/js/controllers.js
View File

@@ -102,11 +102,8 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
$scope.refreshList();
});
$scope.offset = 0;
$scope.limit = 10;
$scope.busy = false;
$scope.hasMore = true;
$scope.refreshList = function() {
if ($scope.settings.readingMode) {
@@ -114,14 +111,14 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
_type : $scope.selectedType,
_id : $scope.selectedId,
_readtype : $scope.settings.readingMode,
offset : $scope.offset,
limit : 30
offset : 0,
limit : $scope.limit
});
}
};
$scope.loadMoreEntries = function() {
if ($scope.busy || !$scope.hasMore)
if ($scope.busy)
return;
if (!$scope.settings.readingMode)
return;
@@ -130,15 +127,17 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http,
_type : $scope.selectedType,
_id : $scope.selectedId,
_readtype : $scope.settings.readingMode,
offset : $scope.offset,
offset : $scope.entryList.entries.length,
limit : $scope.limit
}, function(data) {
for ( var i = 0; i < data.entries.length; i++) {
$scope.entryList.entries.push(data.entries[i]);
console.log(data)
var entries = data.entries
for ( var i = 0; i < entries.length; i++) {
$scope.entryList.entries.push(entries[i]);
}
$scope.offset = $scope.offset + data.entries.length;
console.log(entries.length)
console.log($scope.limit)
$scope.busy = false;
$scope.hasMore = data.entries.length == $scope.limit;
});
}

17
src/main/webapp/templates/feeds.html
View File

@@ -2,9 +2,9 @@
{{readType}}
<span>{{entryList.name}}</span><span
ng-show="selectedType == 'category'"> &#187;</span>
<div class="accordion" id="feed-accordion" infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy" infinite-scroll-distance="1">
<div class="accordion-group" ng-repeat="entry in entryList.entries">
<div class="accordion-heading">
<div id="feed-accordion" infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy" infinite-scroll-distance="1">
<div ng-repeat="entry in entryList.entries">
<div class="entry-heading">
<a class="accordion-toggle" data-toggle="collapse"
ng-click="mark(entry, true)"
ng-class="{unread: entry.read == false}"
@@ -13,8 +13,15 @@
- </span>{{entry.title}} <span class="pull-right">{{entry.date}}</span>
</a>
</div>
<div id="{{'feed-body' + $index}}" class="accordion-body collapse">
<div class="accordion-inner" ng-bind-html="entry.content"></div>
<div id="{{'feed-body' + $index}}" class="collapse">
<div>
<div>
<h4>
<a href="{{entry.url}}" target="_blank">{{entry.title}}</a>
</h4>
</div>
<div ng-bind-html="entry.content"></div>
</div>
</div>
</div>
<div ng-show="busy">Loading data...</div>