├── .gitignore
├── README.md
├── scripts
    ├── filter
    │   ├── hash.js
    │   └── rssDate.js
    ├── controller
    │   ├── FeedList.js
    │   ├── ItemsCrtl.js
    │   ├── ItemCrtl.js
    │   └── FeedManageCrtl.js
    ├── service
    │   ├── googleapis.feed.js
    │   ├── HashString.js
    │   ├── LocalObjectStorage.js
    │   └── FeedList.js
    └── app.js
├── views
    ├── item.html
    ├── manage
    │   ├── list.html
    │   └── add.html
    └── list.html
├── css
    └── app.css
└── index.html


/.gitignore:
--------------------------------------------------------------------------------
1 | .idea


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | AngularJSFeedReader
2 | ===================
3 | 
4 | A simple AngularJS based rss feed reader using the google jsonsp feed api.
5 | 


--------------------------------------------------------------------------------
/scripts/filter/hash.js:
--------------------------------------------------------------------------------
1 | angular.module('caco.MiniRSS')
2 |     .filter('hash', function (HashString) {
3 |         return function (value) {
4 |             return HashString.perform(value);
5 |         };
6 |     });


--------------------------------------------------------------------------------
/scripts/filter/rssDate.js:
--------------------------------------------------------------------------------
1 | angular.module('caco.MiniRSS')
2 |     .filter('rssDate', function () {
3 |         return function (value) {
4 |             return new Date(value).toLocaleString();
5 |         };
6 |     });


--------------------------------------------------------------------------------
/views/item.html:
--------------------------------------------------------------------------------
1 | <p>ok</p>
2 | <div class="well">
3 |     <h1><a href="#/feed/{{id}}">{{feed.title}}</a></h1>
4 |     <h2><a href="{{item.link}}">{{item.title}}</a></h2>
5 |     <p ng-bind-html="item.content"></p>
6 | </div>
7 | 


--------------------------------------------------------------------------------
/scripts/controller/FeedList.js:
--------------------------------------------------------------------------------
1 | angular.module('caco.MiniRSS')
2 |     .controller('FeedListCtrl', function ($scope, FeedList) {
3 |         $scope.feeds = FeedList.get();
4 | 
5 |         $scope.$on('FeedList', function (event, data) {
6 |             $scope.feeds = data;
7 |         });
8 |     });


--------------------------------------------------------------------------------
/scripts/controller/ItemsCrtl.js:
--------------------------------------------------------------------------------
1 | angular.module('caco.MiniRSS')
2 |     .controller('ItemsCtrl', function ($scope, $routeParams, FeedList, FeedLoad) {
3 |         var feed = FeedList.getById($routeParams.id || FeedList.getMinId())
4 | 
5 |         FeedLoad.fetch({q: feed.url, num: 50}, {}, function (data) {
6 |             $scope.feed = data.responseData.feed;
7 |             $scope.feed.id = feed.id;
8 |         });
9 |     });


--------------------------------------------------------------------------------
/css/app.css:
--------------------------------------------------------------------------------
 1 | .fade-enter-setup{
 2 |     -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 2.0s;
 3 |     -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 2.0s;
 4 |     -ms-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 2.0s;
 5 |     -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 2.0s;
 6 |     transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 2.0s;
 7 |     opacity: 0;
 8 | }
 9 | 
10 | .fade-enter-start{
11 |     opacity: 1;
12 | }
13 | 
14 | .navbar-fixed-top{
15 |     position: static;
16 |     padding-bottom: 10px;
17 | }


--------------------------------------------------------------------------------
/scripts/service/googleapis.feed.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.MiniRSS.googleapis.feed', ['ngResource'])
 2 |     .factory('FeedLoad', function ($resource) {
 3 |         return $resource('http://ajax.googleapis.com/ajax/services/feed/load', {}, {
 4 |             fetch: { method: 'JSONP', params: {v: '1.0', callback: 'JSON_CALLBACK'} }
 5 |         });
 6 |     })
 7 |     .factory('UrlLookup', function ($resource) {
 8 |         return $resource('http://ajax.googleapis.com/ajax/services/feed/lookup', {}, {
 9 |             fetch: { method: 'JSONP', params: {v: '1.0', callback: 'JSON_CALLBACK'} }
10 |         });
11 |     });


