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
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251 |
12x
12x
12x
12x
322x
177x
2x
175x
15x
12x
93x
93x
93x
93x
93x
93x
93x
93x
93x
93x
12x
290x
342x
342x
342x
342x
290x
12x
290x
290x
290x
12x
290x
290x
290x
12x
97x
97x
4x
4x
93x
93x
97x
93x
93x
93x
93x
93x
93x
93x
97x
12x
93x
93x
12x
67x
67x
15x
15x
52x
67x
15x
52x
52x
52x
52x
52x
15x
15x
37x
37x
37x
37x
67x
| /*
Copyright 2017 OCAD University
Licensed under the Educational Community License (ECL), Version 2.0 or the New
BSD license. You may not use this file except in compliance with one these
Licenses.
You may obtain a copy of the ECL 2.0 License and BSD License at
https://github.com/fluid-project/infusion/raw/master/Infusion-LICENSE.txt
*/
var fluid_3_0_0 = fluid_3_0_0 || {};
(function ($, fluid) {
"use strict";
/**
* fluid.remoteModelComponent builds on top of fluid.modelComponent with the purpose of providing a buffer between a
* local and remote model that are attempting to stay in sync. For example a local model is being updated by user
* interaction, this is sent back to a remote server, which in turn tries to update the local model. If additional
* user actions occur during the roundtrip, an infinite loop of updates may occur. fluid.remoteModelComponent solves
* this by restricting reading and writing to a single request at a time, waiting for one request to complete
* before operating the next.
*
* For more detailed documentation, including diagrams outlining the fetch and write workflows, see:
* https://docs.fluidproject.org/infusion/development/RemoteModelAPI.html
*/
fluid.defaults("fluid.remoteModelComponent", {
gradeNames: ["fluid.modelComponent"],
events: {
afterFetch: null,
onFetch: null,
onFetchError: null,
afterWrite: null,
onWrite: null,
onWriteError: null
},
members: {
pendingRequests: {
write: null,
fetch: null
}
},
model: {
// an implementor must setup a model relay between the buffered local value and the portions of the
// component's model state that should be updated with the remote source.
local: {},
remote: {},
requestInFlight: false
},
modelListeners: {
"requestInFlight": {
listener: "fluid.remoteModelComponent.launchPendingRequest",
args: ["{that}"]
}
},
listeners: {
"afterFetch.updateModel": {
listener: "fluid.remoteModelComponent.updateModelFromFetch",
args: ["{that}", "{arguments}.0"],
priority: "before:unblock"
},
"afterFetch.unblock": {
listener: "fluid.remoteModelComponent.unblockFetchReq",
args: ["{that}"]
},
"onFetchError.unblock": {
listener: "fluid.remoteModelComponent.unblockFetchReq",
args: ["{that}"]
},
"afterWrite.unblock": {
changePath: "requestInFlight",
value: false
},
"onWriteError.unblock": {
changePath: "requestInFlight",
value: false
}
},
invokers: {
fetch: {
funcName: "fluid.remoteModelComponent.fetch",
args: ["{that}"]
},
fetchImpl: "fluid.notImplemented",
write: {
funcName: "fluid.remoteModelComponent.write",
args: ["{that}"]
},
writeImpl: "fluid.notImplemented"
}
});
fluid.remoteModelComponent.launchPendingRequest = function (that) {
if (!that.model.requestInFlight) {
if (that.pendingRequests.fetch) {
that.fetch();
} else if (that.pendingRequests.write) {
that.write();
}
}
};
fluid.remoteModelComponent.updateModelFromFetch = function (that, fetchedModel) {
var remoteChanges = fluid.modelPairToChanges(fetchedModel, that.model.remote, "local");
var localChanges = fluid.modelPairToChanges(that.model.local, that.model.remote, "local");
var changes = remoteChanges.concat(localChanges);
// perform model updates in a single transaction
var transaction = that.applier.initiate();
transaction.fireChangeRequest({path: "local", type: "DELETE"}); // clear old local model
transaction.change("local", that.model.remote); // reset local model to the base for applying changes.
transaction.fireChangeRequest({path: "remote", type: "DELETE"}); // clear old remote model
transaction.change("remote", fetchedModel); // update remote model to fetched changes.
fluid.fireChanges(transaction, changes); // apply changes from remote and local onto base model.
transaction.commit(); // submit transaction
};
/*
* Similar to fluid.promise.makeSequenceStrategy from FluidPromises.js; however, rather than passing along the
* result from one listener in the sequence to the next, the original payload is always passed to each listener.
* In this way, the synthetic events are handled like typical events, but a promise can be resolved/rejected at the
* end of the sequence.
*/
fluid.remoteModelComponent.makeSequenceStrategy = function (payload) {
return {
invokeNext: function (that) {
var lisrec = that.sources[that.index];
lisrec.listener = fluid.event.resolveListener(lisrec.listener);
var value = lisrec.listener.apply(null, [payload, that.options]);
return value;
},
resolveResult: function () {
return payload;
}
};
};
fluid.remoteModelComponent.makeSequence = function (listeners, payload, options) {
var sequencer = fluid.promise.makeSequencer(listeners, options, fluid.remoteModelComponent.makeSequenceStrategy(payload));
fluid.promise.resumeSequence(sequencer);
return sequencer;
};
fluid.remoteModelComponent.fireEventSequence = function (event, payload, options) {
var listeners = fluid.makeArray(event.sortedListeners);
var sequence = fluid.remoteModelComponent.makeSequence(listeners, payload, options);
return sequence.promise;
};
/**
* Adds a fetch request and returns a promise.
*
* Only one request can be in flight (processing) at a time. If a write request is in flight, the fetch will be
* queued. If a fetch request is already in queue/flight, the result of that request will be passed along to the
* current fetch request. When a fetch request is in flight , it will trigger the fetchImpl invoker to perform the
* actual request.
*
* Two synthetic events, onFetch and afterFetch, are fired during the processing of a fetch. onFetch can be used to
* perform any necessary actions before running fetchImpl. afterFetch can be used to perform any necessary actions
* after running fetchImpl (e.g. updating the model, unblocking the queue). If promises returned from onFetch, afterFetch, or
* fetchImpl are rejected, the onFetchError event will be fired.
*
* @param {Object} that - The component itself.
* @return {Promise} - A promise that will be resolved with the fetched value or rejected if there is an error.
*/
fluid.remoteModelComponent.fetch = function (that) {
var promise = fluid.promise();
var activePromise;
if (that.pendingRequests.fetch) {
activePromise = that.pendingRequests.fetch;
fluid.promise.follow(activePromise, promise);
} else {
activePromise = promise;
that.pendingRequests.fetch = promise;
}
if (!that.model.requestInFlight) {
var onFetchSeqPromise = fluid.remoteModelComponent.fireEventSequence(that.events.onFetch);
onFetchSeqPromise.then(function () {
that.applier.change("requestInFlight", true);
var reqPromise = that.fetchImpl();
reqPromise.then(function (data) {
var afterFetchSeqPromise = fluid.remoteModelComponent.fireEventSequence(that.events.afterFetch, data);
fluid.promise.follow(afterFetchSeqPromise, activePromise);
}, that.events.onFetchError.fire);
}, that.events.onFetchError.fire);
}
return promise;
};
fluid.remoteModelComponent.unblockFetchReq = function (that) {
that.pendingRequests.fetch = null;
that.applier.change("requestInFlight", false);
};
/**
* Adds a write request and returns a promise.
*
* Only one request can be in flight (processing) at a time. If a fetch or write request is in flight, the write will
* be queued. If a write request is already in queue, the result of that request will be passed along to the current
* write request. When a write request is in flight , it will trigger the writeImpl invoker to perform the
* actual request.
*
* Two synthetic events, onWrite and afterWrite, are fired during the processing of a write. onWrite can be used to
* perform any necessary actions before running writeImpl (e.g. performing a fetch). afterWrite can be used to perform any necessary actions
* after running writeImpl (e.g. unblocking the queue, performing a fetch). If promises returned from onWrite, afterWrite, or
* writeImpl are rejected, the onWriteError event will be fired.
*
* @param {Object} that - The component itself.
* @return {Promise} - A promise that will be resolved when the value is written or rejected if there is an error.
*/
fluid.remoteModelComponent.write = function (that) {
var promise = fluid.promise();
var activePromise;
if (that.pendingRequests.write) {
activePromise = that.pendingRequests.write;
fluid.promise.follow(that.pendingRequests.write, promise);
} else {
activePromise = promise;
}
if (that.model.requestInFlight) {
that.pendingRequests.write = activePromise;
} else {
var onWriteSeqPromise = fluid.remoteModelComponent.fireEventSequence(that.events.onWrite);
onWriteSeqPromise.then(function () {
that.applier.change("requestInFlight", true);
that.pendingRequests.write = null;
if (fluid.model.diff(that.model.local, that.model.remote)) {
var afterWriteSeqPromise = fluid.remoteModelComponent.fireEventSequence(that.events.afterWrite, that.model.local);
fluid.promise.follow(afterWriteSeqPromise, activePromise);
} else {
var reqPromise = that.writeImpl(that.model.local);
reqPromise.then(function (data) {
var afterWriteSeqPromise = fluid.remoteModelComponent.fireEventSequence(that.events.afterWrite, data);
fluid.promise.follow(afterWriteSeqPromise, activePromise);
}, that.events.onWriteError.fire);;
}
}, that.events.onWriteError.fire);
}
return promise;
};
})(jQuery, fluid_3_0_0);
|