Few additional ui adjustement + filtering categ feature on button click

pull/3/head
Sami Mokaddem 2017-11-02 14:02:54 +01:00
parent aabd4779f9
commit 3bfa5185dc
3 changed files with 18 additions and 8 deletions

View File

@ -3,6 +3,15 @@
height: auto; height: auto;
} }
.centerInBtn {
float: left;
text-align: center;
vertical-align: middle;
line-height: 40px;
margin-right: 10px;
font-size: x-large;
}
.popover-content { .popover-content {
padding: 3px padding: 3px
} }

View File

@ -7,7 +7,6 @@ var datatableFame;
var maxRank = 16; var maxRank = 16;
var popOverOption = { var popOverOption = {
trigger: "hover", trigger: "hover",
title: "Ranking icons",
html: true, html: true,
placement: 'bottom', placement: 'bottom',
content: generateRankingSheet() content: generateRankingSheet()
@ -113,7 +112,7 @@ function generateRankingSheet(rank) {
th.innerHTML = "Rank"; th.innerHTML = "Rank";
tr.appendChild(th); tr.appendChild(th);
var th = document.createElement('th'); var th = document.createElement('th');
th.innerHTML = "Requirement"; th.innerHTML = "Requirement (CP)";
tr.appendChild(th); tr.appendChild(th);
thead.appendChild(tr); thead.appendChild(tr);
//body //body
@ -125,7 +124,7 @@ function generateRankingSheet(rank) {
td.style.padding = "2px"; td.style.padding = "2px";
tr.appendChild(td); tr.appendChild(td);
var td = document.createElement('td'); var td = document.createElement('td');
td.innerHTML = Math.pow(rankMultiplier, i)+" pnts"; td.innerHTML = Math.pow(rankMultiplier, i);
td.style.padding = "2px"; td.style.padding = "2px";
tr.style.textAlign = "center"; tr.style.textAlign = "center";
if (i == rank) { // current org rank if (i == rank) { // current org rank
@ -156,10 +155,10 @@ function addToTableFromJson(datatable, url) {
}); });
} }
function updateProgressHeader(org) { function updateProgressHeader(org) {
// get Org rank // get Org rank
$.getJSON( url_getOrgRank+'?org='+org, function( data ) { $.getJSON( url_getOrgRank+'?org='+org, function( data ) {
console.log(data);
datatableTop.draw(); datatableTop.draw();
var rank = Math.floor(data.rank); var rank = Math.floor(data.rank);
$('#btnCurrRank').show(); $('#btnCurrRank').show();
@ -189,6 +188,10 @@ function updateProgressHeader(org) {
}); });
} }
function showOnlyOrg() {
datatableCateg.search( $('#orgText').text() ).draw();
}
$(document).ready(function() { $(document).ready(function() {
if(currOrg != "") // currOrg selected if(currOrg != "") // currOrg selected
updateProgressHeader(org) updateProgressHeader(org)

View File

@ -64,10 +64,8 @@
<div class='textTopHeader' style="padding-top: 9px;"> <div class='textTopHeader' style="padding-top: 9px;">
<input type="text" id="orgName" data-provide="typeahead" size="20" style="margin-bottom: 5px;"> <input type="text" id="orgName" data-provide="typeahead" size="20" style="margin-bottom: 5px;">
</div> </div>
<div class='leftSepa textTopHeader' style="min-width: 100px;"> <button id="btnCurrRank" class='btn btn-default popOverBtn' data-container='body' data-toggle='popover' style="display: none; margin-left: 20px;" onclick="showOnlyOrg()">
<strong id="orgText"></strong> <strong id="orgText" class="centerInBtn"></strong>
</div>
<button id="btnCurrRank" class='btn btn-default popOverBtn' data-container='body' data-toggle='popover' style="display: none;">
<div id="orgRankDiv" class='textTopHeader' style="padding-top: 0px; position: relative; width: 40px; height: 40px;"></div> <div id="orgRankDiv" class='textTopHeader' style="padding-top: 0px; position: relative; width: 40px; height: 40px;"></div>
<div class='' style="float: left; padding: 10px;"> <div class='' style="float: left; padding: 10px;">
<div class="progress" style=''> <div class="progress" style=''>