--------------------------------------------------------------------------------
/scripts/service/HashString.js:
--------------------------------------------------------------------------------
 1 | //based on http://werxltd.com/wp/2010/05/13/javascript-implementation-of-javas-string-hashcode-method/
 2 | angular.module('caco.MiniRSS')
 3 |     .service('HashString', function () {
 4 |         this.perform = function(str){
 5 |             var hash = 0;
 6 |             if (str.length == 0) {
 7 |                 return hash;
 8 |             }
 9 | 
10 |             for (var i = str.length - 1; i >= 0; i--) {
11 |                 char = str.charCodeAt(i);
12 |                 hash = ((hash<<5)-hash)+char;
13 |                 hash = hash & hash;
14 |             }
15 | 
16 |             return hash;
17 |         };
18 |     });


--------------------------------------------------------------------------------
/scripts/service/LocalObjectStorage.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.LocalObjectStorage', [])
 2 |     .service('LocalObjectStorage', function () {
 3 |         this.getObject = function (key) {
 4 |             return JSON.parse(localStorage.getItem(key))
 5 |         };
 6 | 
 7 |         this.setObject = function (key, value) {
 8 |             localStorage.setItem(key, JSON.stringify(value));
 9 |         };
10 | 
11 |         this.removeObject = function (key) {
12 |             localStorage.removeItem(key);
13 |         };
14 | 
15 |         this.contains = function (key) {
16 |             return localStorage.getItem(key) ? true : false;
17 |         };
18 |     });


--------------------------------------------------------------------------------
/scripts/controller/ItemCrtl.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.MiniRSS')
 2 |     .controller('ItemCrtl', function ($scope, $routeParams, FeedList, FeedLoad, HashString) {
 3 |         var feed = FeedList.getById($routeParams.id)
 4 | 
 5 |         FeedLoad.fetch({q: feed.url, num: 50}, {}, function (data) {
 6 |             $scope.feed = data.responseData.feed;
 7 |             $scope.id = $routeParams.id;
 8 |             var entries = data.responseData.feed.entries;
 9 | 
10 |             for (var i = entries.length - 1; i >= 0; i--) {
11 |                 if (HashString.perform(entries[i].title) == $routeParams.hashKey) {
12 |                     $scope.item = entries[i];
13 |                 }
14 |             }
15 |         });
16 |     });


--------------------------------------------------------------------------------
/scripts/app.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.MiniRSS', ['caco.MiniRSS.FeedList', 'caco.MiniRSS.googleapis.feed', 'ngRoute', 'ngSanitize'])
 2 |     .config(function ($routeProvider) {
 3 |         $routeProvider
 4 |             .when('/',                      {templateUrl: 'views/list.html',        controller: 'ItemsCtrl'})
 5 |             .when('/feed/:id',              {templateUrl: 'views/list.html',        controller: 'ItemsCtrl'})
 6 |             .when('/feed/:id/item/:hashKey',{templateUrl: 'views/item.html',        controller: 'ItemCrtl'})
 7 |             .when('/manage',                {templateUrl: 'views/manage/list.html', controller: 'FeedManage'})
 8 |             .when('/manage/add',            {templateUrl: 'views/manage/add.html',  controller: 'FeedManage'})
 9 |     });
10 | 


--------------------------------------------------------------------------------
/views/manage/list.html:
--------------------------------------------------------------------------------
 1 | <ul class="nav nav-tabs">
 2 |     <li><a href="#/manage/add">Add a Feed</a></li>
 3 |     <li class="active"><a href="#/manage">Feeds</a></li>
 4 | </ul>
 5 | 
 6 | <table class="table table-striped table-condensed">
 7 |     <tbody>
 8 |     <tr ng-repeat="feed in feeds">
 9 |         <td>
10 |             <img ng-src="http://g.etfv.co/{{feed.url}}" width="16" height="16"/>
11 |             <a href="{{feed.url}}" target="_blank" ng-bind-html="feed.title"/>
12 |         </td>
13 |         <td>
14 |             <div class="btn-group pull-right">
15 |                 <a href="#/manage" class="btn btn-danger" ng-click="delete(feed.id)" title="delete">
16 |                 	<i class="icon-trash icon-white"></i>
17 |                 </a>
18 |             </div>
19 |         </td>
20 |     </tr>
21 |     </tbody>
22 | </table>
23 | 


--------------------------------------------------------------------------------
/views/list.html:
--------------------------------------------------------------------------------
 1 | <div class="well">
 2 | <h1>{{feed.title}}</h1>
 3 | 
 4 | <table class="table table-striped table-condensed">
 5 |     <thead>
 6 |     <tr>
 7 |         <th colspan="2">
 8 |             <form class="form-horizontal">
 9 |                 <input name="textinput" placeholder="Search" class="input-xlarge" type="text"
