/**
 * @license
 * Copyright (C) 2016 The Android Open Source Project
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
(function() {
  'use strict';

  const ERR_COMMENT_ON_EDIT = 'You cannot comment on an edit.';
  const ERR_COMMENT_ON_EDIT_BASE = 'You cannot comment on the base patch set ' +
      'of an edit.';
  const ERR_INVALID_LINE = 'Invalid line number: ';

  const NO_NEWLINE_BASE = 'No newline at end of base file.';
  const NO_NEWLINE_REVISION = 'No newline at end of revision file.';

  const DiffViewMode = {
    SIDE_BY_SIDE: 'SIDE_BY_SIDE',
    UNIFIED: 'UNIFIED_DIFF',
  };

  const DiffSide = {
    LEFT: 'left',
    RIGHT: 'right',
  };

  const LARGE_DIFF_THRESHOLD_LINES = 10000;
  const FULL_CONTEXT = -1;
  const LIMITED_CONTEXT = 10;

  /**
   * Compare two ranges. Either argument may be falsy, but will only return
   * true if both are falsy or if neither are falsy and have the same position
   * values.
   *
   * @param {Gerrit.Range=} a range 1
   * @param {Gerrit.Range=} b range 2
   * @return {boolean}
   */
  Gerrit.rangesEqual = function(a, b) {
    if (!a && !b) { return true; }
    if (!a || !b) { return false; }
    return a.start_line === b.start_line &&
        a.start_character === b.start_character &&
        a.end_line === b.end_line &&
        a.end_character === b.end_character;
  };

  function isThreadEl(node) {
    return node.nodeType === Node.ELEMENT_NODE &&
        node.classList.contains('comment-thread');
  }

  /**
   * Turn a slot element into the corresponding content element.
   * Slots are only fully supported in Polymer 2 - in Polymer 1, they are
   * replaced with content elements during template parsing. This conversion is
   * not applied for imperatively created slot elements, so this method
   * implements the same behavior as the template parsing for imperative slots.
   */
  Gerrit.slotToContent = function(slot) {
    if (Polymer.Element) {
      return slot;
    }
    const content = document.createElement('content');
    content.name = slot.name;
    content.setAttribute('select', `[slot='${slot.name}']`);
    return content;
  };

  const COMMIT_MSG_PATH = '/COMMIT_MSG';
  /**
   * 72 is the inofficial length standard for git commit messages.
   * Derived from the fact that git log/show appends 4 ws in the beginning of
   * each line when displaying commit messages. To center the commit message
   * in an 80 char terminal a 4 ws border is added to the rightmost side:
   * 4 + 72 + 4
   */
  const COMMIT_MSG_LINE_LENGTH = 72;

  const RENDER_DIFF_TABLE_DEBOUNCE_NAME = 'renderDiffTable';

  /**
   * @appliesMixin Gerrit.FireMixin
   * @appliesMixin Gerrit.PatchSetMixin
   * @extends Polymer.Element
   */
  class GrDiff extends Polymer.mixinBehaviors( [
    Gerrit.FireBehavior,
    Gerrit.PatchSetBehavior,
  ], Polymer.GestureEventListeners(
      Polymer.LegacyElementMixin(
          Polymer.Element))) {
    static get is() { return 'gr-diff'; }
    /**
     * Fired when the user selects a line.
     *
     * @event line-selected
     */

    /**
     * Fired if being logged in is required.
     *
     * @event show-auth-required
     */

    /**
     * Fired when a comment is created
     *
     * @event create-comment
     */

    /**
     * Fired when rendering, including syntax highlighting, is done. Also fired
     * when no rendering can be done because required preferences are not set.
     *
     * @event render
     */

    /**
     * Fired for interaction reporting when a diff context is expanded.
     * Contains an event.detail with numLines about the number of lines that
     * were expanded.
     *
     * @event diff-context-expanded
     */

    static get properties() {
      return {
        changeNum: String,
        noAutoRender: {
          type: Boolean,
          value: false,
        },
        /** @type {?} */
        patchRange: Object,
        path: {
          type: String,
          observer: '_pathObserver',
        },
        prefs: {
          type: Object,
          observer: '_prefsObserver',
        },
        projectName: String,
        displayLine: {
          type: Boolean,
          value: false,
        },
        isImageDiff: {
          type: Boolean,
        },
        commitRange: Object,
        hidden: {
          type: Boolean,
          reflectToAttribute: true,
        },
        noRenderOnPrefsChange: Boolean,
        /** @type {!Array<!Gerrit.HoveredRange>} */
        _commentRanges: {
          type: Array,
          value: () => [],
        },
        /** @type {!Array<!Gerrit.CoverageRange>} */
        coverageRanges: {
          type: Array,
          value: () => [],
        },
        lineWrapping: {
          type: Boolean,
          value: false,
          observer: '_lineWrappingObserver',
        },
        viewMode: {
          type: String,
          value: DiffViewMode.SIDE_BY_SIDE,
          observer: '_viewModeObserver',
        },

        /** @type {?Gerrit.LineOfInterest} */
        lineOfInterest: Object,

        loading: {
          type: Boolean,
          value: false,
          observer: '_loadingChanged',
        },

        loggedIn: {
          type: Boolean,
          value: false,
        },
        diff: {
          type: Object,
          observer: '_diffChanged',
        },
        _diffHeaderItems: {
          type: Array,
          value: [],
          computed: '_computeDiffHeaderItems(diff.*)',
        },
        _diffTableClass: {
          type: String,
          value: '',
        },
        /** @type {?Object} */
        baseImage: Object,
        /** @type {?Object} */
        revisionImage: Object,

        /**
         * Whether the safety check for large diffs when whole-file is set has
         * been bypassed. If the value is null, then the safety has not been
         * bypassed. If the value is a number, then that number represents the
         * context preference to use when rendering the bypassed diff.
         *
         * @type {number|null}
         */
        _safetyBypass: {
          type: Number,
          value: null,
        },

        _showWarning: Boolean,

        /** @type {?string} */
        errorMessage: {
          type: String,
          value: null,
        },

        /** @type {?Object} */
        blame: {
          type: Object,
          value: null,
          observer: '_blameChanged',
        },

        parentIndex: Number,

        _newlineWarning: {
          type: String,
          computed: '_computeNewlineWarning(diff)',
        },

        _diffLength: Number,

        /**
         * Observes comment nodes added or removed after the initial render.
         * Can be used to unregister when the entire diff is (re-)rendered or upon
         * detachment.
         *
         * @type {?PolymerDomApi.ObserveHandle}
         */
        _incrementalNodeObserver: Object,

        /**
         * Observes comment nodes added or removed at any point.
         * Can be used to unregister upon detachment.
         *
         * @type {?PolymerDomApi.ObserveHandle}
         */
        _nodeObserver: Object,

        /** Set by Polymer. */
        isAttached: Boolean,
        layers: Array,
      };
    }

    static get observers() {
      return [
        '_enableSelectionObserver(loggedIn, isAttached)',
      ];
    }

    /** @override */
    created() {
      super.created();
      this.addEventListener('create-range-comment',
          e => this._handleCreateRangeComment(e));
      this.addEventListener('render-content',
          () => this._handleRenderContent());
    }

    /** @override */
    attached() {
      super.attached();
      this._observeNodes();
    }

    /** @override */
    detached() {
      super.detached();
      this._unobserveIncrementalNodes();
      this._unobserveNodes();
    }

    showNoChangeMessage(loading, prefs, diffLength) {
      return !loading &&
        prefs && prefs.ignore_whitespace !== 'IGNORE_NONE' &&
        diffLength === 0;
    }

    _enableSelectionObserver(loggedIn, isAttached) {
      // Polymer 2: check for undefined
      if ([loggedIn, isAttached].some(arg => arg === undefined)) {
        return;
      }

      if (loggedIn && isAttached) {
        this.listen(document, 'selectionchange', '_handleSelectionChange');
        this.listen(document, 'mouseup', '_handleMouseUp');
      } else {
        this.unlisten(document, 'selectionchange', '_handleSelectionChange');
        this.unlisten(document, 'mouseup', '_handleMouseUp');
      }
    }

    _handleSelectionChange() {
      // Because of shadow DOM selections, we handle the selectionchange here,
      // and pass the shadow DOM selection into gr-diff-highlight, where the
      // corresponding range is determined and normalized.
      const selection = this._getShadowOrDocumentSelection();
      this.$.highlights.handleSelectionChange(selection, false);
    }

    _handleMouseUp(e) {
      // To handle double-click outside of text creating comments, we check on
      // mouse-up if there's a selection that just covers a line change. We
      // can't do that on selection change since the user may still be dragging.
      const selection = this._getShadowOrDocumentSelection();
      this.$.highlights.handleSelectionChange(selection, true);
    }

    /** Gets the current selection, preferring the shadow DOM selection. */
    _getShadowOrDocumentSelection() {
      // When using native shadow DOM, the selection returned by
      // document.getSelection() cannot reference the actual DOM elements making
      // up the diff, because they are in the shadow DOM of the gr-diff element.
      // This takes the shadow DOM selection if one exists.
      return this.root.getSelection ?
        this.root.getSelection() :
        document.getSelection();
    }

    _observeNodes() {
      this._nodeObserver = Polymer.dom(this).observeNodes(info => {
        const addedThreadEls = info.addedNodes.filter(isThreadEl);
        const removedThreadEls = info.removedNodes.filter(isThreadEl);
        this._updateRanges(addedThreadEls, removedThreadEls);
        this._redispatchHoverEvents(addedThreadEls);
      });
    }

    _updateRanges(addedThreadEls, removedThreadEls) {
      function commentRangeFromThreadEl(threadEl) {
        const side = threadEl.getAttribute('comment-side');
        const range = JSON.parse(threadEl.getAttribute('range'));
        return {side, range, hovering: false};
      }

      const addedCommentRanges = addedThreadEls
          .map(commentRangeFromThreadEl)
          .filter(({range}) => range);
      const removedCommentRanges = removedThreadEls
          .map(commentRangeFromThreadEl)
          .filter(({range}) => range);
      for (const removedCommentRange of removedCommentRanges) {
        const i = this._commentRanges
            .findIndex(
                cr => cr.side === removedCommentRange.side &&
              Gerrit.rangesEqual(cr.range, removedCommentRange.range)
            );
        this.splice('_commentRanges', i, 1);
      }

      if (addedCommentRanges && addedCommentRanges.length) {
        this.push('_commentRanges', ...addedCommentRanges);
      }
    }

    /**
     * The key locations based on the comments and line of interests,
     * where lines should not be collapsed.
     *
     * @return {{left: Object<(string|number), boolean>,
     *     right: Object<(string|number), boolean>}}
     */
    _computeKeyLocations() {
      const keyLocations = {left: {}, right: {}};
      if (this.lineOfInterest) {
        const side = this.lineOfInterest.leftSide ? 'left' : 'right';
        keyLocations[side][this.lineOfInterest.number] = true;
      }
      const threadEls = Polymer.dom(this).getEffectiveChildNodes()
          .filter(isThreadEl);

      for (const threadEl of threadEls) {
        const commentSide = threadEl.getAttribute('comment-side');
        const lineNum = Number(threadEl.getAttribute('line-num')) ||
            GrDiffLine.FILE;
        const commentRange = threadEl.range || {};
        keyLocations[commentSide][lineNum] = true;
        // Add start_line as well if exists,
        // the being and end of the range should not be collapsed.
        if (commentRange.start_line) {
          keyLocations[commentSide][commentRange.start_line] = true;
        }
      }
      return keyLocations;
    }

    // Dispatch events that are handled by the gr-diff-highlight.
    _redispatchHoverEvents(addedThreadEls) {
      for (const threadEl of addedThreadEls) {
        threadEl.addEventListener('mouseenter', () => {
          threadEl.dispatchEvent(new CustomEvent(
              'comment-thread-mouseenter', {bubbles: true, composed: true}));
        });
        threadEl.addEventListener('mouseleave', () => {
          threadEl.dispatchEvent(new CustomEvent(
              'comment-thread-mouseleave', {bubbles: true, composed: true}));
        });
      }
    }

    /** Cancel any remaining diff builder rendering work. */
    cancel() {
      this.$.diffBuilder.cancel();
      this.cancelDebouncer(RENDER_DIFF_TABLE_DEBOUNCE_NAME);
    }

    /** @return {!Array<!HTMLElement>} */
    getCursorStops() {
      if (this.hidden && this.noAutoRender) {
        return [];
      }

      return Array.from(
          Polymer.dom(this.root).querySelectorAll('.diff-row'));
    }

    /** @return {boolean} */
    isRangeSelected() {
      return !!this.$.highlights.selectedRange;
    }

    toggleLeftDiff() {
      this.toggleClass('no-left');
    }

    _blameChanged(newValue) {
      this.$.diffBuilder.setBlame(newValue);
      if (newValue) {
        this.classList.add('showBlame');
      } else {
        this.classList.remove('showBlame');
      }
    }

    /** @return {string} */
    _computeContainerClass(loggedIn, viewMode, displayLine) {
      const classes = ['diffContainer'];
      switch (viewMode) {
        case DiffViewMode.UNIFIED:
          classes.push('unified');
          break;
        case DiffViewMode.SIDE_BY_SIDE:
          classes.push('sideBySide');
          break;
        default:
          throw Error('Invalid view mode: ', viewMode);
      }
      if (Gerrit.hiddenscroll) {
        classes.push('hiddenscroll');
      }
      if (loggedIn) {
        classes.push('canComment');
      }
      if (displayLine) {
        classes.push('displayLine');
      }
      return classes.join(' ');
    }

    _handleTap(e) {
      const el = Polymer.dom(e).localTarget;

      if (el.classList.contains('showContext')) {
        this.fire('diff-context-expanded', {
          numLines: e.detail.numLines,
        });
        this.$.diffBuilder.showContext(e.detail.groups, e.detail.section);
      } else if (el.classList.contains('lineNum')) {
        this.addDraftAtLine(el);
      } else if (el.tagName === 'HL' ||
          el.classList.contains('content') ||
          el.classList.contains('contentText')) {
        const target = this.$.diffBuilder.getLineElByChild(el);
        if (target) { this._selectLine(target); }
      }
    }

    _selectLine(el) {
      this.fire('line-selected', {
        side: el.classList.contains('left') ? DiffSide.LEFT : DiffSide.RIGHT,
        number: el.getAttribute('data-value'),
        path: this.path,
      });
    }

    addDraftAtLine(el) {
      this._selectLine(el);
      if (!this._isValidElForComment(el)) { return; }

      const value = el.getAttribute('data-value');
      let lineNum;
      if (value !== GrDiffLine.FILE) {
        lineNum = parseInt(value, 10);
        if (isNaN(lineNum)) {
          this.fire('show-alert', {message: ERR_INVALID_LINE + value});
          return;
        }
      }
      this._createComment(el, lineNum);
    }

    createRangeComment() {
      if (!this.isRangeSelected()) {
        throw Error('Selection is needed for new range comment');
      }
      const {side, range} = this.$.highlights.selectedRange;
      this._createCommentForSelection(side, range);
    }

    _createCommentForSelection(side, range) {
      const lineNum = range.end_line;
      const lineEl = this.$.diffBuilder.getLineElByNumber(lineNum, side);
      if (this._isValidElForComment(lineEl)) {
        this._createComment(lineEl, lineNum, side, range);
      }
    }

    _handleCreateRangeComment(e) {
      const range = e.detail.range;
      const side = e.detail.side;
      this._createCommentForSelection(side, range);
    }

    /** @return {boolean} */
    _isValidElForComment(el) {
      if (!this.loggedIn) {
        this.fire('show-auth-required');
        return false;
      }
      const patchNum = el.classList.contains(DiffSide.LEFT) ?
        this.patchRange.basePatchNum :
        this.patchRange.patchNum;

      const isEdit = this.patchNumEquals(patchNum, this.EDIT_NAME);
      const isEditBase = this.patchNumEquals(patchNum, this.PARENT_NAME) &&
          this.patchNumEquals(this.patchRange.patchNum, this.EDIT_NAME);

      if (isEdit) {
        this.fire('show-alert', {message: ERR_COMMENT_ON_EDIT});
        return false;
      } else if (isEditBase) {
        this.fire('show-alert', {message: ERR_COMMENT_ON_EDIT_BASE});
        return false;
      }
      return true;
    }

    /**
     * @param {!Object} lineEl
     * @param {number=} lineNum
     * @param {string=} side
     * @param {!Object=} range
     */
    _createComment(lineEl, lineNum, side, range) {
      const contentText = this.$.diffBuilder.getContentByLineEl(lineEl);
      const contentEl = contentText.parentElement;
      side = side ||
          this._getCommentSideByLineAndContent(lineEl, contentEl);
      const patchForNewThreads = this._getPatchNumByLineAndContent(
          lineEl, contentEl);
      const isOnParent =
          this._getIsParentCommentByLineAndContent(lineEl, contentEl);
      this.dispatchEvent(new CustomEvent('create-comment', {
        bubbles: true,
        composed: true,
        detail: {
          lineNum,
          side,
          patchNum: patchForNewThreads,
          isOnParent,
          range,
        },
      }));
    }

    _getThreadGroupForLine(contentEl) {
      return contentEl.querySelector('.thread-group');
    }

    /**
     * Gets or creates a comment thread group for a specific line and side on a
     * diff.
     *
     * @param {!Object} contentEl
     * @param {!Gerrit.DiffSide} commentSide
     * @return {!Node}
     */
    _getOrCreateThreadGroup(contentEl, commentSide) {
      // Check if thread group exists.
      let threadGroupEl = this._getThreadGroupForLine(contentEl);
      if (!threadGroupEl) {
        threadGroupEl = document.createElement('div');
        threadGroupEl.className = 'thread-group';
        threadGroupEl.setAttribute('data-side', commentSide);
        contentEl.appendChild(threadGroupEl);
      }
      return threadGroupEl;
    }

    /**
     * The value to be used for the patch number of new comments created at the
     * given line and content elements.
     *
     * In two cases of creating a comment on the left side, the patch number to
     * be used should actually be right side of the patch range:
     * - When the patch range is against the parent comment of a normal change.
     *   Such comments declare themmselves to be on the left using side=PARENT.
     * - If the patch range is against the indexed parent of a merge change.
     *   Such comments declare themselves to be on the given parent by
     *   specifying the parent index via parent=i.
     *
     * @return {number}
     */
    _getPatchNumByLineAndContent(lineEl, contentEl) {
      let patchNum = this.patchRange.patchNum;

      if ((lineEl.classList.contains(DiffSide.LEFT) ||
          contentEl.classList.contains('remove')) &&
          this.patchRange.basePatchNum !== 'PARENT' &&
          !this.isMergeParent(this.patchRange.basePatchNum)) {
        patchNum = this.patchRange.basePatchNum;
      }
      return patchNum;
    }

    /** @return {boolean} */
    _getIsParentCommentByLineAndContent(lineEl, contentEl) {
      if ((lineEl.classList.contains(DiffSide.LEFT) ||
          contentEl.classList.contains('remove')) &&
          (this.patchRange.basePatchNum === 'PARENT' ||
          this.isMergeParent(this.patchRange.basePatchNum))) {
        return true;
      }
      return false;
    }

    /** @return {string} */
    _getCommentSideByLineAndContent(lineEl, contentEl) {
      let side = 'right';
      if (lineEl.classList.contains(DiffSide.LEFT) ||
          contentEl.classList.contains('remove')) {
        side = 'left';
      }
      return side;
    }

    _prefsObserver(newPrefs, oldPrefs) {
      // Scan the preference objects one level deep to see if they differ.
      let differ = !oldPrefs;
      if (newPrefs && oldPrefs) {
        for (const key in newPrefs) {
          if (newPrefs[key] !== oldPrefs[key]) {
            differ = true;
          }
        }
      }

      if (differ) {
        this._prefsChanged(newPrefs);
      }
    }

    _pathObserver() {
      // Call _prefsChanged(), because line-limit style value depends on path.
      this._prefsChanged(this.prefs);
    }

    _viewModeObserver() {
      this._prefsChanged(this.prefs);
    }

    /** @param {boolean} newValue */
    _loadingChanged(newValue) {
      if (newValue) {
        this.cancel();
        this._blame = null;
        this._safetyBypass = null;
        this._showWarning = false;
        this.clearDiffContent();
      }
    }

    _lineWrappingObserver() {
      this._prefsChanged(this.prefs);
    }

    _prefsChanged(prefs) {
      if (!prefs) { return; }

      this._blame = null;

      const lineLength = this.path === COMMIT_MSG_PATH ?
        COMMIT_MSG_LINE_LENGTH : prefs.line_length;
      const stylesToUpdate = {};

      if (prefs.line_wrapping) {
        this._diffTableClass = 'full-width';
        if (this.viewMode === 'SIDE_BY_SIDE') {
          stylesToUpdate['--content-width'] = 'none';
          stylesToUpdate['--line-limit'] = lineLength + 'ch';
        }
      } else {
        this._diffTableClass = '';
        stylesToUpdate['--content-width'] = lineLength + 'ch';
      }

      if (prefs.font_size) {
        stylesToUpdate['--font-size'] = prefs.font_size + 'px';
      }

      this.updateStyles(stylesToUpdate);

      if (this.diff && !this.noRenderOnPrefsChange) {
        this._debounceRenderDiffTable();
      }
    }

    _diffChanged(newValue) {
      if (newValue) {
        this._diffLength = this.getDiffLength(newValue);
        this._debounceRenderDiffTable();
      }
    }

    /**
     * When called multiple times from the same microtask, will call
     * _renderDiffTable only once, in the next microtask, unless it is cancelled
     * before that microtask runs.
     *
     * This should be used instead of calling _renderDiffTable directly to
     * render the diff in response to an input change, because there may be
     * multiple inputs changing in the same microtask, but we only want to
     * render once.
     */
    _debounceRenderDiffTable() {
      this.debounce(
          RENDER_DIFF_TABLE_DEBOUNCE_NAME, () => this._renderDiffTable());
    }

    _renderDiffTable() {
      this._unobserveIncrementalNodes();
      if (!this.prefs) {
        this.dispatchEvent(
            new CustomEvent('render', {bubbles: true, composed: true}));
        return;
      }
      if (this.prefs.context === -1 &&
          this._diffLength >= LARGE_DIFF_THRESHOLD_LINES &&
          this._safetyBypass === null) {
        this._showWarning = true;
        this.dispatchEvent(
            new CustomEvent('render', {bubbles: true, composed: true}));
        return;
      }

      this._showWarning = false;

      const keyLocations = this._computeKeyLocations();
      this.$.diffBuilder.render(keyLocations, this._getBypassPrefs())
          .then(() => {
            this.dispatchEvent(
                new CustomEvent('render', {
                  bubbles: true,
                  composed: true,
                  detail: {contentRendered: true},
                }));
          });
    }

    _handleRenderContent() {
      this._incrementalNodeObserver = Polymer.dom(this).observeNodes(info => {
        const addedThreadEls = info.addedNodes.filter(isThreadEl);
        // Removed nodes do not need to be handled because all this code does is
        // adding a slot for the added thread elements, and the extra slots do
        // not hurt. It's probably a bigger performance cost to remove them than
        // to keep them around. Medium term we can even consider to add one slot
        // for each line from the start.
        let lastEl;
        for (const threadEl of addedThreadEls) {
          const commentSide = threadEl.getAttribute('comment-side');
          const lineEl = this._getLineElement(threadEl,
              commentSide);
          const contentText = this.$.diffBuilder.getContentByLineEl(lineEl);
          const contentEl = contentText.parentElement;
          const threadGroupEl = this._getOrCreateThreadGroup(
              contentEl, commentSide);
          // Create a slot for the thread and attach it to the thread group.
          // The Polyfill has some bugs and this only works if the slot is
          // attached to the group after the group is attached to the DOM.
          // The thread group may already have a slot with the right name, but
          // that is okay because the first matching slot is used and the rest
          // are ignored.
          const slot = document.createElement('slot');
          slot.name = threadEl.getAttribute('slot');
          Polymer.dom(threadGroupEl).appendChild(Gerrit.slotToContent(slot));
          lastEl = threadEl;
        }

        // Safari is not binding newly created comment-thread
        // with the slot somehow, replace itself will rebind it
        // @see Issue 11182
        if (lastEl && lastEl.replaceWith) {
          lastEl.replaceWith(lastEl);
        }
      });
    }

    _getLineElement(threadEl, commentSide) {
      const lineNumString = threadEl.getAttribute('line-num') || 'FILE';
      const lineEl = this.$.diffBuilder.getLineElByNumber(
          lineNumString, commentSide);
      if (lineEl) {
        return lineEl;
      }
      // It is possible to add comment to non-existing line via API
      threadEl.invalidLineNumber = true;
      return this.$.diffBuilder.getLineElByNumber('FILE', commentSide);
    }

    _unobserveIncrementalNodes() {
      if (this._incrementalNodeObserver) {
        Polymer.dom(this).unobserveNodes(this._incrementalNodeObserver);
      }
    }

    _unobserveNodes() {
      if (this._nodeObserver) {
        Polymer.dom(this).unobserveNodes(this._nodeObserver);
      }
    }

    /**
     * Get the preferences object including the safety bypass context (if any).
     */
    _getBypassPrefs() {
      if (this._safetyBypass !== null) {
        return Object.assign({}, this.prefs, {context: this._safetyBypass});
      }
      return this.prefs;
    }

    clearDiffContent() {
      this._unobserveIncrementalNodes();
      this.$.diffTable.innerHTML = null;
    }

    /** @return {!Array} */
    _computeDiffHeaderItems(diffInfoRecord) {
      const diffInfo = diffInfoRecord.base;
      if (!diffInfo || !diffInfo.diff_header) { return []; }
      return diffInfo.diff_header
          .filter(item => !(item.startsWith('diff --git ') ||
            item.startsWith('index ') ||
            item.startsWith('+++ ') ||
            item.startsWith('--- ') ||
            item === 'Binary files differ'));
    }

    /** @return {boolean} */
    _computeDiffHeaderHidden(items) {
      return items.length === 0;
    }

    _handleFullBypass() {
      this._safetyBypass = FULL_CONTEXT;
      this._debounceRenderDiffTable();
    }

    _handleLimitedBypass() {
      this._safetyBypass = LIMITED_CONTEXT;
      this._debounceRenderDiffTable();
    }

    /** @return {string} */
    _computeWarningClass(showWarning) {
      return showWarning ? 'warn' : '';
    }

    /**
     * @param {string} errorMessage
     * @return {string}
     */
    _computeErrorClass(errorMessage) {
      return errorMessage ? 'showError' : '';
    }

    expandAllContext() {
      this._handleFullBypass();
    }

    /**
     * Find the last chunk for the given side.
     *
     * @param {!Object} diff
     * @param {boolean} leftSide true if checking the base of the diff,
     *     false if testing the revision.
     * @return {Object|null} returns the chunk object or null if there was
     *     no chunk for that side.
     */
    _lastChunkForSide(diff, leftSide) {
      if (!diff.content.length) { return null; }

      let chunkIndex = diff.content.length;
      let chunk;

      // Walk backwards until we find a chunk for the given side.
      do {
        chunkIndex--;
        chunk = diff.content[chunkIndex];
      } while (
      // We haven't reached the beginning.
        chunkIndex >= 0 &&

          // The chunk doesn't have both sides.
          !chunk.ab &&

          // The chunk doesn't have the given side.
          ((leftSide && (!chunk.a || !chunk.a.length)) ||
           (!leftSide && (!chunk.b || !chunk.b.length))));

      // If we reached the beginning of the diff and failed to find a chunk
      // with the given side, return null.
      if (chunkIndex === -1) { return null; }

      return chunk;
    }

    /**
     * Check whether the specified side of the diff has a trailing newline.
     *
     * @param {!Object} diff
     * @param {boolean} leftSide true if checking the base of the diff,
     *     false if testing the revision.
     * @return {boolean|null} Return true if the side has a trailing newline.
     *     Return false if it doesn't. Return null if not applicable (for
     *     example, if the diff has no content on the specified side).
     */
    _hasTrailingNewlines(diff, leftSide) {
      const chunk = this._lastChunkForSide(diff, leftSide);
      if (!chunk) { return null; }
      let lines;
      if (chunk.ab) {
        lines = chunk.ab;
      } else {
        lines = leftSide ? chunk.a : chunk.b;
      }
      return lines[lines.length - 1] === '';
    }

    /**
     * @param {!Object} diff
     * @return {string|null}
     */
    _computeNewlineWarning(diff) {
      const hasLeft = this._hasTrailingNewlines(diff, true);
      const hasRight = this._hasTrailingNewlines(diff, false);
      const messages = [];
      if (hasLeft === false) {
        messages.push(NO_NEWLINE_BASE);
      }
      if (hasRight === false) {
        messages.push(NO_NEWLINE_REVISION);
      }
      if (!messages.length) { return null; }
      return messages.join(' — ');
    }

    /**
     * @param {string} warning
     * @param {boolean} loading
     * @return {string}
     */
    _computeNewlineWarningClass(warning, loading) {
      if (loading || !warning) { return 'newlineWarning hidden'; }
      return 'newlineWarning';
    }

    /**
     * Get the approximate length of the diff as the sum of the maximum
     * length of the chunks.
     *
     * @param {Object} diff object
     * @return {number}
     */
    getDiffLength(diff) {
      if (!diff) return 0;
      return diff.content.reduce((sum, sec) => {
        if (sec.hasOwnProperty('ab')) {
          return sum + sec.ab.length;
        } else {
          return sum + Math.max(
              sec.hasOwnProperty('a') ? sec.a.length : 0,
              sec.hasOwnProperty('b') ? sec.b.length : 0);
        }
      }, 0);
    }
  }

  customElements.define(GrDiff.is, GrDiff);
})();