"use strict";
angular.module("dialHorseshoeAppHistoric", ["ngAnimate", "ngAria", "ngCookies", "ngResource", "ngRoute", "ngSanitize", "ngTouch"]).config(["$routeProvider", function(a) {
    a.when("/", {
        templateUrl: "views/main.html",
        controller: "MainCtrlAppHist",
        controllerAs: "main"
    }).otherwise({
        redirectTo: "/"
    })
}]), angular.module("dialHorseshoeAppHistoric").controller("MainCtrlAppHist", ["$scope", "$timeout", "$http", function(a, b, c) {
    a.dails = null, c.get("/cstatic/static/general-election/dail-historic/dail_members_historic.json").success(function(b) {
        a.dails = b
    }), a.currentImage = 0, a.sliderValue = a.currentImage, a.fadeTimeout = 500, a.getMainCtrlScope = function() {
        return a
    }, a.updateSlider = function(b) {
        b = parseInt(b), b !== a.currentImage && a.updateImage(b)
    }, a.updateImage = function(b) {
        parseInt(b) < 0 || parseInt(b) >= a.dails.length || parseInt(b) !== a.currentImage && a.fadeOutImage(b)
    }, a.fadeOutImage = function(c) {
        a.startFadeIn = !1, a.startFadeOut = !0, b(function() {
            a.currentImage = parseInt(c)
        }, a.fadeTimeout)
    }, a.fadeInImage = function() {
        a.startFadeOut = !1, a.startFadeIn = !0
    }
}]).directive("resize", ["$window", function(a) {
    return function(b) {
        var c = angular.element(a);
        b.$watch(function() {
            b.windowWidth = c.width(), b.windowWidth < 767 ? (b.showMobile || (b.sliderValue = b.currentImage - 22), b.showMobile = !0) : b.showMobile = !1
        }, !0), c.bind("resize", function() {
            b.$apply()
        })
    }
}]), angular.module("dialHorseshoeAppHistoric").run(["$templateCache", function(a) {
    a.put("views/main.html", '<div class="dail_horseshoe_historic">  <h1 class="georgia-font">{{dails[currentImage].name}}</h1> <p>{{dails[currentImage].startDate}} - {{dails[currentImage].endDate}} </p> <div class="horseshoe-img-container" ng-swipe-left="imageButtonPress(1)" ng-swipe-right="imageButtonPress(-1)"> <img ng-src="/cstatic/static/general-election/dail-historic/images/dails/dail-{{dails[currentImage].dailNumber}}.png" class="dail_image" ng-class="{fadeOut: startFadeOut, fadeIn: startFadeIn}" id="dail_image_historic"> <table class="horseshoe-img-container-row"> <tr> <td ng-show="showMobile && sliderValue > 0" id="prev-image"><img src="/cstatic/static/general-election/dail-historic/images/slider-arrow-left.png" class="image-arrow" resize></td> <td ng-show="showMobile && sliderValue < dails.length - 1" id="next-image"><img src="/cstatic/static/general-election/dail-historic/images/slider-arrow-right.png" class="image-arrow"></td> </tr> </table> </div> <!-- The ng-hide directive hides the year selector buttons on mobile as they are too wide --> <div class="navbar navbar-default" role="navigation" id="years-selector" ng-hide="showMobile" resize> <div class="navbar-collapse" id="years-navbar-collapse"> <ul class="nav navbar-nav"> <li ng-repeat="dail in dails" ng-click="getMainCtrlScope().updateImage(dail.slideNumber)" data-toggle="collapse" data-target=".in" class="year_button" ng-class="{\'active\': dail.slideNumber == currentImage}"> <a href="">{{dail.year}}</a> </li> </ul> </div> </div> <div ng-show="showMobile" resize class="mobile-slider"> <input type="range" min="0" max="{{dails.length - 1}}" step="1" title="year-slider" ng-model="sliderValue" id="mobile-slider-input"> <div class="slider-markers"> <!--Table to show the year markers under the slider--> <table> <tr> <td ng-repeat="year in dails" ng-if="!$last"></td> </tr> </table> </div> <table class="slider-marker"> <tr> <td class="slider-marker left"><i>2016<br>32nd Dáil</i></td> <td class="slider-marker right"><i>1981<br>22nd Dáil</i></td> </tr> </table> </div> </div> <div class="percentage-votes-table"> <strong style="margin-top: 12px">% 1st preference vote:</strong> <table> <tr> <td ng-repeat="party in dails[currentImage].parties" ng-style="{\'background-color\': party.colour, \'width\': \'\' + party.firstPreference + \'%\'}"> </td> </tr> </table> <div class="dail-legend"> <div ng-repeat="party in dails[currentImage].parties" class="col-xs-12 col-sm-6 col-md-4 .col-lg-4"> <div class="first-pref"> <div class="percentage-identifier" ng-style="{\'background-color\': party.colour}"></div>&nbsp;{{party.name}}: {{party.firstPreference | number:1}}% </div> </div> </div> </div> <script>$(\'#years-navbar-collapse\').on(\'click touchstart\',function() {\n    $(\'#dail_image_historic\').on("load", function() {\n      var scope = angular.element($(\'.dail_horseshoe_historic\')).scope();\n      scope.$apply(function() {\n        scope.fadeInImage();\n      });\n    });\n' + "  });</script> <script>$('#mobile-slider-input').on('change', function() {\n    var scope = angular.element($('.dail_horseshoe_historic')).scope();\n    scope.updateSlider(scope.sliderValue);\n\n    $('#dail_image_historic').on(\"load\", function() {\n      var scope = angular.element($('.dail_horseshoe_historic')).scope();\n      scope.$apply(function() {\n        scope.fadeInImage();\n      });\n    });\n  });</script> <script>$('#prev-image').click(function() {\n    imageButtonPress(-1)\n  });\n\n  $('#next-image').click(function() {\n    imageButtonPress(1)\n  });\n\n  var swipeElement = $('.horseshoe-img-container');\n\n  swipeElement.on(\"swipeleft\", function(event) {\n    imageButtonPress(1)\n  });\n\n  swipeElement.on(\"swiperight\", function(event) {\n    imageButtonPress(-1)\n  });\n\n  var imageButtonPress = function(next) {\n    var scope = angular.element($('.dail_horseshoe_historic')).scope();\n    var slider = $('#mobile-slider-input');\n    var sliderVal = parseInt(slider.val());\n\n    slider.val(sliderVal + next);\n    slider.trigger('change');\n    scope.updateSlider(scope.sliderValue);\n  }</script>")
}]);