10 |                        ng-model="searchText"/>
11 |             </form>
12 |         </th>
13 |     </tr>
14 |     </thead>
15 |     <tbody>
16 |     <tr ng-repeat="item in feed.entries | filter:searchText">
17 |         <td>
18 |             <a href="#/feed/{{feed.id}}/item/{{item.title|hash}}">
19 |                 <strong ng-bind-html="item.title"></strong>
20 |             </a>
21 |             <br />
22 |             <span ng-bind-html="item.contentSnippet"></span>
23 |         </td>
24 |         <td>
25 |             {{item.publishedDate | rssDate}}
26 |         </td>
27 |     </tr>
28 |     </tbody>
29 | </table>
30 | </div>
31 | 


--------------------------------------------------------------------------------
/scripts/controller/FeedManageCrtl.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.MiniRSS')
 2 |     .controller('FeedManage', function ($scope, $location, UrlLookup, FeedLoad, FeedList) {
 3 |         $scope.feeds = FeedList.get();
 4 | 
 5 |         $scope.add = function () {
 6 |             FeedList.add($scope.feed.url, $scope.feed.title);
 7 |             $location.path('/manage');
 8 |         };
 9 | 
10 |         $scope.lookup = function () {
11 |             UrlLookup.fetch({q: $scope.lookup.url}, {}, function (data) {
12 |                 if (data.responseStatus != 200 || (data.responseData && data.responseData.url == '')) {
13 |                     alert(data.responseDetails || 'Feed not found!');
14 |                     return;
15 |                 }
16 | 
17 |                 $scope.feed = data.responseData;
18 |                 FeedLoad.fetch({q: data.responseData.url}, {}, function (data) { //lookup title
19 |                     if (data.responseStatus != 200) {
20 |                         return;
21 |                     }
22 | 
23 |                     $scope.feed.title = data.responseData.feed.title;
24 |                 });
25 |             });
26 |         };
27 | 
28 |         $scope.delete = function (id) {
29 |             FeedList.delete(id);
30 |         };
31 | 
32 |         $scope.$on('FeedList', function (event, data) {
33 |             $scope.feeds = data;
34 |         });
35 |     });


--------------------------------------------------------------------------------
/scripts/service/FeedList.js:
--------------------------------------------------------------------------------
 1 | angular.module('caco.MiniRSS.FeedList', ['caco.LocalObjectStorage'])
 2 |     .service('FeedList', function ($rootScope, LocalObjectStorage) {
 3 |         this.add = function (url, title) {
 4 |             var list = this.get();
 5 |             var id = localStorage.getItem('FeedListId') ? localStorage.getItem('FeedListId') : 1;
 6 | 
 7 |             list.push({
 8 |                 url:    url,
 9 |                 title:  title,
10 |                 id: id
11 |             });
12 | 
13 |             LocalObjectStorage.setObject('FeedList',  list);
14 |             localStorage.setItem('FeedListId', ++id);
15 |             $rootScope.$broadcast('FeedList', list);
16 |         };
17 | 
18 |         this.delete = function (id) {
19 |             var list = this.get();
20 | 
21 |             for (var i = list.length - 1; i >= 0; i--) {
22 |                 if (list[i].id == id) {
23 |                     list.splice(i, 1);
24 |                 }
25 |             }
26 | 
27 |             LocalObjectStorage.setObject('FeedList', list);
28 |             $rootScope.$broadcast('FeedList', list);
29 |         };
30 | 
31 |         this.get = function () {
32 |             if (LocalObjectStorage.contains('FeedList')) {
33 |                 return LocalObjectStorage.getObject('FeedList');
34 |             }
35 | 
36 |             return new Array({
37 |                 url: 'http://cacodaemon.de/index.php?rss=1',
38 |                 title: 'Cacomania',
39 |                 id: 0
40 |             });
41 |         };
42 | 
43 |         this.getById = function(id) {
44 |             var list = this.get();
45 | 
46 |             for (var i = list.length - 1; i >= 0; i--) {
47 |                 if (list[i].id == id) {
48 |                     return list[i];
49 |                 }
50 |             }
51 | 
52 |             return null;
53 |         };
54 | 
55 |         this.getMinId = function () {
56 |             var list = this.get();
57 |             var minId = Number.MAX_VALUE;
58 | 
59 |             for (var i = list.length - 1; i >= 0; i--) {
60 |                 minId = Math.min(minId, list[i].id);
61 |             }
62 | 
63 |             return minId;
64 |         };
65 |     });


--------------------------------------------------------------------------------
/views/manage/add.html:
--------------------------------------------------------------------------------
 1 | <ul class="nav nav-tabs">
 2 |     <li class="active"><a href="#/manage/add">Add a Feed</a></li>
 3 |     <li><a href="#/manage">Feeds</a></li>
 4 | </ul>
 5 | 
 6 | <div class="row">
 7 |     <div class="span6">
 8 |         <form class="form-horizontal" ng-submit="lookup()">
 9 |             <fieldset>
