Angular.js - подача страниц в Facebook, отображение сообщений в списке карточек, с полноэкранной галереей изображений. Кто-нибудь может мне помочь?

angular.module('starter.controllers', [])


.controller('DashCtrl', function($scope,$http) {

function makeHttpRequest() {

try {return new XMLHttpRequest();}
catch (error) {}

try {return new ActiveXObject("Msxml2.XMLHTTP");}
catch (error) {}

try {return new ActiveXObject("Microsoft.XMLHTTP");}
catch (error) {}

throw new Error ("HTTP Request Could not be completed.");
}


var appID = "appID";
var appSecret = "appSecret";

var accessTokenRq = makeHttpRequest();
var httpString = 'https://graph.facebook.com/oauth/access_token?grant_type=client_credentials&client_id='+appID+'&client_secret='+appSecret;

accessTokenRq.open("GET",httpString,true);
accessTokenRq.send(null);

var access_token;

accessTokenRq.onreadystatechange = function() {

  if (accessTokenRq.readyState == 4) {

    access_token = accessTokenRq.responseText;
    //alert("It works!");

    var request = makeHttpRequest();
    request.open("GET",'https://graph.facebook.com/profile_id/posts?'+access_token+'&fields=id,message,picture,link,name,description,type,icon,likes,comments,created_time,from,object_id&limit=5)',true);
    request.send(null);

    request.onreadystatechange = function() {

      if (request.readyState == 4) {

        var response = request.responseText;
        console.log(response);

        var fbData = angular.fromJson(response);

        var data = fbData.data;

        var messageArray = [];
        var pictureArray = [];
        var likeArray = [];
        var dateArray = [];
        var linkArray = [];
        var typeArray = [];
        var commentArray = [];

        var objects = [];

        for (var i = 0; i < data.length; i++) {
          
          var entry = data[i];

          // Message
          if (entry.message) {
             var message = entry.message;
             messageArray.push(message);
          }
          else {messageArray.push(" ");}

          // Picture
          if(angular.equals(entry.type,"photo")) {
            var pic = "https://graph.facebook.com/"+entry.object_id+"/picture?type=normal";
            pictureArray.push(pic);
          }
          else if (angular.equals(entry.type,"link")) {
            pictureArray.push(entry.picture);
          }
          else {pictureArray.push("empty");}
          console.log(pic);
          console.log(entry.picture);
            
          // Likes
          if (entry.likes) {
            var likeData = entry.likes;
            likeArray.push(likeData.data.length+" Likes");
          }
          else {likeArray.push(" Likes");}

            
          // Date 
          var created = entry.created_time;
          var rawDate = created.split("T");
          var date = rawDate[0];

          var rawTime = rawDate[1];
          var time = rawTime.split(":");
          var betaTime = time[0]+":"+time[1];
          var finalTime = addOneHour(betaTime);
          dateArray.push(date+" - "+finalTime);

            function addOneHour(time) {
              var seperatedTime = time.split(":");
              var hourTime = seperatedTime[0];
              var returningTime = "";
              if (seperatedTime.indexOf("00") > -1) {returningTime = "01";}
              if (seperatedTime.indexOf("01") > -1) {returningTime = "02";}
              if (seperatedTime.indexOf("02") > -1) {returningTime = "03";}
              if (seperatedTime.indexOf("03") > -1) {returningTime = "04";}
              if (seperatedTime.indexOf("04") > -1) {returningTime = "05";}
              if (seperatedTime.indexOf("05") > -1) {returningTime = "06";}
              if (seperatedTime.indexOf("06") > -1) {returningTime = "07";}
              if (seperatedTime.indexOf("07") > -1) {returningTime = "08";}
              if (seperatedTime.indexOf("08") > -1) {returningTime = "09";}
              if (seperatedTime.indexOf("09") > -1) {returningTime = "10";}
              if (seperatedTime.indexOf("10") > -1) {returningTime = "11";}
              if (seperatedTime.indexOf("11") > -1) {returningTime = "12";}
              if (seperatedTime.indexOf("12") > -1) {returningTime = "13";}
              if (seperatedTime.indexOf("13") > -1) {returningTime = "14";}
              if (seperatedTime.indexOf("14") > -1) {returningTime = "15";}
              if (seperatedTime.indexOf("15") > -1) {returningTime = "16";}
              if (seperatedTime.indexOf("16") > -1) {returningTime = "17";}
              if (seperatedTime.indexOf("17") > -1) {returningTime = "18";}
              if (seperatedTime.indexOf("18") > -1) {returningTime = "19";}
              if (seperatedTime.indexOf("19") > -1) {returningTime = "20";}
              if (seperatedTime.indexOf("20") > -1) {returningTime = "21";}
              if (seperatedTime.indexOf("21") > -1) {returningTime = "22";}
              if (seperatedTime.indexOf("22") > -1) {returningTime = "23";}
              if (seperatedTime.indexOf("23") > -1) {returningTime = "00";}

                console.log(returningTime+":"+seperatedTime[1]);

              return returningTime+":"+seperatedTime[1];  

              }

          // Link
          if (entry.link) {linkArray.push(entry.link);}
          else {linkArray.push("empty");}

          // Comments 
          if (entry.comments) {
            var commentData = entry.comments;
            commentArray.push(commentData.data.length+" Comments");

          }
          else {
            commentArray.push("0 Comments");
          }


          typeArray.push(entry.type);
        }

        for (var i = 0; i < dateArray.length; i++) {
          
          // Only Text 
          if ( (angular.equals(linkArray[i],"empty")) && (angular.equals(pictureArray[i],"empty")) ) {
            objects.push('<div class="list card"><div class="item thumbnail-left"> <h2>Matty Mode</h2><p>'+dateArray[i]+'</p></div><div class="item item-body"><p>'+messageArray[i]+'</p><p><span class="subdued">'+likeArray[i]+'</span>  <span class="subdued">'+commentArray[i]+'</span></p></div> <a class="button-block button" ng-click="openModal()" ng-controller="MainCtrl">Bekijk</a> </div>');
          
          }

          // No Link, picture availiable
          else if ( (angular.equals(linkArray[i],"empty")) && (angular.equals(pictureArray[i],"empty")) == false ) {

            objects.push('<div class="list card"><div class="item thumbnail-left"> <h2>Matty Mode</h2><p>'+dateArray[i]+'</p></div><div class="item item-body"><img src="'+pictureArray[i]+'" width=100%></img> <p>'+messageArray[i]+'</p><p><span class="subdued">'+likeArray[i]+'</span>  <span class="subdued">'+commentArray[i]+'</span></p></div> <a class="button-block button" ng-click="openModal()" ng-controller="MainCtrl">Bekijk</a> </div>');

          }

          // The rest 
          else {
            
            objects.push('<div class="list card"><div class="item thumbnail-left"> <h2>Matty Mode</h2><p>'+dateArray[i]+'</p></div><div class="item item-body"><a href='+linkArray[i]+' ><img src="'+pictureArray[i]+'" width=100%></img></a> <p>'+messageArray[i]+'</p><p><span class="subdued">'+likeArray[i]+'</span>  <span class="subdued">'+commentArray[i]+'</span></p></div> <a class="button-block button" ng-click="openModal()" ng-controller="MainCtrl">Bekijk</a> </div>');

          }

        }

        $scope.entries = objects;
        //console.log(objects);
      }
    }
  }

}


})

