1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
|
// A inlined form is used to provide a quick edition of single field for a given
// document. Clicking on a edit button should display the form to edit the field
// value. The form can then be submited, or just closed.
//
// When the form is closed we save non-submitted values in memory to avoid any
// data loss.
//
// Usage:
//
// +inlineForm
// // the content when the form is open
// else
// // the content when the form is close (optional)
// We can only have one inlined form element opened at a time
// XXX Could we avoid using a global here ? This is used in Mousetrap
// keyboard.js
var currentlyOpenedForm = new ReactiveVar(null);
BlazeComponent.extendComponent({
template: function() {
return 'inlinedForm';
},
mixins: function() {
return [Mixins.CachedValue];
},
onCreated: function() {
this.isOpen = new ReactiveVar(false);
},
onDestroyed: function() {
currentlyOpenedForm.set(null);
},
open: function() {
// Close currently opened form, if any
EscapeActions.executeLowerThan('inlinedForm');
this.isOpen.set(true);
currentlyOpenedForm.set(this);
},
close: function() {
this.saveValue();
this.isOpen.set(false);
currentlyOpenedForm.set(null);
},
getValue: function() {
var input = this.find('textarea,input[type=text]');
return this.isOpen.get() && input && input.value;
},
saveValue: function() {
this.callFirstWith(this, 'setCache', this.getValue());
},
events: function() {
return [{
'click .js-close-inlined-form': this.close,
'click .js-open-inlined-form': this.open,
// Close the inlined form by pressing escape.
//
// Keydown (and not keypress) in necessary here because the `keyCode`
// property is consistent in all browsers, (there is not keyCode for the
// `keypress` event in firefox)
'keydown form input, keydown form textarea': function(evt) {
if (evt.keyCode === 27) {
evt.preventDefault();
EscapeActions.executeLowest();
}
},
// Pressing Ctrl+Enter should submit the form
'keydown form textarea': function(evt) {
if (evt.keyCode === 13 && (evt.metaKey || evt.ctrlKey)) {
$(evt.currentTarget).parents('form:first').submit();
}
},
// Close the inlined form when after its submission
submit: function() {
var self = this;
// XXX Swith to an arrow function here when we'll have ES6
if (this.currentData().autoclose !== false) {
Tracker.afterFlush(function() {
self.close();
self.callFirstWith(self, 'resetCache');
});
}
}
}];
}
}).register('inlinedForm');
// Press escape to close the currently opened inlinedForm
EscapeActions.register('inlinedForm',
function() { return currentlyOpenedForm.get() !== null; },
function() { currentlyOpenedForm.get().close(); }
);
|