10 |                 <legend>Lookup a feed URL</legend>
11 |                 <div class="control-group ">
12 |                     <label class="control-label" for="lookup-url">URL</label>
13 | 
14 |                     <div class="controls">
15 |                         <input id="lookup-url" name="url" type="url" placeholder="http://www.cacodaemon.de" required
16 |                                ng-model="lookup.url" class="input-xlarge"/>
17 |                     </div>
18 |                 </div>
19 |                 <div class="form-actions">
20 |                     <button type="submit" class="btn btn-primary"><i class="icon-search icon-white"></i> Lookup</button>
21 |                 </div>
22 |             </fieldset>
23 |         </form>
24 |     </div>
25 |     <div class="span6">
26 |         <form class="form-horizontal" ng-submit="add()">
27 |             <fieldset>
28 |                 <legend>Add a feed</legend>
29 | 
30 |                 <div class="control-group ">
31 |                     <label class="control-label" for="add-title">Title</label>
32 | 
33 |                     <div class="controls">
34 |                         <input id="add-title" name="title" type="text" required
35 |                                ng-model="feed.title"  class="input-xlarge"/>
36 |                     </div>
37 |                 </div>
38 | 
39 |                 <div class="control-group ">
40 |                     <label class="control-label" for="add-url">Feed URL</label>
41 | 
42 |                     <div class="controls">
43 |                         <input id="add-url" name="url" type="url" placeholder="www.cacodaemon.de" required
44 |                                ng-model="feed.url"  class="input-xlarge"/>
45 |                     </div>
46 |                 </div>
47 |                 <div class="form-actions">
48 |                     <button type="submit" class="btn btn-success"><i class="icon-plus icon-white"></i> Add</button>
49 |                 </div>
50 |             </fieldset>
51 |         </form>
52 |     </div>
53 | </div>


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en" ng-app="caco.MiniRSS">
 3 | <head>
 4 |     <meta charset="utf-8">
 5 |     <title>caco[miniRSS]</title>
 6 |     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 7 |     <meta name="description" content="A simple google api based demo rss app.">
 8 |     <meta name="author" content="Guido Krömer">
 9 |     <link href="http://netdna.bootstrapcdn.com/bootswatch/2.3.2/cosmo/bootstrap.min.css" rel="stylesheet">
10 |     <link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet">
11 |     <link href="css/app.css" rel="stylesheet">
12 | </head>
13 | 
14 | <body id="body">
15 |   
16 | <div class="navbar navbar-fixed-top navbar-inverse">
17 |     <div class="navbar-inner">
18 |         <div class="container">
19 |             <a class="brand" href="#/">caco[miniRSS]</a>
20 |             </ul>
21 |             <a href="#/manage/" class="btn btn-warning pull-right"><i class="icon-wrench icon-white"></i> Manage</a>
22 |         </div>
23 |     </div>
24 | </div>
25 | 
26 | <div class="container-fluid">
27 |     <div class="row-fluid">
28 |         <div class="span3" ng-controller="FeedListCtrl">
29 |             <ul class="nav nav-list">
30 |                 <li ng-repeat="feed in feeds">
31 |                     <a href="#/feed/{{feed.id}}">
32 |                         <img ng-src="http://g.etfv.co/{{feed.url}}" width="16" height="16"/>
33 |                         <span ng-bind-html="feed.title"></span>
34 |                     </a>
35 |                 </li>
36 |             </ul>
37 |         </div>
38 |         <div class="span9 ng-view" ng-animate="{enter: 'fade-enter'}">
39 |         </div>
40 |     </div>
41 | </div>
42 | 
43 | <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.js"></script>
44 | <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-resource.js"></script>
45 | <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js"></script>
46 | <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-sanitize.js"></script>
47 | <script src="scripts/app.js"></script>
48 | <script src="scripts/service/googleapis.feed.js"></script>
49 | <script src="scripts/service/LocalObjectStorage.js"></script>
50 | <script src="scripts/service/FeedList.js"></script>
51 | <script src="scripts/service/HashString.js"></script>
52 | <script src="scripts/filter/rssDate.js"></script>
53 | <script src="scripts/filter/hash.js"></script>
54 | <script src="scripts/controller/ItemsCrtl.js"></script>
55 | <script src="scripts/controller/ItemCrtl.js"></script>
56 | <script src="scripts/controller/FeedManageCrtl.js"></script>
57 | <script src="scripts/controller/FeedList.js"></script>
58 | </body>
59 | </html>
60 | 


--------------------------------------------------------------------------------