"use strict";

angular.module('arethusa.core').directive('unusedTokenHighlighter', [
  'state',
  '$parse',
  '$window',
  'translator',
  'StateChangeWatcher',
  function(state, $parse, $window, translator, StateChangeWatcher) {
    return {
      restrict: 'A',
      scope: {
        highlightMode: '@unusedTokenHighlighter',
        style: '=unusedTokenStyle',
        uthCheckProperty: '@'
      },
      link: function(scope, element, attrs) {
        // var unusedTokens;
        var style = scope.style || { "background-color": "rgb(255, 216, 216)" }; // a very light red
        var highlightMode = !!scope.highlightMode;
        scope.s = state;
        scope.total = state.totalTokens;

        var getter = $parse(scope.uthCheckProperty);

        /*
        function checkIfUnused(token, id) {
          if (!getter(token)) {
            scope.unusedCount++;
            unusedTokens[id] = true;
          }
        }
       */

        var callbacks = {
          newMatch: function(token) {
            if (highlightMode) state.addStyle(token.id, style);
          },
          lostMatch: function(token) {
            if (highlightMode) removeStyle(token.id);
          },
          changedCount: function(newCount) {
            scope.unusedCount = newCount;
          }
        };
        var stateChangeWatcher = new StateChangeWatcher(
          scope.uthCheckProperty, getter, callbacks);
        stateChangeWatcher.initCount();

        /*
        function findUnusedTokens() {
          angular.forEach(state.tokens, checkIfUnused);
        }

        function watchChange(newVal, oldVal, event) {
          var id = event.token.id;
          if (newVal) {
            // Check if the token was used before!
            if (!oldVal) {
              scope.unusedCount--;
              delete unusedTokens[id];
              if (highlightMode) removeStyle(id);
            }
          } else {
            scope.unusedCount++;
            unusedTokens[id] = true;
            if (highlightMode) state.addStyle(id, style);
          }

          console.log('Old: ' + scope.unusedCount + ' New: ' + stateChangeWatcher.count);
        }
       */

        // state.watch(scope.uthCheckProperty, watchChange);

        /*
        function init() {
          scope.total = state.totalTokens;
          scope.unusedCount = 0;
          unusedTokens = {};
          findUnusedTokens();
          if (highlightMode) applyHighlighting();
        }
       */

        if (highlightMode) applyHighlighting();

        function applyHighlighting() {
          stateChangeWatcher.applyToMatching(function(id) {
            state.addStyle(id, style);
          });

          /*
          angular.forEach(unusedTokens, function(val, id) {
            state.addStyle(id, style);
          });
         */
        }

        function removeStyle(id) {
          var styles = Object.keys(style);
          state.removeStyle(id, styles);
        }

        function unapplyHighlighting() {
          stateChangeWatcher.applyToMatching(function(id) {
            removeStyle(id);
          });
          /*
          angular.forEach(unusedTokens, function(val, id) {
            removeStyle(id);
          });
         */
        }

        function selectUnusedTokens() {
          unapplyHighlighting();
          // state.multiSelect(Object.keys(unusedTokens));
          state.multiSelect(Object.keys(stateChangeWatcher.matchingTokens));
        }

        element.bind('click', function() {
          scope.$apply(function() {
            if (highlightMode) {
              unapplyHighlighting();
            } else {
              applyHighlighting();
            }
          });
          highlightMode = !highlightMode;
        });

        element.bind('dblclick', function(event) {
          scope.$apply(function() {
            selectUnusedTokens();
          });

          // Trying to prevent the native browser behaviour
          // for dblclicks - they are pretty browser-dependent
          event.preventDefault();
          $window.getSelection().empty();
          return false;
        });

        scope.$watch('s.tokens', function(newVal, oldVal) {
          // init();
          stateChangeWatcher.initCount();
        });

        scope.$on('tokenAdded', function(event, token) {
          /*
          var id = token.id;
          scope.total++;
          checkIfUnused(token, id);
         */
          scope.total++;
          stateChangeWatcher.initCount();
          if (highlightMode) applyHighlighting();
        });

        scope.$on('tokenRemoved', function(event, token) {
          scope.total--;
        });

        scope.tooltip = {};
        translator('uth.tooltip', scope.tooltip, 'text');
      },
      template: '\
      <span\
      tooltip-html-unsafe="{{ tooltip.text }}"\
      tooltip-popup-delay="700"\
      tooltip-placement="left"\
      translate="uth.count"\
      translate-value-count="{{ unusedCount }}"\
      translate-value-total="{{ total }}">\
      '
    };
  }
]);

@@ -447,37 +447,8 @@
 ) %7B%0A
-        // var unusedTokens;%0A
     
@@ -544,16 +544,16 @@
 ght red%0A
+
         
@@ -720,198 +720,8 @@
 );%0A%0A
-        /*%0A        function checkIfUnused(token, id) %7B%0A          if (!getter(token)) %7B%0A            scope.unusedCount++;%0A            unusedTokens%5Bid%5D = true;%0A          %7D%0A        %7D%0A       */%0A%0A
     
@@ -1229,1029 +1229,8 @@
 );%0A%0A
-        /*%0A        function findUnusedTokens() %7B%0A          angular.forEach(state.tokens, checkIfUnused);%0A        %7D%0A%0A        function watchChange(newVal, oldVal, event) %7B%0A          var id = event.token.id;%0A          if (newVal) %7B%0A            // Check if the token was used before!%0A            if (!oldVal) %7B%0A              scope.unusedCount--;%0A              delete unusedTokens%5Bid%5D;%0A              if (highlightMode) removeStyle(id);%0A            %7D%0A          %7D else %7B%0A            scope.unusedCount++;%0A            unusedTokens%5Bid%5D = true;%0A            if (highlightMode) state.addStyle(id, style);%0A          %7D%0A%0A          console.log('Old: ' + scope.unusedCount + ' New: ' + stateChangeWatcher.count);%0A        %7D%0A       */%0A%0A        // state.watch(scope.uthCheckProperty, watchChange);%0A%0A        /*%0A        function init() %7B%0A          scope.total = state.totalTokens;%0A          scope.unusedCount = 0;%0A          unusedTokens = %7B%7D;%0A          findUnusedTokens();%0A          if (highlightMode) applyHighlighting();%0A        %7D%0A       */%0A%0A
     
@@ -1429,147 +1429,8 @@
  %7D);
-%0A%0A          /*%0A          angular.forEach(unusedTokens, function(val, id) %7B%0A            state.addStyle(id, style);%0A          %7D);%0A         */
 %0A   
@@ -1715,136 +1715,8 @@
 %7D);%0A
-          /*%0A          angular.forEach(unusedTokens, function(val, id) %7B%0A            removeStyle(id);%0A          %7D);%0A         */%0A
     
@@ -1799,67 +1799,8 @@
 ();%0A
-          // state.multiSelect(Object.keys(unusedTokens));%0A
     
@@ -2607,29 +2607,8 @@
 ) %7B%0A
-          // init();%0A
     
@@ -2650,32 +2650,32 @@
 );%0A        %7D);%0A%0A
+
         scope.$o
@@ -2719,123 +2719,8 @@
 ) %7B%0A
-          /*%0A          var id = token.id;%0A          scope.total++;%0A          checkIfUnused(token, id);%0A         */%0A
     

Remove unused code