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

新增备忘录功能

This commit is contained in:
luchenqun 2017-05-04 22:46:13 +08:00
parent 3a9fa90bbb
commit 82c1b5e4cd
14 changed files with 363 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
database/db.js
View File

@ -958,17 +958,57 @@ db.addNote = function(note) {
};
db.getNotes = function(params) {
var sql = "SELECT notes.id, notes.content, notes.tag_id, DATE_FORMAT(notes.created_at, '%Y-%m-%d %H:%i:%s') as created_at, tags.name FROM `notes` LEFT JOIN tags ON tags.id = notes.tag_id WHERE notes.user_id = '"+params.user_id+"' ORDER BY `created_at` DESC";
var sql = "SELECT notes.id, notes.content, notes.tag_id, DATE_FORMAT(notes.created_at, '%Y-%m-%d %H:%i:%s') as created_at, tags.name FROM `notes` LEFT JOIN tags ON tags.id = notes.tag_id WHERE notes.user_id = '" + params.user_id + "'";
if (params.searchWord) {
sql += " AND notes.content LIKE '%" + params.searchWord + "%'";
}
sql += " ORDER BY `created_at` DESC"
console.log(sql);
return new Promise(function(resolve, reject) {
client.query(sql, (err, result) => {
if (err) {
reject(err);
} else {
resolve(result);
params.currentPage = params.currentPage || 1;
params.perPageItems = params.perPageItems || 20;
var searchData = {
totalItems: result.length,
notes: result.slice((params.currentPage - 1) * params.perPageItems, params.currentPage * params.perPageItems),
}
resolve(searchData);
}
});
})
};
db.delNote = function(id) {
var sql = "DELETE FROM `notes` WHERE (`id`='" + id + "')";
console.log(sql);
return new Promise(function(resolve, reject) {
client.query(sql, (err, result) => {
if (err) {
reject(err);
} else {
resolve(result.affectedRows);
}
});
});
};
}
db.updateNote = function(id, content) {
var sql = "UPDATE `notes` SET `content`=" + client.escape(content) + " WHERE (`id`='" + id + "')";
console.log(sql);
return new Promise(function(resolve, reject) {
client.query(sql, (err, result) => {
if (err) {
reject(err);
} else {
resolve(result.affectedRows);
}
});
});
}
module.exports = db;

BIN
public/images/add-note.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 705 B

3
public/scripts/app-angular.js
View File

