js: workaround to avoid <option> tags inside <script>

The naive formencode html parser would sometimes (Python 2.6?) fail with
  AssertionError: <option> outside of <select>

kallithea/templates/base/base.html

@@ -1,679 +1,679 b''
 ## -*- coding: utf-8 -*-
 <%inherit file="root.html"/>
 
 <!-- CONTENT -->
 <div id="content">
     ${self.flash_msg()}
     <div id="main">
         ${next.main()}
     </div>
 </div>
 <!-- END CONTENT -->
 
 <!-- FOOTER -->
 <div id="footer">
    <div id="footer-inner" class="title">
        <div>
            <p class="footer-link">
                ${_('Server instance: %s') % c.instance_id if c.instance_id else ''}
            </p>
            <p class="footer-link-right">
                This site is powered by
                %if c.visual.show_version:
                    <a href="${h.url('kallithea_project_url')}" target="_blank">Kallithea</a> ${c.kallithea_version},
                %else:
                    <a href="${h.url('kallithea_project_url')}" target="_blank">Kallithea</a>,
                %endif
                which is
                <a href="${h.canonical_url('about')}#copyright">&copy; 2010&ndash;2016 by various authors &amp; licensed under GPLv3</a>.
                %if c.issues_url:
                    &ndash; <a href="${c.issues_url}" target="_blank">${_('Support')}</a>
                %endif
            </p>
        </div>
    </div>
 </div>
 
 <!-- END FOOTER -->
 
 ### MAKO DEFS ###
 
 <%block name="branding_title">
     %if c.site_name:
     &middot; ${c.site_name}
     %endif
 </%block>
 
 <%def name="flash_msg()">
     <%include file="/base/flash_msg.html"/>
 </%def>
 
 <%def name="breadcrumbs()">
     <div class="breadcrumbs">
     ${self.breadcrumbs_links()}
     </div>
 </%def>
 
 <%def name="admin_menu()">
   <ul class="dropdown-menu" role="menu">
       <li><a href="${h.url('admin_home')}"><i class="icon-book"></i> ${_('Admin Journal')}</a></li>
       <li><a href="${h.url('repos')}"><i class="icon-database"></i> ${_('Repositories')}</a></li>
       <li><a href="${h.url('repos_groups')}"><i class="icon-folder"></i> ${_('Repository Groups')}</a></li>
       <li><a href="${h.url('users')}"><i class="icon-user"></i> ${_('Users')}</a></li>
       <li><a href="${h.url('users_groups')}"><i class="icon-users"></i> ${_('User Groups')}</a></li>
       <li><a href="${h.url('admin_permissions')}"><i class="icon-block"></i> ${_('Default Permissions')}</a></li>
       <li><a href="${h.url('auth_home')}"><i class="icon-key"></i> ${_('Authentication')}</a></li>
       <li><a href="${h.url('defaults')}"><i class="icon-wrench"></i> ${_('Repository Defaults')}</a></li>
       <li class="last"><a href="${h.url('admin_settings')}"><i class="icon-gear"></i> ${_('Settings')}</a></li>
   </ul>
 
 </%def>
 
 
 ## admin menu used for people that have some admin resources
 <%def name="admin_menu_simple(repositories=None, repository_groups=None, user_groups=None)">
   <ul class="dropdown-menu" role="menu">
    %if repositories:
       <li><a href="${h.url('repos')}"><i class="icon-database"></i> ${_('Repositories')}</a></li>
    %endif
    %if repository_groups:
       <li><a href="${h.url('repos_groups')}"><i class="icon-folder"></i> ${_('Repository Groups')}</a></li>
    %endif
    %if user_groups:
       <li><a href="${h.url('users_groups')}"><i class="icon-users"></i> ${_('User Groups')}</a></li>
    %endif
   </ul>
 </%def>
 
 <%def name="repotag(repo)">
   %if h.is_hg(repo):
     <span class="repotag" title="${_('Mercurial repository')}">hg</span>
   %endif
   %if h.is_git(repo):
     <span class="repotag" title="${_('Git repository')}">git</span>
   %endif
 </%def>
 
 <%def name="repo_context_bar(current=None, rev=None)">
   <% rev = None if rev == 'tip' else rev %>
   <%
     def is_current(selected):
         if selected == current:
             return h.literal('class="current"')
     %>
 
   <!--- CONTEXT BAR -->
   <div id="context-bar" class="box">
       <h2>
         ${repotag(c.db_repo)}
 
         ## public/private
         %if c.db_repo.private:
           <i class="icon-keyhole-circled"></i>
         %else:
           <i class="icon-globe"></i>
         %endif
         ${h.repo_link(c.db_repo.groups_and_repo)}
 
         %if current == 'createfork':
          - ${_('Create Fork')}
         %endif
       </h2>
       <!--
       <div id="breadcrumbs">
         ${h.link_to(_('Repositories'),h.url('home'))}
         &raquo;
         ${h.repo_link(c.db_repo.groups_and_repo)}
       </div>
       -->
       <ul id="context-pages" class="horizontal-list">
         <li ${is_current('summary')} data-context="summary"><a href="${h.url('summary_home', repo_name=c.repo_name)}"><i class="icon-doc-text"></i> ${_('Summary')}</a></li>
         %if rev:
         <li ${is_current('changelog')} data-context="changelog"><a href="${h.url('changelog_file_home', repo_name=c.repo_name, revision=rev, f_path='')}"><i class="icon-clock"></i> ${_('Changelog')}</a></li>
         %else:
         <li ${is_current('changelog')} data-context="changelog"><a href="${h.url('changelog_home', repo_name=c.repo_name)}"><i class="icon-clock"></i> ${_('Changelog')}</a></li>
         %endif
         <li ${is_current('files')} data-context="files"><a href="${h.url('files_home', repo_name=c.repo_name, revision=rev or 'tip')}"><i class="icon-doc-inv"></i> ${_('Files')}</a></li>
         <li ${is_current('switch-to')} data-context="switch-to">
           <input id="branch_switcher" name="branch_switcher" type="hidden">
         </li>
         <li ${is_current('options')} data-context="options">
              %if h.HasRepoPermissionAll('repository.admin')(c.repo_name):
                <a href="${h.url('edit_repo',repo_name=c.repo_name)}" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
              %else:
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"><i class="icon-wrench"></i> ${_('Options')} <i class="caret"></i></a>
              %endif
           <ul class="dropdown-menu" role="menu">
              %if h.HasRepoPermissionAll('repository.admin')(c.repo_name):
                    <li><a href="${h.url('edit_repo',repo_name=c.repo_name)}"><i class="icon-gear"></i> ${_('Settings')}</a></li>
              %endif
               %if c.db_repo.fork:
                <li><a href="${h.url('compare_url',repo_name=c.db_repo.fork.repo_name,org_ref_type=c.db_repo.landing_rev[0],org_ref_name=c.db_repo.landing_rev[1], other_repo=c.repo_name,other_ref_type='branch' if request.GET.get('branch') else c.db_repo.landing_rev[0],other_ref_name=request.GET.get('branch') or c.db_repo.landing_rev[1], merge=1)}">
                    <i class="icon-git-compare"></i> ${_('Compare Fork')}</a></li>
               %endif
               <li><a href="${h.url('compare_home',repo_name=c.repo_name)}"><i class="icon-git-compare"></i> ${_('Compare')}</a></li>
 
               <li><a href="${h.url('search_repo',repo_name=c.repo_name)}"><i class="icon-search"></i> ${_('Search')}</a></li>
 
               %if h.HasRepoPermissionAny('repository.write','repository.admin')(c.repo_name) and c.db_repo.enable_locking:
                 %if c.db_repo.locked[0]:
                   <li><a href="${h.url('toggle_locking', repo_name=c.repo_name)}"><i class="icon-lock"></i> ${_('Unlock')}</a></li>
                 %else:
                   <li><a href="${h.url('toggle_locking', repo_name=c.repo_name)}"><i class="icon-lock-open-alt"></i> ${_('Lock')}</li>
                 %endif
               %endif
               ## TODO: this check feels wrong, it would be better to have a check for permissions
               ## also it feels like a job for the controller
               %if c.authuser.username != 'default':
                   <li>
                    <a class="${'following' if c.repository_following else 'follow'}" onclick="toggleFollowingRepo(this, ${c.db_repo.repo_id});">
                     <span class="show-follow"><i class="icon-heart-empty"></i> ${_('Follow')}</span>
                     <span class="show-following"><i class="icon-heart"></i> ${_('Unfollow')}</span>
                    </a>
                   </li>
                   <li><a href="${h.url('repo_fork_home',repo_name=c.repo_name)}"><i class="icon-git-pull-request"></i> ${_('Fork')}</a></li>
                   <li><a href="${h.url('pullrequest_home',repo_name=c.repo_name)}"><i class="icon-git-pull-request"></i> ${_('Create Pull Request')}</a></li>
               %endif
              </ul>
         </li>
         <li ${is_current('showpullrequest')} data-context="showpullrequest">
           <a href="${h.url('pullrequest_show_all',repo_name=c.repo_name)}" title="${_('Show Pull Requests for %s') % c.repo_name}"> <i class="icon-git-pull-request"></i> ${_('Pull Requests')}
             %if c.repository_pull_requests:
               <span class="badge">${c.repository_pull_requests}</span>
             %endif
           </a>
         </li>
       </ul>
   </div>
   <script type="text/javascript">
     $(document).ready(function() {
       var bcache = {};
 
       $("#branch_switcher").select2({
           placeholder: '<i class="icon-exchange"></i> ${_('Switch To')} <span class="caret"></span>',
           dropdownAutoWidth: true,
           sortResults: prefixFirstSort,
           formatResult: function(obj) {
               return obj.text;
           },
           formatSelection: function(obj) {
               return obj.text;
           },
           formatNoMatches: function(term) {
               return "${_('No matches found')}";
           },
           escapeMarkup: function(m) {
               // don't escape our custom placeholder
               if (m.substr(0, 29) == '<i class="icon-exchange"></i>') {
                   return m;
               }
 
               return Select2.util.escapeMarkup(m);
           },
           containerCssClass: "repo-switcher",
           dropdownCssClass: "repo-switcher-dropdown",
           query: function(query) {
               var key = 'cache';
               var cached = bcache[key];
               if (cached) {
                   var data = {
                       results: []
                   };
                   // filter results
                   $.each(cached.results, function() {
                       var section = this.text;
                       var children = [];
                       $.each(this.children, function() {
                           if (query.term.length === 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
                               children.push({
                                   'id': this.id,
                                   'text': this.text,
                                   'type': this.type,
                                   'obj': this.obj
                               });
                           }
                       });
                       if (children.length !== 0) {
                           data.results.push({
                               'text': section,
                               'children': children
                           });
                       }
 
                   });
                   query.callback(data);
               } else {
                   $.ajax({
                       url: pyroutes.url('repo_refs_data', {
                           'repo_name': '${c.repo_name}'
                       }),
                       data: {},
                       dataType: 'json',
                       type: 'GET',
                       success: function(data) {
                           bcache[key] = data;
                           query.callback(data);
                       }
                   });
               }
           }
       });
 
       $("#branch_switcher").on('select2-selecting', function(e) {
           e.preventDefault();
           var context = $('#context-bar .current').data('context');
           if (context == 'files') {
               window.location = pyroutes.url('files_home', {
                   'repo_name': REPO_NAME,
                   'revision': e.choice.id,
                   'f_path': '',
                   'at': e.choice.text
               });
           } else if (context == 'changelog') {
               if (e.choice.type == 'tag' || e.choice.type == 'book') {
-                  $("#branch_filter").append($('<option/>').val(e.choice.text));
+                  $("#branch_filter").append($('<'+'option/>').val(e.choice.text));
               }
               $("#branch_filter").val(e.choice.text).change();
           } else {
               window.location = pyroutes.url('changelog_home', {
                   'repo_name': '${c.repo_name}',
                   'branch': e.choice.text
               });
           }
       });
     });
   </script>
   <!--- END CONTEXT BAR -->
 </%def>
 
 <%def name="menu(current=None)">
   <%
   def is_current(selected):
       if selected == current:
           return h.literal('class="current"')
   %>
 
   <ul id="quick" class="horizontal-list">
     <!-- repo switcher -->
     <li ${is_current('repositories')}>
       <input id="repo_switcher" name="repo_switcher" type="hidden">
     </li>
 
     ##ROOT MENU
     %if c.authuser.username != 'default':
       <li ${is_current('journal')}>
         <a class="menu_link" title="${_('Show recent activity')}"  href="${h.url('journal')}">
           <i class="icon-book"></i> ${_('Journal')}
         </a>
       </li>
     %else:
       <li ${is_current('journal')}>
         <a class="menu_link" title="${_('Public journal')}"  href="${h.url('public_journal')}">
           <i class="icon-book"></i> ${_('Public journal')}
         </a>
       </li>
     %endif
       <li ${is_current('gists')} class="dropdown">
         <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Show public gists')}"  href="${h.url('gists')}">
           <i class="icon-clippy"></i> ${_('Gists')} <span class="caret"></span>
         </a>
           <ul class="dropdown-menu" role="menu">
             <li><a href="${h.url('new_gist', public=1)}"><i class="icon-paste"></i> ${_('Create New Gist')}</a></li>
             <li><a href="${h.url('gists')}"><i class="icon-globe"></i> ${_('All Public Gists')}</a></li>
             %if c.authuser.username != 'default':
               <li><a href="${h.url('gists', public=1)}"><i class="icon-user"></i> ${_('My Public Gists')}</a></li>
               <li><a href="${h.url('gists', private=1)}"><i class="icon-keyhole-circled"></i> ${_('My Private Gists')}</a></li>
             %endif
           </ul>
       </li>
     <li ${is_current('search')}>
         <a class="menu_link" title="${_('Search in repositories')}"  href="${h.url('search')}">
           <i class="icon-search"></i> ${_('Search')}
         </a>
     </li>
     % if h.HasPermissionAll('hg.admin')('access admin main page'):
       <li ${is_current('admin')} class="dropdown">
         <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Admin')}" href="${h.url('admin_home')}">
           <i class="icon-gear"></i> ${_('Admin')} <span class="caret"></span>
         </a>
         ${admin_menu()}
       </li>
     % elif c.authuser.repositories_admin or c.authuser.repository_groups_admin or c.authuser.user_groups_admin:
     <li ${is_current('admin')} class="dropdown">
         <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" title="${_('Admin')}">
           <i class="icon-gear"></i> ${_('Admin')}
         </a>
         ${admin_menu_simple(c.authuser.repositories_admin,
                             c.authuser.repository_groups_admin,
                             c.authuser.user_groups_admin or h.HasPermissionAny('hg.usergroup.create.true')())}
     </li>
     % endif
 
     <li ${is_current('my_pullrequests')}>
       <a class="menu_link" title="${_('My Pull Requests')}" href="${h.url('my_pullrequests')}">
         <i class="icon-git-pull-request"></i> ${_('My Pull Requests')}
         %if c.my_pr_count != 0:
           <span class="badge">${c.my_pr_count}</span>
         %endif
       </a>
     </li>
 
     ## USER MENU
     <li class="dropdown">
       <a class="menu_link dropdown-toggle" data-toggle="dropdown" role="button" id="quick_login_link"
         %if c.authuser.username != 'default':
           href="${h.url('notifications')}"
         %endif
       >
           ${h.gravatar_div(c.authuser.email, size=20, div_class="icon", div_style="display:inline")}
           %if c.authuser.username != 'default':
             <span class="menu_link_user">${c.authuser.username}</span>
             %if c.unread_notifications != 0:
               <span class="badge">${c.unread_notifications}</span>
             %endif
           %else:
               <span>${_('Not Logged In')}</span>
           %endif
       </a>
 
       <div class="user-menu">
         <div id="quick_login">
           %if c.authuser.username == 'default' or c.authuser.user_id is None:
             <h4>${_('Login to Your Account')}</h4>
             ${h.form(h.url('login_home', came_from=request.path_qs))}
             <div class="form">
                 <div class="fields">
                     <div class="field">
                         <div class="label">
                             <label for="username">${_('Username')}:</label>
                         </div>
                         <div class="input">
                             ${h.text('username',class_='focus')}
                         </div>
 
                     </div>
                     <div class="field">
                         <div class="label">
                             <label for="password">${_('Password')}:</label>
                         </div>
                         <div class="input">
                             ${h.password('password',class_='focus')}
                         </div>
 
                     </div>
                     <div class="buttons">
                         <div class="password_forgoten">${h.link_to(_('Forgot password ?'),h.url('reset_password'))}</div>
                         <div class="register">
                         %if h.HasPermissionAny('hg.admin', 'hg.register.auto_activate', 'hg.register.manual_activate')():
                          ${h.link_to(_("Don't have an account ?"),h.url('register'))}
                         %endif
                         </div>
                         <div class="submit">
                             ${h.submit('sign_in',_('Log In'),class_="btn btn-mini")}
                         </div>
                     </div>
                 </div>
             </div>
             ${h.end_form()}
           %else:
             <div class="links_left">
                 ${h.gravatar_div(c.authuser.email, size=48, div_class="big_gravatar")}
                 <div class="full_name">${c.authuser.full_name_or_username}</div>
                 <div class="email">${c.authuser.email}</div>
             </div>
             <div class="links_right">
             <ol class="links">
               <li><a href="${h.url('notifications')}">${_('Notifications')}: ${c.unread_notifications}</a></li>
               <li>${h.link_to(_('My Account'),h.url('my_account'))}</li>
               %if not c.authuser.is_external_auth:
                 ## Cannot log out if using external (container) authentication.
                 <li class="logout">${h.link_to(_('Log Out'), h.url('logout_home'))}</li>
               %endif
             </ol>
             </div>
           %endif
         </div>
       </div>
     </li>
 
     <script type="text/javascript">
         $(document).ready(function(){
             var visual_show_public_icon = "${c.visual.show_public_icon}" == "True";
             var cache = {}
             /*format the look of items in the list*/
             var format = function(state){
                 if (!state.id){
                   return state.text; // optgroup
                 }
                 var obj_dict = state.obj;
                 var tmpl = '';
 
                 if(obj_dict && state.type == 'repo'){
                     tmpl += '<span class="repo-icons">';
                     if(obj_dict['repo_type'] === 'hg'){
                         tmpl += '<span class="repotag">hg</span> ';
                     }
                     else if(obj_dict['repo_type'] === 'git'){
                         tmpl += '<span class="repotag">git</span> ';
                     }
                     if(obj_dict['private']){
                         tmpl += '<i class="icon-keyhole-circled"></i> ';
                     }
                     else if(visual_show_public_icon){
                         tmpl += '<i class="icon-globe"></i> ';
                     }
                     tmpl += '</span>';
                 }
                 if(obj_dict && state.type == 'group'){
                         tmpl += '<i class="icon-folder"></i> ';
                 }
                 tmpl += state.text;
                 return tmpl;
             }
 
             $("#repo_switcher").select2({
                 placeholder: '<i class="icon-database"></i> ${_('Repositories')} <span class="caret"></span>',
                 dropdownAutoWidth: true,
                 sortResults: prefixFirstSort,
                 formatResult: format,
                 formatSelection: format,
                 formatNoMatches: function(term){
                     return "${_('No matches found')}";
                 },
                 containerCssClass: "repo-switcher",
                 dropdownCssClass: "repo-switcher-dropdown",
                 escapeMarkup: function(m){
                     // don't escape our custom placeholder
                     if(m.substr(0,29) == '<i class="icon-database"></i>'){
                         return m;
                     }
 
                     return Select2.util.escapeMarkup(m);
                 },
                 query: function(query){
                   var key = 'cache';
                   var cached = cache[key] ;
                   if(cached) {
                     var data = {results: []};
                     //filter results
                     $.each(cached.results, function(){
                         var section = this.text;
                         var children = [];
                         $.each(this.children, function(){
                             if(query.term.length == 0 || this.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0 ){
                                 children.push({'id': this.id, 'text': this.text, 'type': this.type, 'obj': this.obj});
                             }
                         });
                         if(children.length !== 0){
                             data.results.push({'text': section, 'children': children});
                         }
 
                     });
                     query.callback(data);
                   }else{
                       $.ajax({
                         url: "${h.url('repo_switcher_data')}",
                         data: {},
                         dataType: 'json',
                         type: 'GET',
                         success: function(data) {
                           cache[key] = data;
                           query.callback({results: data.results});
                         }
                       });
                   }
                 }
             });
 
             $("#repo_switcher").on('select2-selecting', function(e){
                 e.preventDefault();
                 window.location = pyroutes.url('summary_home', {'repo_name': e.val});
             });
         });
 
         ## Global mouse bindings ##
 
         // general help "?"
         Mousetrap.bind(['?'], function(e) {
             $('#help_kb').modal({});
         });
 
         // / open the quick filter
         Mousetrap.bind(['/'], function(e) {
             $("#repo_switcher").select2("open");
 
             // return false to prevent default browser behavior
             // and stop event from bubbling
             return false;
         });
 
         // ctrl/command+b, show the the main bar
         Mousetrap.bind(['command+b', 'ctrl+b'], function(e) {
             if($('#header-inner').hasClass('hover') && $('#content').hasClass('hover')){
                 $('#header-inner').removeClass('hover');
                 $('#content').removeClass('hover');
             }
             else{
                 $('#header-inner').addClass('hover');
                 $('#content').addClass('hover');
             }
             return false;
         });
 
         // general nav g + action
         Mousetrap.bind(['g h'], function(e) {
             window.location = pyroutes.url('home');
         });
         Mousetrap.bind(['g g'], function(e) {
             window.location = pyroutes.url('gists', {'private':1});
         });
         Mousetrap.bind(['g G'], function(e) {
             window.location = pyroutes.url('gists', {'public':1});
         });
         Mousetrap.bind(['n g'], function(e) {
             window.location = pyroutes.url('new_gist');
         });
         Mousetrap.bind(['n r'], function(e) {
             window.location = pyroutes.url('new_repo');
         });
 
         % if hasattr(c, 'repo_name') and hasattr(c, 'db_repo'):
             // nav in repo context
             Mousetrap.bind(['g s'], function(e) {
                 window.location = pyroutes.url('summary_home', {'repo_name': REPO_NAME});
             });
             Mousetrap.bind(['g c'], function(e) {
                 window.location = pyroutes.url('changelog_home', {'repo_name': REPO_NAME});
             });
             Mousetrap.bind(['g F'], function(e) {
                 window.location = pyroutes.url('files_home', {'repo_name': REPO_NAME, 'revision': '${c.db_repo.landing_rev[1]}', 'f_path': '', 'search': '1'});
             });
             Mousetrap.bind(['g f'], function(e) {
                 window.location = pyroutes.url('files_home', {'repo_name': REPO_NAME, 'revision': '${c.db_repo.landing_rev[1]}', 'f_path': ''});
             });
             Mousetrap.bind(['g o'], function(e) {
                 window.location = pyroutes.url('edit_repo', {'repo_name': REPO_NAME});
             });
             Mousetrap.bind(['g O'], function(e) {
                 window.location = pyroutes.url('edit_repo_perms', {'repo_name': REPO_NAME});
             });
         % endif
 
     </script>
 </%def>
 
 %if 0:
 <div class="modal" id="help_kb" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
     <div class="modal-dialog">
       <div class="modal-content">
         <div class="modal-header">
           <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="icon-cancel-circled"></i></button>
           <h4 class="modal-title">${_('Keyboard shortcuts')}</h4>
         </div>
         <div class="modal-body">
            <div class="row">
               <div class="col-md-5">
                 <table class="keyboard-mappings">
                     <tbody>
                   <tr>
                     <th></th>
                     <th>${_('Site-wide shortcuts')}</th>
                   </tr>
                   <%
                      elems = [
                          ('/', 'Open quick search box'),
                          ('ctrl/cmd+b', 'Show main settings bar'),
                          ('g h', 'Goto home page'),
                          ('g g', 'Goto my private gists page'),
                          ('g G', 'Goto my public gists page'),
                          ('n r', 'New repository page'),
                          ('n g', 'New gist page'),
                      ]
                   %>
                   %for key, desc in elems:
                   <tr>
                     <td class="keys">
                       <span class="key">${key}</span>
                     </td>
                     <td>${desc}</td>
                   </tr>
                 %endfor
                 </tbody>
                   </table>
               </div>
               <div class="col-md-offset-5">
                 <table class="keyboard-mappings">
                 <tbody>
                   <tr>
                     <th></th>
                     <th>${_('Repositories')}</th>
                   </tr>
                   <%
                      elems = [
                          ('g s', 'Goto summary page'),
                          ('g c', 'Goto changelog page'),
                          ('g f', 'Goto files page'),
                          ('g F', 'Goto files page with file search activated'),
                          ('g o', 'Goto repository settings'),
                          ('g O', 'Goto repository permissions settings'),
                      ]
                   %>
                   %for key, desc in elems:
                   <tr>
                     <td class="keys">
                       <span class="key">${key}</span>
                     </td>
                     <td>${desc}</td>
                   </tr>
                 %endfor
                 </tbody>
             </table>
               </div>
             </div>
         </div>
         <div class="modal-footer">
         </div>
       </div><!-- /.modal-content -->
     </div><!-- /.modal-dialog -->
 </div><!-- /.modal -->
 %endif