.controller('MainCtrl', ['$scope', '$ionicModal', '$ionicSlideBoxDelegate', function ($scope, $ionicModal, $ionicSlideBoxDelegate) {
    
  	$scope.aImages = [{
      	'src' : 'http://ionicframework.com/img/ionic-logo-blog.png', 
      	'msg' : 'Swipe me to the left. Tap/click to close'
    	}, {
        'src' : 'http://ionicframework.com/img/ionic-logo-blog.png', 
        'msg' : ''
      }, { 
        'src' : 'http://ionicframework.com/img/ionic-logo-blog.png', 
        'msg' : ''
    }];
    
    //console.log(objects);
  
    $ionicModal.fromTemplateUrl('image-modal.html', {
      scope: $scope,
      animation: 'slide-in-up'
    }).then(function(modal) {
      $scope.modal = modal;
    });

    $scope.openModal = function() {
      $ionicSlideBoxDelegate.slide(0);
      $scope.modal.show();
    };

    $scope.closeModal = function() {
      $scope.modal.hide();
    };

    // Cleanup the modal when we're done with it!
    $scope.$on('$destroy', function() {
      $scope.modal.remove();
    });
    // Execute action on hide modal
    $scope.$on('modal.hide', function() {
      // Execute action
    });
    // Execute action on remove modal
    $scope.$on('modal.removed', function() {
      // Execute action
    });
    $scope.$on('modal.shown', function() {
      console.log('Modal is shown!');
    });

    // Call this functions if you need to manually control the slides
    $scope.next = function() {
      $ionicSlideBoxDelegate.next();
    };
  
    $scope.previous = function() {
      $ionicSlideBoxDelegate.previous();
    };
  
  	$scope.goToSlide = function(index) {
      $scope.modal.show();
      $ionicSlideBoxDelegate.slide(index);
    }
  
    // Called each time the slide changes
    $scope.slideChanged = function(index) {
      $scope.slideIndex = index;
    };
  }
])