@ -27,6 +27,9 @@ app.config(function($stateProvider, $urlRouterProvider, $httpProvider) {
.state('note', {
url: '/note',
templateUrl: '/views/note.html',
params: {
searchWord: null,
},
controller: 'noteCtr'
})
.state('search', {

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

@ -219,7 +219,6 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
}
})
}
$timeout(function() {
timeagoInstance.cancel();
timeagoInstance.render(document.querySelectorAll('.need_to_be_rendered'), 'zh_CN');
@ -262,6 +261,10 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
})
if (!find) {
$scope.bookmarks.unshift(data);
$timeout(function() {
timeagoInstance.cancel();
timeagoInstance.render(document.querySelectorAll('.need_to_be_rendered'), 'zh_CN');
}, 100)
}
} else {
$scope.forbidTransition = true;
@ -307,6 +310,10 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
$scope.bookmarks.push(bookmark);
}
})
$timeout(function() {
timeagoInstance.cancel();
timeagoInstance.render(document.querySelectorAll('.need_to_be_rendered'), 'zh_CN');
}, 100)
} else if (params.showStyle == 'costomTag') {
$scope.costomTags.forEach((tag) => {
if (tag.clicked) {

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

@ -74,8 +74,15 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', '$window', '$time
$window.open('https://github.com/search?utf8=%E2%9C%93&q=' + encodeURIComponent(searchWord) + '&type=', '_blank');
} else if (searchOption == 3) {
$window.open('https://stackoverflow.com/search?q=' + encodeURIComponent(searchWord), '_blank');
} else {
} else if (searchOption == 4) {
$window.open('http://www.baidu.com/s?tn=mybookmark.cn&ch=3&ie=utf-8&wd=' + encodeURIComponent(searchWord), '_blank');
} else if (searchOption == 5) {
$state.go('note', {
searchWord: searchWord,
}, {
reload: true,
})
updateMenuActive($scope.selectLoginIndex = 6);
}
if (!searchWord) {

140
public/scripts/controllers/note-controller.js
View File

@ -1,10 +1,20 @@
app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$window', '$timeout', 'ngDialog', 'bookmarkService', 'pubSubService', function($scope, $state, $stateParams, $filter, $window, $timeout, ngDialog, bookmarkService, pubSubService) {
console.log("Hello noteCtr...", $stateParams);
const perPageItems = 36;
var dialog = null;
$scope.loadBusy = false;
$scope.add = false;
$scope.edit = false;
$scope.preContent = '';
$scope.content = '';
$scope.currentNoteId = null;
$scope.notes = [];
$scope.totalPages = 0;
$scope.currentPage = 1;
$scope.inputPage = '';
var timeagoInstance = timeago();
bookmarkService.autoLogin()
.then((data) => {
@ -20,13 +30,35 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
console.log('autoLogin err', err)
});
$scope.changeCurrentPage = function(currentPage) {
currentPage = parseInt(currentPage) || 0;
console.log('currentPage = ', currentPage);
if (currentPage <= $scope.totalPages && currentPage >= 1) {
$scope.currentPage = currentPage;
$scope.inputPage = '';
getNotes();
} else {
$scope.currentPage = $scope.totalPages
}
}
$scope.showAddNote = function() {
$scope.edit = (!$scope.edit);
$scope.add = (!$scope.add);
$scope.edit = false;
$scope.content = '';
updateEditPos();
}
$scope.addNote = function(close) {
$scope.edit = close;
if ($scope.content == '') {
toastr.error('不允许备忘录内容为空！', "提示");
return;
}
if ($scope.preContent == $scope.content) {
toastr.error('您刚刚添加了这条内容！', "提示");
return;
}
$scope.add = close;
var note = {
tag_id: -1,
content: $scope.content,
@ -35,8 +67,10 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
bookmarkService.addNote(note)
.then((data) => {
console.log(JSON.stringify(data));
$scope.preContent = $scope.content;
$scope.content = '';
getNotes();
updateEditPos();
})
.catch((err) => {
console.log('addNote err', err)
@ -63,26 +97,112 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
});
}
$scope.delNote = function(id){
toastr.warning('暂未实现', "提示");
$scope.delNote = function(id, content) {
$scope.currentNoteId = id;
$scope.content = content;
var width = content.length >= 500 ? "50%" : "30%";
dialog = ngDialog.open({
template: './views/dialog-del-note.html',
className: 'ngdialog-theme-default',
width: width,
scope: $scope
});
}
$scope.editNote = function(id){
toastr.warning('暂未实现', "提示");
$scope.confirmDelNote = function() {
if ($scope.currentNoteId) {
var params = {
id: $scope.currentNoteId
}
ngDialog.close(dialog);
bookmarkService.delNote(params)
.then((data) => {
if (data.result == 1) {
$("#" + $scope.currentNoteId).transition({
animation: animation(),
duration: 500,
onComplete: function() {
$("#" + $scope.currentNoteId).remove();
}
});
toastr.success('备忘删除成功！', "提示");
} else {
toastr.error('没有找到对应的备忘录，删除失败！请刷新页面再尝试', "提示");
}
})
.catch((err) => {
toastr.error('备忘删除失败！错误提示：' + JSON.stringify(err), "提示");
});
} else {
toastr.error('删除失败！请刷新页面再尝试', "提示");
}
}
$scope.detailNote = function(id){
toastr.warning('暂未实现', "提示");
$scope.editNote = function(id, content) {
$scope.add = true;
$scope.edit = true;
$scope.content = content;
$scope.currentNoteId = id;
}
$scope.updateNote = function() {
var params = {
id: $scope.currentNoteId,
content: $scope.content,
}
bookmarkService.updateNote(params)
.then((data) => {
if (data.result == 1) {
toastr.success('备忘更新成功！', "提示");
$scope.notes.forEach((note) => {
if (note.id == $scope.currentNoteId) {
note.content = $scope.content;
}
})
$scope.add = false;
$scope.edit = false;
updateEditPos();
} else {
toastr.error('备忘更新失败！请刷新页面再尝试', "提示");
}
})
.catch((err) => {
toastr.error('备忘更新失败！错误提示：' + JSON.stringify(err), "提示");
});
}
$scope.detailNote = function(content) {
$scope.content = content;
var width = content.length >= 500 ? "50%" : "30%";
dialog = ngDialog.open({
template: './views/dialog-detail-note.html',
className: 'ngdialog-theme-default',
width: width,
scope: $scope
});
}
// $('.js-segment-praise').transition('hide');
function getNotes() {
var params = {};
$scope.loadBusy = true;
var params = {
currentPage: $scope.currentPage,
perPageItems: perPageItems,
searchWord: $stateParams.searchWord,
};
bookmarkService.getNotes(params)
.then((data) => {
$scope.notes = data;
$scope.notes = data.notes;
$scope.totalPages = Math.ceil(data.totalItems / perPageItems);
$timeout(function() {
timeagoInstance.cancel();
timeagoInstance.render(document.querySelectorAll('.need_to_be_rendered'), 'zh_CN');
}, 100)
$scope.loadBusy = false;
})
.catch((err) => {
$scope.notes = [];
$scope.loadBusy = false;
});
}

2
public/scripts/directives/js-init-directive.js
View File

@ -226,7 +226,7 @@ app.filter('searchType', function() {
types[2] = 'Github';
types[3] = '栈溢出';
types[4] = '百度';
types[5] = '备忘录';
return types[type];
}
});

26
public/scripts/services/bookmark-service.js
View File

@ -392,6 +392,32 @@ app.factory('bookmarkService', ['$http', '$q', function($http, $q) {
});
return def.promise;
},
delNote: function(params) {
var def = $q.defer();
$http.delete('/api/delNote/', {
params: params
})
.success(function(data) {
def.resolve(data);
})
.error(function(data) {
def.reject('delNote error');
});
return def.promise;
},
updateNote: function(params) {
var def = $q.defer();
$http.post('/api/updateNote/', {
params: params
})
.success(function(data) {
def.resolve(data);
})
.error(function(data) {
def.reject('updateNote error');
});
return def.promise;
},
};
return service;

4
public/views/bookmarks.html
View File

@ -147,7 +147,9 @@
<div class="extra content" ng-show="!bookmark.edit" style="height:50px;padding-right:2px;padding-left:8px;">
<span class="left floated like" style="margin-top:6px;">
<img class="ui ui middle aligned tiny image" ng-src="http://g.soz.im/{{bookmark.url}}/cdn.ico" style="width:16px;height:16px;cursor:pointer;" ng-click="jumpToUrl(bookmark.url, bookmark.id)" favicon-err="./images/favicon/{{bookmark.id}}.ico">
{{ bookmark.created_at }}
创建于:
<span title="{{bookmark.created_at}}" class="need_to_be_rendered" data-timeago="{{bookmark.created_at}}"></span>
<!-- {{ bookmark.created_at }} -->
</span>
<i class="ellipsis horizontal icon right floated" style="margin-top:8px;" ng-mouseover="bookmark.edit=true;"></i>
</div>

11
public/views/dialog-del-note.html Normal file
View File

@ -0,0 +1,11 @@
<div class="ngdialog-message">
<h3>删除提示</h3>
<p ng-show="ngDialogId" style="word-break:break-all; word-wrap:break-word;">您确认要删除备忘:<br/><br/>
{{ content | characters:600:false }}
</p>
<p>如果删除该备忘，那么再也无法查看到。</p>
</div>
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-primary" ng-click="confirmDelNote()">确定删除</button>
<button type="button" class="ngdialog-button ngdialog-button-secondary" ng-click="closeThisDialog('button')">取消</button>
</div>

8
public/views/dialog-detail-note.html Normal file
View File

@ -0,0 +1,8 @@
<div class="ngdialog-message">
<h3>备忘详情</h3>
<p style="word-break:break-all; word-wrap:break-word;">{{ content }}
</p>
</div>
<div class="ngdialog-buttons">
<button type="button" class="ngdialog-button ngdialog-button-primary" ng-click="closeThisDialog('button')">确定</button>
</div>

3
public/views/menus.html
View File

@ -1,6 +1,6 @@
<div class="js-menu" ng-controller="menuCtr">
<div class="ui huge menu js-login-in" ng-if="login">
<a class="item" ng-class="{selected:$index===selectLoginIndex}" style="cursor:default;" ui-sref="{{ menu.uiSref }}" ui-sref-opts="{reload: true}" ng-repeat="menu in loginMenus" js-menu-init>
<a class="item" ng-class="{selected:$index===selectLoginIndex}" style="cursor:default;" ui-sref-opts="{reload: true}" ng-repeat="menu in loginMenus" ui-sref="{{ menu.uiSref }}({searchWord:null})" js-menu-init>
<div>{{ menu.title }}</div>
<div class="ui floating simple dropdown icon js-bookmark-dropdown" ng-if="$index==0" ng-click="$event.stopPropagation();">
<i class="dropdown icon"></i>
@ -47,6 +47,7 @@
<div class="item" data-value="2">Github</div>
<div class="item" data-value="3">栈溢出</div>
<div class="item" data-value="4">百度</div>
<div class="item" data-value="5">备忘录</div>
</div>
</div>
</label>

42
public/views/note.html
View File

@ -1,41 +1,51 @@
<div class="ui segment js-note-card">
<div class="ui form" ng-show="edit">
<div class="ui form" ng-show="add">
<div class="required field">
<label>内容</label>
<textarea rows="4" placeholder="" ng-model="content"></textarea>
</div>
<div class="field">
<div class="actions">
<div class="ui cancel button" ng-click="edit=false;">取消</div>
<div class="ui green button" ng-click="addNote(false)">提交关闭</div>
<div class="ui green button" ng-click="addNote(true)">提交继续</div>
<div class="ui cancel button" ng-click="add=false;">取消</div>
<div class="ui green button" ng-click="addNote(false)" ng-show="!edit">提交关闭</div>
<div class="ui green button" ng-click="addNote(true)" ng-show="!edit">提交继续</div>
<div class="ui green button" ng-click="updateNote()" ng-show="edit">更新</div>
</div>
</div>
</div>
<div class="ui divider" ng-show="edit"></div>
<div class="ui five stackable cards" infinite-scroll='loadCardData()' infinite-scroll-immediate-check="false">
<div class="ui divider" ng-show="add"></div>
<div class="ui five stackable cards">
<div class="card" ng-repeat="note in notes" id="{{note.id}}">
<div class="content" id="noteid{{note.id}}" ng-click="copy(note.id, note.content)" style="max-height:200px;margin-bottom:10px;">
<div class="description" style="word-break:break-all; word-wrap:break-word;">
<p>{{ note.content | characters:200:false }}</p>
<div class="content" style="max-height:200px;margin-bottom:8px;">
<div class="description" style="word-break:break-all;width:175px;max-height:184px;line-height:21px; word-wrap:break-word;text-overflow:ellipsis;overflow:hidden;">
{{ note.content }}
</div>
</div>
<div class="extra content" ng-show="!note.edit" style="height:50px;padding-right:2px;padding-left:8px;">
<span class="left floated like" style="margin-top:6px;">
<i class="add to calendar icon"></i>{{ note.created_at }}
<i class="add to calendar icon"></i>
创建于:
<span title="{{note.created_at}}" class="need_to_be_rendered" data-timeago="{{ note.created_at }}"></span>
</span>
<i class="ellipsis horizontal icon right floated" style="margin-top:8px;" ng-mouseover="note.edit=true;"></i>
</div>
<div class="extra content" ng-show="note.edit" ng-mouseleave="note.edit=false;" style="height:50px;">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/delete.png" ng-click="delNote(note.id)" title="删除备忘">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/edit-bookmark.png" ng-click="editNote(note.id)" title="编辑备忘">
<!-- <img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/copy.png" id="url{{bookmark.id}}" ng-click="copy(note.id, note.content)" title="复制备忘"> -->
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/detail.png" ng-click="detailNote(note)" title="备忘详情">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/delete.png" ng-click="delNote(note.id, note.content)" title="删除备忘">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/edit-bookmark.png" ng-click="editNote(note.id, note.content)" title="编辑备忘">
<img class="ui mini spaced image" id="noteid{{note.id}}" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/copy.png" id="url{{bookmark.id}}" ng-click="copy(note.id, note.content)" title="复制备忘">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/detail.png" ng-click="detailNote(note.content)" title="备忘详情">
</div>
</div>
</div>
<div style="width:22px;height:22px;" class="js-note-add" ng-click="showAddNote()" data-tooltip="添加备忘" ng-show="!edit">
<img class="ui ui middle aligned tiny image" src="./images/edit.png" ng-show="!loadBusy">
<div style="width:22px;height:22px;" class="js-note-add" ng-click="showAddNote()" data-tooltip="添加备忘" ng-show="!add">
<img class="ui ui middle aligned tiny image" src="./images/add-note.png" ng-show="!loadBusy">
</div>
<div class="ui divider"></div>
<div class="ui grid">
<div class="eight wide column" style="margin-top:10px;">共找到备忘一共约{{notes.length}}个</div>
<div class="eight wide column">
<pagination></pagination>
</div>
</div>
</div>
<div class="ui massive text centered inline loader js-hot-loader" ng-class="{active:loadBusy, disabled:!loadBusy}">

40
routes/api.js
View File

@ -1299,11 +1299,49 @@ api.get('/notes', function(req, res) {
var params = req.query;
params.user_id = req.session.user.id;
db.getNotes(params)
.then((notes) => res.json(notes))
.then((data) => res.json(data))
.catch((err) => console.log('notes', err));
});
api.delete('/delNote', function(req, res) {
console.log("delBookmark username = ", req.session.username);
if (!req.session.user) {
res.send(401);
return;
}
var noteId = req.query.id;
db.delNote(noteId)
.then((affectedRows) => res.json({
result: affectedRows
}))
.catch((err) => {
console.log('delBookmark err', err);
res.json({
result: -1
})
});
})
api.post('/updateNote', function(req, res) {
console.log("updateNote username = ", req.session.username);
if (!req.session.user) {
res.send(401);
return;
}
var note = req.body.params;
console.log('hello updateNote', JSON.stringify(note));
db.updateNote(note.id, note.content)
.then((affectedRows) => res.json({
result: affectedRows
}))
.catch((err) => {
console.log('updateBookmark err', err);
res.json({
result: -1
})
}); // oops!
})
function md5(str) {
return crypto.createHash('md5').update(str).digest('hex');