LarryWeiss/gist:6afba33b756aaeb4322130dec5c5d178

## gistfile1.txt
<!DOCTYPE html>
<html lang="en" ng-app="RSSFeedApp" ng-strict-di>

<head>
  <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>RSS Feed Reader (demo of an AngularJS 1.4.0 SPA using Bootstrap 3.3.4 CSS)</title>

<!-- based on http://www.ivivelabs.com/blog/making-a-quick-rss-feed-reader-using-angularjs/          -->
<!-- see:  https://developers.google.com/feed/v1/jsondevguide for the service used in RSSFeedFactory -->
<!-- converted to AngularJS 1.4     converted to Bootstrap 3 CSS   rewritten for clarity             -->
<!-- archived at http://sp.ntpcug.org/PowerShell/Shared%20Documents/RSSFeedApp.htm                   -->
<!--         and http://sp.ntpcug.org/PowerShell/Shared%20Documents/RSSFeeds.js                      -->

<!--  -->
<!-- scripts and stylesheets via CDN -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script>
  <link  href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
<!--  -->

<!--  -->
<!-- scripts and stylesheets via local files -->
<!--
  <script src="jquery.min.js"></script>
  <script src="angular.min.js"></script>
  <script src="bootstrap.min.js"></script>
  <link  href="bootstrap.min.css" rel="stylesheet">
 -->

  <script src="RSSFeeds.js"></script>                                                            <!--  loadRSSFeedArray  -->

  <style>
    .RSSFeedDropdownMenu {
      height:     auto;
      max-height: 400px;
      overflow-x: hidden;
     }
    .RSSFeedArticleListItems {
      position:     relative;
      top:          10px;
      border:       solid;
      border-width: 1px;
      height:       auto;
      max-height:   520px;
      overflow-x:   hidden;
     }
    .RSSFeedArticleListItems ul {
      padding: 4px;
     }
    .RSSFeedArticleListItem {
      list-style-type: none;
      margin:          2px;
     }
    .RSSFeedPage {
      font-weight: bold;
     }
    .RSSFeedArticleListItemPublishedDate {
      font-weight: bold;
      font-family: monospace;
     }
    .RSSFeedArticleListItemTitle {
      font-weight: bold;
     }
  </style>

  <script>

    angular.module("RSSFeedApp", []);

    angular.module("RSSFeedApp").factory("RSSFeedFactory", ["$http", function($http){
      var RSSFeedFactory = {};
      RSSFeedFactory.parseRSSFeed = function(RSSFeedURL){                                        // parseRSSFeed
        return $http.jsonp(
          "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=" +
            encodeURIComponent(RSSFeedURL));
       };
      return RSSFeedFactory;
     }]);

    angular.module("RSSFeedApp").controller("RSSFeedController",
       ["$scope", "$http", "RSSFeedFactory", function($scope, $http, RSSFeedFactory){
      $scope.RSSFeedName = "feedname";
      $scope.RSSFeedPage = "https://www.google.com/search?q=AngularJS";
      $scope.RSSFeedArray = loadRSSFeedArray();                             // from RSSFeeds.js  // loadRSSFeedArray ref
      $scope.loadRSSFeedArticleCollection =
        function(RSSFeedName, RSSFeedURL, RSSFeedPage, searchText){
          $scope.RSSFeedName = RSSFeedName;
          $scope.RSSFeedURL = RSSFeedURL;
          $scope.RSSFeedPage = RSSFeedPage;
          $scope.searchText = searchText;
          RSSFeedFactory.parseRSSFeed(RSSFeedURL).then(function(response){                       // parseRSSFeed ref
            $scope.RSSFeedArticleCollection = response.data.responseData.feed.entries;
           })
         };
     }]);

  </script>

</head>

