diff --git a/homework/content.js b/homework/content.js
index 710be28..e03eb52 100644
--- a/homework/content.js
+++ b/homework/content.js
@@ -1,37 +1,43 @@
'use strict';
-(function() {
- var _wrapper = document.querySelector('#note-content-wrapper');
+(function (exports){
- function start() {
- window.addEventListener('note-open', function(event) {
- var note = event.detail;
- resetWrapper();
- drawNote(note);
- });
+ var ContentManager = function(){
+ this._wrapper = document.querySelector('#note-content-wrapper');
}
- function resetWrapper() {
- _wrapper.innerHTML = '';
- }
+ ContentManager.prototype = {
+ start() {
+ window.addEventListener('note-open', (function(event) {
+ var note = event.detail;
+ this.resetWrapper();
+ this.drawNote(note);
+ }).bind(this));
+ },
+ // original content.js start function
+ // call original contest.js resetWrapper function use "this"
+ // following are the same
+ resetWrapper(){
+ _wrapper.innerHTML = '';
+ },
- function drawNote(note) {
- var title = note.title;
- var h = document.createElement('h2');
- h.textContent = title;
- var passages = note.passages;
- var buff = document.createDocumentFragment();
- passages.forEach(function(passage) {
- var p = document.createElement('p');
- p.classList.add('note-passage');
- p.textContent = passage;
- buff.appendChild(p);
- });
- _wrapper.appendChild(h);
- _wrapper.appendChild(buff);
+ drawNote(note){
+ var title = note.title;
+ var h = document.createElement('h2');
+ h.textContent = title;
+ var passages = note.passages;
+ var buff = document.createDocumentFragment();
+ passages.forEach(function(passage) {
+ var p = document.createElement('p');
+ p.classList.add('note-passage');
+ p.textContent = passage;
+ buff.appendChild(p);
+ });
+ this._wrapper.appendChild(h);
+ this._wrapper.appendChild(buff);
+ }
}
- document.addEventListener('DOMContentLoaded', function(event) {
- start();
- });
-})();
+ exports.ContentManager = ContentManager;
+
+})(window);
\ No newline at end of file
diff --git a/homework/index.html b/homework/index.html
index e387963..975d252 100644
--- a/homework/index.html
+++ b/homework/index.html
@@ -5,6 +5,7 @@
Homework - Note List
+
diff --git a/homework/list.js b/homework/list.js
index 21eddbc..53985c2 100644
--- a/homework/list.js
+++ b/homework/list.js
@@ -1,43 +1,53 @@
'use strict';
-(function() {
+//the way of how to refactor list.js is the same as content.js
+//repair some error in list.js
+// add promise into it
- var _listNoteContent = [];
- var _wrapper = document.querySelector('#note-list-wrapper');
+(function(exports) {
- function start() {
- fetchList(function(data) {
- updateList(data);
- drawList();
- preloadFirstNote();
- });
- window.addEventListener('click', function(event) {
- onNoteOpen(event);
+ var ListManager = function(){
+ this._listNoteContent = [];
+ this._wrapper = document.querySelector("#note-content-wrapper");
+ }
+
+ ListManager.prototype = {
+ start() {
+ this.fetchList().then((function(data) {
+ this.updateList(data);
+ this.drawList();
+ this.preloadFirstNote();
+ }).bind(this))
+ .catch((function () {
+ }).bind(this));
+
+ window.addEventListener('click', (function(event) {
+ this.onNoteOpen(event).bind(this));
});
}
- function onNoteOpen(event) {
- if (event.target.classList.contains('note-title')) {
+ onNoteOpen(event) {
+ if (event.target.classList.contains('note-title')) {
var id = event.target.dataset.noteId;
var content = _listNoteContent[id];
window.dispatchEvent(new CustomEvent('note-open',
{ detail: content }));
- };
- }
+ };
+ }
- function preloadFirstNote() {
- if (_listNoteContent.length !== 0) {
- var content = _listNoteContent[0];
- window.dispatchEvent(new CustomEvent('note-open',
+ preloadFirstNote() {
+ if (_listNoteContent.length !== 0) {
+ var content = _listNoteContent[0];
+ window.dispatchEvent(new CustomEvent('note-open',
{ detail: content }));
+ }
}
- }
- function updateList(list) {
- _listNoteContent = list;
+ updateList(list) {
+ this. _listNoteContent = list;
}
- function drawList() {
+ drawList() {
var list = _listNoteContent;
var ul = document.createElement('ul');
ul.id = 'note-title-list';
@@ -52,28 +62,26 @@
buff.appendChild(li);
});
ul.appendChild(buff);
- _wrapper.appendChild(ul);
+ this._wrapper.appendChild(ul);
}
- function fetchList(afterFetch) {
- var xhr = new XMLHttpRequest();
- xhr.open('GET', 'http://127.0.0.1:8000/demo-list-notes.json', true);
- xhr.responseType = 'json';
- xhr.onreadystatechange = function(e) {
+ fetchList(afterFetch) {
+ return new Promise(function(resolve,reject){
+ var xhr = new XMLHttpRequest();
+ xhr.open('GET', 'http://127.0.0.1:8000/demo-list-notes.json', true);
+ xhr.responseType = 'json';
+ xhr.onreadystatechange = (function(e) {
// Watch out: we have a mysterious unknown 'this'.
if (this.readyState === 4 && this.status === 200) {
var listData = this.response;
- // The flow ends here.
- afterFetch(listData);
+ resolve(listData)
} else if (this.status !== 200 ){
- // Ignore error in this case.
+ reject('ERROR');
}
- };
- xhr.send();
+ }).bind(xhr);
+ xhr.send();
+ });
}
-
- document.addEventListener('DOMContentLoaded', function(event) {
- start();
- });
-
-})();
+}
+exports.ListManager = ListManager;
+})(window);
diff --git a/homework/main.js b/homework/main.js
new file mode 100644
index 0000000..32e26e1
--- /dev/null
+++ b/homework/main.js
@@ -0,0 +1,8 @@
+'use strict'
+
+document.addEventListener('DOMContentLoaded',function(event){
+ var contentManager = new ContentManager();
+ var listManager = new ListManager();
+ contentManager.start();
+ listManager.start();
+});
\ No newline at end of file
diff --git a/homework/test/test-list.js b/homework/test/test-list.js
index 441fc45..e25131f 100644
--- a/homework/test/test-list.js
+++ b/homework/test/test-list.js
@@ -2,7 +2,11 @@ describe('Test > ', function() {
beforeEach(function() {
});
- it('will test some pure functions', function() {
+ it('my pure testfunctions', function() {
// Write any pure function assertion here.
+ var a = 1;
+ var b = 2;
+ var sum = a+b;
+ assert.equal(3,sum);
});
});