<!DOCTYPE html>
<html ng-app="scrapperApp" id="appContainer">

  <head>
    <script data-require="jquery@*" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://code.angularjs.org/1.2.25/angular.js" data-semver="1.2.25" data-require="angular.js@1.2.25"></script>
    <link href="style.css" rel="stylesheet" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="scrapperCtrl">
    <h1>The Coding Love</h1>
      <input ng-model="search" placeholder="search..."/>
      <p ng-repeat="post in posts | filter:search">
        <strong>{{post.Desc.text}}</strong><br/>
        <img ng-src="{{post.Img.src}}" height=200/></p>
        
  </body>

</html>
// Code goes here

angular.module('scrapperApp', [])
.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    delete $httpProvider.defaults.headers.common['X-Requested-With'];
}])
.run(function($rootScope){
  $rootScope.data = [];
})
.controller('scrapperCtrl', function($scope, codingloveFactory){
  
  codingloveFactory.success(function(data, status, header, config){
		$scope.posts = data.results.collection1;
	}).error(function(data, status, header, config){console.log(data)});
  
})
.factory('codingloveFactory', function($http) {
	var url = 'https://www.kimonolabs.com/api/2c3907pw?apikey=Q3H8aNDGlqWZX76VDgldNkaA9ewVfeR0&callback=JSON_CALLBACK';	
  return $http({method: 'JSONP', url: url})
})
/* Styles go here */