 #= require ./../../vendor/jquery.lazyload/jquery.lazyload
 
 #= require ./../services/quickview
+#= require ./../services/url
+#= require ./../services/notifier
 
 #= require ./../directives/inlineuser
 #= require ./../directives/inlineplunk

  """
  link: ($scope, $el, attrs) ->
    $scope.visitor = visitor
    
    $scope.$watch "plunk.updated_at", ->
      $timeout -> $("abbr.timeago", $el).timeago()

  "plunker.quickview"
  "plunker.plunkinfo"
  "plunker.taglist"
  "plunker.url"
  "ui.bootstrap"
]

module.directive "plunkerCard", [ "$timeout", "$compile", "quickview", "visitor", "url", "notifier", ($timeout, $compile, quickview, visitor, url, notifier) ->
  restrict: "EAC"
  scope:
    plunk: "="
  template: """
    <div class="plunk" ng-show="plunk.id" ng-class="{starred: plunk.thumbed, owned: plunk.token}">
      <div class="card">
        <ul class="operations">
          <li><a class="btn" title="Edit this Plunk" ng-href="/edit/{{plunk.id}}"><i class="icon-edit"></i></a></li>
          <li><a class="btn" title="View this Plunk in an overlay" ng-click="showQuickView(plunk, $event)"><i class="icon-play"></i></a></li>
          <li><a class="btn" title="View the detailed information about this Plunk" ng-href="/{{plunk.id}}"><i class="icon-info-sign"></i></a></li>
          <li><a class="btn" title="Open the embedded view of this Plunk" ng-href="{{url.embed}}/{{plunk.id}}/" target="_blank"><i class="icon-external-link"></i></a></li>
          <li ng-show="plunk.isWritable()"><a class="btn btn-danger" title="Delete this plunk" ng-click="confirmDelete(plunk)"><i class="icon-trash"></i></a></li>
          <li ng-show="visitor.logged_in && plunk.thumbed"><button title="Unstar this Plunk" class="btn starred" ng-click="plunk.star()"><i class="icon-star"></i></button></li>
          <li ng-show="visitor.logged_in && !plunk.thumbed"><button title="Star this Plunk" class="btn" ng-click="plunk.star()"><i class="icon-star"></i></button></li>
        </ul>
