Merge pull request siddii#1 from siddii/my-feeds

My feeds
trgr · Feb 19, 2014 · c5e911b · c5e911b
2 parents ee662a3 + 8cdb157
commit c5e911b
Show file tree

Hide file tree

Showing 24 changed files with 205 additions and 41 deletions.
diff --git a/app/angular-feeds/angular-feeds.js b/app/angular-feeds/angular-feeds.js
@@ -1,5 +1,5 @@
 /**
- * angular-feeds - v0.0.1 - 2014-02-12 9:50 PM
+ * angular-feeds - v0.0.1 - 2014-02-19 9:15 AM
  * https://github.com/siddii/angular-feeds
  *
  * Copyright (c) 2014 
@@ -15,10 +15,11 @@ angular.module('feeds-directives', []).directive('feed', ['feedService', '$compi
     },
     controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {
       $scope.$watch('finishedLoading', function (value) {
+        console.log('##### $attrs.postRender = ', $attrs.postRender);
         if ($attrs.postRender && value) {
-          $timeout(function () {
-            new Function($attrs.postRender)();
-          });
+          $timeout(function (){
+            new Function("element", $attrs.postRender + '(element);')($element);
+          }, 0);
         }
       });
 

diff --git a/app/angular-feeds/angular-feeds.min.js b/app/angular-feeds/angular-feeds.min.js
diff --git a/app/feed-tester.html b/app/feed-tester.html
@@ -13,14 +13,11 @@
     <title>Angular Feeds - AngularJS module for Atom, RSS & media feeds...</title>
     <meta name="description" content="">
     <meta name="viewport" content="width=device-width">
+    <link rel="icon" type="image/ico" href="favicon.ico"/>
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
     <link rel="stylesheet" href="bower_components/Font-Awesome/css/font-awesome.min.css"/>
     <link rel="stylesheet" href="angular-feeds/angular-feeds.min.css">
-    <style>
-        body {
-            padding-top: 0;
-        }
-    </style>
+    <link rel="stylesheet" href="styles/feed-tester.css">
     <!-- Google Feeds API script -->
     <script type="text/javascript"
             src="https://www.google.com/jsapi?autoload=%7B%22modules%22%3A%5B%7B%22name%22%3A%22feeds%22%2C%22version%22%3A%221.0%22%2C%22nocss%22%3Atrue%7D%5D%7D"></script>
@@ -83,23 +80,6 @@ <h3>Feed Tester</h3>
 <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
 <script src="bower_components/angular-sanitize/angular-sanitize.min.js"></script>
 <script src="angular-feeds/angular-feeds.min.js"></script>
-<script>
-    angular.module('angular-feeds-tester', [
-                'feeds'
-            ]).controller('FeedTesterController', ['$scope', '$compile', function ($scope, $compile) {
-                $scope.count = 10;
-                $scope.summary = false;
-                $scope.showFeed = function (){
-                    var $panelBody = $('.panel-body');
-                    $panelBody.html('');
-                    var feedHTML = "<feed url='" + $scope.url + "' count='" + $scope.count + "' summary='" + $scope.summary + "'/>";
-                    $panelBody.append($compile(feedHTML)($scope));
-                };
-
-                $scope.isOrigin = function (){
-                    return window.parent.location.href.indexOf('feed-tester.html') === -1;
-                };
-            }]);
-</script>
+<script src="scripts/feed-tester.js"></script>
 </body>
 </html>
diff --git a/app/index.html b/app/index.html
@@ -13,11 +13,12 @@
     <title>Angular Feeds - AngularJS module for Atom, RSS & media feeds...</title>
     <meta name="description" content="">
     <meta name="viewport" content="width=device-width">
+    <link rel="icon" type="image/ico" href="favicon.ico"/>
     <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
     <link rel="stylesheet" href="bower_components/Font-Awesome/css/font-awesome.min.css"/>
     <link rel="stylesheet" href="angular-feeds/angular-feeds.css">
-    <link rel="stylesheet" href="styles/main.css">
-    <link rel="stylesheet" href="styles/prettify.css">
+    <link rel="stylesheet" href="styles/feeds-demo.css">
+    <link rel="stylesheet" href="styles/docs/prettify.css">
 </head>
 <body ng-app="angular-feeds-demo">
 
@@ -27,6 +28,7 @@
 <div id="api" style="display: none;" ng-include="'templates/api.html'"></div>
 <div id="used-where" style="display: none;" ng-include="'templates/used-where.html'"></div>
 <div id="feed-tester" style="display: none;" ng-include="'templates/feed-tester-iframe.html'"></div>
+<div id="my-feeds" style="display: none;" ng-include="'templates/my-feeds-iframe.html'"></div>
 <div id="code" style="display: none;" ng-include="'templates/code.html'"></div>
 
 
@@ -46,10 +48,10 @@
 <script src="angular-feeds/angular-feeds.js"></script>
 
 <!-- build:js({.tmp,app}) scripts/scripts.js -->
-<script src="scripts/app.js"></script>
-<script src="scripts/prettify.js"></script>
-<script src="scripts/application.js"></script>
-<script src="scripts/docs.js"></script>
+<script src="scripts/feeds-demo.js"></script>
+<script src="scripts/docs/prettify.js"></script>
+<script src="scripts/docs/application.js"></script>
+<script src="scripts/docs/docs.js"></script>
 <!-- endbuild -->
 </body>
 </html>
diff --git a/app/my-feeds.html b/app/my-feeds.html
@@ -0,0 +1,62 @@
+<!doctype html>
+<!--[if lt IE 7]>
+<html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+<!--[if IE 7]>
+<html class="no-js lt-ie9 lt-ie8"> <![endif]-->
+<!--[if IE 8]>
+<html class="no-js lt-ie9"> <![endif]-->
+<!--[if gt IE 8]><!-->
+<html class="no-js"> <!--<![endif]-->
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>Angular Feeds - AngularJS module for Atom, RSS & media feeds...</title>
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width">
+    <link rel="icon" type="image/ico" href="favicon.ico"/>
+    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
+    <link rel="stylesheet" href="bower_components/Font-Awesome/css/font-awesome.min.css"/>
+    <link rel="stylesheet" href="angular-feeds/angular-feeds.min.css">
+    <link rel="stylesheet" href="styles/my-feeds.css">
+    <!-- Google Feeds API script -->
+    <script type="text/javascript"
+            src="https://www.google.com/jsapi?autoload=%7B%22modules%22%3A%5B%7B%22name%22%3A%22feeds%22%2C%22version%22%3A%221.0%22%2C%22nocss%22%3Atrue%7D%5D%7D"></script>
+</head>
+<body ng-app="angular-my-feeds" ng-controller="MyFeedsController">
+
+<div class="container">
+    <div class="page-header">
+        <a ng-show="!isOrigin()" class="btn btn-default btn-sm pull-right" target="_new" href="my-feeds.html"><i class="fa fa-external-link"></i> Open in new window</a>
+        <h3><i ng-show="isOrigin()" class="fa fa-rss"></i> My Feeds</h3>
+    </div>
+
+    <div id="my-feeds" class="row">
+        <div ng-controller="FeedWidgetController" ng-repeat="feed in feeds" class="col-sm-4">
+            <div class="panel panel-default">
+                <div class="panel-heading">
+                    <div ng-include src="'templates/feed-widget-control.html'"></div>
+                    <h3 class="panel-title">{{feed.title}}</h3>
+                </div>
+                <div ng-if="!collapsed" class="panel-body feed-body">
+                    <div class="feed-block" feed-widget>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+<!--[if lt IE 9]>
+<script src="bower_components/es5-shim/es5-shim.js"></script>
+<script src="bower_components/json3/lib/json3.min.js"></script>
+<![endif]-->
+
+<script src="bower_components/jquery/jquery.min.js"></script>
+<script src="bower_components/angular/angular.min.js"></script>
+<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
+<script src="bower_components/angular-sanitize/angular-sanitize.min.js"></script>
+<script src="angular-feeds/angular-feeds.min.js"></script>
+<script src="scripts/my-feeds.js"></script>
+</body>
+</html>
diff --git a/app/my-feeds.json b/app/my-feeds.json
@@ -0,0 +1,17 @@
+[
+  {
+    "title": "Hacker News",
+    "url": "https://news.ycombinator.com/rss",
+    "count": 10
+  },
+  {
+    "title": "DZone",
+    "url": "http://feeds.dzone.com/dzone/frontpage?format=xml",
+    "count": 10
+  },
+  {
+    "title": "Reddit Programming",
+    "url": "http://www.reddit.com/r/programming/.rss",
+    "count": 10
+  }
+]
diff --git a/app/scripts/application.js → app/scripts/docs/application.js b/app/scripts/application.js → app/scripts/docs/application.js
diff --git a/app/scripts/docs.js → app/scripts/docs/docs.js b/app/scripts/docs.js → app/scripts/docs/docs.js
diff --git a/app/scripts/prettify.js → app/scripts/docs/prettify.js b/app/scripts/prettify.js → app/scripts/docs/prettify.js
diff --git a/app/scripts/feed-tester.js b/app/scripts/feed-tester.js
@@ -0,0 +1,17 @@
+angular.module('angular-feeds-tester', [
+    'feeds'
+  ]).controller('FeedTesterController', ['$scope', '$compile', function ($scope, $compile) {
+    $scope.count = 10;
+    $scope.summary = false;
+    $scope.showFeed = function (){
+      var $panelBody = $('.panel-body');
+      $panelBody.html('');
+      var feedHTML = "<feed url='" + $scope.url + "' count='" + $scope.count + "' summary='" + $scope.summary + "'/>";
+      $panelBody.append($compile(feedHTML)($scope));
+    };
+
+    var url = window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
+    $scope.isOrigin = function (){
+      return window.parent.location.href.indexOf(url) === -1;
+    };
+  }]);
diff --git a/app/scripts/app.js → app/scripts/feeds-demo.js b/app/scripts/app.js → app/scripts/feeds-demo.js
diff --git a/app/scripts/my-feeds.js b/app/scripts/my-feeds.js
@@ -0,0 +1,32 @@
+angular.module('angular-my-feeds', [
+    'feeds'
+  ])
+  .controller('MyFeedsController', ['$scope', '$compile', '$http', '$rootScope', function ($scope, $compile, $http, $rootScope) {
+    $scope.isOrigin = function () {
+      var url = window.location.href.substring(window.location.href.lastIndexOf('/') + 1);
+      return window.parent.location.href.indexOf(url) !== -1;
+    };
+
+    $http.get('my-feeds.json').success(function (feeds) {
+      $scope.feeds = feeds;
+    });
+  }])
+  .directive('feedWidget', ['$compile', function ($compile) {
+    return  {
+      restrict: 'A',
+      controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element) {
+        var feed = $scope.feed;
+        var feedHTML = "<feed url='" + feed.url + "' count='" + feed.count + "' post-render='feedPostRender'/>";
+        $element.append($compile(feedHTML)($scope));
+      }]
+    };
+  }])
+  .controller('FeedWidgetController', ['$scope', function ($scope) {
+    $scope.toggleFeed = function () {
+      $scope.collapsed = !$scope.collapsed;
+    };
+  }]);
+
+function feedPostRender(element) {
+  $(element).find('a').attr('target', '_blank');
+}
diff --git a/app/styles/prettify.css → app/styles/docs/prettify.css b/app/styles/prettify.css → app/styles/docs/prettify.css
diff --git a/app/styles/feed-tester.css b/app/styles/feed-tester.css
@@ -0,0 +1,3 @@
+body {
+    padding-top: 0;
+}
diff --git a/app/styles/main.css → app/styles/feeds-demo.css b/app/styles/main.css → app/styles/feeds-demo.css
diff --git a/app/styles/my-feeds.css b/app/styles/my-feeds.css
@@ -0,0 +1,25 @@
+body {
+    padding-top: 0;
+}
+
+.feed-body {
+    height: 400px;
+    overflow: auto;
+}
+
+.media {
+    margin-top: 0;
+}
+
+hr {
+    margin-bottom: 10px;
+    margin-top: 10px;
+}
+
+.fa-chevron-circle-down {
+    cursor: pointer;
+}
+
+.fa-chevron-circle-up {
+    cursor: pointer;
+}
diff --git a/app/templates/feed-control.html → app/templates/feed-code-toggle.html b/app/templates/feed-control.html → app/templates/feed-code-toggle.html
diff --git a/app/templates/feed-widget-control.html b/app/templates/feed-widget-control.html
@@ -0,0 +1,3 @@
+<div class="pull-right feed-control">
+    <i ng-click="toggleFeed();" class="fa {{!collapsed ? 'fa-chevron-circle-down' : 'fa-chevron-circle-up'}}"></i>
+</div>
diff --git a/app/templates/feed-widget.html b/app/templates/feed-widget.html
@@ -0,0 +1,11 @@
+<div class="panel panel-default">
+    <div class="panel-heading">
+        <div ng-include src="'templates/feed-control.html'"></div>
+        <h3 class="panel-title">{{title}}</h3>
+    </div>
+    <div class="panel-body">
+        <div class="feed-block">
+            {{feed_html}}
+        </div>
+    </div>
+</div>
diff --git a/app/templates/main-page.html b/app/templates/main-page.html
@@ -23,7 +23,7 @@ <h3>Examples</h3>
         <div class="col-sm-12">
             <div class="panel panel-default">
                 <div class="panel-heading">
-                    <div ng-include src="'templates/feed-control.html'"></div>
+                    <div ng-include src="'templates/feed-code-toggle.html'"></div>
                     <h3 class="panel-title">Stack Overflow <i>AngularJS</i> Questions</h3>
                 </div>
                 <div class="panel-body">
@@ -42,7 +42,7 @@ <h3 class="panel-title">Stack Overflow <i>AngularJS</i> Questions</h3>
         <div class="col-sm-12">
             <div class="panel panel-default">
                 <div class="panel-heading">
-                    <div ng-include src="'templates/feed-control.html'"></div>
+                    <div ng-include src="'templates/feed-code-toggle.html'"></div>
                     <h3 class="panel-title">Wikipedia Featured Articles</h3>
                 </div>
                 <div class="panel-body">
@@ -73,7 +73,7 @@ <h3 class="panel-title">Wikipedia Featured Articles</h3>
         <div class="col-sm-12">
             <div class="panel panel-default">
                 <div class="panel-heading">
-                    <div ng-include src="'templates/feed-control.html'"></div>
+                    <div ng-include src="'templates/feed-code-toggle.html'"></div>
                     <h3 class="panel-title">Reddit (<i>/r/programming</i>)</h3>
                 </div>
                 <div class="panel-body">

diff --git a/app/templates/my-feeds-iframe.html b/app/templates/my-feeds-iframe.html
@@ -0,0 +1,3 @@
+<div>
+    <iframe width="100%" height="800px" scrolling="auto" frameborder="0" src="my-feeds.html"></iframe>
+</div>
diff --git a/app/templates/navbar.html b/app/templates/navbar.html
@@ -35,6 +35,7 @@
                         <li><a target="_new" href="https://github.com/siddii/angular-feeds">View on Github</a></li>
                     </ul>
                 </li>
+                <li class="{{page == '#my-feeds' ? 'active' : ''}}"><a ng-click="gotoPage('#my-feeds');" href="#">My Feeds</a></li>
             </ul>
         </div>
     </div>

diff --git a/index.html b/index.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<html>
+    <head>
+        <meta http-equiv="refresh" content="0; url=./app/" />
+    </head>
+</html>
diff --git a/src/scripts/directives.js b/src/scripts/directives.js
@@ -8,10 +8,11 @@ angular.module('feeds-directives', []).directive('feed', ['feedService', '$compi
     },
     controller: ['$scope', '$element', '$attrs', '$timeout', function ($scope, $element, $attrs, $timeout) {
       $scope.$watch('finishedLoading', function (value) {
+        console.log('##### $attrs.postRender = ', $attrs.postRender);
         if ($attrs.postRender && value) {
-          $timeout(function () {
-            new Function($attrs.postRender)();
-          });
+          $timeout(function (){
+            new Function("element", $attrs.postRender + '(element);')($element);
+          }, 0);
         }
       });
-Original file line number
+Diff line change
@@ Expand Up / @@ -35,6 +35,7 @@ @@
                             <li><a target="_new" href="https://github.com/siddii/angular-feeds">View on Github</a></li>
                         </ul>
                     </li>
+                    <li class="{{page == '#my-feeds' ? 'active' : ''}}"><a ng-click="gotoPage('#my-feeds');" href="#">My Feeds</a></li>
                 </ul>
             </div>
         </div>
@@ Expand Down @@