.controller('ChatsCtrl', function($scope, Chats) {
  $scope.chats = Chats.all();
  $scope.remove = function(chat) {
    Chats.remove(chat);
  }
})

.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {
  $scope.chat = Chats.get($stateParams.chatId);
})

.controller('FriendsCtrl', function($scope, Friends) {
  $scope.friends = Friends.all();
})

.controller('FriendDetailCtrl', function($scope, $stateParams, Friends) {
  $scope.friend = Friends.get($stateParams.friendId);
})

.controller('AccountCtrl', function($scope) {
  $scope.settings = {
    enableFriends: true
  };
});

.transparent {
  background: transparent !important;
}
.image-modal {
  width: 100% !important;
  height: 100%;
  top: 0 !important;
  left: 0 !important;
}
.fullscreen-image {
  max-width: 100%;
  max-height: 100%;
  bottom: 0;
  left: 0;
  margin: auto;
  overflow: auto;
  position: fixed;
  right: 0;
  top: 0;
}
.slider {
  width: 100%;
  height: 100%;
}

p.info {
  position: absolute;
  bottom: 55px;
  margin: 0 auto;
  width: 100%;
  display: block;
  text-align: center;
  font-size: 28px;
  color: #ffffff;
}

/* Fix modal backdrop for smaller devices */
@media (max-width: 679px) {
  .active .modal-backdrop-bg {
    opacity: .5;
  }
  .modal-backdrop-bg {
    -webkit-transition: opacity 300ms ease-in-out;
    transition: opacity 300ms ease-in-out;
    background-color: #000;
    opacity: 0;
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.min.js"></script>
<ion-view view-title="Title" style="background-color:#363636">
  <ion-content class="padding">
      <p style="text-align:center"><img src="img/mm_icon.png"></p>
      
    <div class="list" >
        <div ng-repeat = "entry in entries track by $index" ng-bind-html="entry" ng-click="openModal()" ng-controller="MainCtrl">

            <script id="image-modal.html" type="text/ng-template"> 
              <div class="modal image-modal transparent" ng-click="closeModal()"> 
                  <ion-slide-box on-slide-changed="slideChanged(index)" show-pager="false"> 
                      <ion-slide ng-repeat="oImage in aImages"> 
                          <img ng-src="{{oImage.src}}" class="fullscreen-image" /> 
                          <p class="info">{{oImage.msg}}</p> 
                      </ion-slide> 
                  </ion-slide-box> 
              </div> 
            </script>

        </div>
    </div>

  </ion-content>
</ion-view>