Use containerMenu as a base for HintMenu instead of regular menu

Change-Id: Ic1ed2e216a9c61aabf1f1cac41972b1a4e96a91a
diff --git a/dev/js/src/containermenu.js b/dev/js/src/containermenu.js
index 865c3ec..83e3dc6 100644
--- a/dev/js/src/containermenu.js
+++ b/dev/js/src/containermenu.js
@@ -12,7 +12,7 @@
   'container/container',
   'util'
 ], function (defaultMenuClass,
-             defaultContainerClass) {
+            defaultContainerClass) {
 
   return {
     /**
@@ -41,13 +41,13 @@
       } else {
         obj._container = defaultContainerClass.create(containerList, params);
       }
-      obj.container().addMenu(obj);
+      obj.container().addMenu(obj); //this is your menu, container!
 
       // add entry to HTML element
       obj._el.appendChild(obj.container().element());
-      obj._el.removeChild(obj._prefix.element());
+      obj._el.removeChild(obj._prefix.element()); //different HTML element relationship required
       //Keep prefix as 'pref' style. The additional distance is fine.
-      obj.container().addPrefix(obj._prefix);
+      obj.container().addPrefix(obj._prefix); //creates containeritem as base for prefix that then is upgraded to prefix. Also ajust _menu chains.
       return obj;
     },
 
@@ -128,8 +128,16 @@
         // Click on prefix
         if (t.container().active()){
           t.container().enter(e);
+          //NEW: reset some things. These are reset for hint menu style items
+          // so I believe we need to do the same when pressing on items in the container
+          t.reset("");
+          t.hide();
+          t.hint().unshow();
+          //for clicking this is done in container.js with an eventListener for click.
         } else { // Click on item
           t.liveItem(t.position).onclick(e);
+          //Above is already done: see file dev/js/src/hint/item.js
+
         };
         e.halt();
         break;
@@ -165,25 +173,24 @@
      * @param {string} Prefix for filtering the list
      */
     show : function (active) {
-      //There are only four new lines, marked with NEW
       const t = this;
 
       // show menu based on initial offset
       t._unmark();     // Unmark everything that was marked before
       t.removeItems();
-      t.container().exit(); //NEW
+      t.container().exit();
 
       // Initialize the list
       if (!t._initList()) {
 
         // The prefix is not active
-        t._prefix.active(true);        
-        t.container().makeActive(); //NEW Incase the own
-        // list becomes empty we need to make container active for line 129 to work
+        //t._prefix.active(true);
+        t.container().makeActive(); //Incase the own
+        // list becomes empty we need to make container active for handling ENTER keypress to work
 
         // finally show the element
         t._el.classList.add('visible');
-        t.container()._el.classList.add('visible'); //NEW
+        t.container()._el.classList.add('visible');
 
         return true;
       };
@@ -236,7 +243,7 @@
 
       // finally show the element
       t._el.classList.add('visible');
-      t.container()._el.classList.add('visible'); //NEW
+      t.container()._el.classList.add('visible');
 
       // Add classes for rolling menus
       t._boundary(true);
@@ -254,7 +261,7 @@
         this._prefix.clear();
         this.onHide();
         this._el.classList.remove('visible');
-        this.container()._el.classList.remove('visible'); //NEW
+        this.container()._el.classList.remove('visible'); //NEW //apparently not necessary
       }
       // this._el.blur();
     },