Tidying up the topic browser view

revert-70aa11f8
Ace 7 years ago
parent 7601decaaf
commit d74aadae20

@ -28,14 +28,6 @@ function InitiateViewOption(url) {
} }
} }
/*
* Setting-up global variables.
*/
var deviceCheckbox = "#ast-container .ctrl-wr-asset .itm-select input[type='checkbox']";
var assetContainer = "#ast-container";
var deviceListing, currentUser,name;
/* /*
* DOM ready functions. * DOM ready functions.
*/ */
@ -52,12 +44,6 @@ $(document).ready(function () {
name = getParameterByName("name"); name = getParameterByName("name");
/* Adding selected class for selected topics */
$(deviceCheckbox).each(function () {
addDeviceSelectedClass(this);
});
/* for device list sorting drop down */ /* for device list sorting drop down */
$(".ctrl-filter-type-switcher").popover({ $(".ctrl-filter-type-switcher").popover({
html: true, html: true,
@ -67,30 +53,16 @@ $(document).ready(function () {
}); });
}); });
/*
* Add selected style class to the parent element function.
*
* @param checkbox: Selected checkbox
*/
function addDeviceSelectedClass(checkbox) {
if ($(checkbox).is(":checked")) {
$(checkbox).closest(".ctrl-wr-asset").addClass("selected device-select");
} else {
$(checkbox).closest(".ctrl-wr-asset").removeClass("selected device-select");
}
}
function loadTopics(searchType, searchParam) { function loadTopics(searchType, searchParam) {
var serviceURL; var serviceURL;
if ($.hasPermission("VIEW_TOPICS")) { if ($.hasPermission("VIEW_TOPICS")) {
serviceURL = "/api/mqtt-topics/v1.0/admin/topics"; serviceURL = "/api/mqtt-topics/v1.0/admin/topics";
console.log("serviceURL------"+serviceURL);
} else { } else {
$("#loading-content").remove(); $("#loading-content").remove();
$('#device-table').addClass('hidden'); $('#topics-table').addClass('hidden');
$('#device-listing-status-msg').text('Permission denied.'); $('#topics-listing-status-msg').text('Permission denied.');
$("#device-listing-status").removeClass(' hidden'); $("#topics-listing-status").removeClass(' hidden');
return; return;
} }
@ -205,22 +177,15 @@ function loadTopics(searchType, searchParam) {
}); });
var json = { var json = {
"recordsTotal": Object.keys(data).length, "recordsTotal": data.count,
"recordsFiltered": Object.keys(data).length, "recordsFiltered": data.count,
"data": objects "data": objects
}; };
var table = $('#device-grid1').DataTable();
setInterval( function () {
table.ajax.reload();
}, 300000 );
return JSON.stringify(json); return JSON.stringify(json);
}; };
$('#device-grid1').datatables_extended_serverside_paging( $('#topics-grid').datatables_extended_serverside_paging(
null, null,
serviceURL, serviceURL,
dataFilter, dataFilter,
@ -228,10 +193,8 @@ function loadTopics(searchType, searchParam) {
fnCreatedRow, fnCreatedRow,
function () { function () {
$(".icon .text").res_text(0.2); $(".icon .text").res_text(0.2);
$('#device-grid1').removeClass('hidden'); $('#topics-grid').removeClass('hidden');
$("#loading-content").remove(); $("#loading-content").remove();
}, { }, {
"placeholder": "Search By Topic Name", "placeholder": "Search By Topic Name",
"searchKey": "name" "searchKey": "name"

@ -46,198 +46,61 @@
<div class="col-md-12 wr-page-content"> <div class="col-md-12 wr-page-content">
<div> <div>
<span id="permission" data-permission="{{permissions.list}}"></span> <span id="permission" data-permission="{{permissions.list}}"></span>
{{unit "cdmf.unit.device.operation-mod"}} <div id="loading-content" class="col-centered">
{{#if deviceCount}} <i class="fw fw-settings fw-spin fw-2x"></i>
<div id="loading-content" class="col-centered"> Loading subscriptions . . .
<i class="fw fw-settings fw-spin fw-2x"></i> <br>
Loading subscriptions . . .
<br>
</div>
<div id="device-listing-status" class="raw hidden">
<ul style="list-style-type: none;">
<li class="message message-info">
<h4>
<i class="icon fw fw-info"></i>
<a id="device-listing-status-msg"></a>
</h4>
</li>
</ul>
</div>
<div id="device-table">
<table class="table table-striped table-hover list-table display responsive nowrap data-table hidden"
id="device-grid1">
<thead>
<tr class="sort-row">
<th class="no-sort"></th>
<th>By TopicName</th>
<th>By RemainingMsgCount</th>
<th>By Active</th>
<th>By Durable</th>
<th>By SubscriberQueueName</th>
<th>By SubscriptionIdentifier</th>
</tr>
<tr class="filter-row filter-box">
<th class="no-sort"></th>
<th data-for="By TopicName" class="text-filter"></th>
<th data-for="By RemainingMessageCount" class="text-filter"></th>
<th data-for="By Active" class="select-filter"></th>
<th data-for="By Durable" class="select-filter data-platform"></th>
<th data-for="By SubscriberQueueName" class="select-filter"></th>
<th data-for="By SubscriptionIdentifier" class="select-filter"></th>
<!--<th class="no-sort"></th>-->
</tr>
<tr class="bulk-action-row">
<th colspan="7">
<ul class="tiles"></ul>
</th>
</tr>
</thead>
<tbody id="ast-container">
<br class="c-both" />
</tbody>
</table>
</div>
<br class="c-both" />
<div id="content-filter-types" style="display: none">
<div class="sort-title">Sort By</div>
<div class="sort-options">
<a href="#">By SubscribedQueueOrTopicName<span class="ico-sort-asc"></span></a>
<a href="#">By localNumberOfMessagesRemainingForSubscriber</a>
<a href="#">By localActive</a>
<a href="#">By localDurable</a>
<a href="#">By localSubscriberQueueName</a>
<a href="#">By localSubscriptionIdentifier</a>
</div>
</div>
{{else}}
<div id="ast-container" class="ast-container list-view">
<div class="ctrl-info-panel col-centered text-center wr-login">
<h3 class="text-muted">
<i class="fw fw-devices fw-3x"></i>
</h3>
</div>
</div>
{{/if}}
<div id="edit-device-modal-content" class="hide">
<div class="modal-header">
<h3 class="pull-left modal-title">
Please enter new name for the device?
</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
class="fw fw-cancel"></i>
</button>
</div>
<div class="modal-body add-margin-top-2x add-margin-bottom-2x">
<input id="edit-device-name" style="color:#3f3f3f;padding:5px" type="text"
value=""
placeholder="Type here" size="60">
</div>
<div class="modal-footer">
<div class="buttons">
<a href="#" id="edit-device-yes-link" class="btn-operations">
Rename
</a>
<a href="#" id="edit-device-cancel-link" class="btn-operations">
Cancel
</a>
</div>
</div>
</div> </div>
<div id="topics-listing-status" class="raw hidden">
<div id="edit-device-200-content" class="hide"> <ul style="list-style-type: none;">
<div class="modal-header"> <li class="message message-info">
<h3 class="pull-left modal-title"> <h4>
Device was successfully updated. <i class="icon fw fw-info"></i>
</h3> <a id="topics-listing-status-msg"></a>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i </h4>
class="fw fw-cancel"></i> </li>
</button> </ul>
</div> </div>
<div class="modal-body add-margin-top-2x add-margin-bottom-2x"> <div id="topics-table">
<table class="table table-striped table-hover list-table display responsive nowrap data-table hidden"
</div> id="topics-grid">
<div class="modal-footer"> <thead>
<div class="buttons"> <tr class="sort-row">
<th class="no-sort"></th>
<div id="edit-device-200-content" class="hide"> <th>By TopicName</th>
<div class="content"> <th>By RemainingMsgCount</th>
<div class="row"> <th>By Active</th>
<div class="col-lg-5 col-md-6 col-centered"> <th>By Durable</th>
<h3>Device was successfully updated.</h3> <th>By SubscriberQueueName</th>
</div> <th>By SubscriptionIdentifier</th>
</div> </tr>
</div> <tr class="filter-row filter-box">
</div> <th class="no-sort"></th>
<th data-for="By TopicName" class="text-filter"></th>
<div id="device-400-content" class="hide"> <th data-for="By RemainingMessageCount" class="text-filter"></th>
<div class="modal-content"> <th data-for="By Active" class="select-filter"></th>
<div class="row"> <th data-for="By Durable" class="select-filter data-platform"></th>
<div class="col-lg-5 col-md-6 col-centered"> <th data-for="By SubscriberQueueName" class="select-filter"></th>
<h3>Exception at backend. Try Later.</h3> <th data-for="By SubscriptionIdentifier" class="select-filter"></th>
<br /> <!--<th class="no-sort"></th>-->
<div class="buttons"> </tr>
<a href="#" id="device-400-link" class="btn-operations"> </thead>
Ok <tbody id="ast-container">
</a>
</div> <br class="c-both" />
</div> </tbody>
</div> </table>
</div> </div>
</div> <br class="c-both" />
<div id="content-filter-types" style="display: none">
<div id="device-403-content" class="hide"> <div class="sort-title">Sort By</div>
<div class="modal-content"> <div class="sort-options">
<div class="row"> <a href="#">By SubscribedQueueOrTopicName<span class="ico-sort-asc"></span></a>
<div class="col-lg-5 col-md-6 col-centered"> <a href="#">By localNumberOfMessagesRemainingForSubscriber</a>
<h3>Operation not permitted.</h3> <a href="#">By localActive</a>
<br /> <a href="#">By localDurable</a>
<div class="buttons"> <a href="#">By localSubscriberQueueName</a>
<a href="#" id="device-403-link" class="btn-operations"> <a href="#">By localSubscriptionIdentifier</a>
Ok
</a>
</div>
</div>
</div>
</div>
</div>
<div id="device-409-content" class="hide">
<div class="modal-content">
<div class="row">
<div class="col-lg-5 col-md-6 col-centered">
<h3>Device does not exist.</h3>
<br />
<div class="buttons">
<a href="#" id="remove-device-409-link" class="btn-operations">
Ok
</a>
</div>
</div>
</div>
</div>
</div>
<div id="no-device-selected" class="hide">
<div class="modal-content">
<div class="row">
<div class="col-lg-5 col-md-6 col-centered">
<h3>Please select one ore more devices in order to perform this
operation.</h3>
<br/>
<div class="buttons">
<a href="#" id="no-device-selected-link" class="btn-operations">
Ok
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

Loading…
Cancel
Save