kallithea/templates/pullrequests/pullrequest.html

@@ -1,232 +1,232 b''
 <%inherit file="/base/base.html"/>
 
 <%block name="title">
     ${c.repo_name} ${_('New Pull Request')}
 </%block>
 
 <%def name="breadcrumbs_links()">
     ${_('New Pull Request')}
 </%def>
 
 <%block name="header_menu">
     ${self.menu('repositories')}
 </%block>
 
 <%def name="main()">
 ${self.repo_context_bar('showpullrequest')}
 <div class="box">
     <!-- box / title -->
     <div class="title">
         ${self.breadcrumbs()}
     </div>
 
     ${h.form(url('pullrequest', repo_name=c.repo_name), method='post', id='pull_request_form')}
     <div class="form">
         <!-- fields -->
 
         <div class="fields" style="float:left;width:50%;padding-right:30px;">
 
              <div class="field">
                 <div class="label">
                     <label for="pullrequest_title">${_('Title')}:</label>
                 </div>
                 <div class="input">
                     ${h.text('pullrequest_title',class_="large",placeholder=_('Summarize the changes - or leave empty'))}
                 </div>
              </div>
 
             <div class="field">
                 <div class="label label-textarea">
                     <label for="pullrequest_desc">${_('Description')}:</label>
                 </div>
                 <div class="textarea text-area editor">
                     ${h.textarea('pullrequest_desc',size=30,placeholder=_('Write a short description on this pull request'))}
                 </div>
             </div>
 
             <div class="field">
                 <div class="label label-textarea">
                     <label for="pullrequest_desc">${_('Changeset flow')}:</label>
                 </div>
                 <div class="input">
                     ##ORG
                     <div>
                         <div>
                             <div style="padding:5px 3px 3px 3px;">
                             <b>${_('Origin repository')}:</b> <span id="org_repo_desc">${c.db_repo.description.split('\n')[0]}</span>
                             </div>
                             <div>
                             ${h.select('org_repo','',c.cs_repos,class_='refs')}:${h.select('org_ref',c.default_cs_ref,c.cs_refs,class_='refs')}
                             </div>
                             <div style="padding:5px 3px 3px 3px;">
                             <b>${_('Revision')}:</b> <span id="org_rev_span">-</span>
                             </div>
                         </div>
                     </div>
 
                     ##OTHER, most Probably the PARENT OF THIS FORK
                     <div style="border-top: 1px solid #EEE; margin: 5px 0px 0px 0px">
                         <div>
                             ## filled with JS
                             <div style="padding:5px 3px 3px 3px;">
                             <b>${_('Destination repository')}:</b> <span id="other_repo_desc">${c.a_repo.description.split('\n')[0]}</span>
                             </div>
                             <div>
                             ${h.select('other_repo',c.a_repo.repo_name,c.a_repos,class_='refs')}:${h.select('other_ref',c.default_a_ref,c.a_refs,class_='refs')}
                             </div>
                             <div style="padding:5px 3px 3px 3px;">
                             <b>${_('Revision')}:</b> <span id="other_rev_span">-</span>
                             </div>
                         </div>
                     </div>
                     <div style="clear:both"></div>
                 </div>
             </div>
 
             <div class="field">
                 <div class="buttons">
                     ${h.submit('save',_('Create Pull Request'),class_="btn")}
                     ${h.reset('reset',_('Reset'),class_="btn")}
                </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" src="${h.url('/js/graph.js', ver=c.kallithea_version)}"></script>
 <script type="text/javascript">
   pyroutes.register('pullrequest_repo_info', "${url('pullrequest_repo_info',repo_name='%(repo_name)s')}", ['repo_name']);
 
   var pendingajax = undefined;
   var otherrepoChanged = function(){
       var $other_ref = $('#other_ref');
       $other_ref.prop('disabled', true);
       var repo_name = $('#other_repo').val();
       if (pendingajax) {
           pendingajax.abort();
           pendingajax = undefined;
       }
       pendingajax = ajaxGET(pyroutes.url('pullrequest_repo_info', {"repo_name": repo_name}),
           function(data){
               pendingajax = undefined;
               $('#other_repo_desc').html(data.description);
 
               // replace options of other_ref with the ones for the current other_repo
               $other_ref.empty();
               for(var i = 0; i < data.refs.length; i++)
               {
                 var $optgroup = $('<optgroup/>').prop('label', data.refs[i][1]);
                 var options = data.refs[i][0];
                 var length = options.length;
                 for(var j = 0; j < length; j++)
                 {
-                  $optgroup.append($('<option/>').text(options[j][1]).val(options[j][0]));
+                  $optgroup.append($('<'+'option/>').text(options[j][1]).val(options[j][0]));
                 }
                 $other_ref.append($optgroup);
               }
               $other_ref.val(data.selected_ref);
 
               // re-populate the select2 thingy
               $("#other_ref").select2({
                   dropdownAutoWidth: true
               });
 
               $other_ref.prop('disabled', false);
               loadPreview();
           });
   };
 
   var loadPreview = function(){
       //url template
       var url = "${h.url('compare_url',
                          repo_name='__other_repo__',
                          org_ref_type='rev',
                          org_ref_name='__other_ref_name__',
                          other_repo='__org_repo__',
                          other_ref_type='rev',
                          other_ref_name='__org_ref_name__',
                          as_form=True,
                          merge=True,
                          )}";
       var org_repo = $('#pull_request_form #org_repo').val();
       var org_ref = $('#pull_request_form #org_ref').val().split(':');
       ## TODO: make nice link like link_to_ref() do
       $('#org_rev_span').html(org_ref[2].substr(0,12));
 
       var other_repo = $('#pull_request_form #other_repo').val();
       var other_ref = $('#pull_request_form #other_ref').val().split(':');
       $('#other_rev_span').html(other_ref[2].substr(0,12));
 
       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]);
       }
 
       if (pendingajax) {
           pendingajax.abort();
           pendingajax = undefined;
       }
       pendingajax = asynchtml(url, $('#pull_request_overview'), function(o){
           pendingajax = undefined;
           var jsdata = eval('('+$('#jsdata').html()+')'); // TODO: just get json
           var r = new BranchRenderer('graph_canvas', 'graph_content_pr', 'chg_');
           r.render(jsdata,100);
       });
   }
 
   $(document).ready(function(){
       $("#org_repo").select2({
           dropdownAutoWidth: true
       });
       ## (org_repo can't change)
 
       $("#org_ref").select2({
           dropdownAutoWidth: true,
           sortResults: branchSort
       });
       $("#org_ref").on("change", function(e){
           loadPreview();
       });
 
       $("#other_repo").select2({
           dropdownAutoWidth: true
       });
       $("#other_repo").on("change", function(e){
           otherrepoChanged();
       });
 
       $("#other_ref").select2({
           dropdownAutoWidth: true,
           sortResults: branchSort
       });
       $("#other_ref").on("change", function(e){
           loadPreview();
       });
 
       //lazy load overview after 0.5s
       setTimeout(loadPreview, 500);
   });
 
 </script>
 
 </%def>