<?xml version="1.0" encoding="UTF-8"?>
<!--
Copyright (C) 2013 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.
-->
<ui:UiBinder
    xmlns:ui='urn:ui:com.google.gwt.uibinder'
    xmlns:c='urn:import:com.google.gerrit.client.change'
    xmlns:g='urn:import:com.google.gwt.user.client.ui'
    xmlns:x='urn:import:com.google.gerrit.client.ui'>
  <ui:with field='ico' type='com.google.gerrit.client.GerritResources'/>
  <ui:with field='res' type='com.google.gerrit.client.change.Resources'/>
  <ui:style type='com.google.gerrit.client.change.ChangeScreen2.Style'>
    @eval textColor com.google.gerrit.client.Gerrit.getTheme().textColor;
    @eval trimColor com.google.gerrit.client.Gerrit.getTheme().trimColor;

    @def COMMIT_WIDTH 560px;
    @def HEADER_HEIGHT 29px;

    .cs2 {
      margin-bottom: 1em;
    }

    .headerLine {
      position: relative;
      background-color: trimColor;
      height: HEADER_HEIGHT;
      margin: 0 -5px;
      padding: 0 5px;
    }

    .subjectLine {
      position: relative;
      width: COMMIT_WIDTH;
      height: HEADER_HEIGHT;
      background-color: trimColor;
      color: textColor;
      font-family: sans-serif;
    }
    .subjectText {
      width: 460px;
      height: HEADER_HEIGHT;
      line-height: HEADER_HEIGHT;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .subjectButtons {
      position: absolute;
      top: 0;
      right: 3px;
      height: HEADER_HEIGHT;
      line-height: HEADER_HEIGHT;
    }

    .infoLine {
      position: absolute;
      top: 0;
      left: COMMIT_WIDTH;
      height: HEADER_HEIGHT;
      padding-left: 25px;
    }

    .infoLineHeaderButtons {
      display: inline-block;
      height: HEADER_HEIGHT;
      line-height: HEADER_HEIGHT;
      vertical-align: top;
    }
    .statusRight {
      position: absolute;
      top: 0;
      right: 0;
      height: HEADER_HEIGHT;
    }
    .idAndStatus {
      display: inline-block;
      position: relative;
      height: HEADER_HEIGHT;
      width: 300px;
    }
    .star {
      position: absolute;
      top: 5px;
      right: 2px;
      cursor: pointer;
      outline: none;
    }
    .changeId {
      width: 300px;
      white-space: nowrap;
      line-height: HEADER_HEIGHT;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .statusText {
      font-weight: bold;
    }

    div.popdown {
      display: inline-block;
      margin-top: 2px;
      margin-left: 5px;
      margin-right: 25px;
    }

    .popdown button {
      cursor: pointer;
      height: 25px;
      border: none;
      border-left: 2px solid #fff;
      border-right: 2px solid #fff;
      background-color: trimColor;
      margin: 0 0 0 -2px;
      padding-left: 2px;
      padding-right: 2px;
      min-width: 100px;
    }
    .popdown button div {
      padding-left: 6px;
      padding-right: 6px;
    }
    .popdown button div:after {
      content: " \25bc";
    }
    .popdown button.selected {
      font-weight: bold;
    }
    .popdown button:focus {
      outline: none;
    }

    .headerButtons button:disabled,
    #change_infoTable button:disabled,
    .popdown button:disabled {
      background-color: #999;
      background-image: -webkit-linear-gradient(top, #999, #999);
    }

    .infoTable {
      border-spacing: 0;
    }

    .infoTable th {
      width: 60px;
      color: #444;
      font-weight: normal;
      vertical-align: top;
      text-align: left;
      padding: 0 5px 0 0;
    }

    .projectSettings {
      float: right;
      cursor: pointer;
    }

    .infoColumn {
      width: 440px;
      padding-left: 17px;
      padding-right: 17px;
      vertical-align: top;
    }

    #change_infoTable {
      border-spacing: 0;
      width: 100%;
      margin-left: 2px;
      margin-right: 5px;
    }

    .notMergeable {
      float: right;
      font-weight: bold;
      color: #d00;
    }

    .commitColumn, .relatedColumn {
      padding: 0;
      vertical-align: top;
    }
    .commitColumn { width: COMMIT_WIDTH; }
    .relatedColumn { width: 375px; }

    .labels {
      border-spacing: 0;
      padding: 0;
    }
    .labelName {
      color: #444;
      vertical-align: top;
      text-align: left;
      padding-top: 3px;
      padding-right: 5px;
      white-space: nowrap;
    }

    .label_user {
      display: inline-block;
      margin-bottom: 2px;
      padding: 1px 3px 0px 3px;
      border-radius: 5px;
      -webkit-border-radius: 5px;
      background: trimColor;
      border: 1px solid trimColor;
      white-space: nowrap;
    }
    .label_user img.avatar {
      margin: 0 2px 0 0;
      width: 16px;
      height: 16px;
      vertical-align: bottom;
    }
    .label_user button {
      cursor: pointer;
      padding: 0;
      margin: 0 0 0 5px;
      border: 0;
      background-color: transparent;
      white-space: nowrap;
    }

    .label_ok {color: #060;}
    .label_reject {color: #d14836;}
    .label_need {color: #000;}
    .label_may {color: #777;}

    .headerButtons button {
      margin: 6px 3px 0 0;
      border-color: rgba(0, 0, 0, 0.1);
      text-align: center;
      font-size: 8pt;
      font-weight: bold;
      border: 1px solid;
      cursor: pointer;
      color: #444;
      background-color: #f5f5f5;
      background-image: -webkit-linear-gradient(top, #f5f5f5, #f1f1f1);
      -webkit-border-radius: 2px;
      -webkit-box-sizing: content-box;
    }
    .headerButtons button div {
      color: #444;
      height: 10px;
      min-width: 54px;
      line-height: 10px;
      white-space: nowrap;
    }
    button.quickApprove {
      background-color: #4d90fe;
      background-image: -webkit-linear-gradient(top, #4d90fe, #4d90fe);
    }
    button.quickApprove div { color: #fff; }

    .sectionHeader {
      position: relative;
      background-color: trimColor;
      font-weight: bold;
      color: textColor;
      height: 18px;
      margin: 0 -5px;
      padding: 5px 5px;
    }
    .sectionHeader .headerButtons {
      position: absolute;
      left: 300px;
      top: 2px;
      height: 18px;
      line-height: 18px;
      border-left: 1px inset #fff;
      padding-left: 5px;
      padding-top: 3px;
      padding-bottom: 3px;
    }
    .sectionHeader button { margin-top: 0; }

    .diffBase {
      display: inline-block;
      height: 18px;
      line-height: 18px;
      font-size: smaller;
      font-weight: normal;
      vertical-align: top;
    }
    .diffBase select {
      margin: 0;
      border: 1px solid #bbb;
      font-size: smaller;
    }

    .replyBox {
      background-color: trimColor;
    }
  </ui:style>

  <g:HTMLPanel styleName='{style.cs2}'>
    <g:HTMLPanel styleName='{style.headerLine}' ui:field='headerLine'>
      <div class='{style.subjectLine}'>
        <div class='{style.idAndStatus}'>
          <span class='{style.changeId}'>
            <ui:msg>Change <g:Anchor ui:field='permalink' title='Reload the change (Shortcut: R)'>
              <ui:attribute name='title'/>
            </g:Anchor> - <span ui:field='statusText' class='{style.statusText}'/></ui:msg>
          </span>
        </div>
        <div class='{style.subjectButtons} {style.headerButtons}'>
          <g:Button ui:field='editMessage'
              styleName=''
              visible='false'
              title='Edit commit message (Shortcut: e)'>
            <ui:attribute name='title'/>
            <div><ui:msg>Edit Message</ui:msg></div>
          </g:Button>
        </div>
      </div>

      <div class='{style.infoLine}'>
        <div class='{style.headerButtons} {style.infoLineHeaderButtons}'>
          <g:Button ui:field='reply'
              styleName=''
              title='Reply and score (Shortcut: a)'>
            <ui:attribute name='title'/>
            <div><ui:msg>Reply&#8230;</ui:msg></div>
          </g:Button>
          <c:QuickApprove ui:field='quickApprove'
              styleName='{style.quickApprove}'
              title='Apply score with one click'>
            <ui:attribute name='title'/>
          </c:QuickApprove>
        </div>
      </div>

      <div class='{style.statusRight}'>
        <g:FlowPanel styleName='{style.popdown}'>
          <g:Button ui:field='includedIn' styleName='' visible="false">
            <div><ui:msg>Included in</ui:msg></div>
          </g:Button>
          <g:Button ui:field='patchSets' styleName=''>
            <div ui:field='patchSetsText'/>
          </g:Button>
          <g:Button ui:field='download' styleName=''>
            <div><ui:msg>Download</ui:msg></div>
          </g:Button>
        </g:FlowPanel>
        <c:StarIcon ui:field='star' styleName='{style.star}' title='Star the change (Shortcut: s)'>
          <ui:attribute name='title'/>
        </c:StarIcon>
      </div>
    </g:HTMLPanel>

    <table class='{style.infoTable}'>
      <tr>
        <td class='{style.commitColumn}'>
          <c:CommitBox ui:field='commit'/>
        </td>
        <td class='{style.infoColumn}'>
          <table id='change_infoTable'>
            <tr>
              <th><ui:msg>Owner</ui:msg></th>
              <td><x:InlineHyperlink ui:field='ownerLink'/></td>
            </tr>
            <tr>
              <th><ui:msg>Reviewers</ui:msg></th>
              <td>
                <c:Reviewers ui:field='reviewers'/>
              </td>
            </tr>
            <tr>
              <th/>
              <td ui:field='ccText'/>
            </tr>
            <tr>
              <th><ui:msg>Project</ui:msg></th>
              <td><x:InlineHyperlink ui:field='projectDashboard'
                     title='Go to project dashboard'>
                     <ui:attribute name='title'/>
                  </x:InlineHyperlink>
                  <a ui:field='projectSettingsLink'
                     class='{style.projectSettings}'>
                    <g:Image
                       ui:field='projectSettings'
                       resource='{ico.gear}'
                       title='Go to project settings'>
                      <ui:attribute name='title'/>
                    </g:Image>
                  </a>
              </td>
            </tr>
            <tr>
              <th><ui:msg>Branch</ui:msg></th>
              <td><x:InlineHyperlink ui:field='branchLink'
                     title='Search for changes on this branch'>
                     <ui:attribute name='title'/>
                  </x:InlineHyperlink>
              </td>
            </tr>
            <tr>
              <th><ui:msg>Topic</ui:msg></th>
              <td><c:Topic ui:field='topic'/></td>
            </tr>
            <tr ui:field='strategy'>
              <th><ui:msg>Strategy</ui:msg></th>
              <td>
                <span ui:field='submitActionText'/>
                <div ui:field='notMergeable'
                     class='{style.notMergeable}'
                     style='display: none'
                     aria-hidden='true'
                     title='The change cannot be merged due to a path conflict. Rebase the change locally and upload the rebased commit for review.'>
                  <ui:attribute name='title'/>
                  <ui:msg>Cannot Merge</ui:msg>
                </div>
              </td>
            </tr>
            <tr>
              <th ui:field='actionText'/>
              <td ui:field='actionDate'/>
            </tr>
            <tr><td colspan='2'><c:Actions ui:field='actions'/></td></tr>
          </table>
          <hr/>
          <c:Labels ui:field='labels' styleName='{style.labels}'/>
          <div id='change_plugins'/>
        </td>
        <td class='{style.relatedColumn}'>
          <c:RelatedChanges ui:field='related'/>
        </td>
      </tr>
    </table>

    <div class='{style.sectionHeader}'>
      <ui:msg>Files</ui:msg>
      <div class='{style.headerButtons}'>
        <g:Button ui:field='openAll'
            styleName=''
            title='Open each file in a new tab'>
          <ui:attribute name='title'/>
          <div><ui:msg>Open All</ui:msg></div>
        </g:Button>
        <div class='{style.diffBase}'>
          <ui:msg>Diff against: <g:ListBox ui:field='diffBase' styleName=''/></ui:msg>
        </div>
      </div>
    </div>
    <c:FileTable ui:field='files'/>

    <div class='{style.sectionHeader}'>
      <ui:msg>History</ui:msg>
      <div class='{style.headerButtons}'>
        <g:Button ui:field='expandAll'
            styleName=''
            title='Expand all messages in the change history'>
          <ui:attribute name='title'/>
          <div><ui:msg>Expand All</ui:msg></div>
        </g:Button>
        <g:Button ui:field='collapseAll'
            styleName=''
            visible='false'
            title='Collapse all messages in the change history'>
          <ui:attribute name='title'/>
          <div><ui:msg>Collapse All</ui:msg></div>
        </g:Button>
      </div>
    </div>
    <c:History ui:field='history'/>
  </g:HTMLPanel>
</ui:UiBinder>