Merge pull request #279 from ilvalle/fix-editor

Dynamic tab width in editor settings

applications/admin/controllers/default.py

@@ -563,7 +563,7 @@ def edit():
     # Load json only if it is ajax edited...
     app = get_app(request.vars.app)
     app_path = apath(app, r=request)
-    editor_defaults={'theme':'web2py', 'editor': 'default', 'closetag': 'true', 'codefolding': 'false', 'tabwidth':'4', 'indentwithtabs':'false'}
+    editor_defaults={'theme':'web2py', 'editor': 'default', 'closetag': 'true', 'codefolding': 'false', 'tabwidth':'4', 'indentwithtabs':'false', 'linenumbers':'true', 'highlightline':'true'}
     config = Config(os.path.join(request.folder, 'settings.cfg'),
                     section='editor', default_values=editor_defaults)
     preferences = config.read()
@@ -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:
@@ -586,7 +586,7 @@ def edit():
             response.headers["web2py-component-command"] = "update_editor(%s);$('a[href=#editor_settings] button.close').click();" % response.json(config.read())
             return
         else:
-            details = {'filename':'settings', 'id':'editor_settings', 'force': False}
+            details = {'realfilename':'settings', 'filename':'settings', 'id':'editor_settings', 'force': False}
             details['plain_html'] = response.render('default/editor_settings.html', {'editor_settings':preferences})
             return response.json(details)
 
@@ -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");});
 });
 
@@ -132,6 +136,13 @@ function update_editor(preferences) {
         editor.setOption("indentUnit", parseInt(preferences.tabwidth));
         editor.setOption("tabSize", parseInt(preferences.tabwidth));
         editor.setOption("indentWithTabs", (preferences.indentwithtabs === 'true'));
+        if (preferences.linenumbers === 'true') {
+            gutters = editor.getOption("gutters");
+            gutters.splice(0, 0, 'CodeMirror-linenumbers');
+            editor.setOption("gutter", gutters);
+        }
+        editor.setOption("lineNumbers", (preferences.linenumbers === 'true'));
+        editor.setOption("styleActiveLine", (preferences.highlightline === 'true'));
     });
 }
 

applications/admin/views/default/edit_js.html

@@ -47,11 +47,11 @@
     {{else:}}
         mode: { name: '{{=filetype}}'{{if filetype=='python':}},version: 2,singleLineStringErrors: false, {{pass}} },
     {{pass}}
-        lineNumbers: true,
+        lineNumbers: {{=editor_settings['linenumbers']}},
         indentUnit: {{=editor_settings['tabwidth']}},
         indentWithTabs: {{=editor_settings['indentwithtabs']}},
         tabSize: {{=editor_settings['tabwidth']}},
-        styleActiveLine: true,
+        styleActiveLine: {{=editor_settings['highlightline']}},
         autoCloseTags: {{=editor_settings['closetag']}},
         theme: "{{=editor_settings['theme']}}",
         lineWrapping: true,

applications/admin/views/default/editor_settings.html

@@ -26,13 +26,21 @@
 		<div class="controls">{{=stateWidget("codefolding", value=editor_settings['codefolding'])}}</div>
 	</div>
 	<div class="control-group">
-		<label class="control-label" for="codefolding">{{=T('Tab width (# characters)')}}</label>
+		<label class="control-label" for="tabwidth">{{=T('Tab width (# characters)')}}</label>
 		<div class="controls">{{=SELECT(range(1,9, 1), value=editor_settings['tabwidth'], _name="tabwidth" )}}</div>
 	</div>
 	<div class="control-group">
-		<label class="control-label" for="codefolding">{{=T('Indent with tabs')}}</label>
+		<label class="control-label" for="indentwithtabs">{{=T('Indent with tabs')}}</label>
 		<div class="controls">{{=stateWidget("indentwithtabs", value=editor_settings['indentwithtabs'])}}</div>
 	</div>
+    <div class="control-group">
+        <label class="control-label" for="linenumbers">{{=T('Display line numbers')}}</label>
+        <div class="controls">{{=stateWidget("linenumbers", value=editor_settings['linenumbers'])}}</div>
+    </div>
+    <div class="control-group">
+        <label class="control-label" for="highlightline">{{=T('Highlight current line')}}</label>
+        <div class="controls">{{=stateWidget("highlightline", value=editor_settings['highlightline'])}}</div>
+    </div>
 	<div class="control-group">
 		<div class="controls"><button type="submit" class="disabled btn btn-primary">{{=T('Save')}}</button></div>
 	</div>