KYLIN-2287 fix the button display issue with js Signed-off-by: zhongjian <jiat...@163.com>
Project: http://git-wip-us.apache.org/repos/asf/kylin/repo Commit: http://git-wip-us.apache.org/repos/asf/kylin/commit/49de556f Tree: http://git-wip-us.apache.org/repos/asf/kylin/tree/49de556f Diff: http://git-wip-us.apache.org/repos/asf/kylin/diff/49de556f Branch: refs/heads/sparkcubing-rebase Commit: 49de556f00ff8fd854654daf1bc7e1d26c1fb879 Parents: f267ba9 Author: ShaoChinYu <shaoqin...@kyligence.io> Authored: Fri Jan 6 12:22:59 2017 +0800 Committer: zhongjian <jiat...@163.com> Committed: Fri Jan 6 12:29:35 2017 +0800 ---------------------------------------------------------------------- webapp/app/js/controllers/models.js | 36 ++++++++++++++++++++++++ webapp/app/partials/models/models_tree.html | 6 ++-- 2 files changed, 39 insertions(+), 3 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/kylin/blob/49de556f/webapp/app/js/controllers/models.js ---------------------------------------------------------------------- diff --git a/webapp/app/js/controllers/models.js b/webapp/app/js/controllers/models.js index e3ee038..fd21845 100644 --- a/webapp/app/js/controllers/models.js +++ b/webapp/app/js/controllers/models.js @@ -183,7 +183,41 @@ KylinApp.controller('ModelsCtrl', function ($scope, $q, $routeParams, $location, }); }; + function changePositionOfScrollBar(){ + //get which button be clicked + var btn = window.event.srcElement || window.event.target; + //get current position of scroll bar + var scrollTop =$("#cube_model_trees").scrollTop(); + //get total length of scroll bar + var scrollHeight = document.getElementById('cube_model_trees').scrollHeight; + //get the position of clicked button relative to the top of window + var offsetTop =$(btn).offset().top; + //get the position of the container relative to the top of window + var treeOffsetTop = $("#cube_model_trees").offset().top; + + //distance from button to the top of tree model container + var minor = offsetTop - treeOffsetTop; + //height of tree model container + var viewH =$("#cube_model_trees").height(); + + //change scroll bar to show the dropdown menu + if(minor + 100 > viewH){//100 is the height of dropdowm menu + if((scrollHeight - scrollTop - viewH)>=minor+100-viewH){ + document.getElementById('cube_model_trees').scrollTop+=(minor+120-viewH); + }else{ + var node=document.createElement("LI"); + node.style.height = (minor+120-viewH)+"px"; + document.getElementById("models-tree").appendChild(node); + var viewH =$("#cube_model_trees").height();//å¯è§é«åº¦ + document.getElementById('cube_model_trees').scrollTop+=(minor+120-viewH); + + } + } + } + $scope.listModelAccess = function (model) { + changePositionOfScrollBar(); + if(model.uuid){ AccessService.list({type: "DataModelDesc", uuid: model.uuid}, function (accessEntities) { model.accessEntities = accessEntities; @@ -196,6 +230,8 @@ KylinApp.controller('ModelsCtrl', function ($scope, $q, $routeParams, $location, } }) } + + }; var ModelDetailModalCtrl = function ($scope, $location, $modalInstance, scope) { http://git-wip-us.apache.org/repos/asf/kylin/blob/49de556f/webapp/app/partials/models/models_tree.html ---------------------------------------------------------------------- diff --git a/webapp/app/partials/models/models_tree.html b/webapp/app/partials/models/models_tree.html index 944d2dc..eba7d29 100644 --- a/webapp/app/partials/models/models_tree.html +++ b/webapp/app/partials/models/models_tree.html @@ -41,10 +41,10 @@ <div> <h3 class="text-info">Models</h3> </div> +<!--{{window}}px --> + <div id="cube_model_trees" style="width:100%; height:250px; overflow:auto;margin-top: 20px;" class="cube_model_trees"> - <div style="width:100%; height:{{window}}px; overflow:auto;margin-top: 20px;" class="cube_model_trees"> - - <ul class="list-group models-tree"> + <ul class="list-group models-tree" id="models-tree"> <li class="list-group-item" ng-repeat="model in modelsManager.models"> <div class="pull-right" showonhoverparent style="display:none;" >
