Saving files works

This commit is contained in:
Thomas Kluyver 2014-11-05 16:48:23 -08:00
parent 25ee73a554
commit f49bef7b0d
3 changed files with 116 additions and 3 deletions

View File

@ -5,16 +5,20 @@ require([
'jquery', 'jquery',
'base/js/utils', 'base/js/utils',
'base/js/page', 'base/js/page',
'base/js/events',
'contents', 'contents',
'codemirror/lib/codemirror', 'codemirror/lib/codemirror',
'texteditor/js/menubar',
'codemirror/mode/meta', 'codemirror/mode/meta',
'custom/custom', 'custom/custom',
], function( ], function(
$, $,
utils, utils,
page, page,
events,
contents, contents,
CodeMirror CodeMirror,
menubar
){ ){
page = new page.Page(); page = new page.Page();
@ -29,7 +33,7 @@ require([
basename = file_path; basename = file_path;
} else { } else {
dir_path = file_path.substring(0, ix); dir_path = file_path.substring(0, ix);
basename = file_path.substring(ix); basename = file_path.substring(ix+1);
} }
contents.load(dir_path, basename, { contents.load(dir_path, basename, {
success: function(model) { success: function(model) {
@ -40,6 +44,14 @@ require([
value: model.content, value: model.content,
}); });
var menus = new menubar.MenuBar('#menubar', {
base_url: base_url,
codemirror: cm,
contents: contents,
events: events,
file_path: file_path
});
// Find and load the highlighting mode // Find and load the highlighting mode
var modeinfo = CodeMirror.findModeByMIME(model.mimetype); var modeinfo = CodeMirror.findModeByMIME(model.mimetype);
if (modeinfo) { if (modeinfo) {

View File

@ -0,0 +1,70 @@
// Copyright (c) IPython Development Team.
// Distributed under the terms of the Modified BSD License.
define([
'base/js/namespace',
'jquery',
'base/js/utils',
'bootstrap',
], function(IPython, $, utils, bootstrap) {
"use strict";
var MenuBar = function (selector, options) {
// Constructor
//
// A MenuBar Class to generate the menubar of IPython notebook
//
// Parameters:
// selector: string
// options: dictionary
// Dictionary of keyword arguments.
// codemirror: CodeMirror instance
// contents: ContentManager instance
// events: $(Events) instance
// base_url : string
// file_path : string
options = options || {};
this.base_url = options.base_url || utils.get_body_data("baseUrl");
this.selector = selector;
this.codemirror = options.codemirror;
this.contents = options.contents;
this.events = options.events;
this.file_path = options.file_path;
if (this.selector !== undefined) {
this.element = $(selector);
this.bind_events();
}
};
MenuBar.prototype.bind_events = function () {
// File
var that = this;
this.element.find('#save_file').click(function () {
var ix = that.file_path.lastIndexOf("/");
var dir_path, basename;
if (ix === -1) {
dir_path = '';
basename = that.file_path;
} else {
dir_path = that.file_path.substring(0, ix);
basename = that.file_path.substring(ix+1);
}
var model = {
path: dir_path,
name: basename,
type: 'file',
format: 'text',
content: that.codemirror.getValue(),
};
console.log(model);
that.contents.save(dir_path, basename, model, {
success: function() {
that.events.trigger("save_succeeded.TextEditor");
}
});
});
};
return {'MenuBar': MenuBar};
});

View File

@ -17,6 +17,37 @@ data-file-path="{{file_path}}"
{% block site %} {% block site %}
<div id="menubar-container" class="container">
<div id="menubar">
<div id="menus" class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<button type="button" class="btn btn-default navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<i class="fa fa-bars"></i>
<span class="navbar-text">Menu</span>
</button>
<ul class="nav navbar-nav navbar-right">
<li id="kernel_indicator">
<i id="kernel_indicator_icon"></i>
</li>
<li id="modal_indicator">
<i id="modal_indicator_icon"></i>
</li>
<li id="notification_area"></li>
</ul>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">File</a>
<ul id="file_menu" class="dropdown-menu">
<li id="save_file"><a href="#">Save</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div id="texteditor-container"></div> <div id="texteditor-container"></div>
{% endblock %} {% endblock %}