Skip to content
Snippets Groups Projects
Commit f51e4ea2 authored by David Findlay's avatar David Findlay
Browse files

Menu improvements

parent 1bb87d28
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
app/au/org/mastersswimmingqld/ppmg/models/Meet.java
+ 1
− 0
View file @ f51e4ea2
......@@ -7,6 +7,7 @@ import java.util.List;
* Handles details of meets
*
*/
public class Meet {
private long id;
......
app/views/Index.scala.html
+ 31
− 10
View file @ f51e4ea2
......@@ -10,29 +10,50 @@
<link rel="stylesheet" href="@routes.Assets.versioned("css/app.css")">
<script data-main="@routes.Assets.versioned("js/main.js")" src="@routes.Assets.versioned("lib/requirejs/require.js")"></script>
</head>
<body>
<body ng-controller="menuCtrl">
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle pull-left" ng-click="isShowMenu">
<span class="sr-only">Toggle navigation</span>
<a class="btn btn-navbar navbar-toggle pull-left" ng-click="menuClosed = !menuClosed">
<span class="sr-only">Menu</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</a>
<a class="navbar-brand" href="#">eProgram2</a>
</div>
</div>
</nav>
<div id="wrapper" class="row row-offcanvas row-offcanvas-left" ng-controller="menuCtrl" uib-collapse="showMenu" horizontal>
<div id="wrapper">
<div id="sidebar-wrapper" class="col-xs-6 col-sm-3 sidebar-offcanvas" ng-show="menuOpen" role="navigation">
<div id="sidebar-wrapper" class="col-xs-10 col-sm-3 col-md-3 col-lg-3" ng-hide="menuClosed"
role="navigation">
<ul class="nav nav-pills nav-stacked">
<li><a href="#/view1">view1</a></li>
<li><a href="#/view2">view2</a></li>
</ul>
<form>
<select class="form-control" id="meet">
<option value="">Select a meet</option>
</select>
<ul class="nav nav-pills nav-stacked">
<li><a href="#/view1">Newsflashes</a></li>
<li><a href="#/view2">Marshalling</a></li>
</ul>
<select class="form-control" id="event">
<option value="">Select an event</option>
</select>
<select class="form-control" id="heat">
<option value="">Select a heat</option>
</select>
<select class="form-control" id="agegroup">
<option value="">Select an age group</option>
</select>
</form>
</div>
......
public/css/app.css
+ 50
− 30
View file @ f51e4ea2
......@@ -28,36 +28,56 @@ body { padding-top: 50px; }
margin-bottom: 0;
}
/* Mobile narrow view */
@media screen and (max-width: 767px) {
.row-offcanvas {
position: relative;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
.row-offcanvas-right
.sidebar-offcanvas {
right: -41.6%;
}
.form-control {
margin-top: 1em;
margin-bottom: 1em;
}
.row-offcanvas-left
.sidebar-offcanvas {
left: -41.6%;
}
.row-offcanvas-right.active {
right: 41.6%;
}
.row-offcanvas-left.active {
left: 41.6%;
}
.sidebar-offcanvas {
position: absolute;
top: 0;
width: 41.6%;
}
#sidebar-wrapper {
padding-top:0;
/* Force side menu open on screens other than mobile */
@media screen and (min-width: 768px) {
#sidebar-wrapper.collapse{
display: block !important;
}
}
/* Animation for menu */
.ng-hide-add {
transition: 0.5s linear all;
}
.ng-hide-remove {
transition: 0.5s linear all;
}
/*!* Mobile narrow view *!*/
/*@media screen and (max-width: 767px) {*/
/*.row-offcanvas {*/
/*position: relative;*/
/*-webkit-transition: all 0.25s ease-out;*/
/*-moz-transition: all 0.25s ease-out;*/
/*transition: all 0.25s ease-out;*/
/*}*/
/*.row-offcanvas-right*/
/*.sidebar-offcanvas {*/
/*right: -41.6%;*/
/*}*/
/*.row-offcanvas-left*/
/*.sidebar-offcanvas {*/
/*left: -41.6%;*/
/*}*/
/*.row-offcanvas-right.active {*/
/*right: 41.6%;*/
/*}*/
/*.row-offcanvas-left.active {*/
/*left: 41.6%;*/
/*}*/
/*.sidebar-offcanvas {*/
/*position: absolute;*/
/*top: 0;*/
/*width: 41.6%;*/
/*}*/
/*#sidebar-wrapper {*/
/*padding-top:0;*/
/*}*/
}
\ No newline at end of file
/*}*/
\ No newline at end of file
public/js/controllers.js
+ 7
− 6
View file @ f51e4ea2
......@@ -9,21 +9,22 @@ define(function() {
var controllers = {};
controllers.menuCtrl = function($scope, $window) {
$scope.menuOpen = false;
console.log("MenuCtrl");
// Detect if mobile portrait screen size
$scope.is_mobile = ($window.innerWidth <= 480);
if ($scope.isMobile) {
$scope.menuOpen = false;
console.log ($window.innerWidth + " therefore " + $scope.is_mobile);
if ($scope.is_mobile) {
$scope.menuClosed = true;
console.log("mobile detected - close menu")
} else {
$scope.menuOpen = true;
$scope.menuClosed = false;
console.log("not mobile - open menu")
}
//console.log("menu = " + showMenu);
}
controllers.menuCtrl.$inject = ['$scope', '$window'];
......
public/js/main.js
+ 3
− 2
View file @ f51e4ea2
......@@ -6,6 +6,7 @@ requirejs.config({
paths: {
'angular': ['../lib/angularjs/angular'],
'angular-route': ['../lib/angularjs/angular-route'],
'angular-animate': ['../lib/angular-animate/angular-animate'],
'ui-bootstrap':['../lib/angular-ui-bootstrap/ui-bootstrap']
},
shim: {
......@@ -23,12 +24,12 @@ requirejs.config({
}
});
require(['angular', './controllers', './directives', './filters', './services', 'angular-route', "ui-bootstrap"],
require(['angular', './controllers', './directives', './filters', './services', 'angular-route', "ui-bootstrap", 'angular-animate'],
function(angular, controllers) {
// Declare app level module which depends on filters, and services
//
var eprogram2 = angular.module('eprogram2', ['ui.bootstrap', 'eprogram2.filters', 'eprogram2.services', 'eprogram2.directives', 'ngRoute']).
var eprogram2 = angular.module('eprogram2', ['ui.bootstrap', 'eprogram2.filters', 'eprogram2.services', 'eprogram2.directives', 'ngRoute', 'ngAnimate']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: controllers.MyCtrl1});
$routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: controllers.MyCtrl2});
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment