Changeset 12557


Ignore:
Timestamp:
07/01/15 10:58:26 (4 years ago)
Author:
dglaser
Message:

#2394:

HeuristicLab.Services.WebApp-3.3:

  • added angular-tablesort library
  • added sorting functionality to plugins page

HeuristicLab.Services.WebApp.Status-3.3:

  • changed sorting
Location:
trunk/sources
Files:
3 added
7 edited

Legend:

Unmodified
Added
Removed
  • trunk/sources/HeuristicLab.Services.WebApp.Status/3.3/WebApp/status/status.cshtml

    r12546 r12557  
    166166            </div>
    167167            <div class="panel-body">
    168                 <table class="table table-hover">
     168                <table class="table table-hover" ts-wrapper>
    169169                    <thead>
    170                     <tr>
    171                         <th>Username</th>
    172                         <th>Calculating Tasks</th>
    173                         <th>Waiting Tasks</th>
    174                     </tr>
     170                        <tr>
     171                            <th ts-criteria="User.Name">Username</th>
     172                            <th ts-criteria="CalculatingTasks|parseInt">Calculating Tasks</th>
     173                            <th ts-criteria="WaitingTasks|parseInt">Waiting Tasks</th>
     174                        </tr>
    175175                    </thead>
    176                     <tr ng-repeat="task in status.TasksStatus">
    177                         <td>{{task.User.Name}}</td>
    178                         <td>{{task.CalculatingTasks | number}}</td>
    179                         <td>{{task.WaitingTasks | number}}</td>
    180                     </tr>
    181                     <tr ng-hide="status.TasksStatus.length">
    182                         <td colspan="3" class="text-center">
    183                             There are no waiting or calculating tasks available!
    184                         </td>
    185                     </tr>
     176                    <tbody>
     177                        <tr ng-repeat="task in status.TasksStatus" ts-repeat>
     178                            <td>{{task.User.Name}}</td>
     179                            <td>{{task.CalculatingTasks | number}}</td>
     180                            <td>{{task.WaitingTasks | number}}</td>
     181                        </tr>
     182                        <tr ng-hide="status.TasksStatus.length">
     183                            <td colspan="3" class="text-center">
     184                                There are no waiting or calculating tasks available!
     185                            </td>
     186                        </tr>
     187                    </tbody>
    186188                </table>
    187189            </div>
     
    204206                 class="panel-collapse collapse in">
    205207                <div class="panel-body">
    206                     <table class="table table-hover">
     208                    <table class="table table-hover" ts-wrapper>
    207209                        <thead>
    208                         <tr>
    209                             <th ng-click="activeCalculatingSlavesOrderColumn='Slave.Name';
    210                                                   activeCalculatingSlavesReverseSort=!activeCalculatingSlavesReverseSort">
    211                                 Slave
    212                             </th>
    213                             <th ng-click="activeCalculatingSlavesOrderColumn='CpuUtilization';
    214                                                   activeCalculatingSlavesReverseSort=!activeCalculatingSlavesReverseSort">
    215                                 CPU Utilization
    216                             </th>
    217                             <th ng-click="activeCalculatingSlavesOrderColumn='Cores';
    218                                                   activeCalculatingSlavesReverseSort=!activeCalculatingSlavesReverseSort">
    219                                 Cores
    220                             </th>
    221                             <th ng-click="activeCalculatingSlavesOrderColumn='Memory';
    222                                                   activeCalculatingSlavesReverseSort=!activeCalculatingSlavesReverseSort">
    223                                 Memory
    224                             </th>
    225                         </tr>
     210                            <tr>
     211                                <th ts-criteria="Slave.Name">Slave</th>
     212                                <th ts-criteria="CpuUtilization|parseFloat">CPU Utilization</th>
     213                                <th ts-criteria="Cores|parseInt">Cores</th>
     214                                <th ts-criteria="Memory|parseInt">Memory</th>
     215                            </tr>
    226216                        </thead>
    227                         <tr ng-repeat="slave in activeCalculatingSlaves = (status.SlavesStatus
     217                        <tbody>
     218                            <tr ng-repeat="slave in activeCalculatingSlaves = (status.SlavesStatus
    228219                                | filter: {
    229220                                    IsAllowedToCalculate: true,
    230221                                    State: 'Calculating'
    231                                   }
    232                                 | orderBy: activeCalculatingSlavesOrderColumn:activeCalculatingSlavesReverseSort)">
    233                             <td>{{slave.Slave.Name}}</td>
    234                             <td>{{slave.CpuUtilization | number: 2}} %</td>
    235                             <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
    236                             <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
    237                         </tr>
    238                         <tr ng-hide="activeCalculatingSlaves.length">
    239                             <td colspan="4" class="text-center">
    240                                 There are no active calculating slaves available!
    241                             </td>
    242                         </tr>
     222                                  })" ts-repeat>
     223                                <td>{{slave.Slave.Name}}</td>
     224                                <td>{{slave.CpuUtilization | number: 2}} %</td>
     225                                <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
     226                                <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
     227                            </tr>
     228                            <tr ng-hide="activeCalculatingSlaves.length">
     229                                <td colspan="4" class="text-center">
     230                                    There are no active calculating slaves available!
     231                                </td>
     232                            </tr>
     233                        </tbody>
    243234                    </table>
    244235                </div>
     
    262253                 class="panel-collapse collapse">
    263254                <div class="panel-body">
    264                     <table class="table table-hover">
     255                    <table class="table table-hover" ts-wrapper>
    265256                        <thead>
    266257                        <tr>
    267                             <th ng-click="activeIdleSlavesOrderColumn='Slave.Name';
    268                                                   activeIdleSlavesReverseSort=!activeIdleSlavesReverseSort">
    269                                 Slave
    270                             </th>
    271                             <th ng-click="activeIdleSlavesOrderColumn='CpuUtilization';
    272                                                   activeIdleSlavesReverseSort=!activeIdleSlavesReverseSort">
    273                                 CPU Utilization
    274                             </th>
    275                             <th ng-click="activeIdleSlavesOrderColumn='Cores';
    276                                                   activeIdleSlavesReverseSort=!activeIdleSlavesReverseSort">
    277                                 Cores
    278                             </th>
    279                             <th ng-click="activeIdleSlavesOrderColumn='Memory';
    280                                                   activeIdleSlavesReverseSort=!activeIdleSlavesReverseSort">
    281                                 Memory
    282                             </th>
     258                            <th ts-criteria="Slave.Name">Slave</th>
     259                            <th ts-criteria="CpuUtilization|parseFloat">CPU Utilization</th>
     260                            <th ts-criteria="Cores|parseInt">Cores</th>
     261                            <th ts-criteria="Memory|parseInt">Memory</th>
    283262                        </tr>
    284263                        </thead>
    285                         <tr ng-repeat="slave in activeIdleSlaves = (status.SlavesStatus
     264                        <tbody>
     265                            <tr ng-repeat="slave in activeIdleSlaves = (status.SlavesStatus
    286266                                | filter: {
    287267                                    IsAllowedToCalculate: true,
    288268                                    State: 'Idle'
    289                                   }
    290                                 | orderBy: activeIdleSlavesOrderColumn:activeIdleSlavesReverseSort)">
    291                             <td>{{slave.Slave.Name}}</td>
    292                             <td>{{slave.CpuUtilization | number: 2}} %</td>
    293                             <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
    294                             <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
    295                         </tr>
    296                         <tr ng-hide="activeIdleSlaves.length">
    297                             <td colspan="4" class="text-center">
    298                             There are no active idle slaves available!
    299                             <td>
    300                         </tr>
     269                                  })" ts-repeat>
     270                                <td>{{slave.Slave.Name}}</td>
     271                                <td>{{slave.CpuUtilization | number: 2}} %</td>
     272                                <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
     273                                <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
     274                            </tr>
     275                            <tr ng-hide="activeIdleSlaves.length">
     276                                <td colspan="4" class="text-center">
     277                                    There are no active idle slaves available!
     278                                <td>
     279                            </tr>
     280                        </tbody>
    301281                    </table>
    302282                </div>
     
    320300                 class="panel-collapse collapse">
    321301                <div class="panel-body">
    322                     <table class="table table-hover">
     302                    <table class="table table-hover" ts-wrapper>
    323303                        <thead>
    324                         <tr>
    325                             <th ng-click="inactiveSlavesOrderColumn='Slave.Name';
    326                                                   inactiveSlavesReverseSort=!inactiveSlavesReverseSort">
    327                                 Slave
    328                             </th>
    329                             <th ng-click="inactiveSlavesOrderColumn='CpuUtilization';
    330                                                   inactiveSlavesReverseSort=!inactiveSlavesReverseSort">
    331                                 CPU Utilization
    332                             </th>
    333                             <th ng-click="inactiveSlavesOrderColumn='Cores';
    334                                                   inactiveSlavesReverseSort=!inactiveSlavesReverseSort">
    335                                 Cores
    336                             </th>
    337                             <th ng-click="inactiveSlavesOrderColumn='Memory';
    338                                                   inactiveSlavesReverseSort=!inactiveSlavesReverseSort">
    339                                 Memory
    340                             </th>
    341                         </tr>
     304                            <tr>
     305                                <th ts-criteria="Slave.Name">Slave</th>
     306                                <th ts-criteria="CpuUtilization|parseFloat">CPU Utilization</th>
     307                                <th ts-criteria="Cores|parseInt">Cores</th>
     308                                <th ts-criteria="Memory|parseInt">Memory</th>
     309                            </tr>
    342310                        </thead>
    343                         <tr ng-repeat="slave in inactiveSlaves = (status.SlavesStatus
     311                        <tbody>
     312                            <tr ng-repeat="slave in inactiveSlaves = (status.SlavesStatus
    344313                                | filter: {
    345314                                    IsAllowedToCalculate: false
    346                                   }
    347                                 | orderBy: inactiveSlavesOrderColumn:inactiveSlavesReverseSort)">
    348                             <td>{{slave.Slave.Name}}</td>
    349                             <td>{{slave.CpuUtilization | number: 2}} %</td>
    350                             <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
    351                             <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
    352                         </tr>
    353                         <tr ng-hide="inactiveSlaves.length">
    354                             <td colspan="4" class="text-center">No inactive slaves available!</td>
    355                         </tr>
     315                                  })" ts-repeat>
     316                                <td>{{slave.Slave.Name}}</td>
     317                                <td>{{slave.CpuUtilization | number: 2}} %</td>
     318                                <td>{{slave.Cores - slave.FreeCores | number}} / {{slave.Cores | number}}</td>
     319                                <td>{{slave.Memory - slave.FreeMemory | kbToGB}} / {{slave.Memory | kbToGB}} GB</td>
     320                            </tr>
     321                            <tr ng-hide="inactiveSlaves.length">
     322                                <td colspan="4" class="text-center">No inactive slaves available!</td>
     323                            </tr>
     324                        </tbody>
    356325                    </table>
    357326                </div>
  • trunk/sources/HeuristicLab.Services.WebApp.Status/3.3/WebApp/status/statusCtrl.js

    r12546 r12557  
    8484                CalculatingTasks: 0
    8585            };
    86 
    87             $scope.activeIdleSlaveFilter = function (slave) {
    88                 return (slave.IsAllowedToCalculate == true) && (slave.State == 'Idle');
    89             };
    90 
    91             $scope.activeCalculatingSlavesReverseSort = false;
    92             $scope.activeCalculatingSlavesOrderColumn = 'slave.Slave.Name';
    93 
    94             $scope.activeIdleSlavesReverseSort = false;
    95             $scope.activeIdleSlavesOrderColumn = 'slave.Slave.Name';
    96 
    97             $scope.inactiveSlavesReverseSort = false;
    98             $scope.inactiveSlavesOrderColumn = 'slave.Slave.Name';
    99 
    10086
    10187            var updateStatus = function () {
  • trunk/sources/HeuristicLab.Services.WebApp.Status/3.3/status.js

    r12428 r12557  
    22(function () {
    33    var plugin = appStatusPlugin;
    4     plugin.dependencies = ['ngResource', 'ui.knob', 'ui.bootstrap'];
     4    plugin.dependencies = ['ngResource', 'ui.knob', 'ui.bootstrap', 'tableSort'];
    55    plugin.files = [
    66        'WebApp/status.css',
     
    1515    ];
    1616    var menu = app.getMenu();
    17     var section = menu.getSection('Menü', 1);
     17    var section = menu.getSection('Menu', 1);
    1818    section.addEntry({
    1919        name: 'Status',
  • trunk/sources/HeuristicLab.Services.WebApp/3.3/Configs/BundleConfig.cs

    r12546 r12557  
    4141        "~/WebApp/libs/bootstrap/css/bootstrap-theme.min.css",
    4242        "~/WebApp/libs/font-aweseome/font-aweseome.min.css",
    43         "~/WebApp/libs/angularjs/loading-bar/loading-bar.css"
     43        "~/WebApp/libs/angularjs/loading-bar/loading-bar.css",
     44        "~/WebApp/libs/angularjs/angular-tablesort/tablesort.css"
    4445      ));
    4546
     
    7071        "~/WebApp/libs/angularjs/angular-ui-router.min.js",
    7172        "~/WebApp/libs/angularjs/angular-knob/angular-knob.js",
     73        "~/WebApp/libs/angularjs/angular-tablesort/angular-tablesort.js",
    7274        "~/WebApp/libs/angularjs/angular-ui/ui-bootstrap-tpls-0.13.0.min.js",
    7375        "~/WebApp/libs/angularjs/loading-bar/loading-bar.js",
  • trunk/sources/HeuristicLab.Services.WebApp/3.3/WebApp/plugins/about/about.js

    r12546 r12557  
    99
    1010    var menu = app.getMenu();
    11     var section = menu.getSection('Menü', -1);
     11    var section = menu.getSection('Menu', -1);
    1212    section.addEntry({
    1313        index: 10000,
  • trunk/sources/HeuristicLab.Services.WebApp/3.3/WebApp/plugins/plugins/plugins.cshtml

    r12523 r12557  
    1616                </div>
    1717                <div class="panel-body">
    18                     <table class="table table-hover table-condensed">
     18                    <table class="table table-hover table-condensed" ts-wrapper>
    1919                        <thead>
    2020                            <tr>
    2121                                <th>#</th>
    22                                 <th>Name</th>
    23                                 <th>Assembly</th>
    24                                 <th>Last reload</th>
     22                                <th ts-criteria="Name">Name</th>
     23                                <th ts-criteria ="AssemblyName">Assembly</th>
     24                                <th ts-criteria="LastReload">Last reload</th>
    2525                                <th>Status</th>
    2626                                <th></th>
    2727                            </tr>
    2828                        </thead>
    29                         <tr ng-repeat="plugin in plugins">
    30                             <td>{{$index + 1}}</td>
    31                             <td>{{plugin.Name}}</td>
    32                             <td>{{plugin.AssemblyName}}</td>
    33                             <td>{{plugin.LastReload}}</td>
    34                             <td>
    35                                 <span ng-hide="plugin.Exception" class="glyphicon glyphicon glyphicon-ok" style="color: green"></span>
    36                                 <span ng-show="plugin.Exception" class="glyphicon glyphicon glyphicon-remove" style="color: darkred"
    37                                       ng-click="open(plugin.Name, plugin.Exception)"></span>
    38                             </td>
    39                             <td>
    40                                 <a ng-href="" data-ng-click="reloadPlugin(plugin.Name)">Reload</a>
    41                             </td>
    42                         </tr>
     29                        <tbody>
     30                            <tr ng-repeat="plugin in plugins" ts-repeat>
     31                                <td>{{$index + 1}}</td>
     32                                <td>{{plugin.Name}}</td>
     33                                <td>{{plugin.AssemblyName}}</td>
     34                                <td>{{plugin.LastReload}}</td>
     35                                <td>
     36                                    <span ng-hide="plugin.Exception" class="glyphicon glyphicon glyphicon-ok" style="color: green"></span>
     37                                    <span ng-show="plugin.Exception" class="glyphicon glyphicon glyphicon-remove" style="color: darkred"
     38                                          ng-click="open(plugin.Name, plugin.Exception)"></span>
     39                                </td>
     40                                <td>
     41                                    <a ng-href="" data-ng-click="reloadPlugin(plugin.Name)">Reload</a>
     42                                </td>
     43                            </tr>
     44                        </tbody>
    4345                    </table>
    4446                </div>
  • trunk/sources/HeuristicLab.Services.WebApp/3.3/WebApp/plugins/plugins/plugins.js

    r12523 r12557  
    22(function () {
    33    var plugin = appPluginsPlugin;
    4     plugin.dependencies = ['ngResource', 'ui.bootstrap'];
     4    plugin.dependencies = ['ngResource', 'ui.bootstrap', 'tableSort'];
    55    plugin.files = [
    66        'pluginsService.js',
Note: See TracChangeset for help on using the changeset viewer.