mirror of
https://github.com/nasa/openmct.git
synced 2025-03-23 12:35:48 +00:00
[Mobile] Moved Button
Button moved to the Browse.html and BrowseController handles the tree slide.
This commit is contained in:
parent
7974f33781
commit
b9371ea03d
@ -41,6 +41,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</mct-split-pane>
|
||||
<div class="btn s-btn s-icon-btn s-very-subtle key-properties button-hide"
|
||||
ng-click="treeSlide()">T</div>
|
||||
</div>
|
||||
<mct-include key="'bottombar'"></mct-include>
|
||||
</div>
|
||||
|
@ -19,10 +19,7 @@
|
||||
this source code distribution or the Licensing information page available
|
||||
at runtime from the About dialog for additional information.
|
||||
-->
|
||||
<div class='object-header' ng-controller="TreeMenuController as treeController">
|
||||
<div class="btn s-btn s-icon-btn s-very-subtle key-properties" ng-click="treeController.toggle()">
|
||||
T
|
||||
</div>
|
||||
<div class='object-header object-header-mobile'>
|
||||
<span class="label s-label">
|
||||
<span class='type-icon icon ui-symbol'>{{type.getGlyph()}}</span>
|
||||
<span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span>
|
||||
|
@ -140,6 +140,22 @@ define(
|
||||
$scope.treeModel = {
|
||||
selectedObject: navigationService.getNavigation()
|
||||
};
|
||||
|
||||
$scope.treeSlide = function () {
|
||||
console.log("Clicked");
|
||||
if (document.getElementById("myElement").
|
||||
className.match(/(?:^|\s)holder-hide(?!\S)/)) {
|
||||
document.getElementById("myElement").className =
|
||||
document.getElementById("myElement")
|
||||
.className.replace(/(?:^|\s)holder-hide(?!\S)/g, '');
|
||||
document.getElementById("myElement").className += " holder-show";
|
||||
} else {
|
||||
document.getElementById("myElement").className =
|
||||
document.getElementById("myElement")
|
||||
.className.replace(/(?:^|\s)holder-show(?!\S)/g, '');
|
||||
document.getElementById("myElement").className += " holder-hide";
|
||||
}
|
||||
};
|
||||
|
||||
// Listen for changes in navigation state.
|
||||
navigationService.addListener(setNavigation);
|
||||
|
@ -748,7 +748,15 @@ mct-container {
|
||||
transition-duration: 0.2s;
|
||||
left: -150px; } }
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
@media screen and (max-width: 514px) {
|
||||
/* line 37, ../sass/mobile/_layout.scss */
|
||||
.holder-show {
|
||||
-moz-transition-duration: 0.2s;
|
||||
-o-transition-duration: 0.2s;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
left: 0px; } }
|
||||
@media screen and (min-width: 515px) and (max-width: 800px) {
|
||||
/* line 37, ../sass/mobile/_layout.scss */
|
||||
.holder-show {
|
||||
-moz-transition-duration: 0.2s;
|
||||
@ -757,16 +765,40 @@ mct-container {
|
||||
transition-duration: 0.2s;
|
||||
left: 0px; } }
|
||||
|
||||
/* line 48, ../sass/mobile/_layout.scss */
|
||||
.button-hide {
|
||||
position: absolute; }
|
||||
@media screen and (max-width: 514px) {
|
||||
/* line 48, ../sass/mobile/_layout.scss */
|
||||
.button-hide {
|
||||
left: 108px; } }
|
||||
@media screen and (min-width: 515px) and (max-width: 800px) {
|
||||
/* line 48, ../sass/mobile/_layout.scss */
|
||||
.button-hide {
|
||||
left: 150px; } }
|
||||
|
||||
/* line 59, ../sass/mobile/_layout.scss */
|
||||
.object-header-mobile {
|
||||
position: relative; }
|
||||
@media screen and (max-width: 514px) {
|
||||
/* line 59, ../sass/mobile/_layout.scss */
|
||||
.object-header-mobile {
|
||||
left: 17px; } }
|
||||
@media screen and (min-width: 515px) and (max-width: 800px) {
|
||||
/* line 59, ../sass/mobile/_layout.scss */
|
||||
.object-header-mobile {
|
||||
left: 15px; } }
|
||||
|
||||
@media screen and (max-width: 514px) {
|
||||
/* line 44, ../sass/mobile/_layout.scss */
|
||||
/* line 69, ../sass/mobile/_layout.scss */
|
||||
.browse-manage {
|
||||
width: 100px; } }
|
||||
@media screen and (min-width: 515px) and (max-width: 800px) {
|
||||
/* line 44, ../sass/mobile/_layout.scss */
|
||||
/* line 69, ../sass/mobile/_layout.scss */
|
||||
.browse-manage {
|
||||
width: 150px; } }
|
||||
@media screen and (min-width: 801px) {
|
||||
/* line 44, ../sass/mobile/_layout.scss */
|
||||
/* line 69, ../sass/mobile/_layout.scss */
|
||||
.browse-manage {
|
||||
min-width: 150px;
|
||||
max-width: 800px;
|
||||
|
@ -35,10 +35,35 @@
|
||||
}
|
||||
|
||||
.holder-show {
|
||||
@include phoneandtablet {
|
||||
@include phone {
|
||||
@include transition-duration(.2s);
|
||||
left: 0px;
|
||||
}
|
||||
}
|
||||
@include tablet {
|
||||
@include transition-duration(.2s);
|
||||
left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.button-hide {
|
||||
position: absolute;
|
||||
// @include transition-duration(.2s);
|
||||
@include phone {
|
||||
left: 108px;
|
||||
}
|
||||
@include tablet {
|
||||
left: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
.object-header-mobile {
|
||||
position: relative;
|
||||
@include phone {
|
||||
left: 23px;
|
||||
}
|
||||
@include tablet {
|
||||
left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.browse-manage {
|
||||
|
Loading…
x
Reference in New Issue
Block a user