From 5096e5f12937ff0cdd252c21d79ced8e2139c4ab Mon Sep 17 00:00:00 2001
From: Ludovic Stephan <ludovic.stephan@ens.fr>
Date: Mon, 24 Apr 2017 13:25:18 -0300
Subject: [PATCH] Adapt ArticleManager

---
 kfet/static/kfet/js/kpsul.js | 45 +++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 24 deletions(-)

diff --git a/kfet/static/kfet/js/kpsul.js b/kfet/static/kfet/js/kpsul.js
index b6f15b6d..37246522 100644
--- a/kfet/static/kfet/js/kpsul.js
+++ b/kfet/static/kfet/js/kpsul.js
@@ -426,12 +426,16 @@ class ArticleManager {
         this._$input = $('#article_autocomplete'); 
         this._$nb = $('#article_number');
         this._$stock = $('#article_stock');
-        this.templates = {'category': '<div class="category"><span class="name"></span></div>',
-                          'article' : '<div class="article"><span class="name"></span><span class="price"></span><span class="stock"></span></div>'}
 
         this.selected = new Article() ;
-        this.list = new ArticleList() ;
-        this.autocomplete = new ArticleAutocomplete(this);
+        this.data = new ArticleList() ;
+        var $container = $('#articles_data');
+        var templates = {
+            'category': '<div class="category"><span class="name"></span></div>',
+            'article' : '<div class="article"><span class="name"></span><span class="price"></span><span class="stock"></span></div>'
+        } ;
+        this.display = new ForestDisplay($container, templates);
+        this.autocomplete = new ArticleAutocomplete(this, $container);
 
         this._init_events();
     }
@@ -441,7 +445,7 @@ class ArticleManager {
     }
 
     display_list() {
-        this.list.display(this._$container, this.templates) ;
+        this.display.render(this.data);
     }
 
     validate(article) {
@@ -461,25 +465,18 @@ class ArticleManager {
     }
 
     reset_data() {
-        this._$container.html('');
-        this.list.clear();
-        this.list.fromAPI()
+        this.display.clear();
+        this.data.clear();
+        this.data.fromAPI()
             .done( () => this.display_list() );
     }
 
-    get_article(id) {
-        return this.list.find('article', id);
-    }
-
     update_data(data) {
         for (let article_dict of data.articles) {
-            var article = this.get_article(article_dict.id);
 
-            // For now, article additions are disregarded
-            if (article) {
-                article.stock = article_dict.stock;
-                this._$container.find('#article-'+article.id+' .stock')
-                                  .text(article.stock);
+            var updated = this.data.update('article', article_dict.id, article_dict);
+            if (updated) {
+                this.display.update(updated);
             }
         }
     }
@@ -508,7 +505,7 @@ class ArticleManager {
 
         this._$container.on('click', '.article', function() {
             var id = $(this).parent().attr('id').split('-')[1];
-            var article = that.list.find('article', id);
+            var article = that.data.find('article', id);
             if (article)
                 that.validate(article);
         });
@@ -547,9 +544,9 @@ class ArticleManager {
 
 class ArticleAutocomplete {
 
-    constructor(article_manager) {
+    constructor(article_manager, $container) {
         this.manager = article_manager;
-        this._$container = article_manager._$container ;
+        this._$container = $container ;
         this._$input = $('#article_autocomplete');
 
         this.showAll() ;
@@ -583,7 +580,7 @@ class ArticleAutocomplete {
     update(prefix, backspace) {
 
         this.resetMatch();
-        var article_list = this.manager.list ;
+        var article_list = this.manager.data ;
         var lower = prefix.toLowerCase() ;
         var that = this ;
 
@@ -611,7 +608,7 @@ class ArticleAutocomplete {
     updateDisplay() {
         var that = this;
 
-        this.manager.list.traverse('category', function(category) {
+        this.manager.data.traverse('category', function(category) {
             var is_active = false;
             for (let article of category.articles) {
                 if (that.matching.indexOf(article) != -1) {
@@ -646,7 +643,7 @@ class ArticleAutocomplete {
     showAll() {
         var that = this;
         this.resetMatch();
-        this.manager.list.traverse('article', function(article) {
+        this.manager.data.traverse('article', function(article) {
             that.matching.push(article);
         });
         this.updateDisplay();