Index: /Explorator/trunk/public/javascripts/explorator_ui.js
===================================================================
--- /Explorator/trunk/public/javascripts/explorator_ui.js	(revision 172)
+++ /Explorator/trunk/public/javascripts/explorator_ui.js	(revision 176)
@@ -20,21 +20,21 @@
     ui_remove: function(item){
         //removes the element from the model and replace the interface with a new one.	
-                new Effect.Shrink(item, {
-            duration: 0.2, 
-			afterFinish: function(){
+        new Effect.Shrink(item, {
+            duration: 0.2,
+            afterFinish: function(){
                 //definitely removes the element from the set.
-                item.remove();                
-            }        
+                item.remove();
+            }
         });
-		item.ctr_remove();
+        item.ctr_remove();
     }, //close an element
     ui_close: function(item){
         new Effect.Shrink(item, {
             duration: 0.2
-           
+        
         });
     }, //open an element
     ui_open: function(item){
-		
+    
         item.ctr_open();
     }
@@ -77,4 +77,22 @@
         
     });
+    $$('.instances').each(function(item){
+        item.identify();
+        item.onclick = function(e){ 
+		 
+            if (item.hasClassName('bluebackground')) {
+                item.innerHTML = 'i'
+                item.removeClassName('bluebackground');
+				item.up('.resource').setAttribute('exp',item.readAttribute('instances'));
+            }
+            //If it was not selected before, select.            
+            else {
+                item.innerHTML = 'c'
+                item.addClassName('bluebackground');
+				item.up('.resource').setAttribute('exp',item.readAttribute('classes'));
+            }
+            e.stopPropagation();
+        };        
+    });
     //calcuates the facets
     $$('._facet').each(function(item){
@@ -97,17 +115,17 @@
         };
     });
-      $$('._object_view').each(function(item){
-        item.onclick = function(){
-            item.up('._WINDOW').crt_refresh('object_view','');
-        };
-    });
-     $$('._predicate_view').each(function(item){
-        item.onclick = function(){
-            item.up('._WINDOW').crt_refresh('predicate_view','');
-        };
-    });
-	 $$('._subject_view').each(function(item){
-        item.onclick = function(){
-            item.up('._WINDOW').crt_refresh('subject_view','');
+    $$('._object_view').each(function(item){
+        item.onclick = function(){
+            item.up('._WINDOW').crt_refresh('object_view', '');
+        };
+    });
+    $$('._predicate_view').each(function(item){
+        item.onclick = function(){
+            item.up('._WINDOW').crt_refresh('predicate_view', '');
+        };
+    });
+    $$('._subject_view').each(function(item){
+        item.onclick = function(){
+            item.up('._WINDOW').crt_refresh('subject_view', '');
         };
     });
@@ -125,8 +143,8 @@
     $$('._refresh').each(function(item){
         item.onclick = function(){
-            item.up('._WINDOW').crt_refresh('subject_view','');
-        };
-    });
-  
+            item.up('._WINDOW').crt_refresh('subject_view', '');
+        };
+    });
+    
     //Adds a id to all _WINDOW elements.
     //This is necessary for the ajax_update method know which element should be updated.
@@ -142,5 +160,5 @@
                 }
             });
-		e.stopPropagation();
+            e.stopPropagation();
         };
     });
@@ -155,26 +173,26 @@
         };
     });
-   
+    
     $$('._expandproperties').each(function(item){
         item.onclick = function(e){
-            item.up('._WINDOW').select('.properties').each(function(x){            
-                x.ui_show();                
-            });
-			item.up('._WINDOW').select('._collapseproperties').invoke('show');
-			item.up('._WINDOW').select('._expandproperties').invoke('hide');
-			e.stopPropagation();
-        };
-    });
-      $$('._collapseproperties').each(function(item){
+            item.up('._WINDOW').select('.properties').each(function(x){
+                x.ui_show();
+            });
+            item.up('._WINDOW').select('._collapseproperties').invoke('show');
+            item.up('._WINDOW').select('._expandproperties').invoke('hide');
+            e.stopPropagation();
+        };
+    });
+    $$('._collapseproperties').each(function(item){
         item.onclick = function(e){
-            item.up('._WINDOW').select('.properties').each(function(x){            
+            item.up('._WINDOW').select('.properties').each(function(x){
                 x.ui_hide();
                 
             });
-			item.up('._WINDOW').select('._expandproperties').invoke('show');
-				item.up('._WINDOW').select('._collapseproperties').invoke('hide');
-				e.stopPropagation();
-        };
-		 
+            item.up('._WINDOW').select('._expandproperties').invoke('show');
+            item.up('._WINDOW').select('._collapseproperties').invoke('hide');
+            e.stopPropagation();
+        };
+        
     });
     
@@ -219,8 +237,8 @@
     $$('.select').each(function(item){
         item.onclick = function(e){
-			  item.select('.properties').each(function(x){            
-                x.ui_hide();       
-				item.select('._collapseproperties').invoke('hide');
-				item.select('._expandproperties').invoke('show');
+            item.select('.properties').each(function(x){
+                x.ui_hide();
+                item.select('._collapseproperties').invoke('hide');
+                item.select('._expandproperties').invoke('show');
             });
             //When only click event happens
@@ -258,8 +276,9 @@
     });
 }
+
 ///////////////////////////////////////////////////////////////////////////////////
 //////////////////////////////////WINDOW HELPER FUNCTION//////////////////////////
 //Create a empty div window and add to the body.
-function ui_create_window(){ 
+function ui_create_window(){
     var div = document.createElement('div');
     Element.extend(div);
@@ -268,5 +287,6 @@
     document.body.insertBefore(div, $$('.set').first());
     return id;
-} 
+}
+
 //Adds a html fragment on the html body.
 function ui_add_window(result){
@@ -275,8 +295,10 @@
     var documentFragment = range.createContextualFragment(result);
     document.body.insertBefore(documentFragment, $$('.set').first());
-	 init_all();
-	$$('.set').first().hide();
-	 
-	Effect.Grow($$('.set').first(),{direction: 'top-left'});
- 
-}
+    init_all();
+    $$('.set').first().hide();
+    
+    Effect.Grow($$('.set').first(), {
+        direction: 'top-left'
+    });
+    
+}