liweichun
/
my-bookmark
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

加一个加载动画

This commit is contained in:
luchenqun 2017-03-21 16:26:44 +08:00
parent d05616d8b8
commit bbf822bb82
5 changed files with 21 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/scripts/controllers/bookmarks-controller.js
View File

@ -39,7 +39,6 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
currentPage = parseInt(currentPage) || 0;
console.log('currentPage = ', currentPage);
if (currentPage <= $scope.totalPages && currentPage >= 1) {
$scope.loadBusy = true;
$scope.currentPage = currentPage;
$scope.inputPage = '';
getBookmarks();
@ -273,8 +272,10 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
toastr.error('获取信息失败。错误信息：' + JSON.stringify(err), "错误");
});
} else {
$scope.loadBusy = true;
bookmarkService.getBookmarks(params)
.then((data) => {
$scope.loadBusy = false;
if (params.showStyle != 'navigate') {
$scope.bookmarkData = data;
$scope.totalPages = Math.ceil(data.totalItems / perPageItems);
@ -289,7 +290,6 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
$scope.bookmarks.push(bookmark);
}
})
$scope.loadBusy = false;
} else if (params.showStyle == 'costomTag') {
$scope.costomTags.forEach((tag) => {
if (tag.clicked) {
@ -317,7 +317,10 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
transition();
}
})
.catch((err) => console.log('getBookmarks err', err));
.catch((err) => {
console.log('getBookmarks err', err);
$scope.loadBusy = false;
});
}
}

7
public/scripts/controllers/hot-controller.js
View File

@ -166,6 +166,7 @@ app.controller('hotCtr', ['$scope', '$state', '$stateParams', '$filter', '$windo
data: requireData,
success: function(json) {
// console.log('success............', json, JSON.stringify(json.data.list[0]) );
$scope.loadBusy = false;
var alterRex = "/mmbiz.qpic.cn|images.jianshu.io|zhimg.com/g";
var defaultSnap = "./images/snap/default.png"
var defaultFavicon = "./images/favicon/default.ico"
@ -200,7 +201,6 @@ app.controller('hotCtr', ['$scope', '$state', '$stateParams', '$filter', '$windo
$scope.bookmarks.push(b);
})
$scope.curDay--;
$scope.loadBusy = false;
updateEditPos();
} else {
toastr.error('获取热门书签失败！失败原因：' + json.message + "。将尝试从缓存中获取！", "提示");
@ -209,6 +209,7 @@ app.controller('hotCtr', ['$scope', '$state', '$stateParams', '$filter', '$windo
}, 100);
},
error: function(json) {
$scope.loadBusy = false;
toastr.error('获取热门书签失败！失败原因：' + json.message + "。将尝试从缓存中获取！", "提示");
getHotBookmarksbyCache();
}
@ -216,16 +217,16 @@ app.controller('hotCtr', ['$scope', '$state', '$stateParams', '$filter', '$windo
}
function getHotBookmarksbyCache() {
$scope.loadBusy = true;
var date = curentDate($scope.curDay, "yyyyMMdd");
if (date < "20160715") {
$scope.loadBusy = false;
toastr.info('您已将将所有的热门标签都加载完了！', "提示");
$scope.loadBusy = false;
return; // 这是最早的了。
}
var params = {
date: date,
}
$scope.loadBusy = true;
bookmarkService.getHotBookmarks(params)
.then((data) => {
data.forEach((bookmark) => {

2
public/scripts/controllers/menus-controller.js
View File

@ -63,6 +63,8 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', 'pubSubService',
$('.js-radio-' + showStyle).checkbox('set checked');
$state.go('bookmarks', {
showStyle: showStyle,
}, {
reload: true,
})
}

12
public/views/bookmarks.html
View File

@ -10,7 +10,7 @@
</ul>
</div>
</div>
<div class="ui segment js-segment-navigate" ng-if="showStyle === 'navigate'">
<div class="ui segment js-segment-navigate" ng-if="showStyle === 'navigate'" ng-show="!loadBusy">
<div class="ui container" ng-repeat="tag in bookmarks" ng-init="tagIndex=$index">
<div class="ui grid">
<div class="row">
@ -47,7 +47,7 @@
<div class="ui divider"></div>
</div>
</div>
<div class="ui segment js-segment-costomTag" ng-if="showStyle === 'costomTag'">
<div class="ui segment js-segment-costomTag" ng-if="showStyle === 'costomTag'" ng-show="!loadBusy">
<div class="ui container">
<div class="ui grid">
<div class="two wide column js-costomTag-label" ng-repeat="tag in costomTags">
@ -78,7 +78,7 @@
</div>
</div>
</div>
<table class="ui selectable sortable celled table js-table-bookmarks" ng-if="showStyle === 'table'">
<table class="ui selectable sortable celled table js-table-bookmarks" ng-if="showStyle === 'table'" ng-show="!loadBusy">
<thead>
<tr>
<th class="forbid_sorted">标题</th>
@ -128,7 +128,7 @@
</tr>
</tfoot>
</table>
<div class="ui segment js-segment-card" ng-if="showStyle === 'card'">
<div class="ui segment js-segment-card" ng-if="showStyle === 'card'" ng-show="!loadBusy || currentPage>1">
<div class="ui five stackable cards" infinite-scroll='loadCardData()' infinite-scroll-immediate-check="false">
<div class="card" ng-repeat="bookmark in bookmarks" id="{{bookmark.id}}">
<div class="content" ng-click="jumpToUrl(bookmark.url, bookmark.id)" style="max-height:70px;cursor:pointer">
@ -159,6 +159,6 @@
</div>
</div>
</div>
<div class="ui massive text centered inline loader" ng-class="{active:loadBusy, disabled:!loadBusy}">
正在加载中...</div>
</div>
<div class="ui massive text centered inline loader" ng-class="{active:loadBusy, disabled:!loadBusy}">
正在加载中...</div>

6
public/views/hot.html
View File

@ -1,5 +1,5 @@
<!-- 高度至少要设置1000，元素少时才能触发滚动条事件 -->
<div class="ui segment js-hot-card" style="min-height:1000px;">
<div class="ui segment js-hot-card" style="min-height:1000px;" ng-show="!loadBusy || (!random && curDay<0)">
<div class="ui five stackable cards" infinite-scroll='loadHotBookmarks()' infinite-scroll-immediate-check="false">
<div class="card" ng-repeat="bookmark in bookmarks">
<div class="content" style="max-height:70px;cursor:pointer" ng-click="jumpToUrl(bookmark.url)">
@ -27,6 +27,6 @@
<div style="width:22px;height:22px;" class="js-hot-random" ng-click="randomHotBookmarks()" title="随机查看热门收藏，如需回到最新热门收藏，请点击菜单按钮热门收藏" ng-show="!loadBusy">
<img class="ui ui middle aligned tiny image" ng-src="./images/random.png">
</div>
<div class="ui massive text centered inline loader js-hot-loader" ng-class="{active:loadBusy, disabled:!loadBusy}" style="top:15px;">
正在加载中...</div>
</div>
<div class="ui massive text centered inline loader js-hot-loader" ng-class="{active:loadBusy, disabled:!loadBusy}" >
正在加载中...</div>