savewidget.js
260 lines
| 8.8 KiB
| application/javascript
|
JavascriptLexer
|
r17198 | // Copyright (c) IPython Development Team. | ||
// Distributed under the terms of the Modified BSD License. | ||||
define([ | ||||
'base/js/namespace', | ||||
|
r17200 | 'jquery', | ||
|
r17198 | 'base/js/utils', | ||
'base/js/dialog', | ||||
'base/js/keyboard', | ||||
|
r17474 | 'moment', | ||
], function(IPython, $, utils, dialog, keyboard, moment) { | ||||
|
r12103 | "use strict"; | ||
|
r4369 | |||
|
r17213 | var SaveWidget = function (selector, options) { | ||
|
r19176 | /** | ||
* TODO: Remove circular ref. | ||||
*/ | ||||
|
r17198 | this.notebook = undefined; | ||
|
r4372 | this.selector = selector; | ||
|
r17213 | this.events = options.events; | ||
|
r17474 | this._checkpoint_date = undefined; | ||
|
r17213 | this.keyboard_manager = options.keyboard_manager; | ||
|
r4372 | if (this.selector !== undefined) { | ||
this.element = $(selector); | ||||
|
r4369 | this.bind_events(); | ||
} | ||||
}; | ||||
|
r4372 | |||
|
r4369 | SaveWidget.prototype.bind_events = function () { | ||
var that = this; | ||||
|
r19315 | this.element.find('span.filename').click(function () { | ||
|
r18964 | that.rename_notebook({notebook: that.notebook}); | ||
|
r4372 | }); | ||
|
r17198 | this.events.on('notebook_loaded.Notebook', function () { | ||
|
r6047 | that.update_notebook_name(); | ||
that.update_document_title(); | ||||
}); | ||||
|
r17198 | this.events.on('notebook_saved.Notebook', function () { | ||
|
r6047 | that.update_notebook_name(); | ||
that.update_document_title(); | ||||
}); | ||||
|
r17198 | this.events.on('notebook_renamed.Notebook', function () { | ||
|
r13012 | that.update_notebook_name(); | ||
that.update_document_title(); | ||||
|
r13010 | that.update_address_bar(); | ||
|
r12997 | }); | ||
|
r17198 | this.events.on('notebook_save_failed.Notebook', function () { | ||
|
r10829 | that.set_save_status('Autosave Failed!'); | ||
|
r6047 | }); | ||
|
r19005 | this.events.on('notebook_read_only.Notebook', function () { | ||
that.set_save_status('(read only)'); | ||||
// disable future set_save_status | ||||
that.set_save_status = function () {}; | ||||
}); | ||||
|
r17198 | this.events.on('checkpoints_listed.Notebook', function (event, data) { | ||
|
r17474 | that._set_last_checkpoint(data[0]); | ||
|
r10516 | }); | ||
|
r12368 | |||
|
r17198 | this.events.on('checkpoint_created.Notebook', function (event, data) { | ||
|
r17474 | that._set_last_checkpoint(data); | ||
|
r10516 | }); | ||
|
r17198 | this.events.on('set_dirty.Notebook', function (event, data) { | ||
|
r10829 | that.set_autosaved(data.value); | ||
}); | ||||
|
r5006 | }; | ||
|
r17213 | SaveWidget.prototype.rename_notebook = function (options) { | ||
options = options || {}; | ||||
|
r5859 | var that = this; | ||
|
r17203 | var dialog_body = $('<div/>').append( | ||
|
r10956 | $("<p/>").addClass("rename-message") | ||
|
r14634 | .text('Enter a new notebook name:') | ||
|
r10956 | ).append( | ||
$("<br/>") | ||||
).append( | ||||
|
r16957 | $('<input/>').attr('type','text').attr('size','25').addClass('form-control') | ||
|
r18964 | .val(options.notebook.get_notebook_name()) | ||
|
r5859 | ); | ||
|
r18964 | var d = dialog.modal({ | ||
|
r5859 | title: "Rename Notebook", | ||
|
r17203 | body: dialog_body, | ||
|
r17213 | notebook: options.notebook, | ||
keyboard_manager: this.keyboard_manager, | ||||
|
r5859 | buttons : { | ||
|
r10895 | "OK": { | ||
class: "btn-primary", | ||||
click: function () { | ||||
|
r18964 | var new_name = d.find('input').val(); | ||
if (!options.notebook.test_notebook_name(new_name)) { | ||||
d.find('.rename-message').text( | ||||
"Invalid notebook name. Notebook names must "+ | ||||
"have 1 or more characters and can contain any characters " + | ||||
"except :/\\. Please enter a new notebook name:" | ||||
); | ||||
return false; | ||||
} else { | ||||
d.find('.rename-message').text("Renaming..."); | ||||
d.find('input[type="text"]').prop('disabled', true); | ||||
that.notebook.rename(new_name).then( | ||||
function () { | ||||
d.modal('hide'); | ||||
}, function (error) { | ||||
d.find('.rename-message').text(error.message || 'Unknown error'); | ||||
d.find('input[type="text"]').prop('disabled', false).focus().select(); | ||||
} | ||||
); | ||||
return false; | ||||
} | ||||
|
r5859 | } | ||
|
r18964 | }, | ||
|
r18926 | "Cancel": {} | ||
|
r5859 | }, | ||
|
r18964 | open : function () { | ||
|
r19176 | /** | ||
* Upon ENTER, click the OK button. | ||||
*/ | ||||
|
r18964 | d.find('input[type="text"]').keydown(function (event) { | ||
|
r17213 | if (event.which === keyboard.keycodes.enter) { | ||
|
r18964 | d.find('.btn-primary').first().click(); | ||
|
r12019 | return false; | ||
|
r7246 | } | ||
}); | ||||
|
r18964 | d.find('input[type="text"]').focus().select(); | ||
|
r5859 | } | ||
}); | ||||
|
r17198 | }; | ||
|
r5859 | |||
|
r4645 | |||
|
r6047 | SaveWidget.prototype.update_notebook_name = function () { | ||
|
r17198 | var nbname = this.notebook.get_notebook_name(); | ||
|
r19315 | this.element.find('span.filename').text(nbname); | ||
|
r5479 | }; | ||
|
r4372 | |||
|
r4369 | |||
|
r6047 | SaveWidget.prototype.update_document_title = function () { | ||
|
r17198 | var nbname = this.notebook.get_notebook_name(); | ||
|
r5104 | document.title = nbname; | ||
|
r4549 | }; | ||
|
r17474 | |||
|
r13010 | SaveWidget.prototype.update_address_bar = function(){ | ||
|
r17198 | var base_url = this.notebook.base_url; | ||
var path = this.notebook.notebook_path; | ||||
|
r18752 | var state = {path : path}; | ||
|
r13693 | window.history.replaceState(state, "", utils.url_join_encode( | ||
|
r15483 | base_url, | ||
"notebooks", | ||||
|
r18752 | path) | ||
|
r13103 | ); | ||
|
r15483 | }; | ||
|
r4484 | |||
|
r6047 | SaveWidget.prototype.set_save_status = function (msg) { | ||
|
r19315 | this.element.find('span.autosave_status').text(msg); | ||
|
r17198 | }; | ||
|
r10516 | |||
|
r17474 | SaveWidget.prototype._set_checkpoint_status = function (human_date, iso_date) { | ||
|
r19315 | var el = this.element.find('span.checkpoint_status'); | ||
|
r17474 | if(human_date){ | ||
el.text("Last Checkpoint: "+human_date).attr('title',iso_date); | ||||
} else { | ||||
|
r17715 | el.text('').attr('title', 'no-checkpoint'); | ||
|
r17474 | } | ||
|
r17198 | }; | ||
|
r4484 | |||
|
r17474 | // compute (roughly) the remaining time in millisecond until the next | ||
// moment.js relative time update of the string, which by default | ||||
// happend at | ||||
// (a few seconds ago) | ||||
// - 45sec, | ||||
// (a minute ago) | ||||
// - 90sec, | ||||
// ( x minutes ago) | ||||
// - then every minutes until | ||||
// - 45 min, | ||||
// (an hour ago) | ||||
// - 1h45, | ||||
// (x hours ago ) | ||||
// - then every hours | ||||
// - 22 hours ago | ||||
var _next_timeago_update = function(deltatime_ms){ | ||||
var s = 1000; | ||||
var m = 60*s; | ||||
var h = 60*m; | ||||
var mtt = moment.relativeTimeThreshold; | ||||
if(deltatime_ms < mtt.s*s){ | ||||
return mtt.s*s-deltatime_ms; | ||||
} else if (deltatime_ms < (mtt.s*s+m)) { | ||||
return (mtt.s*s+m)-deltatime_ms; | ||||
} else if (deltatime_ms < mtt.m*m){ | ||||
return m; | ||||
} else if (deltatime_ms < (mtt.m*m+h)){ | ||||
return (mtt.m*m+h)-deltatime_ms; | ||||
} else { | ||||
return h; | ||||
} | ||||
|
r17715 | }; | ||
|
r17474 | |||
SaveWidget.prototype._regularly_update_checkpoint_date = function(){ | ||||
if (!this._checkpoint_date) { | ||||
|
r17715 | this._set_checkpoint_status(null); | ||
|
r17474 | console.log('no checkpoint done'); | ||
|
r10547 | return; | ||
|
r10532 | } | ||
|
r17474 | var chkd = moment(this._checkpoint_date); | ||
var longdate = chkd.format('llll'); | ||||
var that = this; | ||||
var recall = function(t){ | ||||
|
r19176 | /** | ||
* recall slightly later (1s) as long timeout in js might be imprecise, | ||||
* and you want to be call **after** the change of formatting should happend. | ||||
*/ | ||||
|
r17715 | return setTimeout( | ||
$.proxy(that._regularly_update_checkpoint_date, that), | ||||
t + 1000 | ||||
); | ||||
|
r18752 | }; | ||
|
r17474 | var tdelta = Math.ceil(new Date()-this._checkpoint_date); | ||
// update regularly for the first 6hours and show | ||||
// <x time> ago | ||||
|
r19312 | if(tdelta < 6*3600*1000){ | ||
|
r17474 | recall(_next_timeago_update(tdelta)); | ||
|
r17715 | this._set_checkpoint_status(chkd.fromNow(), longdate); | ||
|
r17474 | // otherwise update every hour and show | ||
// <Today | yesterday|...> at hh,mm,ss | ||||
} else { | ||||
|
r17715 | recall(1*3600*1000); | ||
this._set_checkpoint_status(chkd.calendar(), longdate); | ||||
|
r17474 | } | ||
|
r17715 | }; | ||
|
r17474 | |||
SaveWidget.prototype._set_last_checkpoint = function (checkpoint) { | ||||
|
r17715 | if (checkpoint) { | ||
this._checkpoint_date = new Date(checkpoint.last_modified); | ||||
} else { | ||||
this._checkpoint_date = null; | ||||
} | ||||
|
r17474 | this._regularly_update_checkpoint_date(); | ||
|
r17198 | }; | ||
|
r4484 | |||
|
r10829 | SaveWidget.prototype.set_autosaved = function (dirty) { | ||
if (dirty) { | ||||
this.set_save_status("(unsaved changes)"); | ||||
} else { | ||||
this.set_save_status("(autosaved)"); | ||||
} | ||||
|
r4630 | }; | ||
|
r17443 | // Backwards compatibility. | ||
|
r4369 | IPython.SaveWidget = SaveWidget; | ||
|
r17201 | return {'SaveWidget': SaveWidget}; | ||
|
r4369 | |||
|
r17198 | }); | ||