[Mobile] Moved Button

Button moved to the Browse.html
and BrowseController handles the
tree slide.
This commit is contained in:
Dave 2015-07-09 10:28:45 -07:00
parent 7974f33781
commit b9371ea03d
5 changed files with 82 additions and 10 deletions

View File

@ -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>

View File

@ -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>

View File

@ -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);

View File

@ -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;

View File

@ -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 {