Skip to content

Commit 2917f58

Browse files
weblancasterweblancaster
committed
Merge pull request #370 from Soundnode/followers-view
add followers view and code refactoring
2 parents c59316e + b0057f0 commit 2917f58

File tree

10 files changed

+171
-52
lines changed

10 files changed

+171
-52
lines changed

‎app/index.html‎

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -90,11 +90,23 @@ <h4>Authenticating your Soundcloud account.</h4>
9090
<header class="header">
9191
<!-- user -->
9292
<div class="user" ng-controller="UserCtrl">
93-
<img ng-src="{{ userThumb }}" alt="{{ name }}" class="user_thumb">
93+
<div class="user_profile clearfix">
94+
<img ng-src="{{ data.avatar_url }}" alt="{{ data.username }}" class="user_thumb">
9495

95-
<div class="user_inner">
96-
<span class="user_name">{{ name }}</span>
97-
<a href="" class="user_logOut" ng-click="logOut()">Log out</a>
96+
<div class="user_inner">
97+
<span class="user_name">{{ data.username }}</span>
98+
<a href="" class="user_logOut" ng-click="logOut()">Log out</a>
99+
</div>
100+
</div>
101+
<div class="user_info">
102+
<span class="user_info_wrap" ui-sref="following">
103+
<small>{{ data.followings_count }}</small>
104+
<small>following</small>
105+
</span>
106+
<span class="user_info_wrap" ui-sref="followers">
107+
<small>{{ data.followers_count }}</small>
108+
<small>followers</small>
109+
</span>
98110
</div>
99111
</div>
100112
<!-- user / end -->
@@ -111,12 +123,6 @@ <h2 class="ui_title">Main</h2>
111123
<span class="mainNav_tit">Stream</span>
112124
</a>
113125
</li>
114-
<li class="mainNav_item">
115-
<a class="mainNav_button" ui-sref="following">
116-
<i class="fa fa-users"></i>
117-
<span class="mainNav_tit">Following</span>
118-
</a>
119-
</li>
120126
<li class="mainNav_item">
121127
<a class="mainNav_button" ui-sref="favorites">
122128
<i class="fa fa-heart"></i>
@@ -235,6 +241,7 @@ <h4 id="playerUser" class="player_user"></h4>
235241
<script src="public/js/playlists/playlistsCtrl.js"></script>
236242
<script src="public/js/playlists/playlistDashboardCtrl.js"></script>
237243
<script src="public/js/following/followingCtrl.js"></script>
244+
<script src="public/js/followers/followersCtrl.js"></script>
238245
<script src="public/js/about/aboutCtrl.js"></script>
239246
<script src="public/js/updater/updaterCtrl.js"></script>
240247
<script src="public/js/profile/profileCtrl.js"></script>

‎app/public/js/app.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,11 @@ app.config(function ($stateProvider, $urlRouterProvider, hotkeysProvider) {
4646
templateUrl: 'views/following/following.html',
4747
controller: 'FollowingCtrl'
4848
})
49+
.state('followers', {
50+
url: '/followers',
51+
templateUrl: 'views/followers/followers.html',
52+
controller: 'FollowersCtrl'
53+
})
4954
.state('profile', {
5055
url: '/profile/:id',
5156
templateUrl: 'views/profile/profile.html',

‎app/public/js/common/SCapiService.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -110,10 +110,10 @@ app.service('SCapiService', function ($http, $window, $q, $log, $state, $statePa
110110
* Responsible to get the followed users.
111111
* @return {[object]} data response
112112
*/
113-
this.getFollowing = function () {
113+
this.getFollowing = function (endpoint) {
114114
this.isLoading();
115115

116-
var url = 'https://api.soundcloud.com/me/followings.json?limit=25&oauth_token=' + $window.scAccessToken
116+
var url = 'https://api.soundcloud.com/me/' + endpoint + '.json?limit=25&oauth_token=' + $window.scAccessToken
117117
+ '&linked_partitioning=1'
118118
, that = this;
119119

‎app/public/js/followers/followersCtrl.js‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
'use strict';
2+
3+
app.controller('FollowersCtrl', function ($scope, SCapiService, $rootScope, $log) {
4+
$scope.title = 'Followers';
5+
$scope.data = '';
6+
$scope.busy = false;
7+
8+
SCapiService.getFollowing('followers')
9+
.then(function(data) {
10+
$scope.data = data.collection.sort( sortBy("username") );
11+
}, function(error) {
12+
console.log('error', error);
13+
}).finally(function() {
14+
$rootScope.isLoading = false;
15+
});
16+
17+
$scope.loadMore = function() {
18+
if ( $scope.busy ) {
19+
return;
20+
}
21+
$scope.busy = true;
22+
23+
SCapiService.getNextPage()
24+
.then(function(data) {
25+
for ( var i = 0; i < data.collection.length; i++ ) {
26+
$scope.data.push( data.collection[i] )
27+
}
28+
}, function(error) {
29+
console.log('error', error);
30+
}).finally(function(){
31+
$scope.busy = false;
32+
$rootScope.isLoading = false;
33+
});
34+
};
35+
36+
function sortBy(prop){
37+
return function(a,b){
38+
if( a[prop] > b[prop]){
39+
return 1;
40+
}else if( a[prop] < b[prop] ){
41+
return -1;
42+
}
43+
return 0;
44+
}
45+
}
46+
47+
48+
});

‎app/public/js/following/followingCtrl.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ app.controller('FollowingCtrl', function ($scope, SCapiService, $rootScope, $log
55
$scope.data = '';
66
$scope.busy = false;
77

8-
SCapiService.getFollowing()
8+
SCapiService.getFollowing('followings')
99
.then(function(data) {
1010
$scope.data = data.collection.sort( sortBy("username") );
1111
}, function(error) {

‎app/public/js/user/userCtrl.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,15 @@
11
'use strict'
22

33
app.controller('UserCtrl', function ($rootScope, $scope, $window, SCapiService) {
4-
var endpoint = 'me'
5-
, params = '';
4+
var endpoint = 'me';
5+
var params = '';
66

77
$rootScope.userId = '';
8-
$scope.name = '';
9-
$scope.userThumb = '';
10-
$scope.userThumbWidth = '50px';
11-
$scope.userThumbHeight = '50px';
128

139
SCapiService.get(endpoint, params)
1410
.then(function(data) {
1511
$rootScope.userId = data.id;
12+
$scope.data = data;
1613
$scope.name = data.username;
1714
$scope.userThumb = data.avatar_url;
1815
}, function(error) {

‎app/public/stylesheets/sass/_components/_aside.scss‎

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -13,39 +13,6 @@
1313
padding: 15px 10px 10px;
1414
}
1515

16-
/* user info */
17-
.user {
18-
padding: 10px 0 0;
19-
overflow: hidden;
20-
}
21-
22-
.user_thumb {
23-
width: 30px;
24-
height: 30px;
25-
display: block;
26-
border-radius: 50px;
27-
float: left;
28-
}
29-
30-
.user_inner {
31-
float: left;
32-
margin: 0 0 0 20px;
33-
}
34-
35-
.user_name,
36-
.user_logOut {
37-
font-weight: normal;
38-
display: block;
39-
}
40-
41-
.user_name {
42-
font-size: 12px;
43-
color: #fff;
44-
}
45-
46-
.user_logOut {
47-
font-size: 10px;
48-
}
4916

5017
/* main navigation */
5118
.mainNav {

‎app/public/stylesheets/sass/_components/_user.scss‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
.user {
2+
padding: 10px 0 0;
3+
overflow: hidden;
4+
}
5+
6+
.user_thumb {
7+
width: 30px;
8+
height: 30px;
9+
display: block;
10+
border-radius: 50px;
11+
float: left;
12+
}
13+
14+
.user_inner {
15+
float: left;
16+
margin: 0 0 0 20px;
17+
}
18+
19+
.user_name,
20+
.user_logOut {
21+
font-weight: normal;
22+
display: block;
23+
}
24+
25+
.user_name {
26+
font-size: 12px;
27+
color: #fff;
28+
}
29+
30+
.user_logOut {
31+
font-size: 10px;
32+
}
33+
34+
.user_info {
35+
margin: 10px 0 0;
36+
font-size: 13px;
37+
}
38+
39+
.user_info_wrap {
40+
display: inline-block;
41+
margin: 0 4px;
42+
43+
&:hover {
44+
color: #fff;
45+
}
46+
47+
& small,
48+
& strong {
49+
cursor: pointer;
50+
display: block;
51+
}
52+
}

‎app/public/stylesheets/sass/app.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,11 @@
3030
========================================================================== */
3131
@import "_components/_appContainer";
3232

33+
/* ==========================================================================
34+
@User
35+
========================================================================== */
36+
@import "_components/_user";
37+
3338
/* ==========================================================================
3439
@Aside
3540
========================================================================== */

‎app/views/followers/followers.html‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<div class="followingView">
2+
<h1> {{ title }}</h1>
3+
4+
<!-- Song list wrapper -->
5+
<div class="favoritesView_inner">
6+
<ul class="following"
7+
infinite-scroll='loadMore()'
8+
infinite-scroll-distance='0'
9+
infinite-scroll-container='".mainView"'
10+
infinite-scroll-immediate-check='false' >
11+
12+
<li class="following_item" ng-repeat="data in data"
13+
ng-class="{ active: hover }"
14+
ng-mouseover="hover = true"
15+
ng-mouseleave="hover = false">
16+
17+
<div class="songList_item_container_artwork">
18+
<a ui-sref="profile({id: {{data.id}}})">
19+
<span class="songList_item_song_button">
20+
<i class="fa fa-arrow-circle-o-right"></i>
21+
</span>
22+
<img ng-src="{{ showBigArtwork (data.avatar_url) }}" alt="{{ data.title }}" class="songList_item_artwork">
23+
</a>
24+
</div>
25+
26+
<section class="songList_item_inner">
27+
<h3 class="songList_item_song_tit">{{ data.username }}</h3>
28+
<h4 class="songList_item_song_user">Tracks: {{ data.track_count }}</h4>
29+
</section>
30+
31+
</li>
32+
</ul>
33+
</div>
34+
<!-- Song list wrapper / end -->
35+
36+
<div ng-include="'views/common/loading.html'"></div>
37+
38+
</div>

0 commit comments

Comments
 (0)