source: branches/OaaS/HeuristicLab.Services.Optimization.Web/Views/Experiment/New.cshtml @ 9305

Last change on this file since 9305 was 9305, checked in by fschoepp, 6 years ago

#1888:

  • Added an Update / GetExperiment... methods to the controller for updating and querying experiments.
  • The AlgorithmConverter class now properly converts from/to JSON format.
  • Integrated backbone js as MVC provider for JavaScript + jquery.
  • Added experiment.model.js + experiment.view.js + experiment.controller.js containing the MVC impl. for the Experiment pages.
  • Added new methods to the ExperimentController usable by the backbone js model implementation.
  • Added the experiment dialog from HL 3.3.7 (variate experiment parameters). It's capable of variating the algorithm parameters.
File size: 5.7 KB
Line 
1@model HeuristicLab.Services.Optimization.Web.Models.ExperimentViewModel
2<script type="text/template" id="node_template">
3  <li><%= title%></li> 
4</script>
5
6<script type="text/template" id="tree_template">
7  <div id="<%= id %>" class="treeStyle">
8    <ul>     
9    </ul>
10  </div>
11</script>
12
13<script type="text/template" id="draggable_template">
14  <div id="<%= nodeId %>" data-isExperiment="<%= isExperiment%>" data-name="<%= title%>" class="dragables"><p><%= title %></p></div>
15</script>
16
17<script type="text/template" id="stepwizard_template">
18  <input style="margin-top:5px;" class="remove-button" name="RemoveNode" type="button" value="Remove" disabled="disabled" />
19  <input style="margin-top:5px;" class="variate-button" name="VariateNode" type="button" value="Variate" disabled="disabled" />
20</script>           
21
22<script type="text/template" id="parameter_template">
23<div>
24  <div class="leftEntry"><%= Name %>:</div>
25  <div class="rightEntry"></div> 
26</div>
27</script>       
28
29<script type="text/template" id="validationhints_template">
30<div class="validator" title="<%= header %>">
31  <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
32  <%= text %>
33  </p>
34</div>
35</script>       
36
37<script type="text/template" id="variationdialog_template">
38<div class="variationDialog" title="Variate algorithm">
39  <h1>Select parameter</h1>
40  <select class="variationDialogContent"> 
41  </select>
42  <input type="checkbox" name="active" /> Active
43  <div class="variationDetails">         
44  </div> 
45</div>
46</script>       
47
48<script type="text/template" id="variationentry_template">
49<option data-index='<%= Index %>'><%= Name %></option>
50</script>       
51
52<script type="text/template" id="variationcontent_template">
53<div>
54 
55 
56</div>
57</script>       
58
59<script type="text/template" id="variation_boolean_template">
60<p>Boolean paramter: True / False</p>
61</script>       
62
63<script type="text/template" id="variation_number_template">
64<div>
65    <input type="button" name="generate" value="Generate..."/>   
66    <div></div>
67</div>
68</script>       
69
70<script type="text/template" id="checkbox_template">
71<div>
72    <input type="checkbox" name="<%=name%>"/><%=text%><br/>
73</div>
74</script>       
75
76<script type="text/template" id="variation_generator_template">
77<div title="Generate Values">
78 <div class="leftEntry">Minimum:</div>
79 <div class="rightEntry"><input type="text" name="minimum" value="0"/></div> 
80 <div class="leftEntry">Maximum:</div>
81 <div class="rightEntry"><input type="text" name="maximum" value="2"/></div> 
82 <div class="leftEntry">Step:</div>
83 <div class="rightEntry"><input type="text" name="step" value="1"/></div> 
84</div>
85</script>       
86
87<script type="text/template" id="loading_template">
88<div>
89  <p>Loading ... </p>
90  <img src="@Url.Content("~/Content/ajax-loader.gif")" alt="Loading animation" class="loader" /> 
91</div>
92</script>   
93
94<script type="text/javascript">
95    var controller = new ExperimentPageController();
96    $(document).ready(function () {
97        controller.create();
98    });
99</script>
100<noscript>
101    <p>You need JavaScript to view this page! Please activate it in your browser settings.</p>
102</noscript>
103
104<h2>Experiment</h2>
105
106<div id="stepWizard" class="wizard swMain">
107  <ul>
108    <li>
109      <a href="#step1">
110        <label class="stepNumber">1</label>
111        <span class="stepDesc">
112          Structure<br />
113          <small>Build your experiment</small>
114        </span>
115      </a>
116    </li>
117    <li>
118      <a href="#step2">
119        <label class="stepNumber">2</label>
120        <span class="stepDesc">
121          Customization<br />
122          <small>Change experiment parameters</small>
123        </span>
124      </a>
125    </li>
126    <li>
127      <a href="#step3">
128        <label class="stepNumber">3</label>
129        <span class="stepDesc">
130          Experiment Details<br />
131          <small>Set name of experiment</small>
132        </span>
133      </a>
134    </li>
135  </ul>
136  <div id="step1">
137  <fieldset>   
138    <div>
139    <p>Experiment Tree:</p>
140    </div>
141    <div id="container" class="treeStyle"></div>   
142    <p>Choose an algorithm:</p>
143    <div id="algorithms"></div>
144    <div class="clearer"></div>
145    <p>Choose from your stored experiments:</p>
146    <div id="experiments"></div>
147  </fieldset>
148  </div>
149  <div id="step2">
150    <h2>Click on a experiment to adjust its parameters:</h2>
151    <div id="container2" class="treeStyle"></div>
152  </div>
153  <div id="step3">
154    <div class="editor-label">
155      <label for="name">Experiment Template Name:</label>
156    </div>
157
158    <div class="editor-field">
159      <input id="name" name="Name" type="text" value="My Experiment" />
160    </div>
161
162    <div class="editor-label">
163      <label for="name">Run experiment immediately?</label>
164    </div>
165
166    <div class="editor-field">
167      <input id="runImmediately" name="RunImmediately" type="checkbox" />
168    </div>
169
170    <div class="editor-label">
171      <label for="name">Repititions</label>
172    </div>
173
174    <div class="editor-field">
175      <input id="repititions" name="Repititions" type="text" value="1" disabled="disabled" />
176    </div>
177
178    <div class="editor-label">
179      <label for="name">Group</label>
180    </div>
181
182    <div class="editor-field">
183      <input id="group" name="Group" type="text" value="TESTAZURE" disabled="disabled" />
184    </div>
185  </div>   
186</div>
187
188<div id="parameterDialog">
189  <div id="parameterDialog-content">
190  </div>
191</div>
192
193<div id="loadingDialog">
194</div>
195
196@section submenu {
197    <ul>
198        <li class="selected">@Html.ActionLink("Build", "New")</li>   
199        <li>@Html.ActionLink("Edit", "NewEdit")</li>
200        <li>@Html.ActionLink("Status", "Index", "Status")</li>
201    </ul>
202}
Note: See TracBrowser for help on using the repository browser.