dynamic tab size in admin editor (all tabs are placed along the same line)

applications/admin/controllers/default.py

@@ -571,7 +571,7 @@ def edit():
     if not(request.ajax) and not(is_mobile):
         # return the scaffolding, the rest will be through ajax requests
         response.title = T('Editing %s') % app
-        return response.render ('default/edit.html', dict(app=request.args[0], editor_settings=preferences))
+        return response.render ('default/edit.html', dict(app=app, editor_settings=preferences))
 
     # show settings tab and save prefernces
     if 'settings' in request.vars:
@@ -594,7 +594,7 @@ def edit():
     # Load json only if it is ajax edited...
     app = get_app(request.vars.app)
     filename = '/'.join(request.args)
-    response.title = request.args[-1]
+    realfilename = request.args[-1]
     if request.vars.app:
         path = abspath(filename)
     else:
@@ -751,6 +751,7 @@ def edit():
         file_details = dict(app=request.args[0],
                     editor_settings=preferences,
                     filename=filename,
+                    realfilename=realfilename,
                     filetype=filetype,
                     data=data,
                     edit_controller=edit_controller,

applications/admin/static/css/web2py-codemirror.css

@@ -16,3 +16,23 @@
 	background-repeat: repeat-x;
 }
 
+/* Close button on tab*/
+.nav-tabs li a > .close {
+    font-size: 18px;
+    padding-left: 5px;
+    float: right;
+    margin-right: -10px;
+    padding-right: 5px;
+}
+
+.nav-tabs>li>a {
+    overflow: hidden;
+    white-space: nowrap;
+    word-wrap: normal;
+    -o-text-overflow: ellipsis;
+    text-overflow: ellipsis;
+}
+
+/*.nav-tabs>li {
+    min-width: 100px;
+}*/

applications/admin/static/js/ajax_editor.js

@@ -260,7 +260,7 @@ function load_file(url) {
       if(typeof (json['plain_html']) !== undefined) {
         if($('#' + json['id']).length === 0 || json['force'] === true) {
           // Create a tab and put the code in it
-          var tab_header = '<li><a href="#' + json['id'] + '" data-toggle="tab">' + json['filename'] + '<button type="button" class="close">&times;</button></a></li>';
+          var tab_header = '<li><a title="'+ json['filename'] +'" href="#' + json['id'] + '" data-toggle="tab"><button type="button" class="close">&times;</button>' + json['realfilename'] + '</a></li>';
           var tab_body = '<div id="' + json['id'] + '" class="tab-pane fade in " >' + json['plain_html'] + '</div>';
           if(json['force'] === false) {
             $('#filesTab').append($(tab_header));

applications/admin/views/default/edit.html

@@ -59,6 +59,10 @@ $(document).on('shown click', 'a[data-toggle="tab"]', function (e) {
         editor.setSize($(tab_id).width(),  $(tab_id).height());
         editor.refresh();
     }
+    var n_li = $('#filesTab li').length;
+    $.each($('#filesTab li'), function(index, element) {
+        $(element).css('max-width', 100/n_li + '%' );
+    });
     //$(function(){$('.CodeMirror-scroll').css("height","auto").css("overflow-x","auto");});
 });