101502522 HW3

homework/list.js

@@ -1,79 +1,90 @@
 'use strict';
 
 (function() {
+
+  var ListManager = function(){
+    this._listNoteContent = [];
+    this._wrapper = null;
+  };
 
-  var _listNoteContent = [];
-  var _wrapper = document.querySelector('#note-list-wrapper');
+  ListManager.prototype=
+  {
+     drawList() {
+      var list = this._listNoteContent;
+      var ul = document.createElement('ul');
+      ul.id = 'note-title-list';
+      var buff = document.createDocumentFragment();
+      list.forEach(function(note, i) {
+        var li = document.createElement('li');
+        li.dataset.noteId = i;
+        li.classList.add('note-title');
+        li.textContent = note.title;
+        // Note: buff is captured, so we now have a
+        // little closure naturally.
+        buff.appendChild(li);
+      });
+      ul.appendChild(buff);
+      this._wrapper.appendChild(ul);
+    },
 
-  function start() {
-    fetchList(function(data) {
-      updateList(data);
-      drawList();
-      preloadFirstNote();
-    });
-    window.addEventListener('click', function(event) {
-      onNoteOpen(event);
-    });
-  }
 
-  function 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 }));
-    };
-  }
+    onNoteOpen(event) {
+      if (event.target.classList.contains('note-title')) {
+        var id = event.target.dataset.noteId;
+        var content = this._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',
-        { detail: content }));
-    }
-  }
+    preloadFirstNote() {
+      if (this._listNoteContent.length !== 0) {
+        var content = this._listNoteContent[0];
+        window.dispatchEvent(new CustomEvent('note-open',
+          { detail: content }));
+      }
+    },
 
-  function updateList(list) {
-    _listNoteContent = list;
-  }
+    updateList(list) {
+      this._listNoteContent = list;
+    },
 
-  function drawList() {
-    var list = _listNoteContent;
-    var ul = document.createElement('ul');
-    ul.id = 'note-title-list';
-    var buff = document.createDocumentFragment();
-    list.forEach(function(note, i) {
-      var li = document.createElement('li');
-      li.dataset.noteId = i;
-      li.classList.add('note-title');
-      li.textContent = note.title;
-      // Note: buff is captured, so we now have a
-      // little closure naturally.
-      buff.appendChild(li);
-    });
-    ul.appendChild(buff);
-    _wrapper.appendChild(ul);
-  }
+    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);
+        } else if (this.status !== 200 ){
+          // Ignore error in this case.
+        }
+      };
+      xhr.send();
+    }).bind(this));
+    },
 
-  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) {
-      // 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);
-      } else if (this.status !== 200 ){
-        // Ignore error in this case.
-      }
-    };
-    xhr.send();
-  }
+    start() {
+      this.fetchList((function(data) {
+          this.updateList(data);
+          this.drawList();
+          this.preloadFirstNote();
+        }).bind(this));
+      window.addEventListener('click', (function(event) {
+        this.onNoteOpen(event);
+      }.bind(this)));
+    }
+  };
 
   document.addEventListener('DOMContentLoaded', function(event) {
-    start();
+    var listManager = new ListManager();
+    listManager._wrapper=document.querySelector('#note-list-wrapper');
+    listManager.start();
+
   });
 
 })();

homework/test/test-list.js

@@ -2,7 +2,8 @@ describe('Test > ', function() {
   beforeEach(function() {
   });
 
-  it('will test some pure functions', function() {
+  it('Math.sin()', function() {
     // Write any pure function assertion here.
+    assert.equal('1',Math.sin(Math.PI/2));
   });
 });