Skip to content

Commit

Permalink
feat: [WIP] Adding new Usage tab on items layer
Browse files Browse the repository at this point in the history
  • Loading branch information
KirylHatalski authored and KirylHatalski committed Apr 9, 2024
1 parent e5bf1b6 commit 83d0d52
Show file tree
Hide file tree
Showing 11 changed files with 308 additions and 2 deletions.
36 changes: 36 additions & 0 deletions controller/Usage.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
<?php

/**
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; under version 2
* of the License (non-upgradable).
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*
* Copyright (c) 2018 (original work) Public Research Centre Henri Tudor (under the project TAO-SUSTAIN & TAO-DEV);
*
*
*/

namespace oat\taoDeliveryRdf\controller;

/**
* Class taoDeliveryRdf
* @package oat\taoDeliveryRdf\controller
*/
class Usage extends \tao_actions_SaSModule
{

public function index()
{
$this->setView('Usage/index.tpl');
}
}
11 changes: 11 additions & 0 deletions controller/structures.xml
Original file line number Diff line number Diff line change
Expand Up @@ -65,4 +65,15 @@
</section>
</sections>
</structure>
<structure id="items" name="Items" level="0" group="main">
<sections>
<section id="manage_items" name="Manage items" url="">
<actions>
<action id="item-usage" name="Usage" url="/taoDeliveryRdf/Usage/index" context="instance" group="content">
<icon id="icon-filebox"/>
</action>
</actions>
</section>
</sections>
</structure>
</structures>
1 change: 1 addition & 0 deletions views/build/grunt/sass.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ module.exports = function(grunt) {
sass.taodeliveryrdf.files = { };
sass.taodeliveryrdf.files[root + 'css/selector.css'] = root + 'scss/selector.scss';
sass.taodeliveryrdf.files[root + 'css/delivery-rdf.css'] = root + 'scss/delivery-rdf.scss';
sass.taodeliveryrdf.files[root + 'css/usage.css'] = root + 'scss/usage.scss';

watch.taodeliveryrdfsass = {
files : [root + 'scss/**/*.scss'],
Expand Down
3 changes: 3 additions & 0 deletions views/css/usage.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions views/css/usage.css.map

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

158 changes: 158 additions & 0 deletions views/js/controller/Usage/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,158 @@
/**
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; under version 2
* of the License (non-upgradable).
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*
* Copyright (c) 2018 (original work) Open Assessment Technologies SA (under the project TAO-PRODUCT);
*
*/
define([
'jquery',
'i18n',
'util/url',
'layout/actions',
'provider/resources',
'ui/destination/selector',
'ui/tabs',
'ui/datatable',
], function ($, __, url, actionManager, resourceProviderFactory, destinationSelectorFactory, tabsFactory) {
'use strict';

const $window = $(window);

function getNumRows() {
const lineHeight = 30;
const searchPagination = 70;
const $upperElem = $('.content-container h2');
const topSpace = $upperElem.offset().top
+ $upperElem.height()
+ parseInt($upperElem.css('margin-bottom'), 10)
+ lineHeight
+ searchPagination;
const availableHeight = $window.height() - topSpace - $('footer.dark-bar').outerHeight();
if(!window.MSInputMethodContext && !document.documentMode && !window.StyleMedia) {
return 25;
}
return Math.min(Math.floor(availableHeight / lineHeight), 25);
}

function viewResult() {
console.log('res')
}

return {

start : function start() {

// Selectors
const $container = $('.selector-container');
const $usageTestsContainer = $('.usage-tests-container');
const $usageSessionsContainer = $('.usage-sessions-container');
const $tabsContentContainer = $('.usage-tabs-container');
const $contentBlock = $('.content-panel .content-container .content-block').first();
const $deliverTenantSelectList = $('.deliver-tenant-list');

// Callback functions for the selected tabs
const onTaoSessionsClick = () => {
$container.removeClass('hidden');
};

const onTaoTestsClick = () => {
if ($deliverTenantSelectList.children().length) {
$container.removeClass('hidden');
}
else {
$container.addClass('hidden');
}
};

// Initialization of the tab component
const $tabContainer = $('.tab-selector', $contentBlock);
const tabs = [
{
label: 'Tests',
name: 'tao-tests'
},
{
label: 'Sessions',
name: 'tao-sessions'
}
];

tabsFactory($tabContainer, {
showHideTarget: $tabsContentContainer,
hideLoneTab: true,
tabs: tabs
})
.on('tabchange-tao-sessions', onTaoSessionsClick)
.on('tabchange-tao-tests', onTaoTestsClick);

$usageTestsContainer
.datatable({
url: url.route('data', 'ResultsMonitoring', 'taoOutcomeUi'), //todo: find normal url
filter: true,
labels: {
filter: __('Search by results')
},
model: [{
id: 'testLabel',
label: __('Label'),
sortable: true
}, {
id: 'location',
label: __('Location'),
sortable: true,
}, {
id: 'last-modified',
label: __('Last modified on'),
sortable: true
}],
paginationStrategyTop: 'none',
paginationStrategyBottom: 'simple',
rows: getNumRows(),
sortby: 'result_id',
sortorder: 'desc',
actions : {
'view' : {
id: 'view',
label: __('View'),
action: viewResult
}
}
});

$usageSessionsContainer
.datatable({
url: url.route('data', 'ResultsMonitoring', 'taoOutcomeUi'), //todo: find normal url
filter: true,
labels: {
filter: __('Search by results')
},
model: [{
id: 'sessionLabel',
label: __('Name'),
sortable: true
}, {
id: 'last-published',
label: __('Last published on'),
sortable: true,
}],
paginationStrategyTop: 'none',
paginationStrategyBottom: 'simple',
rows: getNumRows(),
sortby: 'result_id',
sortorder: 'desc',
});
}
};
});
5 changes: 5 additions & 0 deletions views/js/controller/routes.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,11 @@ define(function(){
'actions' : {
'index' : 'controller/Publish/index'
}
},
'Usage': {
'actions' : {
'index' : 'controller/Usage/index'
}
}
};
});
2 changes: 1 addition & 1 deletion views/js/loader/taoDeliveryRdf.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion views/js/loader/taoDeliveryRdf.min.js.map

