<img src="${h.url('/images/icons/flag_status_%s.png' % c.statuses[cs.raw_id][0])}" />

            </div>

          %endif

        </td>

        <td style="width: 140px"><span class="tooltip" title="${h.tooltip(h.age(cs.date))}">${cs.date}</span></td>

        <td><div class="gravatar" commit_id="${cs.raw_id}"><img alt="gravatar" src="${h.gravatar_url(h.email_or_none(cs.author),14)}"/></div></td>

        <td><div class="author">${h.person(cs.author)}</div></td>

        <td>${h.link_to('r%s:%s' % (cs.revision,h.short_id(cs.raw_id)),h.url('changeset_home',repo_name=c.other_repo.repo_name,revision=cs.raw_id))}

        %if c.as_form:

          ${h.hidden('revisions',cs.raw_id)}

        %endif

        </td>

        <td>

        %if cs.branch:

        <span class="branchtag">${cs.branch}</span>

        %endif

        </td>

        <td class="expand_commit" commit_id="${cs.raw_id}" title="${_('Expand commit message')}">

            <i class="icon-resize-vertical" style="color:#DDD"></i>

        </td>

        <td><div id="C-${cs.raw_id}" class="message" style="white-space:normal; height:1.1em; padding:0">${h.urlify_commit(cs.message, c.repo_name)}</div></td>

        </tr>

    %endfor

    </table>

        ${h.link_to(h.short_id(c.ancestor),h.url('changeset_home',repo_name=c.repo_name,revision=c.ancestor))}

      </div>

      ${h.hidden('ancestor_rev',c.ancestor)}

      ${h.hidden('merge_rev',c.cs_ranges[-1].raw_id)}

    %endif

    %if c.cs_ranges_org is not None:

      ## TODO: list actual changesets?

      <div style="font-size:1.1em;font-weight: bold;clear:both;padding-top:10px">

        ${h.link_to_ref(c.other_repo.repo_name, c.other_ref_type, c.other_ref_name, c.other_rev)}

        ${_('is')}

        <a href="${c.swap_url}">${_('%s changesets') % (len(c.cs_ranges_org))}</a>

        ${_('behind')}

        ${h.link_to_ref(c.org_repo.repo_name, c.org_ref_type, c.org_ref_name, c.org_rev)}

      </div>

    %endif

  %endif

</div>

<script>

$('.expand_commit').on('click',function(e){

    $(this).children('i').hide();

    var cid = $(this).attr('commit_id');

    $('#C-'+cid).css({'height': 'auto','width': 'auto', 'white-space': 'pre'})

});

$('.gravatar').on('click',function(e){

    var cid = $(this).attr('commit_id');

                          <i class="icon-remove-sign" style="color: #FF4444;"></i>

                      </span>

                    </div>

                  </li>

                %endfor

                </ul>

              </div>

              <div class='ac'>

                <div class="reviewer_ac">

                   ${h.text('user', class_='yui-ac-input')}

                   <span class="help-block">${_('Add reviewer to this pull request.')}</span>

                   <div id="reviewers_container"></div>

                </div>

              </div>

            </div>

        </div>

        <div style="clear:both;padding: 0 0 30px 0;"></div>

        <h4>${_('Changesets')}</h4>

        <div style="float:left;padding:0px 30px 30px 30px">

           ## overview pulled by ajax

           <div style="float:left" id="pull_request_overview"></div>

        </div>

        <div style="clear:both;"></div>

    </div>

    ${h.end_form()}

</div>

<script type="text/javascript">

  var _USERS_AC_DATA = ${c.users_array|n};

  var _GROUPS_AC_DATA = ${c.user_groups_array|n};

  PullRequestAutoComplete('user', 'reviewers_container', _USERS_AC_DATA, _GROUPS_AC_DATA);

  var other_repos_info = ${c.other_repos_info|n};

  var otherrepoChanged = function(){

      var sel_box = YUQ('#pull_request_form #other_repo')[0];

      var repo_name = sel_box.options[sel_box.selectedIndex].value;

      var _tmpl = "<b>${_('Destination repository')}</b>: {0}".format(other_repos_info[repo_name]['description']);

      YUD.get('other_repo_desc').innerHTML = _tmpl

      // replace options of other_ref with the ones for the current other_repo

      var other_ref_selector = YUD.get('other_ref');

      var new_select = YUD.createElementFromMarkup(other_repos_info[repo_name]['revs']);

                         other_ref_name='__org_ref_name__',

                         as_form=True,

                         merge=True,

                         )}";

      var org_repo = YUQ('#pull_request_form #org_repo')[0].value;

      var org_ref = YUQ('#pull_request_form #org_ref')[0].value.split(':');

      var other_repo = YUQ('#pull_request_form #other_repo')[0].value;

      var other_ref = YUQ('#pull_request_form #other_ref')[0].value.split(':');

      var select_refs = YUQ('#pull_request_form select.refs')

      var rev_data = {

          '__org_repo__': org_repo,

          '__org_ref_name__': org_ref[2],

          '__other_repo__': other_repo,

          '__other_ref_name__': other_ref[2],

      }; // gather the org/other ref and repo here

      for (k in rev_data){

          url = url.replace(k,rev_data[k]);

      }

      YUD.get('pull_request_overview').innerHTML = "${_('Loading ...')}";

      ypjax(url,'pull_request_overview');

  }

  ## refresh automatically when something changes (org_repo can't change)

  YUE.on('org_ref', 'change', function(e){

     loadPreview();

  });

  YUE.on('other_repo', 'change', function(e){

      otherrepoChanged();

      loadPreview();

  });

  YUE.on('other_ref', 'change', function(e){

     loadPreview();

  });

  otherrepoChanged();

  //lazy load overview after 0.5s

  setTimeout(loadPreview, 500);

</script>

</%def>