#set( $rootpath = "${apphome}/components/categorize")
#set ($detailid = $context.getRequestParameter("detailid") )
#if( $detail )
    #set( $detailid = $detail.id)
#end
 
<div id="addcategory" data-autosubmit="true"> 
	#set ($existing = $context.getRequestParameter("${detailid}.value") )
	
	
	#if(!$existing)
		#set ($existing = $value)
	#end
	#if(!$existing)
		#set ($existing = $values)
	#end
	#if(!$existing)
		#set ($existing = $context.getRequestParameter("${detailid}.values") )
	#end
	#if(!$existing)
		#set ($existing = $context.getRequestParameter("nodeID") )
	#end
	
	
	
	#if( $existing && !$existing.trim().isEmpty() )
         #set ($existing = $existing.replace("||","|"))
         <div id="cat-list" class="emlist" >
		#foreach($categoryid in $existing.split("\s*\|\s*"))
			#set($category  = $mediaarchive.getCategory($categoryid))
            #if($category)
                #set( $iscollection = $categoryCollectionCache.isPartOfCollection($category))
			    <div class="list-row" data-nodeid="$categoryid" data-categoryname="$category.getName()">
					<div class="category #if($iscollection) cat-collection #else cat-category #end">					
                        #foreach( $parent in $category.getParentCategoriesFrom(1))
                        
                        #if( ${foreach.count} > 1) \ #end
                            <a  href="$home$apphome/views/categories/${category.id}.html" style="padding:0px 4px 4px 4px;">$parent</a>
                        #end
                        <div class="collectionicons">
                                <a href="#" title="[[Remove]]">
                                    <span class="closecategory fas fa-times" data-categoryid="$categoryid"></span>
                                </a>
                        </div>
	    		    </div>
                </div>
			#end
		#end
        </div>
	#end

   <input type="hidden" name="operation" value="orsgroup" />


	##Bug Ajax forms dont validate hidden fields ever. So make it 1px wide
   	<input style="visibility: hidden;width:1px" id="categoryvalues" name="${detailid}.value" value="$!existing" class="#if($detail.isRequired() && !$multiedit) required requiredfield #end"  />
	

   
   <a class="emdialog btn btn-xs btn-secondary" 
   		href="$home$apphome/components/categories/search/searchcategory.html?targetdiv=addcategory&clearselection=$!clear&action=$page.path&detailid=$detailid" 
   		data-cancelsubmit="true" 
   		data-width="900" 
   		data-parameterdata="categoryvalues">[[Pick Categories]]</a>

<script>

lQuery(".collectionicons .closecategory").livequery("click",function() 
		{
			var link = $(this);
			link.closest("div.list-row").hide();
			
			var id = link.data("categoryid");
			var existing = $("#categoryvalues").val();
			existing = existing.replace(id,"");
			existing = existing.replace("||","|");
			$("#categoryvalues").val(existing);
			$("#categorizeform").submit();
			
		}
);

</script>
</div>