# modules/MiniScoreBoard.js

    import moment from 'moment';
    import query from '../utils/query';
    import mapObject from '../utils/mapObject';
    import addClass from '../utils/addClass';
    import hasClass from '../utils/hasClass';
    import removeClass from '../utils/removeClass';
    import remove from '../utils/remove';
    import dragElement from './dragElement';

    /**
     * MiniScoreBoard
     * @param options {Object}
     * @constructor
     */
    export const MiniScoreBoard = function (options) {
      /**
       * MiniScoreBoard settings
       * @memberOf MiniScoreBoard
       * @constant
       * @type { Object }
       */
      this.settings = {
        lbWidget: null,
        container: null,
        overlayContainer: null,
        infoContainer: null,
        updateInterval: null,
        updateIntervalTime: 1000,
        active: false,
        enableDragging: true,
        dragging: false,
        verticalClass: 'cl-vertical-mini'
      };

      if (typeof options !== 'undefined') {
        for (var opt in options) {
          if (options.hasOwnProperty(opt)) {
            this.settings[opt] = options[opt];
          }
        }
      }

      this.layout = function () {
        var wrapper = document.createElement('div');
        var iconWrapper = document.createElement('div');
        var icon = document.createElement('div');

        var informationWrapper = document.createElement('div');
        var informationTopWrapper = document.createElement('div');
        var informationWrapperClose = document.createElement('div');
        var informationClose = document.createElement('a');

        wrapper.setAttribute('class', 'cl-widget-ms-wrapper');
        iconWrapper.setAttribute('class', 'cl-widget-ms-icon-wrapper');
        icon.setAttribute('class', 'cl-widget-ms-icon');
        informationTopWrapper.setAttribute('class', 'cl-widget-ms-information-top-wrapper');
        informationWrapper.setAttribute('class', 'cl-widget-ms-information-wrapper');
        informationWrapperClose.setAttribute('class', 'cl-widget-ms-information-close-wrapper');
        informationClose.setAttribute('class', 'cl-widget-ms-information-close');

        informationClose.href = 'javascript:void(0);';
        informationClose.innerHTML = 'x';

        this.initialLayoutPosition(wrapper);

        informationWrapperClose.appendChild(informationClose);
        informationWrapper.appendChild(informationWrapperClose);
        informationTopWrapper.appendChild(informationWrapper);
        iconWrapper.appendChild(icon);
        wrapper.appendChild(iconWrapper);
        wrapper.appendChild(informationTopWrapper);

        return wrapper;
      };

      this.initialLayoutPosition = function (wrapper) {
        const _this = this;

        mapObject(_this.settings.lbWidget.settings.layout.miniScoreBoardPosition, function (position, positionKey) {
          if (position !== null) {
            wrapper.style[positionKey] = position;
          }
        });

        if (typeof _this.settings.lbWidget.settings.layout.miniScoreBoardOrientation === 'string') {
          switch (_this.settings.lbWidget.settings.layout.miniScoreBoardOrientation) {
            case 'horizontal':
              break;
            case 'vertical':
              addClass(wrapper, _this.settings.verticalClass);
              break;
            default:
              // default behaviour
          }
        }
      };

      this.overlayLayout = function () {
        var wrapper = document.createElement('div');

        wrapper.setAttribute('class', 'cl-widget-ms-overlay-wrapper');

        return wrapper;
      };

      this.timeManagement = function () {
        var _this = this;
        var diff = 0;
        var label = '&nbsp;';
        var date = '';
        var dateObj = '';
        var inverse = false;

        if (_this.settings.lbWidget.settings.competition.activeContest !== null) {
          var startDate = _this.settings.lbWidget.settings.competition.activeContest.scheduledStart;
          if (typeof _this.settings.lbWidget.settings.competition.activeContest.actualStart !== 'undefined') {
            startDate = _this.settings.lbWidget.settings.competition.activeContest.actualStart;
          }

          diff = moment(startDate).diff(moment());
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.startsIn;
          date = _this.settings.lbWidget.formatDateTime(moment.duration(diff));
          dateObj = _this.settings.lbWidget.formatDateTime(moment.duration(diff));
          inverse = false;

          if (diff <= 0 && _this.settings.lbWidget.settings.competition.activeContest.statusCode === 0) {
            label = _this.settings.lbWidget.settings.translation.miniLeaderboard.starting;
            date = '';
          } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 1) {
            label = _this.settings.lbWidget.settings.translation.miniLeaderboard.starting;
            date = '';
          } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 2) {
            diff = moment(_this.settings.lbWidget.settings.competition.activeContest.scheduledEnd).diff(moment());
            dateObj = _this.settings.lbWidget.formatDateTime(moment.duration(diff));
            label = '&nbsp;';
            date = _this.settings.lbWidget.formatDateTime(moment.duration(diff));
            inverse = true;
          } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 3) {
            label = _this.settings.lbWidget.settings.translation.miniLeaderboard.finishing;
            date = '';
            inverse = true;
          } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode >= 4) {
            label = _this.settings.lbWidget.settings.translation.miniLeaderboard.finished;
            date = '';
            inverse = true;
          }
        }

        return {
          label: label,
          diff: diff,
          date: date,
          dateObj: dateObj,
          inverse: inverse
        };
      };

      this.layoutDefaultOrEmptyEntry = function () {
        var lbResultsMemEntry = document.createElement('div');
        var lbResultsMemLabel = document.createElement('div');
        var lbResultsMemRank = document.createElement('div');
        var lbResultsMemIcon = document.createElement('div');
        var lbResultsMemImg = document.createElement('img');
        var lbResultsMemPoints = document.createElement('div');

        lbResultsMemEntry.setAttribute('class', 'cl-widget-ms-default-mem-entry');
        lbResultsMemLabel.setAttribute('class', 'cl-widget-ms-default-mem-label');
        lbResultsMemRank.setAttribute('class', 'cl-widget-ms-default-mem-rank');
        lbResultsMemIcon.setAttribute('class', 'cl-widget-ms-default-mem-icon');
        lbResultsMemImg.setAttribute('class', 'cl-widget-ms-default-mem-img');
        lbResultsMemImg.style.display = 'none';
        lbResultsMemPoints.setAttribute('class', 'cl-widget-ms-default-mem-points');

        lbResultsMemEntry.appendChild(lbResultsMemLabel);
        lbResultsMemEntry.appendChild(lbResultsMemRank);
        lbResultsMemIcon.appendChild(lbResultsMemImg);
        lbResultsMemEntry.appendChild(lbResultsMemIcon);
        lbResultsMemEntry.appendChild(lbResultsMemPoints);

        return lbResultsMemEntry;
      };

      this.layoutFirstToOrEmptyEntry = function () {
        var lbResultsMemEntry = document.createElement('div');
        var lbResultsMemLabel = document.createElement('div');
        var lbResultsMemRank = document.createElement('div');
        var lbResultsMemIcon = document.createElement('div');
        var lbResultsMemImg = document.createElement('img');
        var lbResultsMemPoints = document.createElement('div');

        lbResultsMemEntry.setAttribute('class', 'cl-widget-ms-first-to-mem-entry');
        lbResultsMemLabel.setAttribute('class', 'cl-widget-ms-first-to-mem-label');
        lbResultsMemRank.setAttribute('class', 'cl-widget-ms-first-to-mem-rank');
        lbResultsMemIcon.setAttribute('class', 'cl-widget-ms-first-to-mem-icon');
        lbResultsMemImg.setAttribute('class', 'cl-widget-ms-first-to-mem-img');
        lbResultsMemImg.style.display = 'none';
        lbResultsMemPoints.setAttribute('class', 'cl-widget-ms-first-to-mem-points');

        lbResultsMemEntry.appendChild(lbResultsMemLabel);
        lbResultsMemEntry.appendChild(lbResultsMemRank);
        lbResultsMemIcon.appendChild(lbResultsMemImg);
        lbResultsMemEntry.appendChild(lbResultsMemIcon);
        lbResultsMemEntry.appendChild(lbResultsMemPoints);

        return lbResultsMemEntry;
      };

      // let testLive = false;
      this.layoutDefaultOrEmpty = function () {
        var _this = this;
        var timeManagement = _this.timeManagement();
        // var diff = timeManagement.diff;
        var label = timeManagement.label;
        var date = timeManagement.date;
        // var dateObj = timeManagement.dateObj;
        var wrapperDomObj = _this.settings.infoContainer;
        var defaultDomObj = query(_this.settings.container, '.cl-widget-ms-default-wrapper');
        var inverse = timeManagement.inverse;

        if (defaultDomObj === null) {
          _this.removeUnusedElements();

          addClass(_this.settings.container, 'cl-ms-default-style');

          var lbWrapper = document.createElement('div');
          var lbDateWrapper = document.createElement('div');
          var lbDateLabel = document.createElement('div');
          var lbDate = document.createElement('div');
          var lbResultsWrapper = document.createElement('div');
          var lbResultsList = document.createElement('div');
          var lbHeaders = document.createElement('div');
          var lbHeadersRank = document.createElement('div');
          var lbHeadersPoints = document.createElement('div');
          var lbResultsMemEntry = _this.layoutDefaultOrEmptyEntry();
          var img = query(lbResultsMemEntry, '.cl-widget-ms-default-mem-img');

          lbWrapper.setAttribute('class', 'cl-widget-ms-default-wrapper');
          lbDateLabel.setAttribute('class', 'cl-widget-ms-default-date-label');
          lbDate.setAttribute('class', 'cl-widget-ms-default-date');
          lbDateWrapper.setAttribute('class', 'cl-widget-ms-default-date-wrapper');
          lbResultsWrapper.setAttribute('class', 'cl-widget-ms-default-results-wrapper');
          lbResultsList.setAttribute('class', 'cl-widget-ms-default-results-list');
          lbHeaders.setAttribute('class', 'cl-widget-ms-default-results-headers');
          lbHeadersRank.setAttribute('class', 'cl-widget-ms-default-results-header-rank');
          lbHeadersPoints.setAttribute('class', 'cl-widget-ms-default-results-header-points');

          lbResultsMemEntry.setAttribute('class', 'cl-widget-ms-default-mem-entry');

          lbDateLabel.innerHTML = label;
          lbDate.innerHTML = date;

          lbDateWrapper.appendChild(lbDateLabel);
          lbDateWrapper.appendChild(lbDate);

          query(lbResultsMemEntry, '.cl-widget-ms-default-mem-rank').innerHTML = '--';
          query(lbResultsMemEntry, '.cl-widget-ms-default-mem-points').innerHTML = '--';

          img.src = '';
          img.alt = '';
          img.style.display = 'block';

          lbHeadersRank.innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.rank;
          lbHeadersPoints.innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.points;

          lbHeaders.appendChild(lbHeadersRank);
          lbHeaders.appendChild(lbHeadersPoints);
          lbResultsList.appendChild(lbResultsMemEntry);
          lbResultsWrapper.appendChild(lbHeaders);
          lbResultsWrapper.appendChild(lbResultsList);

          lbWrapper.appendChild(lbDateWrapper);
          lbWrapper.appendChild(lbResultsWrapper);

          defaultDomObj = wrapperDomObj.appendChild(lbWrapper);

          setTimeout(function () {
            addClass(wrapperDomObj, 'cl-show');
          }, 200);
        } else {
          if (!hasClass(wrapperDomObj, 'cl-show')) {
            addClass(wrapperDomObj, 'cl-show');
          }

          query(_this.settings.container, '.cl-widget-ms-default-results-header-rank').innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.rank;
          query(_this.settings.container, '.cl-widget-ms-default-results-header-points').innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.points;
          query(_this.settings.container, '.cl-widget-ms-default-date-label').innerHTML = label;
          query(_this.settings.container, '.cl-widget-ms-default-date').innerHTML = date;
        }
        addClass(query(_this.settings.container, '.cl-widget-ms-default-date-wrapper'), 'cl-widget-ms-default-date-only');

        mapObject(_this.settings.lbWidget.settings.leaderboard.leaderboardData, function (lbEntry) {
          if ((lbEntry.memberRefId === _this.settings.lbWidget.settings.memberId || lbEntry.memberId === _this.settings.lbWidget.settings.memberId)) {
            var scoreArea = query(defaultDomObj, '.cl-widget-ms-default-results-list');
            scoreArea.innerHTML = '';

            query(_this.settings.container, '.cl-widget-ms-default-date-label').innerHTML = label;
            query(_this.settings.container, '.cl-widget-ms-default-date').innerHTML = date;

            if (_this.settings.lbWidget.settings.leaderboard.miniScoreBoard.enableRankings && typeof lbEntry.rankings !== 'undefined') {
              mapObject(lbEntry.rankings, function (lbRankingEntry) {
                scoreArea.appendChild(_this.layoutDefaultOrEmptySingleRow(lbRankingEntry));
              });
            } else {
              scoreArea.appendChild(_this.layoutDefaultOrEmptySingleRow(lbEntry));
            }

            // testLive = true;

            //  var lastScore = query(_this.settings.container, ".cl-widget-ms-default-last-score").innerHTML,
            //  highScore = query(_this.settings.container, ".cl-widget-ms-default-high-score").innerHTML,
            //  rank = query(_this.settings.container, ".cl-widget-ms-default-rank-value"),
            //  change = (lbEntry.change < 0) ? "down" : ( lbEntry.change > 0 ? "up" : "same" ),
            //  rankValue = lbEntry.rank;
            //
            // if( lastScore !== String(lbEntry.points) && String(lbEntry.points) !== highScore ){
            //  query(_this.settings.container, ".cl-widget-ms-default-last-score").innerHTML = highScore;
            // }
            //
            // query(_this.settings.container, ".cl-widget-ms-default-high-score").innerHTML = lbEntry.points;
            //
            // removeClass(rank, "cl-ms-rank-up");
            // removeClass(rank, "cl-ms-rank-down");
            // removeClass(rank, "cl-ms-rank-same");
            //
            // addClass(rank, "cl-ms-rank-" + change);
            //
            // rank.innerHTML = rankValue;
          }
        });

        if (inverse && !hasClass(defaultDomObj, 'cl-inverse')) {
          addClass(defaultDomObj, 'cl-inverse');
        }
      };

      this.layoutDefaultOrEmptySingleRow = function (lbEntry) {
        var _this = this;
        var icon = _this.settings.lbWidget.populateIdenticonBase64Image(lbEntry.memberId);
        var lbWrapper = _this.layoutDefaultOrEmptyEntry();
        var img = query(lbWrapper, '.cl-widget-ms-default-mem-img');
        var selfMember = ((lbEntry.memberRefId === _this.settings.lbWidget.settings.memberId || lbEntry.memberId === _this.settings.lbWidget.settings.memberId));
        var formattedPoints = _this.settings.lbWidget.settings.leaderboard.pointsFormatter(lbEntry.points);

        img.src = icon;
        img.alt = '';
        img.style.display = 'block';

        if (selfMember) {
          addClass(lbWrapper, 'cl-widget-ms-default-mem-self');
        }

        query(lbWrapper, '.cl-widget-ms-default-mem-label').innerHTML = selfMember ? _this.settings.lbWidget.settings.translation.leaderboard.you : '';
        query(lbWrapper, '.cl-widget-ms-default-mem-rank').innerHTML = "<span class='cl-mem-rank-label'>" + _this.settings.lbWidget.settings.translation.leaderboard.rank + "</span><span class='cl-mem-rank'>" + lbEntry.rank + '</span>';
        query(lbWrapper, '.cl-widget-ms-default-mem-points').innerHTML = "<span class='cl-mem-points-label'>" + _this.settings.lbWidget.settings.translation.leaderboard.points + "</span><span class='cl-mem-points'>" + formattedPoints + '</span>';

        return lbWrapper;
      };

      this.layoutFirstToOrEmpty = function (strategy) {
        var _this = this;
        var timeManagement = _this.timeManagement();
        // var diff = timeManagement.diff;
        var label = timeManagement.label;
        var date = timeManagement.date;
        var wrapperDomObj = _this.settings.infoContainer;
        var defaultDomObj = query(_this.settings.container, '.cl-widget-ms-first-to-wrapper');
        var inverse = timeManagement.inverse;

        if (defaultDomObj === null) {
          _this.removeUnusedElements();

          addClass(_this.settings.container, 'cl-ms-first-to-style');

          var lbWrapper = document.createElement('div');
          var lbDateWrapper = document.createElement('div');
          var lbDateLabel = document.createElement('div');
          var lbDate = document.createElement('div');
          var lbResultsWrapper = document.createElement('div');
          var lbResultsList = document.createElement('div');
          var lbHeaders = document.createElement('div');
          var lbHeadersRank = document.createElement('div');
          var lbHeadersPoints = document.createElement('div');
          var lbResultsMemEntry = _this.layoutFirstToOrEmptyEntry();
          var img = query(lbResultsMemEntry, '.cl-widget-ms-first-to-mem-img');

          lbWrapper.setAttribute('class', 'cl-widget-ms-first-to-wrapper');
          lbDateLabel.setAttribute('class', 'cl-widget-ms-first-to-date-label');
          lbDate.setAttribute('class', 'cl-widget-ms-first-to-date');
          lbDateWrapper.setAttribute('class', 'cl-widget-ms-first-to-date-wrapper');
          lbResultsWrapper.setAttribute('class', 'cl-widget-ms-first-to-results-wrapper');
          lbResultsList.setAttribute('class', 'cl-widget-ms-first-to-results-list');
          lbHeaders.setAttribute('class', 'cl-widget-ms-first-to-results-headers');
          lbHeadersRank.setAttribute('class', 'cl-widget-ms-first-to-results-header-rank');
          lbHeadersPoints.setAttribute('class', 'cl-widget-ms-first-to-results-header-points');

          lbResultsMemEntry.setAttribute('class', 'cl-widget-ms-first-to-mem-entry');

          // lbDateLabel.innerHTML = label;
          lbDate.innerHTML = label;

          lbDateWrapper.appendChild(lbDateLabel);
          lbDateWrapper.appendChild(lbDate);

          query(lbResultsMemEntry, '.cl-widget-ms-first-to-mem-rank').innerHTML = '--';
          query(lbResultsMemEntry, '.cl-widget-ms-first-to-mem-points').innerHTML = '--/' + strategy.recordTimeWhenSumReaches;

          img.src = '';
          img.alt = '';
          img.style.display = 'block';

          lbHeadersRank.innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.rank;
          lbHeadersPoints.innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.points;

          lbHeaders.appendChild(lbHeadersRank);
          lbHeaders.appendChild(lbHeadersPoints);
          lbResultsList.appendChild(lbResultsMemEntry);
          lbResultsWrapper.appendChild(lbHeaders);
          lbResultsWrapper.appendChild(lbResultsList);

          lbWrapper.appendChild(lbDateWrapper);
          lbWrapper.appendChild(lbResultsWrapper);

          defaultDomObj = wrapperDomObj.appendChild(lbWrapper);

          setTimeout(function () {
            addClass(wrapperDomObj, 'cl-show');
          }, 200);
        } else {
          if (!hasClass(wrapperDomObj, 'cl-show')) {
            addClass(wrapperDomObj, 'cl-show');
          }

          query(_this.settings.container, '.cl-widget-ms-first-to-results-header-rank').innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.rank;
          query(_this.settings.container, '.cl-widget-ms-first-to-results-header-points').innerHTML = _this.settings.lbWidget.settings.translation.leaderboard.points;
          query(_this.settings.container, '.cl-widget-ms-first-to-date-label').innerHTML = label;
          query(_this.settings.container, '.cl-widget-ms-first-to-date').innerHTML = date;
        }

        addClass(query(_this.settings.container, '.cl-widget-ms-first-to-date-wrapper'), 'cl-widget-ms-first-to-date-only');

        mapObject(_this.settings.lbWidget.settings.leaderboard.leaderboardData, function (lbEntry) {
          if ((lbEntry.memberRefId === _this.settings.lbWidget.settings.memberId || lbEntry.memberId === _this.settings.lbWidget.settings.memberId)) {
            var scoreArea = query(defaultDomObj, '.cl-widget-ms-first-to-results-list');
            scoreArea.innerHTML = '';

            if (_this.settings.lbWidget.settings.leaderboard.miniScoreBoard.enableRankings && typeof lbEntry.rankings !== 'undefined') {
              mapObject(lbEntry.rankings, function (lbRankingEntry) {
                scoreArea.appendChild(_this.layoutFirstToOrEmptySingleRow(lbRankingEntry, strategy));
              });
            } else {
              scoreArea.appendChild(_this.layoutFirstToOrEmptySingleRow(lbEntry, strategy));
            }
          }
        });

        if (inverse && !hasClass(defaultDomObj, 'cl-inverse')) {
          addClass(defaultDomObj, 'cl-inverse');
        }
      };

      this.layoutFirstToOrEmptySingleRow = function (lbEntry, strategy) {
        var _this = this;
        var icon = _this.settings.lbWidget.populateIdenticonBase64Image(lbEntry.memberId);
        var lbWrapper = _this.layoutFirstToOrEmptyEntry();
        var img = query(lbWrapper, '.cl-widget-ms-first-to-mem-img');
        var selfMember = ((lbEntry.memberRefId === _this.settings.lbWidget.settings.memberId || lbEntry.memberId === _this.settings.lbWidget.settings.memberId));
        var formattedPoints = _this.settings.lbWidget.settings.leaderboard.pointsFormatter(lbEntry.points);

        if (selfMember) {
          addClass(lbWrapper, 'cl-widget-ms-first-to-mem-self');
        }

        img.src = icon;
        img.alt = '';
        img.style.display = 'block';

        query(lbWrapper, '.cl-widget-ms-first-to-mem-label').innerHTML = selfMember ? _this.settings.lbWidget.settings.translation.leaderboard.you : '';
        query(lbWrapper, '.cl-widget-ms-first-to-mem-rank').innerHTML = "<span class='cl-mem-rank-label'>" + _this.settings.lbWidget.settings.translation.leaderboard.rank + "</span><span class='cl-mem-rank'>" + lbEntry.rank + '</span>';
        query(lbWrapper, '.cl-widget-ms-first-to-mem-points').innerHTML = "<span class='cl-mem-points-label'>" + _this.settings.lbWidget.settings.translation.leaderboard.points + "</span><span class='cl-mem-points'>" + formattedPoints + '/' + strategy.recordTimeWhenSumReaches + '</span>';

        return lbWrapper;
      };

      this.layoutSumBestOf = function () {
        var _this = this;
        var timeManagement = _this.timeManagement();
        // var diff = timeManagement.diff;
        var label = timeManagement.label;
        var date = timeManagement.date;
        var wrapperDomObj = _this.settings.infoContainer;
        var sumBestDomObj = query(_this.settings.container, '.cl-widget-ms-sum-best-wrapper');
        var inverse = timeManagement.inverse;

        if (sumBestDomObj === null) {
          _this.removeUnusedElements();

          var lbWrapper = document.createElement('div');
          var lbDateWrapper = document.createElement('div');
          var lbDateLabel = document.createElement('div');
          var lbDate = document.createElement('div');
          var lbResultsWrapper = document.createElement('div');
          var lbResultsScoreArea = document.createElement('div');
          var lbResultsScoreAreaHigh = document.createElement('div');
          var lbResultsScoreAreaHighLabel = document.createElement('div');
          var lbResultsScoreAreaHighScore = document.createElement('div');
          var lbResultsScoreAreaLast = document.createElement('div');
          var lbResultsScoreAreaLastLabel = document.createElement('div');
          var lbResultsScoreAreaLastScore = document.createElement('div');
          var lbResultsRankArea = document.createElement('div');
          var lbResultsRankValue = document.createElement('span');

          lbWrapper.setAttribute('class', 'cl-widget-ms-sum-best-wrapper');
          lbDateLabel.setAttribute('class', 'cl-widget-ms-sum-best-date-label');
          lbDate.setAttribute('class', 'cl-widget-ms-sum-best-date');
          lbDateWrapper.setAttribute('class', 'cl-widget-ms-sum-best-date-wrapper');
          lbResultsWrapper.setAttribute('class', 'cl-widget-ms-sum-best-results-wrapper');

          lbResultsScoreArea.setAttribute('class', 'cl-widget-ms-sum-best-area');
          lbResultsScoreAreaHigh.setAttribute('class', 'cl-widget-ms-sum-best-high-area');
          lbResultsScoreAreaHighLabel.setAttribute('class', 'cl-widget-ms-sum-best-high-label');
          lbResultsScoreAreaHighScore.setAttribute('class', 'cl-widget-ms-sum-best-high-score');

          lbResultsScoreAreaLast.setAttribute('class', 'cl-widget-ms-sum-best-last-area');
          lbResultsScoreAreaLastLabel.setAttribute('class', 'cl-widget-ms-sum-best-last-label');
          lbResultsScoreAreaLastScore.setAttribute('class', 'cl-widget-ms-sum-best-last-score');

          lbResultsRankArea.setAttribute('class', 'cl-widget-ms-sum-best-rank-area');
          lbResultsRankValue.setAttribute('class', 'cl-widget-ms-sum-best-rank-value');

          lbDateLabel.innerHTML = (date.length > 0) ? date : label;
          lbDate.innerHTML = (date.length > 0) ? _this.settings.lbWidget.settings.translation.miniLeaderboard.rank : '';

          lbResultsScoreAreaHighLabel.innerHTML = _this.settings.lbWidget.settings.translation.miniLeaderboard.highScore;
          lbResultsScoreAreaHighScore.innerHTML = '--';
          lbResultsScoreAreaHigh.appendChild(lbResultsScoreAreaHighLabel);
          lbResultsScoreAreaHigh.appendChild(lbResultsScoreAreaHighScore);
          lbResultsScoreArea.appendChild(lbResultsScoreAreaHigh);

          lbResultsScoreAreaLastLabel.innerHTML = _this.settings.lbWidget.settings.translation.miniLeaderboard.lastScore;
          lbResultsScoreAreaLastScore.innerHTML = '--';
          lbResultsScoreAreaLast.appendChild(lbResultsScoreAreaLastLabel);
          lbResultsScoreAreaLast.appendChild(lbResultsScoreAreaLastScore);
          lbResultsScoreArea.appendChild(lbResultsScoreAreaLast);

          lbResultsRankValue.innerHTML = '--';
          lbResultsRankArea.appendChild(lbResultsRankValue);

          lbResultsWrapper.appendChild(lbResultsScoreArea);
          lbResultsWrapper.appendChild(lbResultsRankArea);

          lbDateWrapper.appendChild(lbDateLabel);
          lbDateWrapper.appendChild(lbDate);

          lbWrapper.appendChild(lbDateWrapper);
          lbWrapper.appendChild(lbResultsWrapper);

          sumBestDomObj = wrapperDomObj.appendChild(lbWrapper);

          setTimeout(function () {
            addClass(wrapperDomObj, 'cl-show');
          }, 200);
        } else {
          if (!hasClass(wrapperDomObj, 'cl-show')) {
            addClass(wrapperDomObj, 'cl-show');
          }
          query(_this.settings.container, '.cl-widget-ms-sum-best-high-label').innerHTML = _this.settings.lbWidget.settings.translation.miniLeaderboard.highScore;
          query(_this.settings.container, '.cl-widget-ms-sum-best-last-label').innerHTML = _this.settings.lbWidget.settings.translation.miniLeaderboard.lastScore;
          query(_this.settings.container, '.cl-widget-ms-sum-best-date-label').innerHTML = (date.length > 0) ? date : label;
          query(_this.settings.container, '.cl-widget-ms-sum-best-date').innerHTML = (date.length > 0) ? _this.settings.lbWidget.settings.translation.miniLeaderboard.rank : '';
        }

        mapObject(_this.settings.lbWidget.settings.leaderboard.leaderboardData, function (lbEntry) {
          if (lbEntry.memberRefId === _this.settings.lbWidget.settings.memberId || lbEntry.memberId === _this.settings.lbWidget.settings.memberId) {
            var lastScore = query(_this.settings.container, '.cl-widget-ms-sum-best-last-score').innerHTML;
            var highScore = query(_this.settings.container, '.cl-widget-ms-sum-best-high-score').innerHTML;
            var rank = query(_this.settings.container, '.cl-widget-ms-sum-best-rank-value');
            var change = (lbEntry.change < 0) ? 'down' : (lbEntry.change > 0 ? 'up' : 'same');
            var rankValue = lbEntry.rank;
            var formattedPoints = _this.settings.lbWidget.settings.leaderboard.pointsFormatter(lbEntry.points);

            if (lastScore !== String(lbEntry.points) && String(lbEntry.points) !== highScore) {
              query(_this.settings.container, '.cl-widget-ms-sum-best-last-score').innerHTML = highScore;
            }

            query(_this.settings.container, '.cl-widget-ms-sum-best-high-score').innerHTML = formattedPoints;

            removeClass(rank, 'cl-ms-rank-up');
            removeClass(rank, 'cl-ms-rank-down');
            removeClass(rank, 'cl-ms-rank-same');

            addClass(rank, 'cl-ms-rank-' + change);

            rank.innerHTML = rankValue;
          }
        });

        if (inverse && !hasClass(sumBestDomObj, 'cl-inverse')) {
          addClass(sumBestDomObj, 'cl-inverse');
        }
      };

      this.layoutRequiresOptIn = function () {
        var _this = this;
        var startDate = _this.settings.lbWidget.settings.competition.activeContest.scheduledStart;
        if (typeof _this.settings.lbWidget.settings.competition.activeContest.actualStart !== 'undefined') {
          startDate = _this.settings.lbWidget.settings.competition.activeContest.actualStart;
        }
        var diff = moment(startDate).diff(moment());
        var label = _this.settings.lbWidget.settings.translation.miniLeaderboard.startsIn;
        var wrapperDomObj = _this.settings.infoContainer;
        var date = _this.settings.lbWidget.formatDateTime(moment.duration(diff));

        if (diff <= 0 && _this.settings.lbWidget.settings.competition.activeContest.statusCode === 0) {
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.starting;
          date = '';
        } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 1) {
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.starting;
          date = '';
        } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 2) {
          diff = moment(_this.settings.lbWidget.settings.competition.activeContest.scheduledEnd).diff(moment());
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.started;
          date = _this.settings.lbWidget.formatDateTime(moment.duration(diff));

          if (diff <= 0) {
            label = _this.settings.lbWidget.settings.translation.tournaments.finishing;
            date = '';
          }
        } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode === 3) {
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.finishing;
          date = '';
        } else if (_this.settings.lbWidget.settings.competition.activeContest.statusCode >= 4) {
          label = _this.settings.lbWidget.settings.translation.miniLeaderboard.finished;
          date = '';
        }

        if (query(_this.settings.container, '.cl-widget-ms-optin-wrapper') === null) {
          _this.removeUnusedElements();

          var optInWrapper = document.createElement('div');
          var optInDateWrapper = document.createElement('div');
          var optInDateLabel = document.createElement('div');
          var optInDate = document.createElement('div');
          var optInDateActionWrapper = document.createElement('div');
          var optInDateAction = document.createElement('a');

          optInWrapper.setAttribute('class', 'cl-widget-ms-optin-wrapper');
          optInDateLabel.setAttribute('class', 'cl-widget-ms-optin-date-label');
          optInDate.setAttribute('class', 'cl-widget-ms-optin-date');
          optInDateWrapper.setAttribute('class', 'cl-widget-ms-optin-date-wrapper');
          optInDateActionWrapper.setAttribute('class', 'cl-widget-ms-optin-action-wrapper');
          optInDateAction.setAttribute('class', 'cl-widget-ms-optin-action');

          optInDateLabel.innerHTML = label;
          optInDate.innerHTML = date;
          optInDateAction.innerHTML = _this.settings.lbWidget.settings.translation.tournaments.enter;

          optInDateWrapper.appendChild(optInDateLabel);
          optInDateWrapper.appendChild(optInDate);

          optInDateActionWrapper.appendChild(optInDateAction);
          optInWrapper.appendChild(optInDateWrapper);
          optInWrapper.appendChild(optInDateActionWrapper);

          wrapperDomObj.appendChild(optInWrapper);

          setTimeout(function () {
            addClass(wrapperDomObj, 'cl-show');
          }, 200);
        } else {
          if (!hasClass(wrapperDomObj, 'cl-show')) {
            addClass(wrapperDomObj, 'cl-show');
          }
          query(_this.settings.container, '.cl-widget-ms-optin-action').innerHTML = _this.settings.lbWidget.settings.translation.tournaments.enter;
          query(_this.settings.container, '.cl-widget-ms-optin-date-label').innerHTML = label;
          query(_this.settings.container, '.cl-widget-ms-optin-date').innerHTML = date;
        }
      };

      this.removeUnusedElements = function () {
        var _this = this;
        var defaultLayoutWrapperDomObj = query(_this.settings.container, '.cl-widget-ms-default-wrapper');
        var optInWrapperDomObj = query(_this.settings.container, '.cl-widget-ms-optin-wrapper');
        var sumBestDomObj = query(_this.settings.container, '.cl-widget-ms-sum-best-wrapper');
        var firstToDomObj = query(_this.settings.container, '.cl-widget-ms-first-to-wrapper');

        removeClass(_this.settings.container, 'cl-ms-default-style');
        removeClass(_this.settings.container, 'cl-ms-optin-style');
        removeClass(_this.settings.container, 'cl-ms-sum-best-style');
        removeClass(_this.settings.container, 'cl-ms-first-to-style');

        if (defaultLayoutWrapperDomObj !== null) {
          remove(defaultLayoutWrapperDomObj);
        }

        if (optInWrapperDomObj !== null) {
          remove(optInWrapperDomObj);
        }

        if (sumBestDomObj !== null) {
          remove(sumBestDomObj);
        }

        if (firstToDomObj !== null) {
          remove(firstToDomObj);
        }
      };

      this.clearAll = function () {
        var _this = this;

        if (_this.settings.updateInterval) {
          clearTimeout(_this.settings.updateInterval);
        }

        _this.removeInfoArea();

        _this.settings.active = false;
      };

      var removeInfoAreaInterval;
      this.removeInfoArea = function () {
        var _this = this;
        var wrapperDomObj = query(_this.settings.container, '.cl-show');
        var layout = query(_this.settings.container, '.cl-widget-ms-default-wrapper');

        if (wrapperDomObj !== null) removeClass(wrapperDomObj, 'cl-show');

        if (layout !== null) {
          if (removeInfoAreaInterval) {
            clearTimeout(removeInfoAreaInterval);
          }
          removeInfoAreaInterval = setTimeout(function () {
            remove(layout);
          }, 200);
        }
      };

      this.updateScoreBoard = function () {
        var _this = this;

        if (_this.settings.updateInterval) {
          clearTimeout(_this.settings.updateInterval);
        }

        _this.settings.updateInterval = setTimeout(function () {
          _this.loadInfoArea(function () {
            _this.updateScoreBoard();
          });
        }, _this.settings.updateIntervalTime);
      };

      this.loadInfoArea = function (callback) {
        var _this = this;

        if (_this.settings.active && _this.settings.lbWidget.settings.competition.activeCompetition !== null && _this.settings.lbWidget.settings.competition.activeCompetition.statusCode < 7) {
          if (typeof _this.settings.lbWidget.settings.competition.activeCompetition.optinRequired === 'boolean' && _this.settings.lbWidget.settings.competition.activeCompetition.optinRequired && typeof _this.settings.lbWidget.settings.competition.activeCompetition.optin === 'boolean' && !_this.settings.lbWidget.settings.competition.activeCompetition.optin) {
            _this.layoutRequiresOptIn();
            callback();
          } else if (_this.settings.lbWidget.settings.competition.activeContest !== null && _this.settings.lbWidget.settings.competition.activeContest.strategy.type === 'SumBest') {
            _this.layoutSumBestOf();
            callback();
          } else if (_this.settings.lbWidget.settings.competition.activeContest !== null && _this.settings.lbWidget.settings.competition.activeContest.strategy.type === 'FirstTo') {
            _this.layoutFirstToOrEmpty(_this.settings.lbWidget.settings.competition.activeContest.strategy);
            callback();
          } else if (_this.settings.lbWidget.settings.competition.activeContestId !== null) {
            _this.layoutDefaultOrEmpty();
            callback();
          } else {
            _this.layoutDefaultOrEmpty();
          }
        } else {
          _this.clearAll();
        }
      };

      this.eventListeners = function () {
        var _this = this;

        if (_this.settings.lbWidget.settings.layout.enableMiniScoreBoardDragging) {
          dragElement(_this.settings.container, query(_this.settings.container, '.cl-widget-ms-icon'), _this.settings.overlayContainer, _this.settings.lbWidget.settings.bindContainer, function (newTop, newLeft) {
            _this.settings.lbWidget.stopActivity();

            if (_this.settings.lbWidget.settings.layout.allowOrientationChange) {
              if (newTop <= 5) {
                addClass(_this.settings.container, _this.settings.verticalClass);
              } else if (newLeft <= 5) {
                removeClass(_this.settings.container, _this.settings.verticalClass);
              }
            }
            _this.settings.dragging = true;
          }, function () {
            _this.settings.lbWidget.restartActivity();
            setTimeout(function () {
              _this.settings.dragging = false;
            }, 200);
          }, function () {
            _this.settings.lbWidget.clickedMiniScoreBoard();
          });
        }
      };

      this.initLayout = function (callback) {
        var _this = this;

        if (_this.settings.container === null) {
          _this.settings.active = true;
          _this.settings.container = _this.settings.lbWidget.settings.bindContainer.appendChild(_this.layout());
          _this.settings.overlayContainer = _this.settings.lbWidget.settings.bindContainer.appendChild(_this.overlayLayout());
          _this.settings.infoContainer = query(_this.settings.container, '.cl-widget-ms-information-wrapper');

          _this.eventListeners();
        }

        if (typeof callback === 'function') {
          callback();
        }
      };

      this.loadScoreBoard = function () {
        var _this = this;

        _this.initLayout(function () {
          _this.loadInfoArea(function () {
            _this.updateScoreBoard();
          });

          setTimeout(function () {
            _this.updateScoreBoard();
          }, 1000);
        });
      };
    };