Skip to content

Commit 525a034

Browse files
author
Rihard Wålander
committed
Added footer links and notification view
1 parent 1608d82 commit 525a034

File tree

5 files changed

+125
-33
lines changed

5 files changed

+125
-33
lines changed

‎src/js/options/App.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ define([
1313
], function($, ydn, Backbone, MainRouter) {
1414
$(function () {
1515
var mainrouter = new MainRouter();
16+
$('.footer .year').text(new Date().getFullYear());
1617
});
1718
return {};
1819
});

‎src/js/options/routers/MainRouter.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,9 @@ define([
1414
"options/collections/PageCollection",
1515
"options/views/ArchiveView",
1616
"options/views/PageView",
17-
"options/views/ImportView"
18-
], function($, ydn, _, Backbone, moment, PageCollection, ArchiveView, PageView, ImportView) {
17+
"options/views/ImportView",
18+
"options/views/NotificationView"
19+
], function($, ydn, _, Backbone, moment, PageCollection, ArchiveView, PageView, ImportView, NotificationView) {
1920

2021
var schema = {
2122
stores: [{
@@ -44,6 +45,8 @@ define([
4445
'import'
4546
);
4647

48+
this.notificationview = new NotificationView({el: '#notifications'});
49+
4750
this.pagecollection = new PageCollection();
4851

4952
this.archiveview = new ArchiveView({el: '#archive', collection: this.pagecollection});

‎src/js/options/views/ImportView.js‎

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,13 @@ define([
4848
var page = this.$el.find('#importarea').val();
4949
page = JSON.parse(page);
5050
console.log(page);
51+
var success = {
52+
success: {
53+
message: '<strong>Nice.</strong> The notes was imported successfully.'
54+
}
55+
};
56+
var notesexist = {message: '<strong>Error:</strong> '+"Notes for this page already exist"};
57+
5158
if(_.isArray(page)) {
5259
_(page).each(function (p) {
5360
if(!p.url && !p.data) {
@@ -56,21 +63,22 @@ define([
5663
db.get('notes', p.url)
5764
.done(function (model) {
5865
if(model) {
59-
throw "Notes for this page already exist";
66+
throw notesexist;
6067
} else {
6168
db.put({name: 'notes', keyPath: 'url'}, p)
6269
.done(function () {
6370
console.log('saved');
6471
p.id = Util.hashCode(p.url);
6572
_self.collection.add(_self.collection.parse(p));
73+
$(document).trigger('notification', [success]);
6674
})
6775
.fail(function (e) {
68-
alert(e);
76+
$(document).trigger('notification', [{error: e}]);
6977
});
7078
}
7179
})
7280
.fail(function (e) {
73-
alert(e);
81+
$(document).trigger('notification', [{error: e}]);
7482
});
7583
}
7684
});
@@ -81,29 +89,31 @@ define([
8189
db.get('notes', page.url)
8290
.done(function (model) {
8391
if(model) {
84-
throw "Notes for this page already exist";
92+
throw notesexist;
8593
} else {
8694
db.put({name: 'notes', keyPath: 'url'}, page)
8795
.done(function () {
8896
console.log('saved');
8997
page.id = Util.hashCode(page.url);
9098
_self.collection.add(_self.collection.parse(page));
99+
$(document).trigger('notification', [success]);
91100
})
92101
.fail(function (e) {
93-
alert(e);
102+
$(document).trigger('notification', [{error: e}]);
94103
});
95104
}
96105
})
97106
.fail(function (e) {
98-
alert(e);
107+
$(document).trigger('notification', [{error: e}]);
99108
});
100109
}
101110
}
102111

103112
this.$el.find('#importarea').val('');
104113

105114
} catch(e) {
106-
alert(e);
115+
// alert(e);
116+
$(document).trigger('notification', [{error: e}]);
107117
}
108118

109119
}

‎src/js/options/views/NotificationView.js‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
"use strict";
2+
3+
/**
4+
* NotificationView
5+
* The NotificationView module.
6+
* @author Richard Wålander
7+
*/
8+
define([
9+
"jquery",
10+
"backbone"
11+
], function($, Backbone) {
12+
var NotificationView = Backbone.View.extend({
13+
initialize: function () {
14+
_.bindAll(this,
15+
'showNotification'
16+
);
17+
$(document).on('notification', this.showNotification);
18+
},
19+
showNotification: function (e, data) {
20+
console.log('showNotification', data);
21+
var $alert = $('<div class="alert alert-dismissable" style="display: none;"></div>');
22+
$alert.append('<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>');
23+
24+
if(data.error) {
25+
this.$el.append($alert.addClass('alert-danger').append(data.error.message));
26+
} else if(data.success) {
27+
this.$el.append($alert.addClass('alert-success').append(data.success.message));
28+
} else if(data.info) {
29+
this.$el.append($alert.addClass('alert-info').append(data.info.message));
30+
} else if(data.warning) {
31+
this.$el.append($alert.addClass('alert-warning').append(data.warning.message));
32+
}
33+
34+
$alert.fadeIn('slow');
35+
36+
if(!data.sticky) {
37+
setTimeout(function () {
38+
$alert.fadeOut('slow', function () {
39+
$alert.remove();
40+
});
41+
}, 5000);
42+
}
43+
44+
}
45+
});
46+
return NotificationView;
47+
});

‎src/options.html‎

Lines changed: 55 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,12 @@
1717
.navbar a.navbar-brand {
1818
font-weight: 900;
1919
}
20+
.footer {
21+
text-align: center;
22+
}
23+
.footer i {
24+
color: #666;
25+
}
2026
</style>
2127

2228
<!--
@@ -40,6 +46,14 @@
4046
</div><!-- /.container -->
4147
</div>
4248

49+
<div class="container">
50+
<div class="row-fluid">
51+
<div id="notifications" class="col-sm-12">
52+
53+
</div>
54+
</div>
55+
</div>
56+
4357
<div class="container">
4458
<div class="row-fuid">
4559
<div class="col-sm-4">
@@ -60,18 +74,20 @@
6074
<div id="archive" class="panel panel-default">
6175
<div class="panel-heading">Saved Notes</div>
6276
<div class="panel-body">
63-
<table class="table table-striped table-hover">
64-
<thead>
65-
<tr>
66-
<th>#</th>
67-
<th>Web Page</th>
68-
<th>Notes</th>
69-
<th></th>
70-
</tr>
71-
</thead>
72-
<tbody>
73-
</tbody>
74-
</table>
77+
<div class="table-responsive">
78+
<table class="table table-striped table-hover">
79+
<thead>
80+
<tr>
81+
<th>#</th>
82+
<th>Web Page</th>
83+
<th>Notes</th>
84+
<th></th>
85+
</tr>
86+
</thead>
87+
<tbody>
88+
</tbody>
89+
</table>
90+
</div>
7591
<a type="submit" class="clear btn btn-sm btn-danger"><i class="icon-trash"></i> Clear All Notes</a>
7692
<a type="submit" class="export-all btn btn-sm btn-default"><i class="icomoon-upload"></i> Export All Notes</a>
7793
</div>
@@ -80,18 +96,20 @@
8096
<div id="page" class="panel panel-default" style="display: none;">
8197
<div class="panel-heading">Notes for: <span>url</span></div>
8298
<div class="panel-body">
83-
<table class="table table-striped table-hover">
84-
<thead>
85-
<tr>
86-
<th>#</th>
87-
<th>Created</th>
88-
<th>Note</th>
89-
<th></th>
90-
</tr>
91-
</thead>
92-
<tbody>
93-
</tbody>
94-
</table>
99+
<div class="table-responsive">
100+
<table class="table table-striped table-hover">
101+
<thead>
102+
<tr>
103+
<th>#</th>
104+
<th>Created</th>
105+
<th>Note</th>
106+
<th></th>
107+
</tr>
108+
</thead>
109+
<tbody>
110+
</tbody>
111+
</table>
112+
</div>
95113
<a type="submit" class="clear btn btn-sm btn-danger"><i class="icon-trash"></i> Clear Notes</a>
96114
</div>
97115
</div>
@@ -153,6 +171,19 @@ <h2>View all notes related to a page</h2>
153171
</div>
154172
</div>
155173
</div>
174+
175+
<div class="footer">
176+
<div class="container">
177+
<hr>
178+
<ul class="list-inline">
179+
<li><i class="icomoon-home2"></i> <a href="http://notely.github.io/" target="_blank">notely.github.io</a></li>
180+
<li><i class="icomoon-github3"></i> <a href="https://github.com/notely/notely-chrome" target="_blank">Github</a></li>
181+
<li><i class="icomoon-books"></i> <a href="https://github.com/notely/notely-chrome/wiki" target="_blank">Wiki</a></li>
182+
<li><i class="icomoon-bug"></i> <a href="https://github.com/notely/notely-chrome/issues/new" target="_blank">Report Issue</a></li>
183+
</ul>
184+
<small class="text-muted">All Rights Reserved &copy; Notely <span class="year"></span></small>
185+
</div>
186+
</div>
156187

157188
<div id="modals"></div>
158189

0 commit comments

Comments
 (0)