Merge branch 'mongokit' of https://github.com/gnowledge/gstudio into delete_group

19 files changed, 1764 insertions, 851 deletions

diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Upload_File.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Upload_File.html
new file mode 100644
index 0000000..157f575
--- /dev/null
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Upload_File.html
@@ -0,0 +1,426 @@
+{% load i18n %}
+{% load ndf_tags %}
+
+<style type="text/css">
+	
+
+	#tags_error{
+		color: red;
+	}
+
+	div.tags{ 
+		/*padding: 5px 10px; */
+		margin: 2px 5px;
+		/*color: white;*/
+		font-size: 1em;
+		border: solid thin #FFD400;
+	}
+
+	i.remove-tag{
+		padding-left: 8px;
+		font-size: 1.1em;
+		cursor: pointer;
+	}
+
+</style>
+
+{% get_group_name groupid as group_name_tag %}
+{% if user.is_authenticated %}	
+
+	<form class="dropzone" id ="docPost" enctype="multipart/form-data" method="post" action="{% url 'submitDoc' group_name_tag %}">{% csrf_token %}
+
+		<!-- file browse and name -->
+		<fieldset style="background:#ccc;">
+			<legend style="background:#10c1cb">{% trans "Upload File" %}</legend>
+			<div class ="row">
+				<div class="large-3 columns">				
+					<label>{% trans "Choose File" %}</label>
+					<input type="file" name="doc[]"  id="docFile"/>
+				</div>
+				<div class="large-9 columns">				
+					<label>{% trans "Title of File" %}</label>
+					<input type="text" name="docTitle" id ="docTitle"  placeholder="Enter Title of File">
+				</div>
+			</div>
+		</fieldset>
+
+		<!-- other details -->
+		<fieldset style="background:#ccc;">
+			<legend style="background:#10c1cb">{% trans "Enter Details" %}</legend>
+
+			<div class ="row">
+				<div class="large-5 columns">
+					<b>Add Description</b>
+					{% include "ndf/add_editor.html" with var_name="content_org" var_placeholder="Please enter question" %}
+
+					<div class="row">
+					
+						<b class="small-3 columns"> {% trans "Add Tag" %}:
+						</b>
+
+						<div class="small-9 columns">
+							<div class="row collapse" data-tooltip class="has-tip" title="{% trans 'Tags help identify similiar work easily. Just add tag text and click Add Tag button' %}">
+									
+								<div class="small-9 columns">
+							    	<input id="tags_id" tabindex="2" type="text" value="" placeholder="{% trans 'Add tag text and click on [Add Tag] button' %}">
+							    	<input type="hidden" value="{{node.tags|join:', '|default_if_none:""}}" name="tags">
+						        </div>
+						        <div class="small-3 columns">
+						        	<span tabindex="3" id="add-tag-btn" class="tiny button">
+						        		{% trans 'Add Tag' %}
+						        	</span>
+						        </div>
+
+							</div>
+
+							<!-- show tags error msg -->
+							<div class="row hide" id="tags_error">
+								<div class="small-10 columns">{% trans 'Non empty tags can have only alphanumeric characters, dash(-) and spaces.' %}</div>
+							</div>
+
+							<!-- show added tags -->
+							<div class="row">
+								<div id="added_tags" class="small-9 columns">
+									{% for each_tag in node.tags %}
+										<div class="tags label radius info">{{each_tag}}<i title="Remove this tag" class="fi-x-circle remove-tag"></i></div>
+									{% endfor %}
+								</div>
+							</div>
+
+						</div>
+
+					</div>
+
+				</div>
+
+				<div class="large-7 columns">
+					<div class ="row">
+						<div class="large-4 columns">
+							<b>Set Language</b>
+							<select name="lan">
+								{% get_language_info_list for LANGUAGES as languages %}
+								{% for language in languages %}
+								<option value="{{ language.code }}">
+									{{ language.name }}
+								</option>
+								{% endfor %}
+							</select>
+						</div>
+						<div class="large-4 columns">
+							<b>Location</b>
+							<a href="#view-map-edit-widget" data-reveal-id="view-map-edit-widget" title="Click to add location markers" class="tiny secondary button expand"> <i class="fi-marker"></i> &nbsp; {% trans "Add Location" %}
+							</a>
+						</div>
+						<div class="large-4 columns">
+							<b>Set Privacy</b><br/>
+							<input id="PUBLIC" name="login-mode" value="PUBLIC" type="radio" checked>
+							<label for="PUBLIC" onclick="">{% trans "Public" %} <i class="fi-torsos-all"></i></label>
+							<input id="PRIVATE" name="login-mode" value="PRIVATE" type="radio">
+							<label for="PRIVATE" onclick="">{% trans "Private" %} <i class="fi-lock"></i></label>
+						</div>
+					</div>
+					
+					<div class ="row">
+						<div class="large-4 columns">
+							<b>Target Audience</b>
+							{% get_metadata_values as metadata %}
+	  						{% for k,v in metadata.items %}
+	  						{% if k == "audience" %}
+							<select name="audience">
+			         			<option>---Select from list---</option>
+			        			{% for opts in v %}		        														
+									<option>{% trans opts %}</option>
+								{% endfor %}
+							</select>
+							{% endif %}
+							{% endfor %}
+						</div>
+
+						{% comment %}
+						<!-- <div class="large-4 columns">
+							<b>File Type</b>
+							{% get_metadata_values as metadata %}
+	  						{% for k,v in metadata.items %}
+	  						{% if k == "educationaluse" %}
+							<select name="FileType">
+			         			<option>---Select from list---</option>
+			        			{% for opts in v %}		        					
+									<option>{% trans opts %}</option>
+								{% endfor %}
+							</select>
+							{% endif %}
+							{% endfor %}
+						</div> -->
+						{% endcomment %}
+
+						<div class="large-4 columns">
+							<b>Subject</b>
+							{% get_metadata_values as metadata %}
+	  						{% for k,v in metadata.items %}
+	  						{% if k == "educationalsubject" %}
+							<select name="Subject">
+			         			<option>---Select from list---</option>
+			        			{% for opts in v %}		        														
+									<option>{% trans opts %}</option>
+								{% endfor %}
+							</select>
+							{% endif %}
+							{% endfor %}
+						</div>
+
+						<div class="large-4 columns">
+							<b>Educational Level</b>
+							{% get_metadata_values as metadata %}
+	  						{% for k,v in metadata.items %}
+	  						{% if k == "educationallevel" %}
+							<select name="Level">
+			         			<option>---Select from list---</option>
+			        			{% for opts in v %}		        														
+									<option>{% trans opts %}</option>
+								{% endfor %}
+							</select>
+							{% endif %}
+							{% endfor %}
+						</div>
+					</div>
+
+					<div class ="row">
+						<div class="large-2 columns">
+							<b>License</b>
+						</div>
+						<div class="large-10 columns">
+							<!-- <input id="license_id" name="License" type="text" placeholder="Enter source name"/> -->
+							{% get_licence as licence %}
+							<select name="License">
+			         			<option value="CC BY-SA">---Select from list---</option>
+		  						{% for each_licence in licence %}
+				        			<option value="{{each_licence}}">
+				        				{% trans each_licence %}
+				        			</option>
+								{% endfor %}
+							</select>
+						</div>
+					</div>
+
+					<div class ="row">
+						<div class="large-2 columns">
+							<b>Source</b>
+						</div>
+						<div class="large-10 columns">
+							<input id="source_id" name="Source" type="text" placeholder="Enter source name"/>
+						</div>
+					</div>
+
+					<div class ="row">
+						<div class="large-3 columns">
+							<b>Based on url</b>
+						</div>
+						<div class="large-9 columns">
+							<input id="based_on_id" name="based_url" type="text" placeholder="Enter valid url"/>
+						</div>
+					</div>
+
+			</div>	
+			
+
+		</fieldset>
+		
+		<input type="hidden" name="user" value="{{user.id}}">
+		<input type="hidden" name="page_url" value="{{page_url}}">
+		<input type="submit" id="submitpostid" value="Submit" class="button round medium">
+		<p id="message" style="display:none"> 
+			{% trans "Depending on the size of file/s and your Internet speed, upload process may take time. Please do not close this window." %} <br/>
+			{% trans "Please upload videos in webm format. If you upload videos of other formats, it will take longer to publish them." %} 
+		</p>
+
+
+		<!-- Overlay : Map Widget -->
+	    <div class="content reveal-modal graph-div" id="view-map-edit-widget" data-reveal>    
+	    	<!-- #{#% #if '/edit/' in request.path  or '/image_detail/' in request.path  or '/video_detail/' in request.path%} -->
+	        <a class="close-reveal-modal" >&#215;</a>
+	        {% include "ndf/map_widget.html" with mode="edit" %}
+	        <!-- <div style="background-color:gray; width:100%; height:80%;"></div> -->
+	      <!-- #{#%# endif %} -->
+	    </div>
+
+	</form>
+
+{% else %}
+	<p><em>{% trans "You are not an authorised user. Please login to upload files." %} </em></p>
+{% endif %}
+
+<script type="text/javascript">
+
+	$("#docFile").change(function() {
+        var max_size =100000
+        var fsize=this.files[0].size
+        fsize=fsize/1024
+        {% check_is_gstaff groupid request.user as gstaff_access %}
+        if(fsize> max_size){
+          {% if gstaff_access%}
+          	$('#docFile').val(this.value);
+          {% else %}
+          	alert("Sorry. Max File Size Limit Exceeded");
+          	$(this).val("")
+          	$('#docFile').val(this.value);
+          {% endif %}
+          }
+        else{
+		$('#docFile').val(this.value);}        
+      	});
+		
+		$(document).on('submit',"form",function(){
+		if($("#docFile").val() != "")
+		{	
+
+		$("#message").show();
+		$("#submitpostid").hide();
+		$("#submitpostid").submit();
+
+		}
+		else
+		{
+		alert("select a file");
+		return false;
+		}
+	});
+
+	// --- tags ---	
+	var tags = document.getElementById("tags_id");
+	var addedTags = document.getElementById("added_tags");
+
+	function checkTag()
+	{
+		var textValue = tags.value.trim();
+		// console.log(textValue.length);
+
+		if(textValue.length < 1){ return false; }
+
+		if(textValue.match(/[^A-Za-z0-9\-\ ]/g))
+		{	// having special characters
+			$('#tags_error').removeClass("hide");
+			return false;
+		}
+		else
+		{	// passed the test and now add tag label
+			$('#tags_error').addClass("hide") // fadeout fastly ongoing fadeout event
+			return true;
+		}
+	}
+
+	tags.onchange = checkTag;
+	tags.onmouseup = checkTag;
+	tags.onkeyup = checkTag;
+
+	function updateAllTags() {
+		
+		var tagsArr = new Array();
+
+		$("#added_tags").children("div.tags.label").each(function(){
+			tagsArr.push(this.textContent.trim().toLowerCase());
+		});
+
+		$("input:hidden[name='tags']").val(tagsArr.toString());
+		// console.log(tagsArr)
+	}
+	
+
+	function removeTag(){
+		$(this).parent().fadeOut("slow", function(){
+			$(this).detach();
+		});
+
+		updateAllTags();
+	};
+
+	$(".remove-tag").click(removeTag);
+
+	$(".remove-tag").mouseenter(function(){
+		$(this).parent("div.tags").css("text-decoration", "line-through");
+	});
+
+	$(".remove-tag").mouseleave(function(){
+		$(this).parent("div.tags").css("text-decoration", "none");
+	});
+
+	function addTag() {
+		if(checkTag())
+		{
+			var textValue = tags.value.trim().toLowerCase();
+			tags.value = '';
+
+			var tagDiv = document.createElement("div");
+			tagDiv.className = "tags label radius info";
+			tagDiv.appendChild(document.createTextNode(textValue));
+			// tagDiv.setAttribute("data-primary-type", selFieldPrimaryType);
+
+			var closeBtn = document.createElement("i");
+			closeBtn.className = "fi-x-circle remove-tag";
+			closeBtn.title = "Remove this tag";
+			closeBtn.onclick = removeTag;
+
+			$(closeBtn).mouseenter(function(){
+				$(this).parent("div.tags").css("text-decoration", "line-through");
+			});
+
+			$(closeBtn).mouseleave(function(){
+				$(this).parent("div.tags").css("text-decoration", "none");
+			});
+
+			tagDiv.appendChild(closeBtn);
+
+			addedTags.appendChild(tagDiv);
+
+			updateAllTags();
+		}
+		else
+		{
+			$('#tags_error').removeClass("hide");
+		}
+		tags.focus();
+	}
+
+	var addTagBtn = document.getElementById("add-tag-btn");
+	addTagBtn.onclick = addTag;
+	addTagBtn.onkeypress = addTag;
+
+
+	// --- map ---
+  	$(document).on('open', '#view-map-edit-widget[data-reveal]', function () {  
+    
+  		$.ajax({
+  			url: "{% url 'get_visited_location' groupid %}",
+  			success: function(data){ 
+   
+			  	data = JSON.parse(data);
+
+			    var lastVisitedLocationVal = data;
+			    
+			    if(lastVisitedLocationVal){
+
+			      if(lastVisitedLocationVal == "[]"){
+			        lastVisitedLocationVal = JSON.parse(lastVisitedLocationVal);
+			      }
+
+			      if(lastVisitedLocationVal.length > 0){
+			            // lastVisitedLocationVal = JSON.parse(lastVisitedLocationVal);
+			            var zoom = lastVisitedLocationVal.pop(),
+			                lng = lastVisitedLocationVal[1],
+			                lat = lastVisitedLocationVal[0];
+			              map.setView([lat, lng], zoom);
+			            }
+			    }
+			    else if( tempArr.length )
+			    {
+			      var group = new L.featureGroup(tempArr)
+			          map.fitBounds(group.getBounds());
+			    }
+			}
+		});
+  	});
+
+	$(document).on('opened', '#view-map-edit-widget[data-reveal]', function () {  
+		map.invalidateSize();  
+	});
+
+</script>
\ No newline at end of file
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Uploader_Form.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Uploader_Form.html
new file mode 100644
index 0000000..423a650
--- /dev/null
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/Uploader_Form.html
@@ -0,0 +1,25 @@
+{% extends "ndf/base.html" %}
+{% load i18n %}
+
+{% block title %} Upload Resource {% endblock %}
+
+
+{% block meta_content %} 
+	<!-- This content displayed into the left panel to display the info/hrlp document -->
+	<h3>{% trans "Uploader Form" %}</h3>
+	<p class="text-justify subheader">
+        {% trans "You can upload <b>files</b> of any format to your group library." %}
+    </p>
+
+{% endblock %} 
+
+
+{% block body_content %} 
+
+	{% include "ndf/Upload_File.html" %}
+
+{% endblock %}
+
+
+
+
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/course.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/course.html
index 6573df0..bed3a68 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/course.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/course.html
@@ -12,16 +12,27 @@
 
 
 {% block meta_content %}
-  <h2 class="subheader">{% trans "Courses" %}</h2>
-    {% if user.is_authenticated %}
-      {% user_access_policy groupid request.user as user_access %}
-      {% if user_access == "allow" %}
-        <a class="small button" href="{% url 'create_edit' group_name_tag %}">
-          <span class="fi-plus">&nbsp;&nbsp; {% trans "New" %} {{title}} </span>
-        </a>
-        <a class="small publish-btn button" style="width:73%" href="{% url 'ann_course_create_edit' group_id app_id app_set_id %}">{% trans "Announce" %}</a>
-      {% endif %}
+
+  <a href="{% url course_gst.name|lower group_name_tag %}">
+    <h2 class="subheader">
+      {% if course_gst.altnames and course_gst.altnames != "None" %}
+        {{course_gst.altnames}}
+      {% else %}
+        {{course_gst.name}}
+      {% endif%}
+    </h2>
+    {{course_gst.content|default_if_none:""|safe}}
+  </a>
+
+  {% if user.is_authenticated %}
+    {% user_access_policy groupid request.user as user_access %}
+    {% if user_access == "allow" %}
+      <a class="small button" href="{% url 'create_edit' group_name_tag %}">
+        <span class="fi-plus">&nbsp;&nbsp; {% trans "New" %} {{title}} </span>
+      </a>
+      <a class="small publish-btn button" style="width:73%" href="{% url 'ann_course_create_edit' group_id app_id app_set_id %}">{% trans "Announce" %}</a>
     {% endif %}
+  {% endif %}
 {% endblock %}
 
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/ebook.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/ebook.html
index b1a184f..4b969ba 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/ebook.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/ebook.html
@@ -4,6 +4,21 @@
 
 {% block title %} Repository {% endblock %}
 
+
+{% block meta_content %}
+  <a href="{% url 'e-book' group_name_tag %}" title="Click to go to ebooks">
+    <h2 class="subheader">
+      {% if ebook_gst.altnames and ebook_gst.altnames != "None" %}
+        {{ebook_gst.altnames}}
+      {% else %}
+        {{ebook_gst.name}}
+      {% endif%}
+    </h2>
+  </a>
+  {{ebook_gst.content|default_if_none:""|safe}}
+{% endblock %}
+
+
 {% block body_content %}
 
 <ul class="small-block-grid-1 medium-block-grid-2 large-block-grid-4">
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/file.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/file.html
index 1eeadbf..3cf5c35 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/file.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/file.html
@@ -44,7 +44,18 @@
 
 <!-- left top panel -->
 {% block meta_content %}
-  <h2 class="subheader">{% trans title %}</h2>
+
+  <a href="{% url app_gst.name|lower group_name_tag %}">
+    <h2 class="subheader">
+      {% if app_gst.altnames and app_gst.altnames != "None" %}
+        {{app_gst.altnames}}
+      {% else %}
+        {{app_gst.name}}
+      {% endif%}
+    </h2>
+    {{app_gst.content|default_if_none:""|safe}}
+  </a>
+
 {% endblock %}
 
 
@@ -53,18 +64,6 @@
 
   <div class="panel" style="background-color:#ddd;">
     
-    <!-- radio buttons for E-Library app: CR and XCR -->
-    {% comment %}
-    <!-- 
-    {% if title == "E-Library" %}
-      <input type="radio" name="crxcr" value="cr" id="cr-rad" title="Curricular">
-        <label for="cr-rad" title="Curricular">CR</label>
-      <input type="radio" name="crxcr" value="xcr" id="xcr-rad" title="Extra Curricular">
-        <label for="xcr-rad" title="Extra Curricular">XCR</label>
-    {% endif %}
-    -->
-    {% endcomment %}  
-    
     <ul class="side-nav">
       <dl class="tabs" data-tab >
 
@@ -191,15 +190,9 @@
       {% if user_is_joined == "joined" or user_is_joined == "author" %}
       <b>{% trans "Actions" %}</b><br/><br/>
       
-        {% user_access_policy groupid request.user as user_access %}
-        {% if user_access == "allow" %}
-          
           <a href="{% url 'uploadDoc' group_name_tag %}?next={{request.path}}" class="tiny round button">
             {% trans "Upload File" %}
           </a><br/><br/>
-          
-        {% endif %}
-      
 
       <b>{% trans "Review" %}</b><br/><br/>
       
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/group.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/group.html
index 25bc57c..0829d8e 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/group.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/group.html
@@ -6,10 +6,26 @@
 
 {% block title %} Group {% endblock %}
 
-{% block meta_content %}  
-<h2 class="subheader">{% trans "Groups" %}</h2>
-{% endblock %}
+<!-- left top panel -->
+{% block meta_content %}
+
+  <h2 class="subheader">{% trans "Groups" %}</h2>
 
+<!-- 
+{% comment %}
+  <a href="{% url app_gst.name|lower group_name_tag %}">
+    <h2 class="subheader">
+      {% if app_gst.altnames and app_gst.altnames != "None" %}
+        {{app_gst.altnames}}
+      {% else %}
+        {{app_gst.name}}
+      {% endif%}
+    </h2>
+    {{app_gst.content|safe}}
+  </a>
+{% endcomment %}
+ -->
+{% endblock %}
 
 {% block help_content %}
 {% blocktrans %}<p>Groups are an easy way to share content and conversation, either privately or with the world. Many times, a group already exist for a specific interest or topic. If you can't find one you like, feel free to start your own.</p>
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/hierarchy_tree.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/hierarchy_tree.html
new file mode 100644
index 0000000..bc9ff32
--- /dev/null
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/hierarchy_tree.html
@@ -0,0 +1,545 @@
+{% load i18n %}
+
+{% load ndf_tags %}
+{% get_group_name groupid as group_name_tag %}
+
+<style>
+
+	.jqtree-closed > .jqtree-element i.icon-folder-open:before {
+        content: "\f07b";
+    }
+
+    .jqtree-tree i {
+		margin-right: 4px;
+    }
+
+    ul.jqtree-tree ul.jqtree_common {
+    	margin-left: 36px;
+    }
+    
+</style>
+
+
+<script type="text/javascript">
+
+  	function plotHierarchyTree() {
+		// Funtion for loading tree for showing collection list left side panel
+		doc();
+
+		// Function for manipulating tree when user visits to page directly via browser url
+		{% if selected %} TreeTillNode(); {% endif %}
+    }
+
+
+  	function TreeTillNode () {
+
+		// This gives the last hierarchy node id from browser url.
+		var url = "{{selected}}";
+
+		var tree_build = $(".themes").not(".jqtree-loading");
+		var node = tree_build.tree('getNodeById', url);
+		tree_build.tree('openNode', node);
+
+		// Javascript function to be used for checking objects in specific time of interval
+		setTimeout(function(){
+
+		// console.log($(".themes"))
+		if( ($(".themes").length > 0) ) { TreeTillNode() }
+		}, 100 );
+    }
+
+
+	function doc() {
+		
+		var $tree = $('.themes');
+		var user = "{{user.is_authenticated}}";
+		var unfold = "{{unfold}}";
+
+		if(unfold == "true"){
+			unfold = true
+		}
+		else{
+			unfold = false
+		}
+
+		$tree.tree({
+			autoOpen: unfold,
+
+    		onCreateLi: function(node, $li) {
+					
+				if (node.node_type == "Topic"){
+					$li.find('.jqtree-title').before('&nbsp <span class="fi-page"></span> &nbsp;');				        	
+				}
+				else{
+					$li.find('.jqtree-title').before('&nbsp <span class="fi-folder" style="color:orange"></span> &nbsp;');				        		
+				}
+    			   
+				if (node.node_type == "Topic"){        					
+					$li.find('.jqtree-element').append(
+
+            				'&nbsp;&nbsp;<a id='+node.id+' name='+node.name+' class="topic" href="/{{groupid}}/topics/'+node.id+'/"> </a>' 
+        			);	            			
+				}
+				else{
+					if (user == "True"){
+
+    					$li.find('.jqtree-element').append(
+        					{% user_access_policy groupid request.user as user_access %}
+        					{% if user_access == "allow" %}
+
+                				'&nbsp;&nbsp;<a href="/{{groupid}}/topics/'+node.id+'/"> <i class="fi-pencil edit"></i></a> &nbsp;&nbsp; <a id='+node.id+' class="objectsCheckbox"> <input type="checkbox"> </a>' 
+                			
+                			{% endif %}
+        				);
+					}
+				}
+    		}
+		});
+		
+		// bind 'tree.click' event
+		$tree.bind(
+		    'tree.click',
+		    function(event) {
+		        // The clicked node is 'event.node'
+		        var node = event.node;
+
+		        var parent_arr = [];
+	            var parent_node = node;
+	            parent_arr.push(node.id);
+
+	            // Bellow code manipulates the parent hierarchy of clicked node in a tree
+	            while (parent_node) {
+	                if (parent_node.name !== undefined){           
+	                  $tree.tree('openNode', parent_node);
+	                  parent_node = parent_node.parent;
+	                  if (parent_node.name !== undefined){
+	                    parent_arr.push(parent_node.id);                                          
+	                  }
+	                }
+	                else{
+	                  break;
+	                }
+	            }
+	            var nav_list = parent_arr.reverse();
+		        // alert(nav_list);
+
+		        // If its topic node i.e no children of this node then show the detail view for topic
+		  		if( node.children[0] == null ){
+
+		  			if (node.node_type == "Topic"){
+		  				location.href = "/{{group_name_tag}}/topic_details/"+node.id+"?nav_li="+nav_list+"";
+		  			}
+		  		}
+		    }
+		);
+
+		$tree.bind(
+		    'tree.contextmenu',
+		    function(event) {
+		        // The clicked node is 'event.node'
+		        var node = event.node;
+		        {% user_access_policy groupid request.user as user_access %}
+        		{% if user_access == "allow" %}
+			        var msg = confirm("Do you want to delete this topic ?");
+			        if (msg == true) {
+
+			        	$.ajax({
+			            	url: "{% url 'delete_themes' groupid %}",
+			             	type: 'POST',
+			             	data:{
+			             		deleteobj: node.id,
+			             		csrfmiddlewaretoken: '{{ csrf_token }}'
+			             	},
+			             	success: function(result){
+			             		alert("Topic "+node.name+" deleted successfully");
+			             		location.reload(true);
+			             	},
+			            });
+					}
+				{% endif %} 
+		    }
+		);
+	};
+
+
+	// method to handle hover on topics
+	function showTopicStats(){
+      // Javascript function to be used for checking objects in specific time of interval
+      setTimeout(function(){
+      	//  On hover of topic node manipulate resources only once
+
+		$(".jqtree-title.jqtree_common").hover( function(){
+
+			topic_id = $(this).siblings("a").attr("id");
+			// var topic_name = $(this).siblings("a").attr("name");
+			var data_info = $(this).attr("data-info");
+			var hover_context = this;
+			if ( ! data_info && topic_id ){
+				$(".topic_stats").css("display", "none");
+
+				$.ajax({
+	            	url: "{% url 'get_topic_contents' groupid %}",
+	             	type: 'POST',
+	             	data:{
+	             		node_id: topic_id,
+	             		csrfmiddlewaretoken: '{{ csrf_token }}'
+	             	},
+	             	success: function(data){
+	             		
+	             		count = display_top_res(data)
+
+	             		if (data != "{}"){
+
+	             			$(".topic_stats").html(count);
+	             			$(hover_context).attr("data-info", data)
+
+	             			$(".topic_stats").css("display", "block");
+	             			
+	             		}
+	             		else{
+	             			$(hover_context).attr("data-info", data);	             			
+	             		}
+
+	             	},
+	             	
+	            });
+
+
+			}
+			else{ 
+				
+				if (topic_id){
+					var data = $(this).attr("data-info");
+					count = display_top_res(data)
+					$(".topic_stats").html(count);
+	     			$(".topic_stats").css("display", "block");
+				}
+
+			}
+		});
+		
+        // console.log($(".jqtree-element.jqtree_common"))
+        if( ($(".jqtree-title.jqtree_common").length <= 0) ) { 
+        	showTopicStats() 
+        }
+
+      }, 1000 );
+	}
+
+
+	function display_top_res(data){
+		data_obj = JSON.parse(data);
+ 		count = ""
+
+ 		if (data != "{}"){
+ 			var k = Object.keys(data_obj); // To get the keys from incomming data
+
+ 			for (var m = 0; m < k.length; m++) { 
+ 				var key = k[m];  
+ 				var len = data_obj[key].length;  // length of list as a value of key
+ 				// alert(key+": "+len);
+ 				count += key+": "+len+"<br/>";
+ 			} 			
+
+ 		}
+ 		else{
+ 			count += "No Resources !<br/>";
+ 		}
+
+ 		return count
+
+	}
+
+	showTopicStats();
+
+	    	$("document").on("hover", ".jqtree-title.jqtree_common", function(){
+    		setTimeout(function(){
+		      }, 1000);
+
+			alert($(this).siblings("a").attr("id"));
+		});
+
+		$("#add_theme_item").click(function() {
+			      $.ajax({
+		        type: "POST",
+		        url: "{% url 'add_theme_item' groupid %}",
+		        datatype: "html",
+		        data:{
+		          context_theme: "{{node.pk}}",
+		          name: $(".name_id").val(),
+		          csrfmiddlewaretoken: '{{ csrf_token }}'
+		        },
+		        success: function(data) {
+
+		          var item = $(".name_id").val();
+
+		          if ($.trim(data) === "failure") {
+		            alert("Theme item "+ item +" already available, Please choose different name");
+		          }
+
+		          if ($.trim(data) === "success") {
+		            location.reload(true);
+		          }
+
+		          $(".name_id").val("");
+		        }
+		      });
+
+		});
+
+		// script for fold themes_cards hierarchy
+		$(".fold").click(function() {
+			$(function() {				
+				location.href = "{% url 'theme_page' group_name_tag app_id %}";
+			});
+		});
+
+		// script for unfold themes hierarchy
+	    $(".unfold").click(function() {
+	    	$(function() {
+	    		location.href = "{% url 'theme_page' group_name_tag app_id %}?unfold=true";	
+	    	});
+	    });	
+
+	    $(".tree_browser").click(function() {
+			$(function() {				
+				location.href = "{% url 'theme_page' group_name_tag app_id %}";
+			});
+		});
+
+	    // script for delete themes
+	    $(document).on('click',".button.deleteObjects",function(){
+	    	var selectedobject = $(".objectsCheckbox input:checked")
+
+	    	if(selectedobject.length > 0)
+	    	{
+           		$('#myModal').foundation('reveal', 'open');
+
+           		var i = 0;
+             	var str = "";  
+	            $.map(selectedobject,function(each){
+	                if(i == 0)
+	                {
+	                	str = str.concat(each.parentElement.id)
+	                }
+	                else 
+	                {
+	                	str = str.concat(","+each.parentElement.id)
+	                }
+	                
+	                i= i+1
+	            })
+
+           		$.ajax({
+		            url: "{% url 'delete_themes' groupid %}",
+		            type: 'POST',
+		            data:{
+		            	context_theme: "{{node.pk}}",
+		            	deleteobjects: str,
+		            	csrfmiddlewaretoken: '{{ csrf_token }}'
+		            },
+             		success: function(result){
+
+             			$("#deletion_results").html("");
+                        for(var obj in result)
+                        {
+	                  		var li = $("<ul><li><b>"+result[obj].title+"</b></li></ul>").appendTo($("#deletion_results"));
+                        }
+
+             		},
+             	});
+
+           	}
+           	else
+           	{
+        		alert("select object to delete")
+        	}
+
+	    });
+
+		// Script for delete themes after confirm delete.
+		$(document).on('click',".button.confirmDeleteObjects",function(){
+	        var selectedobject = $(".objectsCheckbox input:checked")
+
+	        if(selectedobject.length > 0)
+	        {
+	            var i = 0;
+	            var str = "";  
+
+	            $.map(selectedobject,function(each){
+	            	if(i == 0)
+	            	{
+	            		str = str.concat(each.parentElement.id)
+	            	}
+	                else 
+	                {
+	                	str = str.concat(","+each.parentElement.id)
+	                }
+
+	                i= i+1
+	            });
+
+	            $.ajax({
+	            	url: "{% url 'delete_themes' groupid %}",
+	             	type: 'POST',
+	             	data:{
+		            	context_theme: "{{node.pk}}",
+	             		deleteobjects: str,
+	             		confirm:"yes",
+	             		csrfmiddlewaretoken: '{{ csrf_token }}'
+	             	},
+	             	success: function(result){
+	             		alert("Themes deleted successfully");
+	             		$('#myModal').foundation('reveal', 'close');
+	             		location.reload(true);
+	             	},
+	             	
+	            });
+	             
+	        }
+	        else{
+	        alert("select object to delete")
+	        }
+
+		});
+
+		// Script for selecting all objects 
+		$(document).on('click',".checkedAll",function(){
+			if($(this).is(":checked")==true)
+			{
+				$('.objectsCheckbox input').prop( "checked", true );
+			}
+			else
+			{
+				$('.objectsCheckbox input').prop( "checked", false );
+			}
+		});
+
+		// Script for cancel option for deleting themes
+		$(document).on('click',".button.cancelDeleteObjects",function(){
+             $('#myModal').foundation('reveal', 'close');
+		});
+
+
+    	$("document").on("hover", ".jqtree-title.jqtree_common", function(){
+    		setTimeout(function(){
+		      }, 1000);
+
+			alert($(this).siblings("a").attr("id"));
+		});
+
+		// Script for selecting all objects 
+		$(document).on('click',".checkedAll",function(){
+			if($(this).is(":checked")==true)
+			{
+				$('.objectsCheckbox input').prop( "checked", true );
+			}
+			else
+			{
+				$('.objectsCheckbox input').prop( "checked", false );
+			}
+		});
+
+		// Script for cancel option for deleting themes
+		$(document).on('click',".button.cancelDeleteObjects",function(){
+             $('#myModal').foundation('reveal', 'close');
+		});
+
+	    // script for delete themes
+	    $(document).on('click',".button.deleteObjects",function(){
+	    	var selectedobject = $(".objectsCheckbox input:checked")
+
+	    	if(selectedobject.length > 0)
+	    	{
+           		$('#myModal').foundation('reveal', 'open');
+
+           		var i = 0;
+             	var str = "";  
+	            $.map(selectedobject,function(each){
+	                if(i == 0)
+	                {
+	                	str = str.concat(each.parentElement.id)
+	                }
+	                else 
+	                {
+	                	str = str.concat(","+each.parentElement.id)
+	                }
+	                
+	                i= i+1
+	            })
+
+           		$.ajax({
+		            url: "{% url 'delete_themes' groupid %}",
+		            type: 'POST',
+		            data:{
+		            	context_theme: "{{node.pk}}",
+		            	deleteobjects: str,
+		            	csrfmiddlewaretoken: '{{ csrf_token }}'
+		            },
+             		success: function(result){
+
+             			$("#deletion_results").html("");
+                        for(var obj in result)
+                        {
+	                  		var li = $("<ul><li><b>"+result[obj].title+"</b></li></ul>").appendTo($("#deletion_results"));
+                        }
+
+             		},
+             	});
+
+           	}
+           	else
+           	{
+        		alert("select object to delete")
+        	}
+
+	    });
+
+
+		// Script for delete themes after confirm delete.
+		$(document).on('click',".button.confirmDeleteObjects",function(){
+	        var selectedobject = $(".objectsCheckbox input:checked")
+
+	        if(selectedobject.length > 0)
+	        {
+	            var i = 0;
+	            var str = "";  
+
+	            $.map(selectedobject,function(each){
+	            	if(i == 0)
+	            	{
+	            		str = str.concat(each.parentElement.id)
+	            	}
+	                else 
+	                {
+	                	str = str.concat(","+each.parentElement.id)
+	                }
+
+	                i= i+1
+	            });
+
+	            $.ajax({
+	            	url: "{% url 'delete_themes' groupid %}",
+	             	type: 'POST',
+	             	data:{
+		            	context_theme: "{{node.pk}}",
+	             		deleteobjects: str,
+	             		confirm:"yes",
+	             		csrfmiddlewaretoken: '{{ csrf_token }}'
+	             	},
+	             	success: function(result){
+	             		alert("Themes deleted successfully");
+	             		$('#myModal').foundation('reveal', 'close');
+	             		location.reload(true);
+	             	},
+	             	
+	            });
+	             
+	        }
+	        else{
+	        alert("select object to delete")
+	        }
+
+		});
+
+</script>
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/moderation_data_review.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/moderation_data_review.html
index 06505c0..7676a47 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/moderation_data_review.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/moderation_data_review.html
@@ -42,7 +42,7 @@ function approveResource (oid) {
 						alert("Resource is successfully approved from this group.");
 
 						// fetching resource blank seperator row
-						var $resBlankRow = $("tr#blank-row-" + "5577ed2b90b5502857a8e67d");
+						var $resBlankRow = $("tr#blank-row-" + oid);
 						// fetching resource object VIEW row
 						var $resViewRow = $("tr#view-row-" + oid);
 						// fetching resource object EDIT row
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_ajax_view.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_ajax_view.html
index 58b6e0b..9ff7fb5 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_ajax_view.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_ajax_view.html
@@ -303,7 +303,6 @@ ul#navigation li a.last {
 <div class="row page" itemscope itemtype="{{schema.1.type}}">
       
   <section class="medium-9 columns">
-
   {% if breadcrumbs_list %}
   <ul class="breadcrumbs"> 
     {% for e in breadcrumbs_list %}
@@ -316,6 +315,15 @@ ul#navigation li a.last {
       </b></li>
     {% endfor %}
   </ul>
+  {% elif node.teaches %}
+  <ul class="breadcrumbs">
+    <li>
+        {% for each_topic in node.teaches %}
+          <a href="{% url 'topic_details' group_name_tag each_topic.pk %}" style="color:black;">{{ each_topic.name }},</a>
+        {% endfor %}
+    </li>
+  </ul>
+
   {% endif %}
 
   {% if node.status == 'MODERATION' %}
@@ -559,23 +567,7 @@ ul#navigation li a.last {
               -->
             {% endcomment %}
 
-            <div class="small-4 columns">
-              {% get_teaches_list node as teaches_list %}
-              {% if teaches_list %}
-              <div class="panel">
-                <h6>Resource for: </h6>
-                {% for  each_node in teaches_list %}
-                {% get_grid_fs_object each_node as grid_fs_obj %}
-                {% if each_node.mime_type %}
-                <a href="{% url 'read_file' group_name_tag each_node.pk  grid_fs_obj.filename %}{% if nav_list %}?nav_li={{nav_list}}{% endif %}">{{ each_node.name }}</a>,&nbsp;
-                {% else %}
-                <a href="{% url 'topic_details' group_name_tag each_node.pk %}{% if nav_list %}?nav_li={{nav_list}}{% endif %}">{{ each_node.name }}</a>
-                {% if not forloop.last %},&nbsp; {% endif %}
-                {% endif %}
-                {% endfor %}
-              </div>
-              {% endif %}
-            </div>
+            <div class="small-4 columns"> </div>
 
             <div class="small-4 small-pull-4 columns">
               <!-- {#% if node.assesses %#} -->
@@ -1291,7 +1283,8 @@ ul#navigation li a.last {
           
           {% edit_policy groupid node request.user as status %}
 
-          {% if user.is_authenticated and status == "allow" and user_access == "allow" and "Group" in group_object.member_of_names_list %}
+          {% if user.is_authenticated and status == "allow" and user_access == "allow" %}
+          {% if "Group" in group_object.member_of_names_list or "Author" in group_object.member_of_names_list %}
             {% get_edit_url node.pk as edit_url %}
 
             {% check_group node as is_group %}
@@ -1460,6 +1453,7 @@ ul#navigation li a.last {
             {% endif %} 
           {% endif %}
         {% endif %}
+        {% endif %}
 
       </div>      
       {% endif %}
@@ -1661,7 +1655,7 @@ ul#navigation li a.last {
 
     {% if topic %}
     
-      location.href = "{% url 'theme_page' group_name_tag theme_id %}?selected="+clicked_node+"";
+      location.href = "{% url 'theme_page' group_name_tag theme_id %}?tree=hierarchical&selected="+clicked_node+"";
 
     {% else %}
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_edit_base.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_edit_base.html
index 64b3cdb..5a930fe 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_edit_base.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/node_edit_base.html
@@ -378,15 +378,28 @@ i.remove-tag{
 					</label>
 				</div>
 		  	{% endfor %}
-
 		  	<div class="small-6 columns">			  	
 		  		<label>
 					<h5>{% trans "Based on Url: " %} </h5> 
-					<input name="basedonurl" type="text" value="">
+					<input name="basedonurl" type="text" value="{{node.basedonurl}}">		  	
 				</label>
 			</div>
 		  	
 		</div>
+		<div class="row">
+			<div class="small-6 columns">
+				<label>
+					<h5>{% trans "License: " %} </h5> 
+					<input name="license" type="text" value="{{node.license}}">		  	
+				</label>
+			</div>
+			<div class="small-6 columns">
+				<label>
+					<h5>{% trans "Source: " %} </h5> 
+					<input name="source" type="text" value="{{node.source}}">		  	
+				</label>
+			</div>
+		</div>
 		<div id="metadata_info"></div>
 	</div>	
 	{% endcache %}
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner.html
index b12f90b..1349b1d 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner.html
@@ -7,7 +7,16 @@
 {% block title %} {{groups_category}} {% endblock %}
 
 {% block meta_content %}  
-<h2 class="subheader">{{groups_category}}</h2>
+
+  <h2 class="subheader">
+    {% if app_gst.altnames and app_gst.altnames != "None" %}
+      {{app_gst.altnames}}
+    {% else %}
+      {{app_gst.name}}
+    {% endif%}
+  </h2>
+  {{app_gst.content|default_if_none:''|safe}}
+
 {% endblock %}
 
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner_list.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner_list.html
index 4223e87..5432d1a 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner_list.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/partner_list.html
@@ -8,6 +8,19 @@
 
 {% block meta_content %}  
 <h2 class="subheader">{{groups_category}}s</h2>
+<!-- 
+  {% comment %}
+  <a href="{% url app_gst.name|lower group_name_tag %}">
+    <h2 class="subheader">
+      {% if app_gst.altnames and app_gst.altnames != "None" %}
+        {{app_gst.altnames}}
+      {% else %}
+        {{app_gst.name}}
+      {% endif%}
+    </h2>
+    {{app_gst.content|safe}}
+  </a>
+  {% endcomment %} -->
 {% endblock %}
 
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/person_details.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/person_details.html
index b1dbabe..159a259 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/person_details.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/person_details.html
@@ -23,17 +23,22 @@
   <header class="row event">
     <section class="medium-12 columns" >
       <h2>
-        <span class='node'>{{node.name}}</span>      
-        <small class="label-list"> 
+        <span class='node'>{{node.name}}
+        {% if "Student" in node.member_of_names_list %}
+          - {{node.enrollment_code}}
+        {% endif %}
+        </span>
+<!--         <small class="label-list"> 
         {% for tag in node.tags %}
         <a href="{% url 'tag_info' groupid tag %}"><span class="label">{{tag}}</span></a>
         {% endfor %}
         </small>      
+ -->
       </h2>
 
       <dl class="row tabs" data-tab data-options="deep_linking:true">
         {% for tab_details in property_order_list %}
-        <dd {% if forloop.counter == 1 %}class="active"{% endif %} title="Click here to add {{tab_details.0}} details...">
+        <dd {% if forloop.counter == 1 %}class="active"{% endif %} title="Click here to see {{tab_details.0}} details.">
           <a href="#panel_{{tab_details.0}}">{{tab_details.0}}</a>
         </dd>
         {% endfor %}
@@ -73,9 +78,33 @@
               <label>{{field.altnames}}</label>
             </div>
             <div class="small-7 end columns">
-              {% if field.type == "RelationType" %}
-                {% for details in field.value %}
-                <label>{{details.name}}</label>
+              {% if field.altnames == "Caste" or field.altnames == "District" or field.altnames == "State" or field.altnames == "College ( Graduation )" %}
+                <label>{{field.value.0.name|title}}</label>
+              {% elif field.altnames == "Languages Known" %}
+                {% for each_lang in field.value %}
+                  <label>{{each_lang|title}}</label>
+                {% endfor %}
+
+              {% elif field.altnames == "College(s)" %}
+                {% for each_colg in field.value %}
+                  <label>{{each_colg.name}} </label>
+                {% endfor %}
+
+              {% elif field.altnames == "Volunteer to teach Course in College"  %}
+                {% for course_colg in field.value %}
+                  <label>{{course_colg.0.name|title}} - {{course_colg.1.name|title}}</label>
+                {% endfor %}
+
+              {% elif field.altnames == "Voluntary Teacher: Minimum qualifications requirement"  %}
+                {% for min_qual in field.value %}
+                  {% for key,val in min_qual.items %}
+                    <label>{{key|title}} 
+                    {% for reqd_qual in val %}
+                       - {{reqd_qual}}</label>
+                    {% empty %}
+                       - Not specified</label>
+                    {% endfor %}
+                  {% endfor %}
                 {% endfor %}
               {% else %}
                 <label>{{field.value|title}}</label>
@@ -126,7 +155,8 @@
         {{ node.member_of_names_list.0 }} 
         Edited {{ node.last_update|timesince }} ago by <a class="user" href="{% url 'dashboard' node.modified_by %}">{{node.user_details_dict.modified_by}}</a>
         <br>
-        <small>
+
+<!--         <small>
           <a href="#view-changes"><i class="fi-clock"></i> Versions </a>
           {% for seq_no, version_no in node.version_dict.items|slice:"-6:" reversed %}
           <abbr title="Version #{{version_no}}">
@@ -140,6 +170,7 @@
           </abbr> 
           {% endfor %}
         </small>
+ -->
       </p>
       </div>
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/repository.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/repository.html
index 9b4b4a8..d04853c 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/repository.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/repository.html
@@ -1,5 +1,5 @@
 {% extends "ndf/base.html" %}
-
+{% load i18n %}
 {% load ndf_tags %}
 {% load cache %}
 
@@ -14,8 +14,8 @@
 	}
 
 	.app-card{
-		width: 12rem;
-		min-height: 20rem;
+		width: 17rem;
+		min-height: 17rem;
 		margin: 20px 1rem;
 		background-color: #efefef;
 		border: thin solid lightgray;
@@ -35,31 +35,24 @@
 		font-size: 7em;
 		z-index: 0;
 		opacity: 0.1;
-		padding-top: 5rem;
+		padding-top: 2rem;
 	}
 
 {% endblock %}
 
+
+{% block meta_content %}
+	<h2 class="subheader">{% trans "Repository" %}</h2>
+{% endblock %}
+
+{% block related_content%}
+	content goes here...
+{% endblock %}
+
 {% block body_content %}
 	
-	{% comment %}
-	<!--
- 	<ul class="inline-list">
-		{% for each_gapp in gapps_dict %}
-			<li>
-				<a class="app-card text-center" 
-				{% if each_gapp.values.0 %} href="{% url each_gapp.values.0 group_id %}" {% endif %} >
-					<i class="icons fi-asterisk"></i>
-					<h4><small>{{ each_gapp.keys.0 }}</small></h4>
-					<hr/>
-				</a>
-			</li>	
-		{% endfor %}
-	</ul>
-	-->
-	{% endcomment %}
-	
-	<ul class="inline-list card-holder">
+	<!-- <ul class="inline-list card-holder"> -->
+	<ul class="small-block-grid-1 medium-block-grid-2 large-block-grid-3">
 		{% for each_gapp in gapps_obj_list %}
 			<li>
 				<a class="app-card text-center" href="{% url each_gapp.name|lower group_id %}">
@@ -73,12 +66,12 @@
 	</ul>
 
 	<script type="text/javascript">
-        // removing left panel:
-        $("main.row > aside.columns").detach();
+        // // removing left panel:
+        // $("main.row > aside.columns").detach();
 
-        // making body_content block to take 12-large columns
-        $article = $("main.row > article.columns");
-        $article.removeClass("medium-10").addClass("large-12");
+        // // making body_content block to take 12-large columns
+        // $article = $("main.row > article.columns");
+        // $article.removeClass("medium-10").addClass("large-12");
 	</script>	
 
 {% endblock %}
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_create_edit.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_create_edit.html
index d67c66d..216f045 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_create_edit.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_create_edit.html
@@ -210,6 +210,23 @@
           </div>
         </div>  
 
+
+        <!-- For Aadhar id -->
+        <div class="row">
+          <div class="small-6 columns">
+            <div class="row">
+              <div class="small-3 columns">
+                <label for="{{property_order_list.0.1.13.name}}" class="right inline"> {{property_order_list.0.1.13.altnames}} </label>
+              </div>
+              <div class="small-9 columns">
+                {% html_widget groupid node.pk property_order_list.0.1.13 %}
+              </div>
+            </div>
+          </div>
+        </div>  
+
+
+
         <br>
         <!-- Navigation buttons for tab -->
         <div class="row tab-nav">
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_list.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_list.html
index 68a516b..2c7accb 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_list.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/student_list.html
@@ -586,7 +586,7 @@
                     s_id = data["stud_id"];
                     $(row).attr("id", s_id);
 
-                    edit_url = "{% url 'mis:mis_app_instance_edit' 'groupid' 'app_id' 'app_set_id' 'stud_id' %}".replace("groupid", groupid_val).replace("app_id", app_id_val).replace("app_set_id", app_set_id_val).replace("stud_id", s_id);
+                    edit_url = "{% url 'mis:mis_app_instance_detail' 'groupid' 'app_id' 'app_set_id' 'stud_id' %}".replace("groupid", groupid_val).replace("app_id", app_id_val).replace("app_set_id", app_set_id_val).replace("stud_id", s_id);
                     name = data['Name']
                     
                     $(row).find("td:nth-child(3)").html("<a href='" + edit_url + "'>"+name+"</a>");
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme.html
index 280f231..33ac64b 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme.html
@@ -7,361 +7,80 @@
 
 {% get_group_name groupid as group_name_tag %}
 
-
 {% block title %} {{ title }} {% endblock %}
 
 {% block head %}  
 
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-
-  <!-- Scripts required for D3 graph -->
-  <script type="text/javascript" src="/static/ndf/bower_components/d3/d3.min.js"></script> <!-- checked -->
-  <script type="text/javascript" src="/static/ndf/bower_components/underscore/underscore.js"></script> <!-- checked -->
-  <script sync="text/javascript" src="/static/ndf/bower_components/FileSaver/FileSaver.js" ></script> <!-- checked -->
-
-  <link href="/static/ndf/bower_components/jqtree/jqtree.css" rel="stylesheet"> 
-  <script src="/static/ndf/bower_components/jqtree/tree.jquery.js"></script> <!-- checked -->
-  
-  <script type="text/javascript">
-
-  	$(document).ready(function() {
-
-
-      // Funtion for loading tree for showing collection list left side panel
-      doc();
-
-      // Function for manipulating tree when user visits to page directly via browser url
-      {% if selected %}
-      	TreeTillNode();
-      {% endif %}
-
-
-    });
-
-
-  	function TreeTillNode () {
-      // This gives the last hierarchy node id from browser url.
-      var url = "{{selected}}";
-
-	  var tree_build = $(".themes").not(".jqtree-loading");
-  	  var node = tree_build.tree('getNodeById', url);
-  	  tree_build.tree('openNode', node);
-      
-      // Javascript function to be used for checking objects in specific time of interval
-      setTimeout(function(){
-        // console.log($(".themes"))
-        if( ($(".themes").length > 0) ) { TreeTillNode() }
-      }, 100 );
-    
-    }
-
-
-	function doc() {
-		
-		var $tree = $('.themes');
-		var user = "{{user.is_authenticated}}";
-		var unfold = "{{unfold}}";
-
-		if(unfold == "true"){
-			unfold = true
-		}
-		else{
-			unfold = false
-		}
-
-		$tree.tree({
-			autoOpen: unfold,
+	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
-    		onCreateLi: function(node, $li) {
-					
-				if (node.node_type == "Topic"){
-					$li.find('.jqtree-title').before('&nbsp <span class="fi-page"></span> &nbsp;');				        	
-				}
-				else{
-					$li.find('.jqtree-title').before('&nbsp <span class="fi-folder" style="color:orange"></span> &nbsp;');				        		
-				}
-
-    			   
-				if (node.node_type == "Topic"){        					
-
-					$li.find('.jqtree-element').append(
-
-            				'&nbsp;&nbsp;<a id='+node.id+' name='+node.name+' class="topic" href="/{{groupid}}/topics/'+node.id+'/"> </a>' 
-
-        			);	            			
-
-				}
-				else{
-					if (user == "True"){
-
-    					$li.find('.jqtree-element').append(
-        					{% user_access_policy groupid request.user as user_access %}
-        					{% if user_access == "allow" %}
-
-                				'&nbsp;&nbsp;<a href="/{{groupid}}/topics/'+node.id+'/"> <i class="fi-pencil edit"></i></a> &nbsp;&nbsp; <a id='+node.id+' class="objectsCheckbox"> <input type="checkbox"> </a>' 
-                			
-                			{% endif %}
-        				);
-					}
-
-				}
-    					
-
-    		}
-
-		});
-		
-		// bind 'tree.click' event
-		$tree.bind(
-		    'tree.click',
-		    function(event) {
-		        // The clicked node is 'event.node'
-		        var node = event.node;
-
-		        var parent_arr = [];
-	            var parent_node = node;
-	            parent_arr.push(node.id);
-
-	            // Bellow code manipulates the parent hierarchy of clicked node in a tree
-	            while (parent_node) {
-	                if (parent_node.name !== undefined){           
-	                  $tree.tree('openNode', parent_node);
-	                  parent_node = parent_node.parent;
-	                  if (parent_node.name !== undefined){
-	                    parent_arr.push(parent_node.id);                                          
-	                  }
-	                }
-	                else{
-	                  break;
-	                }
-	            }
-	            var nav_list = parent_arr.reverse();
-		        // alert(nav_list);
-
-		        // If its topic node i.e no children of this node then show the detail view for topic
-		  		if( node.children[0] == null ){
-
-		  			if (node.node_type == "Topic"){
-		  				location.href = "/{{group_name_tag}}/topic_details/"+node.id+"?nav_li="+nav_list+"";
-
-		  			}
-			        
-		  		}
-		  		
-		    }
-		);
-
-		$tree.bind(
-		    'tree.contextmenu',
-		    function(event) {
-		        // The clicked node is 'event.node'
-		        var node = event.node;
-		        {% user_access_policy groupid request.user as user_access %}
-        		{% if user_access == "allow" %}
-			        var msg = confirm("Do you want to delete this topic ?");
-			        if (msg == true) {
-
-			        	$.ajax({
-			            	url: "{% url 'delete_themes' groupid %}",
-			             	type: 'POST',
-			             	data:{
-			             		deleteobj: node.id,
-			             		csrfmiddlewaretoken: '{{ csrf_token }}'
-			             	},
-			             	success: function(result){
-			             		alert("Topic "+node.name+" deleted successfully");
-			             		location.reload(true);
-			             	},
-			             	
-			            });
-
-					}
-				{% endif %} 
-
-		    }
-		);
-                 
-
-	};
-
-
-	// method to handle hover on topics
-	function showTopicStats(){
-      // Javascript function to be used for checking objects in specific time of interval
-      setTimeout(function(){
-      	//  On hover of topic node manipulate resources only once
-
-		$(".jqtree-title.jqtree_common").hover( function(){
-
-			topic_id = $(this).siblings("a").attr("id");
-			// var topic_name = $(this).siblings("a").attr("name");
-			var data_info = $(this).attr("data-info");
-			var hover_context = this;
-			if ( ! data_info && topic_id ){
-				$(".topic_stats").css("display", "none");
-
-				$.ajax({
-	            	url: "{% url 'get_topic_contents' groupid %}",
-	             	type: 'POST',
-	             	data:{
-	             		node_id: topic_id,
-	             		csrfmiddlewaretoken: '{{ csrf_token }}'
-	             	},
-	             	success: function(data){
-	             		
-	             		count = display_top_res(data)
-
-	             		if (data != "{}"){
-
-	             			$(".topic_stats").html(count);
-	             			$(hover_context).attr("data-info", data)
-
-	             			$(".topic_stats").css("display", "block");
-	             			
-	             		}
-	             		else{
-	             			$(hover_context).attr("data-info", data);	             			
-	             		}
-
-	             	},
-	             	
-	            });
-
-
-			}
-			else{ 
-				
-				if (topic_id){
-					var data = $(this).attr("data-info");
-					count = display_top_res(data)
-					$(".topic_stats").html(count);
-	     			$(".topic_stats").css("display", "block");
-				}
-
-			}
-
-
-		});
-		
-        // console.log($(".jqtree-element.jqtree_common"))
-        if( ($(".jqtree-title.jqtree_common").length <= 0) ) { 
-        	showTopicStats() 
-        }
+	<!-- Scripts required for D3 graph -->
+	<script type="text/javascript" src="/static/ndf/bower_components/d3/d3.min.js"></script>
+	<script type="text/javascript" src="/static/ndf/bower_components/underscore/underscore.js"></script>
+	<script sync="text/javascript" src="/static/ndf/bower_components/FileSaver/FileSaver.js" ></script>
 
-      }, 1000 );
-	}
-
-
-	function display_top_res(data){
-		data_obj = JSON.parse(data);
- 		count = ""
-
- 		if (data != "{}"){
- 			var k = Object.keys(data_obj); // To get the keys from incomming data
-
- 			for (var m = 0; m < k.length; m++) { 
- 				var key = k[m];  
- 				var len = data_obj[key].length;  // length of list as a value of key
- 				// alert(key+": "+len);
- 				count += key+": "+len+"<br/>";
- 			} 			
-
- 		}
- 		else{
- 			count += "No Resources !<br/>";
- 		}
-
- 		return count
-
-	}
-
-	showTopicStats();
-
-  </script>
+	<link href="/static/ndf/bower_components/jqtree/jqtree.css" rel="stylesheet"> 
+	<script src="/static/ndf/bower_components/jqtree/tree.jquery.js"></script>
 
   <style>
 
-  	#app-set-item li { padding:0.5em }
-
-	.jqtree-closed > .jqtree-element i.icon-folder-open:before {
-        content: "\f07b";
-    }
-    .jqtree-tree i {
-        margin-right: 4px;
-    }
-    /* for reingold tilford tree */
-/*
-	.node {
-	  cursor: pointer;
-	}
-
-	.node circle {
-	  fill: #fff;
-	  stroke: green;
-	  stroke-width: 1.5px;
-	}
-
-	.node text {
-	  font: 12px sans-serif;
-	}
-
-	.link {
-	  fill: none;
-	  stroke: #ccc;
-	  stroke-width: 1.5px;
-	}
-	*/
-	/* for reingold tilford tree -- end */
-
-	.node {
-    cursor: pointer;
+  #theme-drag-zoom-tree-container{
+  	border: medium dashed #D8BFD8;
+  	border-radius: 5px;
   }
 
-  .node circle {
-    fill: #fff;
-    stroke: steelblue;
-    stroke-width: 1.5px;
-  }
-   
-  .node text {
-    font-size:10px; 
-    font-family:sans-serif;
+  .download-graph{
+  	color: gray
   }
-   
-  .link {
-    fill: none;
-    stroke: #ccc;
-    stroke-width: 1.5px;
+
+  .download-graph:hover {
+  	color: black;
+  	background-color: #e5e5e5;
+  	font-size: large;
+  	cursor: pointer;
+  	padding: 0.5em;
+  	transition: all 1s;
   }
 
-/*  .templink {
-    fill: none;
-    stroke: red;
-    stroke-width: 3px;
+  .themes {
+  	margin: 2rem 5rem;
   }
-*/
-  .ghostCircle.show{
-      display:block;
+
+  .highlight {
+  	background-color: #efefef;
+	padding: 0 1em;
+	border: solid #e5e5e5;
   }
 
-  .ghostCircle, .activeDrag .ghostCircle{
-       display: none;
+  #hover1.f-dropdown {
+  	width: 10em;
   }
 
   </style>
 {% endblock%}
 
-
-{% block shelf_content %}
-  {% if user.is_authenticated %}
-    {% include "ndf/shelf.html" %}
-  {% else %}
-  <h4>Please Login to create your shelf</h4>
-  {% endif %}  
-{% endblock %}
+<!-- 
+{% comment %}
+	{% block shelf_content %}
+	  {% if user.is_authenticated %}
+	    {% include "ndf/shelf.html" %}
+	  {% else %}
+	  <h4>Please Login to create your shelf</h4>
+	  {% endif %}  
+	{% endblock %}
+{% endcomment %}
+ -->
 
 {% block meta_content %}
-	<a  class="Tp" href="{% url 'topics' group_name_tag %}" title="Click to go to themes card view"><h2 class="subheader">{% trans "Themes" %}</h2></a>
+	<a  class="Tp" href="{% url 'topics' group_name_tag %}" title="Click to go to themes card view">
+		<h3 class="subheader">
+			{% if theme_GST.altnames and theme_GST.altnames != "None" %}
+				{{theme_GST.altnames}}
+			{% else %}
+				{{theme_GST.name}}
+			{% endif%}
+		</h3>
+	</a>
+	{{theme_GST.content|default_if_none:""|safe}}
 {% endblock %}
 
 {% block related_content %}
@@ -371,88 +90,60 @@
 	<div class="panel" style="background-color:#ddd;">
 	<ul class="no-bullet" id="app-set-item"> 
 
-	    {% get_memberof_objects_count theme_GST_id groupid as count %}
-	  
+	    {% get_memberof_objects_count theme_GST.pk groupid as count %}
+
 	      <li class="selected-app-set-item"> 
 	        <div>
 	  		  {% if user_access == "allow" %}
-	          <a href="{% url "theme_topic_create" groupid theme_GST_id %}" style="float:right;color:#0b8a91;" title="Add Theme">
+	          <a href="{% url "theme_topic_create" groupid theme_GST.pk %}" style="float:right;color:#0b8a91;" title="Add Theme">
 	            +&nbsp;Add
 	          </a>
 	          {% endif %}
 
-	          <a href="{% url "theme_list" groupid app_id theme_GST_id %}" style="color:#0b8a91;">
+	          <a href="{% url "theme_list" groupid app_id theme_GST.pk %}" style="color:#0b8a91;">
 	            Theme ({{count}})
 	          </a> 
 
 	        </div>
 	      </li>
 	  
-	</ul>
+		</ul>
 	</div>
 
 	{% endif %}
+	<br/>
+	<div>
+	{% if user_access == "allow" %}
 
-	<div class="topic_stats panel" style="display:none; position:fixed; background-color:#ddd;border: 1px solid #1a1a1a;"> </div>
-{% endblock %}
+		<a class="button tiny expand" data-reveal-id="view_add_page" title="Add Theme Item">
+			+ Add Theme Item
+		</a>
 
+		<div id="view_add_page" class="reveal-modal" data-reveal style="height:300px;"> 
 
-{% block body_content %}
-{% user_access_policy groupid request.user as user_access %}
-	
-	<!-- This overlay is for displaying topic details from collapsible tree -->
-	<!-- <div id="collaps_topic_details" class="reveal-modal" style="height:500px;overflow:hidden;width:80%" data-reveal>  
-	  	<h3>Topic details comming soon !!!</h3>
-    	<a class="close-reveal-modal" >&#215;</a> 
-	</div> -->
-	<!-- End of overlay -->
-
-	{% if themes_hierarchy %}
-
-		<h2> {{node.name}}</h2> 
-		<div class="row">
-		<div class="large-4 columns">
-
-			{% if user_access == "allow" %}
-
-	          <a class="button tiny" data-reveal-id="view_add_page" title="Add Theme Item">
-	            +&nbsp;Add Theme Item
-	          </a>
-
-	          <div id="view_add_page" class="reveal-modal" data-reveal style="height:300px;"> 
-
-	              <h3>Add New Theme Item:</h3>
-	              <!-- To enter name of theme item -->
-	              <div>
-	                <input class="name_id" name="name" type="text" placeholder="Enter name...">
-	              </div>   <br/>           
+			<h3>Add New Theme Item:</h3>
+			<!-- To enter name of theme item -->
+			<div>
+				<input class="name_id" name="name" type="text" placeholder="Enter name...">
+			</div>
+			<br/>           
 
-	              <input type="submit" id="add_theme_item" value="Save Theme Item" class="medium round button"/>
+			<input type="submit" id="add_theme_item" value="Save Theme Item" class="medium round button"/>
 
-	              <a class="close-reveal-modal">&#215;</a>
+			<a class="close-reveal-modal">&#215;</a>
 
-	          </div>          
-	        {% endif %}
-	    </div>
+		</div>          
 
-        <div class="large-4 columns">
-
-			<a data-dropdown="hover1" data-options="is_hover:true; hover_timeout:5000" class="tree_browser" style="border: 2px solid #0eacb5; padding: 5px;"><b> {% trans "Tree Browser" %} </b></a> &nbsp;&nbsp;&nbsp;
-			<ul id="hover1" class="f-dropdown" data-dropdown-content>
-				<li><a class="fold"><i class="fi-plus"></i> {% trans "Fold" %} </a></li> 
-				<li><a class="unfold"><i class="fi-minus"></i> {% trans "Unfold" %} </a></li>  
-			</ul> 
-			
-			<a class="collapsible_tree" style="border: 2px solid #0eacb5; padding: 5px;"><b> {% trans "Collapsible Tree" %} </b></a>
-
-		</div>
-
-		<div class="large-4 columns">
+	{% endif %}
+				
+    </div>
+    <!-- <br/> -->
+    <div>
 		{% if user.is_authenticated %}
     		{% if user_access == "allow" %}
     		
+    			<span><input class="checkedAll" type="checkbox"> Select All</span>
     			<input class="button tiny deleteObjects right" type="button" value="Delete">
-    			<span class="right"><input class="checkedAll" type="checkbox"> Select All &nbsp;&nbsp;</span>
 
     			<div id="myModal" class="reveal-modal" data-reveal style="height:500px;overflow:scroll;"> 
         
@@ -467,21 +158,58 @@
 
     		{% endif %}
 		{% endif %}
-		</div>
-		</div>
-		<hr/>
+	</div>
+
+	<div class="topic_stats panel" style="display:none; position:fixed; background-color:#ddd;border: 1px solid #1a1a1a;"> </div>
 
-		{% if node %}
-			{% cache 300 theme_tree node.pk request.LANGUAGE_CODE %}
-			<!-- If "Theme" node -->
-			<div id="app-set-item" class="themes" data-url="{% url 'get_tree_hierarchy' groupid node.pk %}"></div>
+{% endblock %}
 
-			<!-- testing -->
-			{% include 'ndf/theme_drag_zoom_d3tree.html' %}
-			{% endcache %}
+
+{% block body_content %}
+
+	{% user_access_policy groupid request.user as user_access %}
+
+	{% if themes_hierarchy and node %}
+
+		<div style="float:left; font-size: 2em; line-height: 0.8;"> {{node.name}}</div> 
+
+        <div style="float:right;  margin:0 2em;">
+
+			<a class="collapsible_tree {% if tree == 'collapsible' or not tree %} highlight {% endif %}" style="">
+				{% trans "Collapsible Tree" %}
+			</a>
 			
-		{% endif %}
+			<a data-dropdown="hover1" data-options="is_hover:true; hover_timeout:5000" class="tree_browser {% if tree == 'hierarchical' %} highlight {% endif %}" style="margin-left:2em;">
+				{% trans "Tree Browser" %}
+			</a>
+			
+			<ul id="hover1" class="f-dropdown" data-dropdown-content style="width: 7em;">
+				<li><a class="fold"><i class="fi-plus"></i> {% trans "Fold" %} </a></li> 
+				<li><a class="unfold"><i class="fi-minus"></i> {% trans "Unfold" %} </a></li>  
+			</ul> 
+
+		</div>
+
+		<br/>
+		<br/>
 
+		{% cache 300 theme_tree node.pk request.LANGUAGE_CODE tree unfold %}
+
+			{% include "ndf/hierarchy_tree.html" %}
+			<div id="app-set-item" class="themes hide" data-url="{% url 'get_tree_hierarchy' groupid node.pk %}">
+			</div>
+
+			<div id="theme-drag-zoom-tree-container" class="hide">
+		    	<div id="theme-drag-zoom-tree"></div>
+		    	<div class="row">
+			    	<div class="small-6 small-centered text-center columns download-graph" onclick='downloadCollapsibleGraph("{{node.name}}");'>
+			    		Download "{{node.name}}" Collapsible Graph
+			    	</div>
+		    	</div>
+			</div>
+			{% include 'ndf/theme_drag_zoom_d3tree.html' %}
+		{% endcache %}
+		
 	{% endif %}
 
 	<!-- For displaying themes items -->
@@ -654,358 +382,316 @@
 	<script type="text/javascript">
 
 // ------ jqtree tree ------
-    	$("document").on("hover", ".jqtree-title.jqtree_common", function(){
-    		setTimeout(function(){
-		      }, 1000);
+		// script for fold themes_cards hierarchy
 
-			alert($(this).siblings("a").attr("id"));
-		});
+	// being the common template for all, to distinguish between the tree landing using following condition:
+    {% if node and tree %}
+
+	    {% if tree == "hierarchical" %}
+	    	if({{unfold}})
+	    	{
+	    		$("article").block({message: '<h4>Building a graph... <br/>Please hold on...</h4>'});
+				$("#theme-drag-zoom-tree-container").addClass("hide")
+		    	$(".themes").removeClass("hide");
+		    	plotHierarchyTree(true);
+	    	}
+	    	else
+	    	{
+	    		$("article").block({message: '<h4>Building a graph... <br/>Please hold on...</h4>'});
+	    		$("#theme-drag-zoom-tree-container").addClass("hide")
+		    	$(".themes").removeClass("hide");
+		    	plotHierarchyTree(false);
+	    	}
+
+	    {% else %}
+	        
+			$(".themes").addClass("hide");
+
+    		{% if node %}
+
+    		$("article").block({message: '<h4>Building a graph... <br/>Please hold on...</h4>'});
+			    $.getJSON("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(data){ treeData = data;})
+			    .done(function(){plotDragZoomTree(treeData);
+			    });
+
+		    {% endif %}
+
+			$("#theme-drag-zoom-tree-container").removeClass("hide");
+
+		{% endif %}
+
+    {% endif %}
 
-		$("#add_theme_item").click(function() {
-			      $.ajax({
-		        type: "POST",
-		        url: "{% url 'add_theme_item' groupid %}",
-		        datatype: "html",
-		        data:{
-		          context_theme: "{{node.pk}}",
-		          name: $(".name_id").val(),
-		          csrfmiddlewaretoken: '{{ csrf_token }}'
-		        },
-		        success: function(data) {
-
-		          var item = $(".name_id").val();
-
-		          if ($.trim(data) === "failure") {
-		            alert("Theme item "+ item +" already available, Please choose different name");
-		          }
-
-		          if ($.trim(data) === "success") {
-		            location.reload(true);
-		          }
-
-		          $(".name_id").val("");
-		        }
-		      });
 
-		});
 
-		// script for fold themes_cards hierarchy
 		$(".fold").click(function() {
-			$(function() {				
-				location.href = "{% url 'theme_page' group_name_tag app_id %}";
-			});
+
+			// $("#theme-drag-zoom-tree-container").addClass("hide")
+	  //   	$(".themes").removeClass("hide");
+	    	// plotHierarchyTree(false);
+			// $(function() {				
+				location.href = "{% url 'theme_page' group_name_tag app_id %}?tree=hierarchical";
+			// });
 		});
 
 		// script for unfold themes hierarchy
 	    $(".unfold").click(function() {
-	    	$(function() {
-	    		location.href = "{% url 'theme_page' group_name_tag app_id %}?unfold=true";	
-	    	});
+
+			// $("#theme-drag-zoom-tree-container").addClass("hide")
+	  //   	$(".themes").removeClass("hide");
+	  //   	plotHierarchyTree(true);
+	    	// $(function() {
+	    		location.href = "{% url 'theme_page' group_name_tag app_id %}?tree=hierarchical&unfold=true";	
+	    	// });
 	    });	
 
 	    $(".tree_browser").click(function() {
-			$(function() {				
-				location.href = "{% url 'theme_page' group_name_tag app_id %}";
-			});
+
+			// $("#theme-drag-zoom-tree-container").addClass("hide")
+	  //   	$(".themes").removeClass("hide");
+	  //   	plotHierarchyTree()
+			// $(function() {				
+				location.href = "{% url 'theme_page' group_name_tag app_id %}?tree=hierarchical";
+			// });
 		});
 
-	    // script for delete themes
-	    $(document).on('click',".button.deleteObjects",function(){
-	    	var selectedobject = $(".objectsCheckbox input:checked")
 
-	    	if(selectedobject.length > 0)
-	    	{
-           		$('#myModal').foundation('reveal', 'open');
-
-           		var i = 0;
-             	var str = "";  
-	            $.map(selectedobject,function(each){
-	                if(i == 0)
-	                {
-	                	str = str.concat(each.parentElement.id)
-	                }
-	                else 
-	                {
-	                	str = str.concat(","+each.parentElement.id)
-	                }
-	                
-	                i= i+1
-	            })
-
-           		$.ajax({
-		            url: "{% url 'delete_themes' groupid %}",
-		            type: 'POST',
-		            data:{
-		            	context_theme: "{{node.pk}}",
-		            	deleteobjects: str,
-		            	csrfmiddlewaretoken: '{{ csrf_token }}'
-		            },
-             		success: function(result){
-
-             			$("#deletion_results").html("");
-                        for(var obj in result)
-                        {
-	                  		var li = $("<ul><li><b>"+result[obj].title+"</b></li></ul>").appendTo($("#deletion_results"));
-                        }
-
-             		},
-             	});
-
-           	}
-           	else
-           	{
-        		alert("select object to delete")
-        	}
-
-	    });
-
-		// Script for delete themes after confirm delete.
-		$(document).on('click',".button.confirmDeleteObjects",function(){
-	        var selectedobject = $(".objectsCheckbox input:checked")
-
-	        if(selectedobject.length > 0)
-	        {
-	            var i = 0;
-	            var str = "";  
-
-	            $.map(selectedobject,function(each){
-	            	if(i == 0)
-	            	{
-	            		str = str.concat(each.parentElement.id)
-	            	}
-	                else 
-	                {
-	                	str = str.concat(","+each.parentElement.id)
-	                }
-
-	                i= i+1
-	            });
-
-	            $.ajax({
-	            	url: "{% url 'delete_themes' groupid %}",
-	             	type: 'POST',
-	             	data:{
-		            	context_theme: "{{node.pk}}",
-	             		deleteobjects: str,
-	             		confirm:"yes",
-	             		csrfmiddlewaretoken: '{{ csrf_token }}'
-	             	},
-	             	success: function(result){
-	             		alert("Themes deleted successfully");
-	             		$('#myModal').foundation('reveal', 'close');
-	             		location.reload(true);
-	             	},
-	             	
-	            });
-	             
-	        }
-	        else{
-	        alert("select object to delete")
-	        }
+	    $(".collapsible_tree").click(function() {
+			location.href = "{% url 'theme_page' group_name_tag app_id %}?tree=collapsible";
 
-		});
+			// $(".themes").addClass("hide");
 
-		// Script for selecting all objects 
-		$(document).on('click',".checkedAll",function(){
-			if($(this).is(":checked")==true)
-			{
-				$('.objectsCheckbox input').prop( "checked", true );
-			}
-			else
-			{
-				$('.objectsCheckbox input').prop( "checked", false );
-			}
+   //  		{% if node %}
+
+			//     $.getJSON("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(data){ treeData = data;})
+			//     .done(function(){plotDragZoomTree(treeData)});
+
+		 //    {% endif %}
+
+			// $("#theme-drag-zoom-tree-container").removeClass("hide")
 		});
 
-		// Script for cancel option for deleting themes
-		$(document).on('click',".button.cancelDeleteObjects",function(){
-             $('#myModal').foundation('reveal', 'close');
+		// 	$("#theme-drag-zoom-container").removeClass("hide");
+
+		// 	// calling function plotDragZoomTree defined in theme_drag_zoom_d3tree.html 
+		// 	}	
+
+
+		$("#add_theme_item").click(function() {
+		    $.ajax({
+	        type: "POST",
+	        url: "{% url 'add_theme_item' groupid %}",
+	        datatype: "html",
+	        data:{
+	          context_theme: "{{node.pk}}",
+	          name: $(".name_id").val(),
+	          csrfmiddlewaretoken: '{{ csrf_token }}'
+	        },
+	        success: function(data) {
+
+	          var item = $(".name_id").val();
+
+	          if ($.trim(data) === "failure") {
+	            alert("Theme item "+ item +" already available, Please choose different name");
+	          }
+
+	          if ($.trim(data) === "success") {
+	            location.reload(true);
+	          }
+
+	          $(".name_id").val("");
+	        }
+	      });
+
 		});
+
 // ------END of jqtree tree ------
 
 // --- start of D3 collapsible tree ---
 
-	    treeData = ""
+	 //    treeData = ""
 
-	    $(".collapsible_tree").click(function() {
+	 //    $(".collapsible_tree").click(function() {
 
-	    	if(treeData.length != 0)
-	    	{
-				plotCollapsibleTree(treeData)	    			
-	    	}
-	    	else{
-	    		{% if node %}
-			    $.getJSON("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(data){ treeData = data;})
-			    .done(function(){plotCollapsibleTree(treeData)});
-			    {% endif %}
-	    	}
-		});
+	 //    	if(treeData.length != 0)
+	 //    	{
+		// 		plotCollapsibleTree(treeData)	    			
+	 //    	}
+	 //    	else{
+	 //    		{% if node %}
+
+		// 		    $.getJSON("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(data){ treeData = data;})
+		// 		    .done(function(){plotCollapsibleTree(treeData)});
+
+		// 	    {% endif %}
+	 //    	}
+		// });
 		
-		function plotCollapsibleTree (treeData) {
-			$(".themes").html("");
+		// function plotCollapsibleTree (treeData) {
+		// 	$(".themes").html("");
 
-			var margin = {top: 20, right: 40, bottom: 20, left: 40},
-			    width = Math.max($(".themes").width(), 960) - margin.right - margin.left,
-			    height = Math.max($(".themes").height(), 800) - margin.top - margin.bottom;
+		// 	var margin = {top: 20, right: 40, bottom: 20, left: 40},
+		// 	    width = Math.max($(".themes").width(), 960) - margin.right - margin.left,
+		// 	    height = Math.max($(".themes").height(), 800) - margin.top - margin.bottom;
 			    
-			var i = 0,
-			    duration = 750,
-			    root;
-
-			var tree = d3.layout.tree()
-			    .size([height, width]);
-
-			var diagonal = d3.svg.diagonal()
-			    .projection(function(d) { return [d.y, d.x]; });
-
-			var svg = d3.select(".themes").append("svg")
-			    .attr("width", width + margin.right + margin.left)
-			    .attr("height", height + margin.top + margin.bottom)
-			  	.append("g")
-			    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
-
-			{% if node %}
-				// d3.json("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(error, flare) {
-				  root = treeData;
-				  root.x0 = height / 2; // the point from where it starts it's animation.
-				  root.y0 = 0;
-
-				  function collapse(d) {
-				    if (d.children) {
-				      d._children = d.children;
-				      d._children.forEach(collapse);
-				      d.children = null;
-				    }
-				  }
-
-				  root.children.forEach(collapse);
-				  update(root);
-				// });
-			{% endif %}
-
-			// d3.select(self.frameElement).style("height", "800px");
-
-			function update(source) {
-
-			  // Compute the new tree layout.
-			  var nodes = tree.nodes(root).reverse(),
-			      links = tree.links(nodes);
-
-			  // Normalize for fixed-depth.
-			  nodes.forEach(function(d) { d.y = d.depth * 150;});
-
-			  // Update the nodes
-			  var node = svg.selectAll("g.node")
-			      .data(nodes, function(d) { return d.id || (d.id = ++i); });
-
-			  // Enter any new nodes at the parent's previous position.
-			  var nodeEnter = node.enter().append("g")
-			      .attr("class", "node")
-			      .attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
-			      .attr("title", function(d) { return d.name; })
-			      .on("click", click);
-
-			  nodeEnter.append("circle")
-			      .attr("r", 1e-6)
-			      .style("fill", function(d) { return d._children ? "#10c1cb" : "#fff"; });
-
-			  nodeEnter.append("text")
-			      .attr("x", function(d) { return d.children || d._children ? -10 : 10; })
-			      .attr("dy", "0.35em")
-			      .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
-			      .text(function(d) { return d.name; })
-			      .style("fill-opacity", 1e-6);
-
-			  // Transition nodes to their new position.
-			  var nodeUpdate = node.transition()
-			      .duration(duration)
-			      .attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });
-
-			  nodeUpdate.select("circle")
-			      .attr("r", 6.5)
-			      .style("fill", function(d) { return d._children ? "#10c1cb" : "#fff"; });
-
-			  nodeUpdate.select("text")
-			      .style("fill-opacity", 1);
-
-			  // Transition exiting nodes to the parent's new position.
-			  var nodeExit = node.exit().transition()
-			      .duration(duration)
-			      .attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })
-			      .remove();
-
-			  nodeExit.select("circle")
-			      .attr("r", 1e-6);
-
-			  nodeExit.select("text")
-			      .style("fill-opacity", 1e-6);
-
-			  // Update the links
-			  var link = svg.selectAll("path.link")
-			      .data(links, function(d) { return d.target.id; });
-
-			  // Enter any new links at the parent's previous position.
-			  link.enter().insert("path", "g")
-			      .attr("class", "link")
-			      .attr("d", function(d) {
-			        var o = {x: source.x0, y: source.y0};
-			        return diagonal({source: o, target: o});
-			      });
-
-			  // Transition links to their new position.
-			  link.transition()
-			      .duration(duration)
-			      .attr("d", diagonal);
-
-			  // Transition exiting nodes to the parent's new position.
-			  link.exit().transition()
-			      .duration(duration)
-			      .attr("d", function(d) {
-			        var o = {x: source.x, y: source.y};
-			        return diagonal({source: o, target: o});
-			      })
-			      .remove();
-
-			  // Stash the old positions for transition.
-			  nodes.forEach(function(d) {
-			    d.x0 = d.x;
-			    d.y0 = d.y;
-			  });
-			}
-
-			// Toggle children on click.
-			function click(d) {
-			  if (d.children) {
-			    d._children = d.children;
-			    d.children = null;
-			        // console.log("non-leaf 1");
-			  } 
-			  else {
-			    if(d._children){
-			        d.children = d._children;
-			        d._children = null;
-			        // console.log("non-leaf 2");
-				}
-				else if (d.node_type == "Topic"){
-			        // console.log("Leaf!");
-			        var a = document.createElement('a');
-					a.setAttribute('href', "/{{group_name_tag}}/topic_details/"+d.id+"");
-					// a.setAttribute('target', '_blank');
-					document.body.appendChild(a);
-					a.click();
-					a.remove();
-			        // location.href = "/{{group_name_tag}}/topic_details/"+d.id+"";
-					// $('#collaps_topic_details').foundation('reveal', 'open');     
-			    }
-			  }
-			  update(d);
-			}
-
-			$("#theme-drag-zoom-container").removeClass("hide");
-
-			// calling function plotDragZoomTree defined in theme_drag_zoom_d3tree.html 
-			plotDragZoomTree(treeData);
-			}	
+		// 	var i = 0,
+		// 	    duration = 750,
+		// 	    root;
+
+		// 	var tree = d3.layout.tree()
+		// 	    .size([height, width]);
+
+		// 	var diagonal = d3.svg.diagonal()
+		// 	    .projection(function(d) { return [d.y, d.x]; });
+
+		// 	var svg = d3.select(".themes").append("svg")
+		// 	    .attr("width", width + margin.right + margin.left)
+		// 	    .attr("height", height + margin.top + margin.bottom)
+		// 	  	.append("g")
+		// 	    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
+
+		// 	{% if node %}
+
+		// 		  root = treeData;
+		// 		  root.x0 = height / 2; // the point from where it starts it's animation.
+		// 		  root.y0 = 0;
+
+		// 		  function collapse(d) {
+		// 		    if (d.children) {
+		// 		      d._children = d.children;
+		// 		      d._children.forEach(collapse);
+		// 		      d.children = null;
+		// 		    }
+		// 		  }
+
+		// 		  root.children.forEach(collapse);
+		// 		  update(root);
+		// 		// });
+		// 	{% endif %}
+
+		// 	// d3.select(self.frameElement).style("height", "800px");
+
+		// 	function update(source) {
+
+		// 	  // Compute the new tree layout.
+		// 	  var nodes = tree.nodes(root).reverse(),
+		// 	      links = tree.links(nodes);
+
+		// 	  // Normalize for fixed-depth.
+		// 	  nodes.forEach(function(d) { d.y = d.depth * 150;});
+
+		// 	  // Update the nodes
+		// 	  var node = svg.selectAll("g.node")
+		// 	      .data(nodes, function(d) { return d.id || (d.id = ++i); });
+
+		// 	  // Enter any new nodes at the parent's previous position.
+		// 	  var nodeEnter = node.enter().append("g")
+		// 	      .attr("class", "node")
+		// 	      .attr("transform", function(d) { return "translate(" + source.y0 + "," + source.x0 + ")"; })
+		// 	      .attr("title", function(d) { return d.name; })
+		// 	      .on("click", click);
+
+		// 	  nodeEnter.append("circle")
+		// 	      .attr("r", 1e-6)
+		// 	      .style("fill", function(d) { return d._children ? "#10c1cb" : "#fff"; });
+
+		// 	  nodeEnter.append("text")
+		// 	      .attr("x", function(d) { return d.children || d._children ? -10 : 10; })
+		// 	      .attr("dy", "0.35em")
+		// 	      .attr("text-anchor", function(d) { return d.children || d._children ? "end" : "start"; })
+		// 	      .text(function(d) { return d.name; })
+		// 	      .style("fill-opacity", 1e-6);
+
+		// 	  // Transition nodes to their new position.
+		// 	  var nodeUpdate = node.transition()
+		// 	      .duration(duration)
+		// 	      .attr("transform", function(d) { return "translate(" + d.y + "," + d.x + ")"; });
+
+		// 	  nodeUpdate.select("circle")
+		// 	      .attr("r", 6.5)
+		// 	      .style("fill", function(d) { return d._children ? "#10c1cb" : "#fff"; });
+
+		// 	  nodeUpdate.select("text")
+		// 	      .style("fill-opacity", 1);
+
+		// 	  // Transition exiting nodes to the parent's new position.
+		// 	  var nodeExit = node.exit().transition()
+		// 	      .duration(duration)
+		// 	      .attr("transform", function(d) { return "translate(" + source.y + "," + source.x + ")"; })
+		// 	      .remove();
+
+		// 	  nodeExit.select("circle")
+		// 	      .attr("r", 1e-6);
+
+		// 	  nodeExit.select("text")
+		// 	      .style("fill-opacity", 1e-6);
+
+		// 	  // Update the links
+		// 	  var link = svg.selectAll("path.link")
+		// 	      .data(links, function(d) { return d.target.id; });
+
+		// 	  // Enter any new links at the parent's previous position.
+		// 	  link.enter().insert("path", "g")
+		// 	      .attr("class", "link")
+		// 	      .attr("d", function(d) {
+		// 	        var o = {x: source.x0, y: source.y0};
+		// 	        return diagonal({source: o, target: o});
+		// 	      });
+
+		// 	  // Transition links to their new position.
+		// 	  link.transition()
+		// 	      .duration(duration)
+		// 	      .attr("d", diagonal);
+
+		// 	  // Transition exiting nodes to the parent's new position.
+		// 	  link.exit().transition()
+		// 	      .duration(duration)
+		// 	      .attr("d", function(d) {
+		// 	        var o = {x: source.x, y: source.y};
+		// 	        return diagonal({source: o, target: o});
+		// 	      })
+		// 	      .remove();
+
+		// 	  // Stash the old positions for transition.
+		// 	  nodes.forEach(function(d) {
+		// 	    d.x0 = d.x;
+		// 	    d.y0 = d.y;
+		// 	  });
+		// 	}
+
+		// 	// Toggle children on click.
+		// 	function click(d) {
+		// 	  if (d.children) {
+		// 	    d._children = d.children;
+		// 	    d.children = null;
+		// 	        // console.log("non-leaf 1");
+		// 	  } 
+		// 	  else {
+		// 	    if(d._children){
+		// 	        d.children = d._children;
+		// 	        d._children = null;
+		// 	        // console.log("non-leaf 2");
+		// 		}
+		// 		else if (d.node_type == "Topic"){
+		// 	        // console.log("Leaf!");
+		// 	        var a = document.createElement('a');
+		// 			a.setAttribute('href', "/{{group_name_tag}}/topic_details/"+d.id+"");
+		// 			// a.setAttribute('target', '_blank');
+		// 			document.body.appendChild(a);
+		// 			a.click();
+		// 			a.remove();
+		// 	        // location.href = "/{{group_name_tag}}/topic_details/"+d.id+"";
+		// 			// $('#collaps_topic_details').foundation('reveal', 'open');     
+		// 	    }
+		// 	  }
+		// 	  update(d);
+		// 	}
+
+		// 	$("#theme-drag-zoom-container").removeClass("hide");
+
+		// 	// calling function plotDragZoomTree defined in theme_drag_zoom_d3tree.html 
+		// 	plotDragZoomTree(treeData);
+		// 	}	
 
 // ---END of D3 collapsible tree
 
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme_drag_zoom_d3tree.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme_drag_zoom_d3tree.html
index 847bb78..a7fdb0c 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme_drag_zoom_d3tree.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/ndf/theme_drag_zoom_d3tree.html
@@ -1,23 +1,8 @@
-<div id="theme-drag-zoom-container" class="hide">
-        
-    <a href="#" data-reveal-id="theme-drag-zoom-tree">Show graph with zoom and drag functionality</a>
-
-    <div id="theme-drag-zoom-tree" class="reveal-modal xlarge" data-reveal>
-        <a class="close-reveal-modal">&#215;</a>
-    </div>
-
-</div>
-
 <script type="text/javascript">
-    
-    // treeData = ""
-    // $.getJSON("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(data){ treeData = data;});
-
-    // d3.json("{% url 'get_tree_hierarchy' group_id node.pk %}?collapsible=true", function(error, treeData) {
         
     function plotDragZoomTree(treeData) {
 
-    $("#theme-drag-zoom-tree").html("");
+    // $("#theme-drag-zoom-tree").html("");
 
     // Calculate total nodes, max label length
     var totalNodes = 0;
@@ -38,7 +23,7 @@
 
     // size of the diagram
     var viewerHeight = $(window).height() * 0.80;
-    var viewerWidth = $(document).width() * 0.90;
+    var viewerWidth = $(document).width() * 0.80;
 
  
     var tree = d3.layout.tree()
@@ -165,6 +150,8 @@
         .attr("width", viewerWidth)
         .attr("height", viewerHeight)
         .attr("class", "overlay")
+        .attr("version", "1.0")
+        .attr("xmlns", "http://www.w3.org/2000/svg")
         .call(zoomListener);
  
     // // Define the drag listeners for drag/drop behaviour of nodes.
@@ -277,6 +264,25 @@
             d._children = null;
         }
     }
+
+    function getHierarchyIds(d) {
+        hierarchyIdsArr = [d.id];
+
+        while(d.parent)
+        {
+            hierarchyIdsArr.push(d.parent.id);
+            d = d.parent;
+        }
+        // currently treeData doesn't hold top-theme _id, 
+        // so by default it's 1 in that place. Replace 1 with top theme's _id: 
+        hierarchyIdsArr.pop(hierarchyIdsArr.indexOf(1));
+        // hierarchyIdsArr.push("{{node.pk}}");
+
+        hierarchyIdsArr.reverse();
+        // console.log(hierarchyIdsArr)
+
+        return hierarchyIdsArr
+    }
  
     var overCircle = function(d) {
         selectedNode = d;
@@ -322,7 +328,7 @@
         scale = zoomListener.scale();
         x = -source.y0;
         y = -source.x0;
-        x = x * scale + viewerWidth / 2;
+        x = x * scale + viewerWidth / 4;
         y = y * scale + viewerHeight / 2;
         d3.select('#theme-drag-zoom-tree g').transition()
             .duration(duration)
@@ -344,13 +350,47 @@
     }
  
     // Toggle children on click.
- 
-    function click(d) {
-        if (d3.event.defaultPrevented) return; // click suppressed
-        d = toggleChildren(d);
-        update(d);
-        centerNode(d);
-    }
+    
+            // Toggle children on click.
+            function click(d) {
+              if (d.children) {
+                d._children = d.children;
+                d.children = null;
+                console.log("non-leaf 1");
+              } 
+              else {
+                if(d._children){
+                    d.children = d._children;
+                    d._children = null;
+                    console.log("non-leaf 2");
+                }
+                else if (d.node_type == "Topic"){
+                    console.log("Leaf!");
+
+                    hierarchyIdsArr = getHierarchyIds(d);
+
+                    // alert("dddddd");
+                    // var a = document.createElement('a');
+                    // a.setAttribute('href', "/{{group_name_tag}}/topic_details/"+d.id+"");
+                    // // a.setAttribute('target', '_blank');
+                    // document.body.appendChild(a);
+                    // a.click();
+                    // a.remove();
+                    location.href = "/{{group_name_tag}}/topic_details/" + d.id + 
+                                    "?nav_li=" + hierarchyIdsArr.toString() + "";
+                    // location.href = "/{{group_name_tag}}/topic_details/"+d.id+"";
+                    // $('#collaps_topic_details').foundation('reveal', 'open');     
+                }
+              }
+              update(d);
+            }
+
+    // function click(d) {
+    //     if (d3.event.defaultPrevented) return; // click suppressed
+    //     d = toggleChildren(d);
+    //     update(d);
+    //     centerNode(d);
+    // }
  
     function update(source) {
         // Compute the new height, function counts total children of root node and sets tree height accordingly.
@@ -397,14 +437,18 @@
             .attr("transform", function(d) {
                 return "translate(" + source.y0 + "," + source.x0 + ")";
             })
+            .attr("data-coll-node-id", function(d) {return d.id || (d.id = ++i); })
+            .style("cursor", "pointer")
             .on('click', click);
- 
+
         nodeEnter.append("circle")
             .attr('class', 'nodeCircle')
             .attr("r", 0)
             .style("fill", function(d) {
                 return d._children ? "lightsteelblue" : "#fff";
-            });
+            })
+            .style("stroke-width", "1.5px")
+            .style("stroke", "steelblue");
  
         nodeEnter.append("text")
             .attr("x", function(d) {
@@ -418,21 +462,23 @@
             .text(function(d) {
                 return d.name;
             })
-            .style("fill-opacity", 0);
+            .style("fill-opacity", 0)
+            .style("font-family", "sans-serif")
+            .style("font-size", "10px");
  
         // phantom node to give us mouseover in a radius around it
-        nodeEnter.append("circle")
-            .attr('class', 'ghostCircle')
-            .attr("r", 30)
-            .attr("opacity", 0.2) // change this to zero to hide the target area
-        .style("fill", "red")
-            .attr('pointer-events', 'mouseover')
-            .on("mouseover", function(node) {
-                overCircle(node);
-            })
-            .on("mouseout", function(node) {
-                outCircle(node);
-            });
+        // nodeEnter.append("circle")
+        //     .attr('class', 'ghostCircle')
+        //     .attr("r", 30)
+        //     .attr("opacity", 0.2) // change this to zero to hide the target area
+        // // .style("fill", "red")
+        //     .attr('pointer-events', 'mouseover')
+        //     .on("mouseover", function(node) {
+        //         overCircle(node);
+        //     })
+        //     .on("mouseout", function(node) {
+        //         outCircle(node);
+        //     });
  
         // Update the text to reflect whether node has children or not.
         node.select('text')
@@ -496,7 +542,10 @@
                     source: o,
                     target: o
                 });
-            });
+            })
+            .style("stroke", "#ccc")
+            .style("stroke-width", "1.5px")
+            .style("fill", "none");
  
         // Transition links to their new position.
         link.transition()
@@ -534,8 +583,82 @@
     root.y0 = 0;
  
     // Layout the tree initially and center on the root node.
+    // getData(root);
     root.children.forEach(collapse);
     update(root);
     centerNode(root);
+
+    setTimeout(function () {
+        firstChild = root.children[0];
+        click(firstChild);
+    }, 1500);
+
+    // recursive function needed to get data for {{selected}} node
+    // result = ""
+    // function getData (d) {
+
+    //     console.log("{{selected}} : " + d.name + " : " + d.id);
+    //     if(d.id == "{{selected}}")
+    //     {
+    //         console.log("======================================================");
+    //         result = d
+    //     }
+        
+    //     if(d.children)
+    //     {
+    //         console.log(d.children)
+    //         d.children.forEach(function(i){
+    //             res = getData(i);
+    //             if (res)
+    //             {
+    //                 return res
+    //             }
+    //         })
+    //     }
+    //     else if(d._children)
+    //     {
+    //         console.log(d._children)
+    //         d._children.forEach(function(i){
+    //             res = getData(i);
+    //             if (res)
+    //             {
+    //                 return res
+    //             }
+    //         })
+    //     }
+    // }
+    // console.log(getData(root))
 }
+// alert("{{selected}}");
+//called with every property and it's value
+    
+
+    // selected = document.querySelector('[data-coll-node-id="{{selected}}"]');
+    // selectedNodeData = d3.select(selected).data();
+    // d = selectedNodeData[0];
+    // hierarchyIdsArr = getHierarchyIds(d);
+    // console.log(hierarchyIdsArr);
+
+    // while(d && d.parent)
+    // {
+    //     console.log("11")
+    //     click(d)
+    //     d = d.parent;
+    // }
+    // function expandHierarchy(d) {
+    //     console.log(d)
+
+    // }
+
+    // expandHierarchy(selectedNodeData[0]);
+
+    function downloadCollapsibleGraph(filename) 
+    {
+        var blob = new Blob([$("#theme-drag-zoom-tree").html()], {type: "image/svg+xml"});
+        filename = filename.replace(/\ /g, '-');
+        filename += "-Collapsible-Graph.svg";
+        saveAs(blob, filename);
+    }
+
+
 </script>
diff --git a/gnowsys-ndf/gnowsys_ndf/ndf/templates/registration/logout.html b/gnowsys-ndf/gnowsys_ndf/ndf/templates/registration/logout.html
index 269f8f9..43f2eaa 100644
--- a/gnowsys-ndf/gnowsys_ndf/ndf/templates/registration/logout.html
+++ b/gnowsys-ndf/gnowsys_ndf/ndf/templates/registration/logout.html
@@ -10,6 +10,9 @@
                 <div class="small-12 medium-10 large-10 columns end text-center">
                 <h3>{% trans "You have sucessfully logged out." %}</h3>
                 <h5>{% trans "Thank you for visiting our website. Please return often to take advantage of this platform." %}</h5>
+
+                <!-- after logout, show some upcoming ProgramEvents -->
+
                 </div>
             </div>
         </div>