satellite/satbd-explorer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Custom routing

Browse Source 
Yep fuck SPA principle in angular, do it my way
This commit is contained in:
Alexandre Tuleu
2016-01-26 10:24:57 +01:00
parent 276642a046
commit 5f2208839d
2 changed files with 47 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
static/index.html
View File

@@ -9,7 +9,7 @@
<link href="/css/satbd.sateliite.bar.css" rel="stylesheet" />
<title>satbd: explorez la betheque de sat</title>
</head>
<body ng-app="satbd.satellite.bar" ng-controller="GlobalCtrl">
<body ng-app="satbd.satellite.bar" ng-controller="GlobalCtrl" >
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container" ng-controller="NavbarCollapseCtrl">
<script type="text/ng-template" id="help.html">
@@ -30,13 +30,13 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><img alt="brand" src="//satellite.bar/images/satellitenuit.png"/></a>
<a class="navbar-brand" href="/"><img alt="brand" src="//satellite.bar/images/satellitenuit.png"/></a>
</div>
<div id="navbar" class="navbar-collapse" uib-collapse="isCollapsed">
<ul class="nav navbar-nav">
<li class="active"><a href="#recents">Récents</a></li>
<li><a href="#collections">Par Collection</a></li>
<li><a href="#authors">Par Auteurs</a></li>
<li ng-class="{active: isActive('recents')}"><a ng-click="recents()" >Récents</a></li>
<li ng-class="{active: isActive('collections')}"><a ng-click="collections()">Par Collection</a></li>
<li ng-class="{active: isActive('authors')}"><a ng-click="authors()">Par Auteurs</a></li>
</ul>
<form class="navbar-form navbar-right" role="search">
<div class="input-group">
@@ -54,10 +54,10 @@
</nav>
<!-- Begin page content -->
<div class="container-fluid">
<div class="recent row" ng-controller="RecentCtrl">
<div class="container-fluid" >
<div class="recent row" ng-controller="RecentCtrl" ng-cloak>
<div class="album col-xs-6 col-sm-4 col-md-3 col-lg-2" ng-repeat="id in albumIDs" ng-controller="RecentAlbumCtrl" ng-init="init_by_id(id)">
<img class="cover img-responsive img-rounded center-block" src="{{album.CoverURL}}">
<img class="cover img-responsive img-rounded center-block" ng-src="{{album.CoverURL}}">
</div>
</div>
</div>

46
static/js/satbd.satellite.bar.js
View File

@@ -1,11 +1,34 @@
angular.module('satbd.satellite.bar', ['ui.bootstrap','ngAnimate']);
angular.module('satbd.satellite.bar').controller('GlobalCtrl', function($scope) {
$scope.location = ''
$scope.location = '';
$scope.isActive = function(location) {
return $scope.location == location
return $scope.location === location
};
$scope.recents = function() {
$scope.location='recents';
$scope.$broadcast('displayRecents')
};
$scope.collections = function() {
$scope.location='collections';
$scope.$broadcast('displayCollections')
};
$scope.authors = function() {
$scope.location='authors';
$scope.$broadcast('displayAuthors')
};
$scope.search = function( query ) {
$scope.location='search';
$scope.$broadcast('displaySearch', query)
};
$scope.$on('recentsReady', function(event) {
$scope.recents();
});
});
@@ -30,12 +53,21 @@ angular.module('satbd.satellite.bar').controller('HelpInstanceCtrl', function($s
angular.module('satbd.satellite.bar').controller('RecentCtrl', function($scope, $http,$log) {
$scope.albumIDs = [ ];
$http.get('/api/recents').success(function(data){
for (var i = 0; i < 10; i++) {
$scope.albumIDs.push(data[i])
}
$scope.clear = function(event) { $scope.albumIDs = [] };
$scope.$on('displayAuthors', $scope.clear);
$scope.$on('displayCollections', $scope.clear);
$scope.$on('displaySearch', $scope.clear);
$scope.$on('displayRecents', function(event) {
$scope.clear();
$log.info('fetching recent albums');
$http.get('/api/recents').success(function(data){
for (var i = 0; i < 10; i++) {
$scope.albumIDs.push(data[i]);
}
});
});
$scope.$emit('recentsReady')
});