Authenticating and using GoogleAPI for Youtube Problem

Hello am currently having trouble authenticating a youtube channel with my current code in Ionic project. I have gotten it to work with the sample project located here

Google Developers code sample Youtube

And have been closely looking at this example from below as well.

Github AngularJS Service with Controller for access to Google API with Javascript Client (and RequireJS)

But have not been able to get my project to work/Authenticate. I get this error BELOW and I have double checked my client ID & scopes unless I guess am missing some am at a lost since am trying to rewrite it for angular.js.

And here is all the code for the files I have.I also put it in this CODEPEN Code For easy readablity I would appreciate any help thanks GUYS!!!

authenticateService.js [Service File]

angular.module(‘va_disability.authenticateService’, )

.service('googleService', ['$http', '$rootScope', '$q', function ($http, $rootScope, $q) {
		var clientId = '425824540063-rfukaaqcp32jck56hbg4f3eb5rv0po5j.apps.googleusercontent.com',
            apiKey = 'AIzaSyD1Vbyw3w2vFNv0VjZ0tYnvQIn1dm1Is2g',
            scopes = 'https://www.googleapis.com/auth/youtube',
            deferred = $q.defer();

       this.login = function () {
			console.log(gapi.auth.authorize);
            gapi.auth.authorize({ 
                client_id: clientId, 
                scope: scopes, 
                immediate: false,
            }, this.handleAuthResult);

            return deferred.promise;
        }
		
		googleApiClientReady = function(){
			gapi.auth.init(function() {
				window.setTimeout(checkAuth, 1);
			});
		
		}




       this.handleClientLoad = function () {
            gapi.client.setApiKey(apiKey);
            gapi.auth.init(function () { });
            window.setTimeout(checkAuth, 1);
        };

        checkAuth = function() {
            console.log("CheckAuth");
            gapi.auth.authorize({
                client_id: clientId, 
                scope: scopes, 
                immediate: false
            }, this.handleAuthResult);
        };

        this.handleAuthResult = function(authResult) {
            console.log("handleAuthResult");
            console.log(authResult);
            if (authResult && !authResult.error) {
                console.log("handleAuthResult loading client")
                var data = {};
                gapi.client.load('oauth2', 'v2', function () {
				//handleAPILoaded();
                    var request = gapi.client.oauth2.userinfo.get();
                    console.log(request);
                    request.execute(function (resp) {
                        data.email = resp.email;
                    });
                });
                deferred.resolve(data);
            } else {
                console.log("handleAuthResult Error");
                deferred.reject('error');
            }
        };	
}]);

VideoCtrl.js [Controller File]

angular.module(‘va_disability.video’, )

.controller('VideoCtrl',['$scope', 'googleService', '$state', function VideoCtrl($scope, googleService, $state){

	$scope.$on("$ionicView.afterEnter", function() {
		login();
	});
	
	function login(){
			googleService.login().then(function (data) {
				console.log("Worked");
            }, function (err) {
                console.log('Failed: ' + err);
           });
	}

}]);

Index.html [Holds All LInking Libs]

<!--- google apis -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://apis.google.com/js/client.js?onload=googleApiClientReady"></script>
<script type="text/javascript" src="//www.google.com/jsapi"></script>