##// END OF EJS Templates
add download link to editor
Min RK -
Show More
@@ -1,155 +1,160 b''
1 // Copyright (c) IPython Development Team.
1 // Copyright (c) IPython Development Team.
2 // Distributed under the terms of the Modified BSD License.
2 // Distributed under the terms of the Modified BSD License.
3
3
4 define([
4 define([
5 'jquery',
5 'jquery',
6 'base/js/namespace',
6 'base/js/namespace',
7 'base/js/utils',
7 'base/js/utils',
8 'base/js/dialog',
8 'base/js/dialog',
9 'codemirror/lib/codemirror',
9 'codemirror/lib/codemirror',
10 'codemirror/mode/meta',
10 'codemirror/mode/meta',
11 'bootstrap',
11 'bootstrap',
12 ], function($, IPython, utils, dialog, CodeMirror) {
12 ], function($, IPython, utils, dialog, CodeMirror) {
13 "use strict";
13 "use strict";
14
14
15 var MenuBar = function (selector, options) {
15 var MenuBar = function (selector, options) {
16 /**
16 /**
17 * Constructor
17 * Constructor
18 *
18 *
19 * A MenuBar Class to generate the menubar of IPython notebook
19 * A MenuBar Class to generate the menubar of IPython notebook
20 *
20 *
21 * Parameters:
21 * Parameters:
22 * selector: string
22 * selector: string
23 * options: dictionary
23 * options: dictionary
24 * Dictionary of keyword arguments.
24 * Dictionary of keyword arguments.
25 * codemirror: CodeMirror instance
25 * codemirror: CodeMirror instance
26 * contents: ContentManager instance
26 * contents: ContentManager instance
27 * events: $(Events) instance
27 * events: $(Events) instance
28 * base_url : string
28 * base_url : string
29 * file_path : string
29 * file_path : string
30 */
30 */
31 options = options || {};
31 options = options || {};
32 this.base_url = options.base_url || utils.get_body_data("baseUrl");
32 this.base_url = options.base_url || utils.get_body_data("baseUrl");
33 this.selector = selector;
33 this.selector = selector;
34 this.editor = options.editor;
34 this.editor = options.editor;
35 this.events = options.events;
35 this.events = options.events;
36 this.save_widget = options.save_widget;
36 this.save_widget = options.save_widget;
37
37
38 if (this.selector !== undefined) {
38 if (this.selector !== undefined) {
39 this.element = $(selector);
39 this.element = $(selector);
40 this.bind_events();
40 this.bind_events();
41 }
41 }
42 this._load_mode_menu();
42 this._load_mode_menu();
43 Object.seal(this);
43 Object.seal(this);
44 };
44 };
45
45
46 MenuBar.prototype.bind_events = function () {
46 MenuBar.prototype.bind_events = function () {
47 var that = this;
47 var that = this;
48 var editor = that.editor;
48 var editor = that.editor;
49
49
50 // File
50 // File
51 this.element.find('#new-file').click(function () {
51 this.element.find('#new-file').click(function () {
52 var w = window.open();
52 var w = window.open();
53 // Create a new file in the current directory
53 // Create a new file in the current directory
54 var parent = utils.url_path_split(editor.file_path)[0];
54 var parent = utils.url_path_split(editor.file_path)[0];
55 editor.contents.new_untitled(parent, {type: "file"}).then(
55 editor.contents.new_untitled(parent, {type: "file"}).then(
56 function (data) {
56 function (data) {
57 w.location = utils.url_join_encode(
57 w.location = utils.url_join_encode(
58 that.base_url, 'edit', data.path
58 that.base_url, 'edit', data.path
59 );
59 );
60 },
60 },
61 function(error) {
61 function(error) {
62 w.close();
62 w.close();
63 dialog.modal({
63 dialog.modal({
64 title : 'Creating New File Failed',
64 title : 'Creating New File Failed',
65 body : "The error was: " + error.message,
65 body : "The error was: " + error.message,
66 buttons : {'OK' : {'class' : 'btn-primary'}}
66 buttons : {'OK' : {'class' : 'btn-primary'}}
67 });
67 });
68 }
68 }
69 );
69 );
70 });
70 });
71 this.element.find('#save-file').click(function () {
71 this.element.find('#save-file').click(function () {
72 editor.save();
72 editor.save();
73 });
73 });
74 this.element.find('#rename-file').click(function () {
74 this.element.find('#rename-file').click(function () {
75 that.save_widget.rename();
75 that.save_widget.rename();
76 });
76 });
77 this.element.find('#download-file').click(function () {
78 window.open(utils.url_join_encode(
79 that.base_url, 'files', that.editor.file_path
80 ) + '?download=1');
81 });
77
82
78 // Edit
83 // Edit
79 this.element.find('#menu-find').click(function () {
84 this.element.find('#menu-find').click(function () {
80 editor.codemirror.execCommand("find");
85 editor.codemirror.execCommand("find");
81 });
86 });
82 this.element.find('#menu-replace').click(function () {
87 this.element.find('#menu-replace').click(function () {
83 editor.codemirror.execCommand("replace");
88 editor.codemirror.execCommand("replace");
84 });
89 });
85 this.element.find('#menu-keymap-default').click(function () {
90 this.element.find('#menu-keymap-default').click(function () {
86 editor.update_codemirror_options({
91 editor.update_codemirror_options({
87 vimMode: false,
92 vimMode: false,
88 keyMap: 'default'
93 keyMap: 'default'
89 });
94 });
90 });
95 });
91 this.element.find('#menu-keymap-sublime').click(function () {
96 this.element.find('#menu-keymap-sublime').click(function () {
92 editor.update_codemirror_options({
97 editor.update_codemirror_options({
93 vimMode: false,
98 vimMode: false,
94 keyMap: 'sublime'
99 keyMap: 'sublime'
95 });
100 });
96 });
101 });
97 this.element.find('#menu-keymap-emacs').click(function () {
102 this.element.find('#menu-keymap-emacs').click(function () {
98 editor.update_codemirror_options({
103 editor.update_codemirror_options({
99 vimMode: false,
104 vimMode: false,
100 keyMap: 'emacs'
105 keyMap: 'emacs'
101 });
106 });
102 });
107 });
103 this.element.find('#menu-keymap-vim').click(function () {
108 this.element.find('#menu-keymap-vim').click(function () {
104 editor.update_codemirror_options({
109 editor.update_codemirror_options({
105 vimMode: true,
110 vimMode: true,
106 keyMap: 'vim'
111 keyMap: 'vim'
107 });
112 });
108 });
113 });
109
114
110 // View
115 // View
111 this.element.find('#menu-line-numbers').click(function () {
116 this.element.find('#menu-line-numbers').click(function () {
112 var current = editor.codemirror.getOption('lineNumbers');
117 var current = editor.codemirror.getOption('lineNumbers');
113 var value = Boolean(1-current);
118 var value = Boolean(1-current);
114 editor.update_codemirror_options({lineNumbers: value});
119 editor.update_codemirror_options({lineNumbers: value});
115 });
120 });
116
121
117 this.events.on("config_changed.Editor", function () {
122 this.events.on("config_changed.Editor", function () {
118 var keyMap = editor.codemirror.getOption('keyMap') || "default";
123 var keyMap = editor.codemirror.getOption('keyMap') || "default";
119 that.element.find(".selected-keymap").removeClass("selected-keymap");
124 that.element.find(".selected-keymap").removeClass("selected-keymap");
120 that.element.find("#menu-keymap-" + keyMap).addClass("selected-keymap");
125 that.element.find("#menu-keymap-" + keyMap).addClass("selected-keymap");
121 });
126 });
122
127
123 this.events.on("mode_changed.Editor", function (evt, modeinfo) {
128 this.events.on("mode_changed.Editor", function (evt, modeinfo) {
124 that.element.find("#current-mode")
129 that.element.find("#current-mode")
125 .text(modeinfo.name)
130 .text(modeinfo.name)
126 .attr(
131 .attr(
127 'title',
132 'title',
128 "The current language is " + modeinfo.name
133 "The current language is " + modeinfo.name
129 );
134 );
130 });
135 });
131 };
136 };
132
137
133 MenuBar.prototype._load_mode_menu = function () {
138 MenuBar.prototype._load_mode_menu = function () {
134 var list = this.element.find("#mode-menu");
139 var list = this.element.find("#mode-menu");
135 var editor = this.editor;
140 var editor = this.editor;
136 function make_set_mode(info) {
141 function make_set_mode(info) {
137 return function () {
142 return function () {
138 editor.set_codemirror_mode(info);
143 editor.set_codemirror_mode(info);
139 };
144 };
140 }
145 }
141 for (var i = 0; i < CodeMirror.modeInfo.length; i++) {
146 for (var i = 0; i < CodeMirror.modeInfo.length; i++) {
142 var info = CodeMirror.modeInfo[i];
147 var info = CodeMirror.modeInfo[i];
143 list.append($("<li>").append(
148 list.append($("<li>").append(
144 $("<a>").attr("href", "#")
149 $("<a>").attr("href", "#")
145 .text(info.name)
150 .text(info.name)
146 .click(make_set_mode(info))
151 .click(make_set_mode(info))
147 .attr('title',
152 .attr('title',
148 "Set language to " + info.name
153 "Set language to " + info.name
149 )
154 )
150 ));
155 ));
151 }
156 }
152 };
157 };
153
158
154 return {'MenuBar': MenuBar};
159 return {'MenuBar': MenuBar};
155 });
160 });
@@ -1,98 +1,99 b''
1 {% extends "page.html" %}
1 {% extends "page.html" %}
2
2
3 {% block title %}{{page_title}}{% endblock %}
3 {% block title %}{{page_title}}{% endblock %}
4
4
5 {% block stylesheet %}
5 {% block stylesheet %}
6 <link rel="stylesheet" href="{{ static_url('components/codemirror/lib/codemirror.css') }}">
6 <link rel="stylesheet" href="{{ static_url('components/codemirror/lib/codemirror.css') }}">
7 <link rel="stylesheet" href="{{ static_url('components/codemirror/addon/dialog/dialog.css') }}">
7 <link rel="stylesheet" href="{{ static_url('components/codemirror/addon/dialog/dialog.css') }}">
8 {{super()}}
8 {{super()}}
9 {% endblock %}
9 {% endblock %}
10
10
11 {% block bodyclasses %}edit_app {{super()}}{% endblock %}
11 {% block bodyclasses %}edit_app {{super()}}{% endblock %}
12
12
13 {% block params %}
13 {% block params %}
14 data-base-url="{{base_url}}"
14 data-base-url="{{base_url}}"
15 data-file-path="{{file_path}}"
15 data-file-path="{{file_path}}"
16 {{super()}}
16 {{super()}}
17 {% endblock %}
17 {% endblock %}
18
18
19 {% block headercontainer %}
19 {% block headercontainer %}
20
20
21 <span id="save_widget" class="pull-left save_widget">
21 <span id="save_widget" class="pull-left save_widget">
22 <span class="filename"></span>
22 <span class="filename"></span>
23 <span class="last_modified"></span>
23 <span class="last_modified"></span>
24 </span>
24 </span>
25
25
26 {% endblock %}
26 {% endblock %}
27
27
28 {% block header %}
28 {% block header %}
29
29
30 <div id="menubar-container" class="container">
30 <div id="menubar-container" class="container">
31 <div id="menubar">
31 <div id="menubar">
32 <div id="menus" class="navbar navbar-default" role="navigation">
32 <div id="menus" class="navbar navbar-default" role="navigation">
33 <div class="container-fluid">
33 <div class="container-fluid">
34 <p class="navbar-text indicator_area">
34 <p class="navbar-text indicator_area">
35 <span id="current-mode" >current mode</span>
35 <span id="current-mode" >current mode</span>
36 </p>
36 </p>
37 <button type="button" class="btn btn-default navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
37 <button type="button" class="btn btn-default navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
38 <i class="fa fa-bars"></i>
38 <i class="fa fa-bars"></i>
39 <span class="navbar-text">Menu</span>
39 <span class="navbar-text">Menu</span>
40 </button>
40 </button>
41 <ul class="nav navbar-nav navbar-right">
41 <ul class="nav navbar-nav navbar-right">
42 <li id="notification_area"></li>
42 <li id="notification_area"></li>
43 </ul>
43 </ul>
44 <div class="navbar-collapse collapse">
44 <div class="navbar-collapse collapse">
45 <ul class="nav navbar-nav">
45 <ul class="nav navbar-nav">
46 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">File</a>
46 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">File</a>
47 <ul id="file-menu" class="dropdown-menu">
47 <ul id="file-menu" class="dropdown-menu">
48 <li id="new-file"><a href="#">New</a></li>
48 <li id="new-file"><a href="#">New</a></li>
49 <li id="save-file"><a href="#">Save</a></li>
49 <li id="save-file"><a href="#">Save</a></li>
50 <li id="rename-file"><a href="#">Rename</a></li>
50 <li id="rename-file"><a href="#">Rename</a></li>
51 <li id="download-file"><a href="#">Download</a></li>
51 </ul>
52 </ul>
52 </li>
53 </li>
53 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Edit</a>
54 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Edit</a>
54 <ul id="edit-menu" class="dropdown-menu">
55 <ul id="edit-menu" class="dropdown-menu">
55 <li id="menu-find"><a href="#">Find</a></li>
56 <li id="menu-find"><a href="#">Find</a></li>
56 <li id="menu-replace"><a href="#">Find &amp; Replace</a></li>
57 <li id="menu-replace"><a href="#">Find &amp; Replace</a></li>
57 <li class="divider"></li>
58 <li class="divider"></li>
58 <li class="dropdown-header">Key Map</li>
59 <li class="dropdown-header">Key Map</li>
59 <li id="menu-keymap-default"><a href="#">Default<i class="fa"></i></a></li>
60 <li id="menu-keymap-default"><a href="#">Default<i class="fa"></i></a></li>
60 <li id="menu-keymap-sublime"><a href="#">Sublime Text<i class="fa"></i></a></li>
61 <li id="menu-keymap-sublime"><a href="#">Sublime Text<i class="fa"></i></a></li>
61 <li id="menu-keymap-vim"><a href="#">Vim<i class="fa"></i></a></li>
62 <li id="menu-keymap-vim"><a href="#">Vim<i class="fa"></i></a></li>
62 <li id="menu-keymap-emacs"><a href="#">emacs<i class="fa"></i></a></li>
63 <li id="menu-keymap-emacs"><a href="#">emacs<i class="fa"></i></a></li>
63 </ul>
64 </ul>
64 </li>
65 </li>
65 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">View</a>
66 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">View</a>
66 <ul id="view-menu" class="dropdown-menu">
67 <ul id="view-menu" class="dropdown-menu">
67 <li id="menu-line-numbers"><a href="#">Toggle Line Numbers</a></li>
68 <li id="menu-line-numbers"><a href="#">Toggle Line Numbers</a></li>
68 </ul>
69 </ul>
69 </li>
70 </li>
70 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Language</a>
71 <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Language</a>
71 <ul id="mode-menu" class="dropdown-menu">
72 <ul id="mode-menu" class="dropdown-menu">
72 </ul>
73 </ul>
73 </li>
74 </li>
74 </ul>
75 </ul>
75 </div>
76 </div>
76 </div>
77 </div>
77 </div>
78 </div>
78 </div>
79 </div>
79 </div>
80 </div>
80
81
81 <div class="lower-header-bar"></div>
82 <div class="lower-header-bar"></div>
82
83
83 {% endblock %}
84 {% endblock %}
84
85
85 {% block site %}
86 {% block site %}
86
87
87 <div id="texteditor-backdrop">
88 <div id="texteditor-backdrop">
88 <div id="texteditor-container" class="container"></div>
89 <div id="texteditor-container" class="container"></div>
89 </div>
90 </div>
90
91
91 {% endblock %}
92 {% endblock %}
92
93
93 {% block script %}
94 {% block script %}
94
95
95 {{super()}}
96 {{super()}}
96
97
97 <script src="{{ static_url("edit/js/main.js") }}" type="text/javascript" charset="utf-8"></script>
98 <script src="{{ static_url("edit/js/main.js") }}" type="text/javascript" charset="utf-8"></script>
98 {% endblock %}
99 {% endblock %}
General Comments 0
You need to be logged in to leave comments. Login now