Javascript-форум - создание кастомной директивы

добрый день всем! :)
Коллеги, помогите, пожалуйста, с таким вопросом - запрашиваю через $resource ('http://jsonplaceholder.typicode.com/photos') json объект, вывожу в представление список - картинку-миниатюру (свойство thumbnailUrl) и текст (свойство title). Свойство url объекта содержит ссылку на картинку полного размера.
Задача - создать директиву в виде атрибута каждого элемента списка - при нажатии на элемент экран затемняется и показывается по центру эта картинка в полном размере; затем при клике на любом месте экрана картинка пропадает, затемнение убирается.
! ng-click использовать нельзя !
Уперся в стенку внутри директивы... попробовал несколько ваариантов.. не идет :(
[html]<!DOCTYPE html>
<html ng-app='pictures'>
<head>
<title>NG</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular-resource.js"></script>
<script src="app.js"></script>
</head>
<body>

<div class="container">

<div id='pictures-list' ng-controller='PicturesController as pictures'>
<ul class="list-group">
<li class="list-group-item" ng-repeat='pict in pictures.pictures' show-full ng-controller='ShowFullController as showfull'>
<img src='{{pict.thumbnailUrl}}' /> <br> {{pict.title}}
</li>
</ul>
</div>
</div>

</body>
</html>[html]

(function() {
	angular.module('pictures', ['ngResource']);

	angular.module('pictures')
		.controller("PicturesController", ['picturesService', PicturesController]);

		function PicturesController(picturesService) {
			var vm = this;
			vm.pictures = picturesService.query();
		};

	angular.module('pictures')
		.directive('showFull', showFull);

		function showFull() {
			return {
				restrict: 'A',
				controller: function() {
                                    ????????????????????????????????????????????????
				},
				controllerAs: 'showfull'
			};
		};
	
	
	angular.module('pictures')
		.factory("picturesService", ['$resource', picturesService]);

		function picturesService($resource) {
			return $resource('http://jsonplaceholder.typicode.com/photos', {});
		};
})();

Спасибо за помощь!