source: branches/OaaS/HeuristicLab.Services.Optimization.Web/Views/Status/Index.cshtml @ 9324

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

#1888:

  • DAL: Added a Delete method which deletes by experiment id.
  • HL DataTables will now be transposed and mapped as double[ROWS][COLUMNS] (transposed)
  • JS: Moved all classes into "modules" to prevent namespace pollution (using OAAS_MODEL for model classes, OAAS_VIEW for views and OAAS_CONTROLLER for controllers)
  • JS: Moved DatatypeMapper classes into Backbone views
  • JS: Models now correctly send DELETE requests
  • Added a new job overview page (which also renders run details) using AJAX
  • Using moment.min.js to format DateTime as string
  • Controllers now inherit from BaseController which provides a RedirectToLoginIfNecessary-method
  • Added loading animations to several AJAX bound places (loading experiments / scenarios)
  • Added a section to _Layout.cshtml which allows page-specific JavaScript includes (<script> only for a certain page)
  • Fixed Build/Edit of experiment menu redirecting to the wrong page
  • The Experiment Variation Dialog disables input fields, if the property has not been activated before
File size: 3.5 KB
Line 
1@model HeuristicLab.Services.Optimization.Web.Models.StatusModel
2
3@{
4    ViewBag.Title = "Job Status";
5}
6
7<script type="text/javascript">
8    function convertTaskToNode(task) {
9        var currentTask = { title: task.General.Name, tooltip: task.General.Id };
10        var children = [];
11        for (var i = 0; i < task.Children.length; i++) {
12            var node = convertTaskToNode(task.Children[i]);
13            children.push(node);
14        }
15        if (children.length > 0)
16            currentTask["children"] = children;
17        return currentTask;
18    }
19
20    function convertTaskDataToNodes(taskData) {
21        var children = [];
22        for (var i = 0; i < taskData.Tasks.length; i++) {
23            var node = convertTaskToNode(taskData.Tasks[i]);
24            children.push(node);
25        }
26        return children;
27    }
28
29    function updateTree(jobId) {
30        $.ajax({
31            type: "GET",
32            url: '/Status/GetTasks',
33            data: { jobId: jobId },
34            contentType: "application/json; charset=utf-8",
35            dataType: "json",
36            success: function (result) {
37                var rootNode = $("#container").dynatree("getRoot");
38                rootNode.removeChildren();
39                var children = convertTaskDataToNodes(result);
40                for (var i = 0; i < children.length; i++)
41                    rootNode.addChild(children[i]);
42            }
43        });
44    }
45
46    function updateJobDetails(details) {
47        $('#details').empty();
48        var props = details.General.Properties;
49        for (var i = 0; i < props.length; i++) {
50            $("<p></p>").text(props[i].Key + ": " + props[i].Value).appendTo('#details');
51        }
52
53        $("<p></p>").text("Task state: " + details.State.State).appendTo('#details');
54        $("<p></p>").text("Date created: " + details.State.DateCreated).appendTo('#details');
55        $("<p></p>").text("Date finished: " + details.State.DateFinished).appendTo('#details');
56        $("<p></p>").text("Execution Time: " + details.State.ExecutionTime).appendTo('#details');
57    }
58
59    function updateDetails(taskId) {
60        var jobId = $('.selectedJob').attr("href").substr(1);
61        $.ajax({
62            type: "GET",
63            url: '/Status/GetTaskData',
64            data: { jobId: jobId, taskId: taskId },
65            contentType: "application/json; charset=utf-8",
66            dataType: "json",
67            success: updateJobDetails
68        });
69    }
70
71    $(document).ready(function () {
72        var tree = $('#container').dynatree({
73            onActivate: function (node) {
74                updateDetails(node.data.tooltip);
75            }
76        });  // no special tree required
77        $('a[class="JobRef"]').click(function (e) {
78            $('a[class="JobRef"]').removeClass("selectedJob");
79            $(this).addClass("selectedJob");
80            updateTree($(this).attr("href").substr(1));
81        });
82    });
83 
84</script>
85
86<h2>Job-Status</h2>
87
88@for (var i = 0; i < Model.Jobs.Count; i++ ) {
89    var jobId = "#" + Model.Jobs[i].Id;
90    <a href="@jobId"  class="JobRef">Details Job @i</a>
91}
92
93
94<div id="container" class="treeStyle">
95  <ul>
96  </ul>
97</div>
98
99<div id="details">
100  <p>-</p>
101</div>
102
103@section submenu {
104    <ul>
105        <li>@Html.ActionLink("Build", "New", "Experiment")</li>   
106        <li>@Html.ActionLink("Edit", "NewEdit", "Experiment")</li>
107        <li class="selected">@Html.ActionLink("Status", "Index", "Status")</li>
108    </ul>
109}
Note: See TracBrowser for help on using the repository browser.