Merge "intro.js update and according changes to source (fixes #109)"
diff --git a/dev/js/spec/containerMenuSpec.js b/dev/js/spec/containerMenuSpec.js
index 26b2fc3..61f919f 100644
--- a/dev/js/spec/containerMenuSpec.js
+++ b/dev/js/spec/containerMenuSpec.js
@@ -282,6 +282,50 @@
         expect(liElements[3]).toBe(undefined);
 
       });
+      
+      it('should switch to the containers prefix whenever the prefix filters the regular list to be empty', function () {
+        /**var list = [
+	        ["Constituency"],
+	        ["Lemma"],
+	        ["Morphology"],
+	        ["Part-of-Speech"],
+	        ["Syntax"]
+        ];
+        */
+        var menu = OwnContainerMenu.create(list,ExampleItemList);
+        menu.container().add("1");
+        menu.show(); // Simulates Buttonpress 1
+        // See function _keypress in containermenu.js (line 147)
+        expect(menu.liveItem()).toBeUndefined(); // no elements in list match "1"
+        expect(menu.container().active()).toBeTruthy(); //thus switch to container
+        var liElements = directElementChildrenByTagName(menu.element(),"li");
+        expect(liElements).toEqual([]);
+        expect(menu.container().liveLength()).toEqual(3); //CI1 and 2, prefix
+        expect(menu._prefix.active()).toBeTruthy(); //  HERE ONLY
+        // We want whichever container item was active before
+        // to stay active, default to prefix if none was.
+
+        //simulate _keydown(...) see containermenu.js line 137
+        menu.container().chop();
+        menu.show();
+        menu.prev();
+        expect(menu._prefix.active()).toBeFalsy();
+        expect(menu.container().item(1).active().toBeTruthy); // at location 1: CIItem 2
+        expect(menu.liveLength()).toEqual(5);
+
+        menu.container().add("1");
+        menu.show(); // Simulates Buttonpress 1
+        // See function _keypress in containermenu.js (line 147)
+        expect(menu.liveItem()).toBeUndefined(); // no elements in list match "1"
+        expect(menu.container().active()).toBeTruthy();
+        var liElements = directElementChildrenByTagName(menu.element(),"li");
+        expect(liElements).toEqual([]);
+        expect(menu.container().liveLength()).toEqual(3); //CI1 and 2, prefix
+        expect(menu.container().item(1).active().toBeTruthy); // at location 1: CIItem 2
+        // We want whichever container item was active before
+        // to stay active, default to prefix if none was.
+
+      });
 
       it('should be nextable', function () {
         var menu = OwnContainerMenu.create(list);
diff --git a/dev/js/src/container/container.js b/dev/js/src/container/container.js
index 60bc0d9..9cf5205 100644
--- a/dev/js/src/container/container.js
+++ b/dev/js/src/container/container.js
@@ -41,13 +41,19 @@
       // after having upgraded a new item scss style to the prefix object.
 
       this.items = new Array();
+      //items are stored in the order they are added in. This includes the prefix.
       if (listOfContainerItems !== undefined) {
         for (let item of listOfContainerItems) {
           this.addItem(item);
         }
       }
 
-      this.position = undefined; //undefined = not in container, 0 to length-1 = in container
+      this.position = undefined; //undefined = not in container,
+      // 0 to length-1 = in container
+
+      this._prefixPosition = undefined; //Required so that switching
+      // to prefix by default is supported
+
 
       
       //t._el.classList.add('visible'); //Done by containermenu
@@ -77,6 +83,7 @@
       prefix.isSelectable =  function () {
         return this.isSet(); //TODO check!
       }
+      this._prefixPosition = this.items.length;
       var prefItem = this.addItem(prefix);
       this._prefix = prefItem;
       if (this._menu !== undefined){
@@ -124,6 +131,26 @@
     },
 
     /**
+     * 
+     * Make the container active without having called prev or next.
+     * Occurs whenever the prefix makes the
+     * menus list empty while we had it selected.
+     * This potentially requires adjusting this.position.
+     */
+     makeActive : function () {
+      if (this.position === undefined) {
+        if (this._prefix.isSelectable()) {
+          this.position = this._prefixPosition; //make prefix active if it exists
+          this.item().active(true);
+        } else if (this.liveLength() > 0) {
+          this.position = 0;
+          this._prefix.active(false); // usually the menu makes the prefix active anyway.
+          this.item().active(true);
+        }
+      }
+    },
+
+    /**
      * Move on to the next item in container. Returns true if we then leave the container, false otherwise.
      */
     next : function() {
diff --git a/dev/js/src/containermenu.js b/dev/js/src/containermenu.js
index a272e10..865c3ec 100644
--- a/dev/js/src/containermenu.js
+++ b/dev/js/src/containermenu.js
@@ -165,7 +165,7 @@
      * @param {string} Prefix for filtering the list
      */
     show : function (active) {
-      //there are only two new lines, marked with NEW
+      //There are only four new lines, marked with NEW
       const t = this;
 
       // show menu based on initial offset
@@ -177,11 +177,13 @@
       if (!t._initList()) {
 
         // The prefix is not active
-        t._prefix.active(true);
+        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
 
         // finally show the element
-        t._el.classList.add('visible'); // TODO do I need this for container?
-        t.container()._el.classList.add('visible');
+        t._el.classList.add('visible');
+        t.container()._el.classList.add('visible'); //NEW
 
         return true;
       };