diff --git a/dev/js/spec/vcSpec.js b/dev/js/spec/vcSpec.js
index 3dd0749..792dc3e 100644
--- a/dev/js/spec/vcSpec.js
+++ b/dev/js/spec/vcSpec.js
@@ -21,10 +21,7 @@
 	for (var prop in overwrites) {
 	  newObj[prop] = overwrites[prop];
 	};
-	if (objClass === vcClass)
-	  return objClass.render(newObj);
-	else
-	  return objClass.create().fromJson(newObj);
+	return objClass.create().fromJson(newObj);
       }
     }
   };
@@ -625,7 +622,7 @@
     });
 
     it('should be replaceable on root', function () {
-      var vc = vcClass.render();
+      var vc = vcClass.create();
       expect(vc.toQuery()).toEqual("");
 
       expect(vc.root().ldType()).toEqual("non");
@@ -874,7 +871,7 @@
     });
     
     it('should be initializable', function () {
-      var vc = vcClass.render();
+      var vc = vcClass.create();
       expect(vc.element().getAttribute('class')).toEqual('vc');
       expect(vc.root().element().getAttribute('class')).toEqual('doc unspecified');
 
@@ -883,7 +880,7 @@
     });
 
     it('should be based on a doc', function () {
-      var vc = vcClass.render({
+      var vc = vcClass.create().fromJson({
 	"@type" : "koral:doc",
 	"key":"Titel",
 	"value":"Baum",
@@ -905,7 +902,7 @@
     });
 
     it('should be based on a docGroup', function () {
-      var vc = vcClass.render(simpleGroupFactory.create().toJson());
+      var vc = vcClass.create().fromJson(simpleGroupFactory.create().toJson());
 
       expect(vc.element().getAttribute('class')).toEqual('vc');
       expect(vc.root().element().getAttribute('class')).toEqual('docGroup');
@@ -1122,7 +1119,7 @@
     });
 
     it('should flatten on import', function () {
-      var vc = vcClass.create().render({
+      var vc = vcClass.create().fromJson({
 	"@type":"koral:docGroup",
 	"operation":"operation:or",
 	"operands":[
@@ -1247,7 +1244,7 @@
     });
 
     it('should clean on root docs', function () {
-      var vc = vcClass.render({
+      var vc = vcClass.create().fromJson({
 	"@type": 'koral:doc',
 	"key": 'pubDate',
 	"match": 'match:eq',
@@ -1265,7 +1262,7 @@
     });
 
     it('should remove on nested docs', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:and',
@@ -1295,7 +1292,7 @@
     });
 
     it('should clean on doc groups', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:and',
@@ -1369,7 +1366,7 @@
     });
 
     it('should remove on nested doc groups (list flattening)', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:or',
@@ -1480,7 +1477,7 @@
     });
 
     it('should add new unspecified doc with "and"', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:and',
@@ -1525,7 +1522,7 @@
     });
 
     it('should add new unspecified doc with "or"', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:and',
@@ -1724,7 +1721,7 @@
     });
 
     it('should wrap on root', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:and',
@@ -1758,7 +1755,7 @@
     });
 
     it('should add on root (case "and")', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:doc',
 	  "key": 'pubDate',
@@ -1780,7 +1777,7 @@
     });
 
     it('should add on root (case "or")', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:doc',
 	  "key": 'pubDate',
@@ -1801,7 +1798,7 @@
     });
 
     it('should support multiple sub groups per group', function () {
-      var vc = vcClass.render(
+      var vc = vcClass.create().fromJson(
 	{
 	  "@type": 'koral:docGroup',
 	  'operation' : 'operation:or',
@@ -1857,8 +1854,9 @@
     });
   });
 
-  describe('KorAP.Rewrite', function () {
 
+
+  describe('KorAP.Rewrite', function () {
     it('should be initializable', function () {
       var rewrite = rewriteClass.create({
 	"@type" : "koral:rewrite",
@@ -1902,10 +1900,41 @@
       expect(doc.element().classList.contains('doc')).toBeTruthy();
       expect(doc.element().classList.contains('rewritten')).toBeTruthy();
     });
-    /*
-      it('should be deserialized by docGroups', function () {
-      });
-    */
+
+    xit('should be deserialized by docGroups', function () {
+      var docGroup = docGroupClass.create(
+	undefined,
+	{
+	  "@type" : "koral:docGroup",
+	  "operation" : "operation:or",
+	  "operands" : [
+	    {
+	      "@type" : "doc",
+	      "key" : "pubDate",
+	      "type" : "type:date",
+	      "value" : "2014-12-05"
+	    },
+	    {
+	      "@type" : "doc",
+	      "key" : "pubDate",
+	      "type" : "type:date",
+	      "value" : "2014-12-06"
+	    }
+	  ],
+	  "rewrites" : [
+	    {
+	      "@type" : "koral:rewrite",
+	      "operation" : "operation:modification",
+	      "src" : "querySerializer",
+	      "scope" : "tree"
+	    }
+	  ]
+	}
+      );
+
+      expect(doc.element().classList.contains('docgroup')).toBeTruthy();
+      expect(doc.element().classList.contains('rewritten')).toBe(false);
+    });
   });
   /*
     describe('KorAP.DocKey', function () {
diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index 66bc081..cd0adfc 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -70,11 +70,37 @@
 	)
       );
       input.parentNode.insertBefore(vcname, input);
-      
+
+      /**
+       * Toggle the Virtual Collection builder
+       */
+      var vc;
       vcname.onclick = function () {
-	var vc = vcClass.render(vcExample);
 	var view = document.getElementById('vc-view');
-	view.appendChild(vc.element());
+
+	// The vc is visible
+	if (this.classList.contains('active')) {
+	  view.removeChild(vc.element());
+	  this.classList.remove('active');
+	}
+
+	// The vc is not visible
+	else {
+	  // The vc is not rendered yet
+	  if (vc === undefined) {
+	    vc = vcClass.create([
+	      ['title', 'string'],
+	      ['subTitle', 'string'],
+	      ['pubDate', 'date'],
+	      ['author', 'string']
+	    ]);
+
+	    if (KorAP.currentVC !== undefined)
+	      vc.fromJson(KorAP.currentVC);
+	  };
+	  view.appendChild(vc.element());
+	  this.classList.add('active');
+	};
       };
     };
 
diff --git a/dev/js/src/vc.js b/dev/js/src/vc.js
index 80f6627..c816883 100644
--- a/dev/js/src/vc.js
+++ b/dev/js/src/vc.js
@@ -131,32 +131,25 @@
      * Create a new virtual collection.
      */
     create : function (keyList) {
-      return Object.create(this)._init(keyList);
-    },
-
-    clean : function () {
-      if (this._root.ldType() !== "non") {
-	this._root.destroy();
-	this.root(unspecDocClass.create(this));
-      };
-      return this;
+      var obj = Object.create(this)._init(keyList);
+      obj._root = unspecDocClass.create(obj);
+      return obj;
     },
 
     /**
      * Create and render a new virtual collection
      * based on a KoralQuery collection document 
      */
-    render : function (json, keyList) {
-      var obj = Object.create(this)._init(keyList);
+    fromJson : function (json) {
 
       if (json !== undefined) {
 	// Parse root document
 	if (json['@type'] == 'koral:doc') {
-	  obj._root = docClass.create(obj, json);
+	  this._root = docClass.create(this, json);
 	}
 	// parse root group
 	else if (json['@type'] == 'koral:docGroup') {
-	  obj._root = docGroupClass.create(obj, json);
+	  this._root = docGroupClass.create(this, json);
 	}
 	// Unknown collection type
 	else {
@@ -167,13 +160,21 @@
 
       else {
 	// Add unspecified object
-	obj._root = unspecDocClass.create(obj);
+	this._root = unspecDocClass.create(this);
       };
 
       // Init element and update
-      obj.update();
+      this.update();
 
-      return obj;
+      return this;
+    },
+
+    clean : function () {
+      if (this._root.ldType() !== "non") {
+	this._root.destroy();
+	this.root(unspecDocClass.create(this));
+      };
+      return this;
     },
 
     /**
diff --git a/dev/js/src/vc/doc.js b/dev/js/src/vc/doc.js
index 10a49a8..5571cf7 100644
--- a/dev/js/src/vc/doc.js
+++ b/dev/js/src/vc/doc.js
@@ -335,10 +335,13 @@
       if (arguments.length === 1) {
 	var m = match.replace(/^match:/, '');
 	if (
-	  (
-	    (this._type === 'string' || this._type === 'regex') &&
-	      KorAP._validStringMatchRE.test(m)
-	  ) ||
+	  (this._type === undefined)
+	    ||
+	    (
+	      (this._type === 'string' || this._type === 'regex') &&
+		KorAP._validStringMatchRE.test(m)
+	    )
+	    ||
 	    (this._type === 'date' && KorAP._validDateMatchRE.test(m))
 	) {
 	  this._matchop = m;