Large diffs are not rendered by default.

57 changes: 57 additions & 0 deletions views/scss/usage.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
///
/// This program is free software; you can redistribute it and/or
/// modify it under the terms of the GNU General Public License
/// as published by the Free Software Foundation; under version 2
/// of the License (non-upgradable).
///
/// This program is distributed in the hope that it will be useful,
/// but WITHOUT ANY WARRANTY; without even the implied warranty of
/// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
/// GNU General Public License for more details.
///
/// You should have received a copy of the GNU General Public License
/// along with this program; if not, write to the Free Software
/// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.

/// Copyright (c) 2019 (original work) Open Assessment Technologies SA;
@import "inc/bootstrap";

.usage-tabs-container {
width: 100%;
}

.usage-tests-container,
.usage-sessions-container {

display: block;
width: 100%;

.datatable-wrapper {
display: block;
}

table.datatable {
.delivery {
max-width: 25%;

}
.actions {
white-space: nowrap;
}
}
}


.results-list {
.grid-row{
&.pagination {
width: 100%;
}
}
}

.section-container {
.content-block .usage-tabs-container .tab-container {
display: block;
}
}
34 changes: 34 additions & 0 deletions views/templates/Usage/index.tpl
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
<?php
use oat\tao\helpers\Template;
?>
<link rel="stylesheet" type="text/css" href="<?= Template::css('selector.css')?>"/>
<link rel="stylesheet" type="text/css" href="<?= Template::css('usage.css')?>"/>
<div class="usage-tabs-container">
<h2><?= __('Item usage')?></h2>
<div class="tab-container">
<nav class="tab-selector"></nav>
<div data-tab-content="tao-tests" data-tab-label="Tests">
<div class="data-container-wrapper flex-container-full">
<div class="grid-row">
<div class="col-12">
<div class="usage-tests-container"></div>
</div>
</div>
</div>
</div>
<div class="hidden" data-tab-content="tao-sessions" data-tab-label="Sessions">
<div class="data-container-wrapper flex-container-full">
<div class="grid-row">
<div class="col-12">
<div class="usage-sessions-container"></div>
</div>
</div>
</div>
</div>
</div>
<div class="selector-container" data-root-class="<?=get_data('rootClassUri')?>" data-test="<?=get_data('testUri')?>" data-label="<?=_dh(get_data('label'))?>">
</div>
</div>
<?php
Template::inc('footer.tpl', 'tao');
?>

0 comments on commit 83d0d52

Please sign in to comment.