Free cookie consent management tool by TermsFeed Policy Generator

source: branches/OaaS/HeuristicLab.Services.Optimization.Web/Content/experiment.controller.js @ 9362

Last change on this file since 9362 was 9335, checked in by fschoepp, 11 years ago

#1888:

  • The Edit-Experiment-Page now correctly displays the experiments again.
  • Disabled key navigation for all wizards.
  • Added a RunCollectionView to render different Plots for the run results of a job.
  • Added a Boxplot-Chart and a Bubble-Chart for rendering the results.
  • Added underscoreAddon.js which provides methods to calculate mean/sum of an JavaScript array/list.
File size: 13.3 KB
Line 
1var OAAS_CONTROLLER = (function (my, Backbone, OAAS_VIEW, OAAS_MODEL, _, $) {
2    my.GeneralController = function () {
3        this.variationRequestHandler = function (evt) {
4            var self = this;
5            var dialog = new OAAS_VIEW.VariationDialog({ model: evt.model });
6            var dialogController = {};
7            _.extend(dialogController, Backbone.Events);
8            dialogController.listenTo(dialog, 'variations-generated', function (variations) {
9                var parent = evt.model.get('parent');
10                for (var i = 0; i < variations.length; i++) {
11                    var title = evt.model.get('title');
12                    var offset = title.indexOf('(')
13                    if (offset != -1) {
14                        title = title.substring(0, offset);
15                    }
16                    title += '(';
17                    for (var j = 0; j < variations[i].length; j++) {
18                        title += variations[i][j].Name + " = " + variations[i][j].Value + "; ";
19                    }
20                    title += ')';
21                    var data = { AlgorithmParameters: variations[i] };
22                    if (evt.model.attributes.data.ProblemParameters) {
23                        data.ProblemParameters = evt.model.attributes.data.ProblemParameters;
24                    }
25                    parent.addNode({ title: title, nodeId: evt.model.get('nodeId'), data: data });
26                }
27                self.model.trigger('change');
28            });
29            dialog.render();
30        },
31        this.experimentFinishedHandler = function (experimentModel, availableExperiments, selectableGroup) {
32            var loadingDialog = new OAAS_VIEW.LoadingDialog({ el: $('#loadingDialog') });
33            // start the loading dialog
34            loadingDialog.setLoading(true);
35            loadingDialog.text('Saving experiment ' + experimentModel.get('title') + '...');
36            loadingDialog.render();
37            // send experiment to server
38            experimentModel.save({}, { success: function () {
39                loadingDialog.setLoading(false);
40                loadingDialog.text('Experiment successfully saved!');
41                loadingDialog.render();
42                if (availableExperiments)
43                    availableExperiments.fetch({ cache: false, success: function (itm) {
44                        selectableGroup.render();
45                    }
46                    });
47            }
48            });
49            //loadingDialog.close();
50        }
51    }
52
53    my.ExperimentPageController = function () {
54        this.refreshExperiments = function () {
55            var availableExperiments = new OAAS_MODEL.ExperimentList();
56            availableExperiments.fetch({ cache: false, success: function (itm) {
57                var group = new OAAS_VIEW.DraggableGroup({ collection: availableExperiments, el: $('#experiments') });
58                group.render();
59            }
60            });
61        },
62        this.refreshScenarios = function () {
63            var availableScenarios = new OAAS_MODEL.ScenarioList();
64            availableScenarios.fetch({ cache: false, success: function (itm) {
65                var group = new OAAS_VIEW.DraggableGroup({ collection: availableScenarios, el: $('#algorithms') });
66                group.render();
67            }
68            });
69        },
70        this.create = function () {
71            var self = this;
72            var generalController = new my.GeneralController();
73            // create all models + required view for the experiment page
74            var model = new OAAS_MODEL.ExperimentNode({
75                title: 'Experiment',
76                key: 0,
77                isExperiment: true
78            }, { parse: true });
79            generalController.model = model;
80            var experimentModel = new OAAS_MODEL.Experiment({ experiment: model });
81
82            var view = new OAAS_VIEW.ExperimentTreeView({ model: model, el: $('#container') });
83            view.render();
84
85            this.refreshScenarios();
86
87            this.refreshExperiments();
88
89            var wizard = new OAAS_VIEW.StepWizardView({ el: $('#stepWizard') });
90            wizard.render();
91
92            var detailsView = new OAAS_VIEW.ExperimentDetailsTreeView({ model: model, el: $('#container2') });
93            var validationView = new OAAS_VIEW.ValidationHintsView({ model: { header: "Validation failed!", text: ""} });
94            var parameterDialog = new OAAS_VIEW.ParameterDialog({ model: model, el: $('#parameterDialog') });
95
96            var wizardController = {};
97            _.extend(wizardController, Backbone.Events);
98
99            wizardController.listenTo(model, 'change', function () {
100                // update the details view, when the model changes
101                view.render();
102                detailsView.render();
103            });
104
105
106            wizardController.listenTo(wizard, 'experiment-finished', function () {
107                generalController.experimentFinishedHandler(experimentModel, null, null);
108                self.refreshExperiments();
109            });
110
111            wizardController.listenTo(view, 'structure-changed', function (node) {
112                view.render();
113                detailsView.render();
114            });
115
116            wizardController.listenTo(view, 'node-added', function (node) {
117                // get details about the node
118                node.fetch({ success: function (itm) {
119                    model.trigger('change', {});
120                }
121                });
122            });
123
124            wizardController.listenTo(detailsView, 'node-clicked', function (node) {
125                // get details about the node
126                var modelNode = OAAS_MODEL.ExperimentNode.lookup(node.data.key);
127                if (!modelNode.get('isExperiment')) {
128                    parameterDialog.model = modelNode;
129                    parameterDialog.render();
130                }
131            });
132
133            wizardController.listenTo(parameterDialog, 'parameters-finished', function (node) {
134                parameterDialog.close();
135            });
136
137            wizardController.listenTo(view, 'variation-request', function (evt) {
138                generalController.variationRequestHandler(evt);
139            });
140
141            var experimentDetailsView = new OAAS_VIEW.ExperimentDetailsView({ el: $('#step3'), model: experimentModel });
142
143
144        }
145    }
146
147
148
149    /// ==================== EDIT PAGE =========================
150    /// ==================== EDIT PAGE =========================
151    /// ==================== EDIT PAGE =========================
152
153    my.ExperimentEditPageController = function () {
154        this.refreshScenarios = function () {
155            var availableScenarios = new OAAS_MODEL.ScenarioList();
156            availableScenarios.fetch({ cache: false, success: function (itm) {
157                var group = new OAAS_VIEW.DraggableGroup({ collection: availableScenarios, el: $('#draggableAlgorithms') });
158                group.render();
159            }
160            });
161        },
162        this.create = function () {
163            var generalController = new my.GeneralController();
164
165            var self = this;
166            // create all models + required view for the experiment page
167            var controllerModel = new OAAS_MODEL.ControllerModel();
168            var model = new OAAS_MODEL.ExperimentNode({
169                title: 'Experiment',
170                key: 0,
171                isExperiment: true
172            }, { parse: true });
173
174            generalController.model = model;
175            var experimentModel = new OAAS_MODEL.Experiment({ experiment: model });
176            var experimentDetailsView = new OAAS_VIEW.ExperimentDetailsView({ el: $('#step4'), model: experimentModel });
177            experimentDetailsView.render();
178
179            var availableExperiments = new OAAS_MODEL.ExperimentList();
180
181            var wizardController = {};
182            _.extend(wizardController, Backbone.Events);
183
184            this.refreshScenarios();
185
186            var selectableGroup = new OAAS_VIEW.SelectableGroup({ collection: availableExperiments, el: $('#experiments') });
187            //selectableGroup.render();
188            var draggableExperiments = new OAAS_VIEW.DraggableGroup({ collection: availableExperiments, el: $('#draggableExperiments') });
189            availableExperiments.fetch({ cache: false, success: function (itm) {
190                // selectableGroup = new OAAS_VIEW.SelectableGroup({ collection: availableExperiments, el: $('#experiments') });
191                selectableGroup.render();
192                draggableExperiments.render();
193
194                wizardController.listenTo(selectableGroup, 'node-selected', function (nodeId) {
195                    var node = availableExperiments.find(function (itm) { return itm.get('nodeId') == nodeId; });
196
197                    var newNode = new OAAS_MODEL.ExperimentNode(node.attributes);
198                    newNode.fetch({ success: function () {
199                        experimentModel.set({
200                            experiment: newNode,
201                            title: node.get('title'),
202                            nodeId: node.get('nodeId'),
203                            run: node.get('run'),
204                            repititions: node.get('repititions'),
205                            group: node.get('group')
206                        });
207                        controllerModel.set({ selectedNode: newNode });
208                        $('#deleteExperimentButton').removeAttr('disabled');
209                        detailsView.model = newNode;
210                        detailsView.render();
211                        view.model = newNode;
212                        view.render();
213                        experimentDetailsView.render();
214                    }
215                    });
216                }
217                );
218            }
219            });
220
221            // create wizard with 4 steps
222            var wizard = new OAAS_VIEW.StepWizardView({ el: $('#stepWizard') });
223            wizard.render();
224
225            var view = new OAAS_VIEW.ExperimentTreeView({ model: model, el: $('#container') });
226            view.render();
227            var validationView = new OAAS_VIEW.ValidationHintsView({ model: { header: "Validation failed!", text: ""} });
228
229            var detailsView = new OAAS_VIEW.ExperimentDetailsTreeView({ model: model, el: $('#container2') });
230
231            var parameterDialog = new OAAS_VIEW.ParameterDialog({ model: model, el: $('#parameterDialog') });
232            var loadingDialog = new OAAS_VIEW.LoadingDialog({ el: $('#loadingDialog') });
233
234            wizardController.listenTo(wizard, 'step-validated', function (validationModel) {
235                // update the details view
236                if (validationModel.stepNumber == 1) {
237                    if (controllerModel.get('selectedNode') == null) {
238                        validationView.model["text"] = 'Please select an experiment to continue!';
239                        validationView.render();
240                        validationModel.succeeded = false;
241                    }
242                }
243                detailsView.render();
244            });
245
246            wizardController.listenTo(model, 'change', function () {
247                // update the details view, when the model changes
248                view.render();
249                detailsView.render();
250            });
251
252            wizardController.listenTo(view, 'structure-changed', function (node) {
253                view.render();
254            });
255
256            wizardController.listenTo(view, 'node-added', function (node) {
257                // get details about the node
258                //if (!node.get('isExperiment'))
259                node.fetch({ success: function (itm) {
260                    model.trigger('change', {});
261                }
262                });
263            });
264
265            wizardController.listenTo(wizard, 'experiment-finished', function () {
266                generalController.experimentFinishedHandler(experimentModel, availableExperiments, selectableGroup);
267            });
268
269            wizardController.listenTo(detailsView, 'node-clicked', function (node) {
270                // get details about the node
271                var modelNode = OAAS_MODEL.ExperimentNode.lookup(node.data.key);
272                if (!modelNode.get('isExperiment')) {
273                    parameterDialog.model = modelNode;
274                    parameterDialog.render();
275                }
276            });
277
278            wizardController.listenTo(view, 'variation-request', function (evt) {
279                generalController.variationRequestHandler(evt);
280            });
281
282            wizardController.listenTo(parameterDialog, 'parameters-finished', function (node) {
283                parameterDialog.close();
284            });
285
286            $('#deleteExperimentButton').click(function (evt) {
287                var node = controllerModel.get('selectedNode');
288                var nodes = availableExperiments.where({ nodeId: node.get('nodeId') });
289                if (nodes.length == 1) {
290                    nodes[0].destroy();
291                    $('#deleteExperimentButton').attr('disabled', 'disabled');
292                    controllerModel.set('selectedNode', null);
293                }
294            });
295        }
296    }
297    return my;
298} (OAAS_CONTROLLER || {}, Backbone, OAAS_VIEW, OAAS_MODEL, _, $));
299
300 
301 
Note: See TracBrowser for help on using the repository browser.