<body>

  <div class="container-fluid">

    <div ng-controller="RSSFeedController">

      <h4>RSS Feed Reader (demo of an AngularJS 1.4.0 SPA using Bootstrap 3.3.4 CSS)</h4>        <!-- heading -->

      <div class="btn-group"> <!-- ( [feedname] (#items) \/ ) -->
        <button class="btn btn-default" type="button">
          <a href="#" ng-click=
              "loadRSSFeedArticleCollection(
                RSSFeedName,
                RSSFeedURL,
                RSSFeedPage,
                RSSFeedName)">                                                                   <!-- loadRSSFeedArray ref -->
            <b>{{RSSFeedName}}</b>                                                               <!-- [ feedname ] -->
          </a>
        <span>&nbsp;</span>
          <div style="display:inline">
            <span class="badge">{{(RSSFeedArticleCollection | filter:filterText).length}}</span> <!-- ( #Items ) -->
          </div>
          <button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
            <span class="caret"></span>                                                          <!-- [ \/ ] -->
          </button>
          <ul class="dropdown-menu RSSFeedDropdownMenu">
            <li ng-repeat="RSSFeed in RSSFeedArray">
              <a href="#" ng-click=
                "loadRSSFeedArticleCollection(
                   RSSFeed.name,
                   RSSFeed.feed,
                   RSSFeed.page,
                   RSSFeed.name)">                                                               <!-- loadRSSFeedArticleCollection ref -->
                <b>{{RSSFeed.name}}</b>                                                          <!-- feed link in dropdown -->
              </a>
            </li>
          </ul>
        </button>
      </div>

      <div style="display:inline"> <!-- filter by [ filtertext ] -->
        <span>&nbsp;&nbsp;<b>filter by&nbsp;</b></span>                                          <!-- "filter by" -->
        <input type="text" size="10%" ng-model="filterText" />                                   <!-- [ filtertext ] -->
      </div>

      <div style="display:inline"> <!-- web search for [ searchtext ] -->
        <span>&nbsp;&nbsp;</span>
        <a href="https://www.google.com/search?q={{searchText}}" target="_blank">
          <b>web search for</b>                                                                  <!-- "web search for" -->
        </a>
        <span>&nbsp;</span>
        <input type="text" size="30%" ng-model="searchText" />                                   <!-- [ searchtext ] -->
      </div>

      <div class="RSSFeedArticleListItems">
        <ul>
          <li class="RSSFeedArticleListItem">
            <a href="{{RSSFeedPage}}" target="_blank">
              <b>website for {{RSSFeedName}}</b>                                                 <!-- [ website link ] -->
            </a>
          </li>
          <li class="RSSFeedArticleListItem" ng-repeat="RSSFeedArticle in RSSFeedArticleCollection | filter:filterText">
            <a href="{{RSSFeedArticle.link}}" target="_blank">                                   <!-- [ article link ] -->
              <span class="RSSFeedArticleListItemPublishedDate">{{RSSFeedArticle.publishedDate|limitTo:16}}</span>
              -
              <span class="RSSFeedArticleListItemTitle">{{RSSFeedArticle.title}}</span>
            </a>
          </li>
        </ul>
      </div>

    </div>

  </div>

</body>

</html>
	<!DOCTYPE html>
	<html lang="en" ng-app="RSSFeedApp" ng-strict-di>

	<head>
	<meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1">

	<title>RSS Feed Reader (demo of an AngularJS 1.4.0 SPA using Bootstrap 3.3.4 CSS)</title>

	<!-- based on http://www.ivivelabs.com/blog/making-a-quick-rss-feed-reader-using-angularjs/ -->
	<!-- see: https://developers.google.com/feed/v1/jsondevguide for the service used in RSSFeedFactory -->
	<!-- converted to AngularJS 1.4 converted to Bootstrap 3 CSS rewritten for clarity -->
	<!-- archived at http://sp.ntpcug.org/PowerShell/Shared%20Documents/RSSFeedApp.htm -->
	<!-- and http://sp.ntpcug.org/PowerShell/Shared%20Documents/RSSFeeds.js -->

	<!-- -->
	<!-- scripts and stylesheets via CDN -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script>
	<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
	<!-- -->

	<!-- -->
	<!-- scripts and stylesheets via local files -->
	<!--
	<script src="jquery.min.js"></script>
	<script src="angular.min.js"></script>
	<script src="bootstrap.min.js"></script>
	<link href="bootstrap.min.css" rel="stylesheet">
	-->

	<script src="RSSFeeds.js"></script> <!-- loadRSSFeedArray -->

	<style>
	.RSSFeedDropdownMenu {
	height: auto;
	max-height: 400px;
	overflow-x: hidden;
	}
	.RSSFeedArticleListItems {
	position: relative;
	top: 10px;
	border: solid;
	border-width: 1px;
	height: auto;
	max-height: 520px;
	overflow-x: hidden;
	}
	.RSSFeedArticleListItems ul {
	padding: 4px;
	}
	.RSSFeedArticleListItem {
	list-style-type: none;
	margin: 2px;
	}
	.RSSFeedPage {
	font-weight: bold;
	}
	.RSSFeedArticleListItemPublishedDate {
	font-weight: bold;
	font-family: monospace;
	}
	.RSSFeedArticleListItemTitle {
	font-weight: bold;
	}
	</style>

	<script>

	angular.module("RSSFeedApp", []);

	angular.module("RSSFeedApp").factory("RSSFeedFactory", ["$http", function($http){
	var RSSFeedFactory = {};
	RSSFeedFactory.parseRSSFeed = function(RSSFeedURL){ // parseRSSFeed
	return $http.jsonp(
	"http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=50&callback=JSON_CALLBACK&q=" +
	encodeURIComponent(RSSFeedURL));
	};
	return RSSFeedFactory;
	}]);

	angular.module("RSSFeedApp").controller("RSSFeedController",
	["$scope", "$http", "RSSFeedFactory", function($scope, $http, RSSFeedFactory){
	$scope.RSSFeedName = "feedname";
	$scope.RSSFeedPage = "https://www.google.com/search?q=AngularJS";
	$scope.RSSFeedArray = loadRSSFeedArray(); // from RSSFeeds.js // loadRSSFeedArray ref
	$scope.loadRSSFeedArticleCollection =
	function(RSSFeedName, RSSFeedURL, RSSFeedPage, searchText){
	$scope.RSSFeedName = RSSFeedName;
	$scope.RSSFeedURL = RSSFeedURL;
	$scope.RSSFeedPage = RSSFeedPage;
	$scope.searchText = searchText;
	RSSFeedFactory.parseRSSFeed(RSSFeedURL).then(function(response){ // parseRSSFeed ref
	$scope.RSSFeedArticleCollection = response.data.responseData.feed.entries;
	})
	};
	}]);

	</script>

	</head>

	<body>

	<div class="container-fluid">

	<div ng-controller="RSSFeedController">

	<h4>RSS Feed Reader (demo of an AngularJS 1.4.0 SPA using Bootstrap 3.3.4 CSS)</h4> <!-- heading -->

	<div class="btn-group"> <!-- ( [feedname] (#items) \/ ) -->
	<button class="btn btn-default" type="button">
	<a href="#" ng-click=
	"loadRSSFeedArticleCollection(
	RSSFeedName,
	RSSFeedURL,
	RSSFeedPage,
	RSSFeedName)"> <!-- loadRSSFeedArray ref -->
	<b>{{RSSFeedName}}</b> <!-- [ feedname ] -->
	</a>
	<span> </span>
	<div style="display:inline">
	<span class="badge">{{(RSSFeedArticleCollection \| filter:filterText).length}}</span> <!-- ( #Items ) -->
	</div>
	<button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
	<span class="caret"></span> <!-- [ \/ ] -->
	</button>
	<ul class="dropdown-menu RSSFeedDropdownMenu">
	<li ng-repeat="RSSFeed in RSSFeedArray">
	<a href="#" ng-click=
	"loadRSSFeedArticleCollection(
	RSSFeed.name,
	RSSFeed.feed,
	RSSFeed.page,
	RSSFeed.name)"> <!-- loadRSSFeedArticleCollection ref -->
	<b>{{RSSFeed.name}}</b> <!-- feed link in dropdown -->
	</a>
	</li>
	</ul>
	</button>
	</div>

	<div style="display:inline"> <!-- filter by [ filtertext ] -->
	<span>  <b>filter by </b></span> <!-- "filter by" -->
	<input type="text" size="10%" ng-model="filterText" /> <!-- [ filtertext ] -->
	</div>

	<div style="display:inline"> <!-- web search for [ searchtext ] -->
	<span>  </span>
	<a href="https://www.google.com/search?q={{searchText}}" target="_blank">
	<b>web search for</b> <!-- "web search for" -->
	</a>
	<span> </span>
	<input type="text" size="30%" ng-model="searchText" /> <!-- [ searchtext ] -->
	</div>

	<div class="RSSFeedArticleListItems">
	<ul>
	<li class="RSSFeedArticleListItem">
	<a href="{{RSSFeedPage}}" target="_blank">
	<b>website for {{RSSFeedName}}</b> <!-- [ website link ] -->
	</a>
	</li>
	<li class="RSSFeedArticleListItem" ng-repeat="RSSFeedArticle in RSSFeedArticleCollection \| filter:filterText">
	<a href="{{RSSFeedArticle.link}}" target="_blank"> <!-- [ article link ] -->
	<span class="RSSFeedArticleListItemPublishedDate">{{RSSFeedArticle.publishedDate\|limitTo:16}}</span>
	-
	<span class="RSSFeedArticleListItemTitle">{{RSSFeedArticle.title}}</span>
	</a>
	</li>
	</ul>
	</div>

	</div>

	</div>

	</body>

	</html>