weixin articles
This commit is contained in:
luchenqun
parent
bab9c124ce
commit
0ad1506f5c
|
|
@ -1,311 +0,0 @@
|
||||||
app.controller('hotCtr', ['$scope', '$state', '$stateParams', '$filter', '$window', '$timeout', '$document', 'ngDialog', 'bookmarkService', 'pubSubService', 'dataService', function($scope, $state, $stateParams, $filter, $window, $timeout, $document, ngDialog, bookmarkService, pubSubService, dataService) {
|
|
||||||
console.log("Hello hotCtr...");
|
|
||||||
if(dataService.smallDevice()){
|
|
||||||
$window.location = "http://m.mybookmark.cn/#/tags";
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
$scope.hoverBookmark = null;
|
|
||||||
$scope.bookmarks = []; // 书签数据
|
|
||||||
$scope.bookmarkNormalHover = false;
|
|
||||||
$scope.bookmarkEditHover = false;
|
|
||||||
const perPageItems = 20;
|
|
||||||
$scope.totalPages = 0;
|
|
||||||
$scope.currentPage = 1;
|
|
||||||
$scope.inputPage = '';
|
|
||||||
$scope.loadBusy = false;
|
|
||||||
$scope.curDay = 0;
|
|
||||||
$scope.toastrId = 0;
|
|
||||||
$scope.random = 0;
|
|
||||||
|
|
||||||
bookmarkService.autoLogin()
|
|
||||||
.then((data) => {
|
|
||||||
var login = data.logined;
|
|
||||||
var index = login ? dataService.LoginIndexHot : dataService.NotLoginIndexHot;
|
|
||||||
pubSubService.publish('Common.menuActive', {
|
|
||||||
login: login,
|
|
||||||
index: index
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.log('autoLogin err', err)
|
|
||||||
});
|
|
||||||
|
|
||||||
getHotBookmarks();
|
|
||||||
|
|
||||||
$scope.jumpToUrl = function(url) {
|
|
||||||
$window.open(url, '_blank');
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.favoriteBookmark = function(b) {
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
if (!login) {
|
|
||||||
$scope.toastrId = toastr.info('请先登录再收藏书签！', "提示");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
var bookmark = {}
|
|
||||||
bookmark.description = '';
|
|
||||||
bookmark.title = b.title;
|
|
||||||
bookmark.url = b.url;
|
|
||||||
bookmark.public = 1;
|
|
||||||
bookmark.click_count = 1;
|
|
||||||
|
|
||||||
bookmarkService.favoriteBookmark(bookmark)
|
|
||||||
.then((data) => {
|
|
||||||
pubSubService.publish('EditCtr.inserBookmarsSuccess', data);
|
|
||||||
if (data.title) {
|
|
||||||
toastr.success('[ ' + data.title + ' ] 收藏成功！', "提示");
|
|
||||||
} else {
|
|
||||||
toastr.error('[ ' + bookmark.title + ' ] 收藏失败！', "提示");
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
toastr.error('[ ' + bookmark.title + ' ] 收藏失败，' + JSON.stringify(err), "提示");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.storeBookmark = function(bookmark) {
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
if (!login) {
|
|
||||||
$scope.toastrId = toastr.info('请先登录再转存书签！', "提示");
|
|
||||||
} else {
|
|
||||||
var b = $.extend(true, {}, bookmark); // 利用jQuery执行深度拷贝
|
|
||||||
b.tags = [{
|
|
||||||
name: b.created_by
|
|
||||||
}]
|
|
||||||
pubSubService.publish('TagCtr.storeBookmark', b);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.copy = function(url) {
|
|
||||||
dataService.clipboard(url);
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.detailBookmark = function(b) {
|
|
||||||
var bookmark = $.extend(true, {}, b); // 利用jQuery执行深度拷贝
|
|
||||||
bookmark.own = false;
|
|
||||||
bookmark.tags = [{
|
|
||||||
id: -1,
|
|
||||||
name: '热门收藏'
|
|
||||||
}];
|
|
||||||
console.log(JSON.stringify(bookmark));
|
|
||||||
pubSubService.publish('TagCtr.showBookmarkInfo', bookmark);
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.loadHotBookmarks = function() {
|
|
||||||
if (!$scope.loadBusy && !$scope.random) {
|
|
||||||
console.log('begin loadHotBookmarks.........')
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
if (login) {
|
|
||||||
getHotBookmarks();
|
|
||||||
} else {
|
|
||||||
toastr.remove();
|
|
||||||
$scope.toastrId = toastr.info('想要查看更多热门标签，请先登录！', "提示");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 快捷键r随机推荐
|
|
||||||
$document.bind("keydown", function(event) {
|
|
||||||
$scope.$apply(function() {
|
|
||||||
// console.log(event.keyCode);
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
var blur = (menusScope && menusScope.blur) || false;
|
|
||||||
// r按键，显示
|
|
||||||
if (event.keyCode == 82 && login && (!blur)) {
|
|
||||||
$scope.randomHotBookmarks();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
});
|
|
||||||
|
|
||||||
$scope.randomHotBookmarks = function() {
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
if (login) {
|
|
||||||
$scope.random = true;
|
|
||||||
var beginDay = new Date(2016, 7, 15); // 注意日期是从0 ~ 11
|
|
||||||
var now = new Date();
|
|
||||||
var dayGap = parseInt(Math.abs(now - beginDay) / (1000 * 60 * 60 * 24)) + 1;
|
|
||||||
$scope.curDay = -(parseInt(Math.random() * 1000000) % dayGap);
|
|
||||||
$scope.bookmarks = [];
|
|
||||||
getHotBookmarks();
|
|
||||||
} else {
|
|
||||||
$scope.toastrId = toastr.info('您只有先登录，才能使用查看随机热门标签', "提示");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$scope.setHoverBookmark = function(bookmark) {
|
|
||||||
$scope.hoverBookmark = bookmark;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 在输入文字的时候也会触发，所以不要用Ctrl,Shift之类的按键
|
|
||||||
$document.bind("keydown", function(event) {
|
|
||||||
$scope.$apply(function() {
|
|
||||||
var key = event.key.toUpperCase();
|
|
||||||
if ($scope.hoverBookmark && dataService.keyShortcuts()) {
|
|
||||||
if (key == 'I') {
|
|
||||||
$scope.detailBookmark($scope.hoverBookmark)
|
|
||||||
} else if (key == 'C') {
|
|
||||||
$scope.copy($scope.hoverBookmark.url)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
});
|
|
||||||
|
|
||||||
function getHotBookmarks() {
|
|
||||||
getHotBookmarksbyAPI(); // 先实时获取，实时获取失败再从缓存中获取
|
|
||||||
|
|
||||||
var menusScope = $('div[ng-controller="menuCtr"]').scope();
|
|
||||||
var login = (menusScope && menusScope.login) || false;
|
|
||||||
var index = login ? dataService.LoginIndexHot : dataService.NotLoginIndexHot;
|
|
||||||
pubSubService.publish('Common.menuActive', {
|
|
||||||
login: login,
|
|
||||||
index: index
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function getHotBookmarksbyAPI() {
|
|
||||||
$scope.loadBusy = true;
|
|
||||||
var requireData = {
|
|
||||||
userId: null,
|
|
||||||
lastupdataTime: new Date().getTime(),
|
|
||||||
pageNo: 1,
|
|
||||||
pageSize: 1000,
|
|
||||||
sort: 'desc',
|
|
||||||
renderType: 0,
|
|
||||||
date: curentDate($scope.curDay, "yyyy年M月d日"),
|
|
||||||
idfa: "d4995f8a0c9b2ad9182369016e376278",
|
|
||||||
os: "ios",
|
|
||||||
osv: "9.3.5"
|
|
||||||
}
|
|
||||||
var api = "https://api.shouqu.me/api_service/api/v1/daily/dailyMark";
|
|
||||||
$.ajax({
|
|
||||||
url: api,
|
|
||||||
type: 'post',
|
|
||||||
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/default.jpg"
|
|
||||||
var defaultFavicon = "./images/default.ico"
|
|
||||||
$timeout(function() {
|
|
||||||
if (json.code == 200) {
|
|
||||||
var bookmarkList = json.data.list;
|
|
||||||
bookmarkList.forEach((bookmark) => {
|
|
||||||
var b = {};
|
|
||||||
b.title = bookmark.title;
|
|
||||||
b.url = bookmark.url;
|
|
||||||
b.favicon_url = bookmark.sourceLogo || defaultFavicon;
|
|
||||||
b.created_by = bookmark.sourceName;
|
|
||||||
b.snap_url = defaultSnap;
|
|
||||||
if (bookmark.imageList.length >= 1) {
|
|
||||||
if (bookmark.imageList[0].url) {
|
|
||||||
b.snap_url = (json.data.pageNo == 1 ? (bookmark.imageList[0].url.match(alterRex) != null ? defaultSnap : bookmark.imageList[0].url) : defaultSnap);
|
|
||||||
} else {
|
|
||||||
for (var i = 0; i < bookmark.images.length; i++) {
|
|
||||||
if (bookmark.images[i]) {
|
|
||||||
b.snap_url = bookmark.images[i];
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
b.fav_count = bookmark.favCount;
|
|
||||||
b.created_at = $filter('date')(new Date(bookmark.createtime < bookmark.updatetime ? bookmark.createtime : bookmark.updatetime), "yyyy-MM-dd HH:mm:ss");
|
|
||||||
b.last_click = $filter('date')(new Date(bookmark.createtime > bookmark.updatetime ? bookmark.createtime : bookmark.updatetime), "yyyy-MM-dd HH:mm:ss");
|
|
||||||
b.id = bookmark.articleId;
|
|
||||||
|
|
||||||
b.edit = false;
|
|
||||||
$scope.bookmarks.push(b);
|
|
||||||
})
|
|
||||||
$scope.curDay--;
|
|
||||||
updateEditPos();
|
|
||||||
} else {
|
|
||||||
toastr.error('获取热门书签失败！失败原因：' + json.message + "。将尝试从缓存中获取！", "提示");
|
|
||||||
getHotBookmarksbyCache();
|
|
||||||
}
|
|
||||||
}, 100);
|
|
||||||
},
|
|
||||||
error: function(json) {
|
|
||||||
$scope.loadBusy = false;
|
|
||||||
toastr.error('获取热门书签失败！失败原因：' + json.message + "。将尝试从缓存中获取！", "提示");
|
|
||||||
getHotBookmarksbyCache();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function getHotBookmarksbyCache() {
|
|
||||||
$scope.loadBusy = true;
|
|
||||||
var date = curentDate($scope.curDay, "yyyyMMdd");
|
|
||||||
if (date < "20160715") {
|
|
||||||
toastr.info('您已将将所有的热门标签都加载完了！', "提示");
|
|
||||||
$scope.loadBusy = false;
|
|
||||||
return; // 这是最早的了。
|
|
||||||
}
|
|
||||||
var params = {
|
|
||||||
date: date,
|
|
||||||
}
|
|
||||||
bookmarkService.getHotBookmarks(params)
|
|
||||||
.then((data) => {
|
|
||||||
data.forEach((bookmark) => {
|
|
||||||
bookmark.created_at = $filter('date')(new Date(bookmark.updatetime), "yyyy-MM-dd HH:mm:ss");
|
|
||||||
bookmark.last_click = $filter('date')(new Date(bookmark.createtime), "yyyy-MM-dd HH:mm:ss");
|
|
||||||
bookmark.edit = false;
|
|
||||||
$scope.bookmarks.push(bookmark);
|
|
||||||
})
|
|
||||||
$scope.curDay--;
|
|
||||||
$scope.loadBusy = false;
|
|
||||||
if (data && data.length == 0) {
|
|
||||||
getHotBookmarksbyCache(); // 没有继续请求
|
|
||||||
}
|
|
||||||
updateEditPos();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
toastr.error("getHotBookmarksbyCache: " + JSON.stringify(err), "提示");
|
|
||||||
$scope.curDay--;
|
|
||||||
$scope.loadBusy = false;
|
|
||||||
getHotBookmarksbyCache(); // 没有继续请求
|
|
||||||
updateEditPos();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// TODO: 我要将编辑按钮固定在容器的右上角
|
|
||||||
$(window).resize(updateEditPos);
|
|
||||||
updateEditPos();
|
|
||||||
|
|
||||||
function curentDate(i, format) {
|
|
||||||
if (i == undefined) {
|
|
||||||
i = 0;
|
|
||||||
}
|
|
||||||
if (format == undefined) {
|
|
||||||
format = 'yyyyMMddhhmmss'
|
|
||||||
}
|
|
||||||
var now = new Date();
|
|
||||||
now.setTime(now.getTime() + i * 24 * 60 * 60 * 1000);
|
|
||||||
clock = $filter('date')(now, format);
|
|
||||||
return clock;
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateEditPos() {
|
|
||||||
for (var i = 1; i <= 100; i += 10) {
|
|
||||||
setTimeout(function() {
|
|
||||||
var offset = $('.js-hot-card').offset();
|
|
||||||
if (offset) {
|
|
||||||
var t = offset.top;
|
|
||||||
var l = offset.left;
|
|
||||||
var w = $('.js-hot-card').width();
|
|
||||||
$('.js-hot-random').offset({
|
|
||||||
top: t + 10,
|
|
||||||
left: l + w - 10,
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}, 100 * i)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}]);
|
|
||||||
|
|
@ -1,32 +0,0 @@
|
||||||
<!-- 高度至少要设置1000，元素少时才能触发滚动条事件 -->
|
|
||||||
<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" ng-mouseover="setHoverBookmark(bookmark)" ng-mouseleave="setHoverBookmark(null)">
|
|
||||||
<div class="content" style="max-height:70px;cursor:pointer" ng-click="jumpToUrl(bookmark.url)">
|
|
||||||
<div class="description bookmarkTitle" title="{{bookmark.title}}">
|
|
||||||
{{bookmark.title}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="image hot-image" href="{{ bookmark.url }}" style="cursor:pointer" ng-click="jumpToUrl(bookmark.url)">
|
|
||||||
<img ng-src="{{bookmark.snap_url}}"/>
|
|
||||||
</div>
|
|
||||||
<div class="extra content" ng-show="!bookmark.edit">
|
|
||||||
<img class="ui avatar image" style="width:16px;height:16px;" ng-src="{{bookmark.favicon_url}}">
|
|
||||||
<span class="sourceName" title="{{ bookmark.created_by }}">{{ bookmark.created_by }}</span>
|
|
||||||
<span class="favCount">·{{ bookmark.fav_count }}人收藏</span>
|
|
||||||
<i class="ellipsis horizontal icon right floated" style="margin-top:6px;" ng-mouseover="bookmark.edit=true;"></i>
|
|
||||||
</div>
|
|
||||||
<div class="extra content" ng-show="bookmark.edit" ng-mouseleave="bookmark.edit=false;">
|
|
||||||
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:4px;" ng-src="./images/favorite.png" ng-click="favoriteBookmark(bookmark)" title="一键收藏">
|
|
||||||
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:4px;" ng-src="./images/store-bookmark.png" ng-click="storeBookmark(bookmark)" title="转存到我的书签">
|
|
||||||
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:4px;" ng-src="./images/copy.png" ng-click="copy(bookmark.url)" title="复制链接">
|
|
||||||
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:4px;" ng-src="./images/detail.png" ng-click="detailBookmark(bookmark)" title="书签详情">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div style="width:22px;height:22px;" class="js-hot-random" ng-click="randomHotBookmarks()" data-tooltip="随机查看热门收藏，如需回到最新热门收藏，请点击菜单栏热门收藏" ng-show="!loadBusy && false">
|
|
||||||
<img class="ui ui middle aligned tiny image" ng-src="./images/random.png">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="ui massive text centered inline loader js-hot-loader" ng-class="{active:loadBusy, disabled:!loadBusy}">
|
|
||||||
正在加载中...</div>
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
<div class="ui center aligned container" style="cursor:default;" ng-if="callCount > maxCallCount && (!loadBusy)">
|
<div class="ui center aligned container" style="cursor:default;" ng-if="callCount > maxCallCount && (!loadBusy)">
|
||||||
<i class="random big link icon" title="随机刷一批" ng-click="randomHotBookmarks()"></i>
|
<i class="random big link icon" title="随机刷一批" ng-click="randomHotBookmarks()"></i>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="ui massive text centered inline loader js-hot-loader" style="margin: 50px 0px 120px 0px;" ng-class="{active:loadBusy, disabled:!loadBusy}">
|
<div class="ui massive text centered inline loader js-hot-loader" style="margin: 50px 0px 120px 0px;" ng-class="{active:loadBusy, disabled:!loadBusy}">
|
||||||
正在加载中...</div>
|
正在加载中...</div>
|
||||||
|
|
||||||
|
|
@ -78,7 +78,7 @@
|
||||||
<div class="ui divider" ng-if="bookmark.content"></div>
|
<div class="ui divider" ng-if="bookmark.content"></div>
|
||||||
<div class="ui grid">
|
<div class="ui grid">
|
||||||
<div class="one wide column">
|
<div class="one wide column">
|
||||||
<i title="按 ESC 键亦可返回" class="window close outline icon large" ng-click="bookmark.content=''" ng-if="bookmark.content"></i>
|
<i title="返回文章列表。按 ESC 键亦可返回" class="reply icon black big" style="padding-top:10px;" ng-click="bookmark.content=''" ng-show="bookmark.content"></i>
|
||||||
</div>
|
</div>
|
||||||
<div class="fifteen wide column">
|
<div class="fifteen wide column">
|
||||||
<pagination></pagination>
|
<pagination></pagination>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue