<div class="small-12 medium-4 large-2 disabled-overlay" *ngIf="content.docStatus == 'S'">
	<img class="not-allowed-icon" src="{{ASSET_IMG_URL}}/svg/not_allowed.svg">
</div>

<div [ngClass]="isSelected ? 'selected' : ''" class="content-card">
	<div class="content-img-container">
		<img (click)="onCardClick();" 
			[src]="img_preview_url" 
			[ngClass]="{ 'content-thumb-img' : isDummyImg  , 'content-img' : !isDummyImg}" 
			(error) = "brokenImage($event)"
			>
		<!--  TODO SEND ENTERPRISE dynamically-->
	</div>
	<div class="content-card-footer">
		<div class="content-details">
			<span class="content-shDescr"  matTooltip="{{content.shDescr}}"
       matTooltipPosition="below">{{content.shDescr | lowercase}}</span>
       <!-- 
			<span class="showmore-section" *ngIf="userRights && userRights?.length > 0">
				<button mat-icon-button class="showmore-button" [matMenuTriggerFor]="menu">
	 					-- <mat-icon class="showmore-icon">more_vert</mat-icon>  --
	 					<span class="visioniconmore-v icon-more-v"></span>
				</button>
			</span>
	   -->
		</div>
			
		<div class="doc-detail">
		   <div class="doctype-icon-cont">
				<img class="doc-type-icon" [src]="docTypeIconUrl" (error) = "brokenDocImage($event)">
			</div>	
				<!-- <span class="doc-access">{{content.lastUserAccDate | timeAgo }}</span> -->
			<span class="doc-access">{{content.lastUserAccDate | amTimeAgo }}</span>
			<div class="doc-content">
				<content-pin class="content-pin" [content]="content" [hostUrl]="hostUrl" (onCardPin)="onCardPin($event);"></content-pin>
	
				<span class="showmore-section" *ngIf="userRights && userRights?.length > 0">
					<button mat-icon-button class="showmore-button" [matMenuTriggerFor]="menu">
		 					<!-- <mat-icon class="showmore-icon">more_vert</mat-icon>  -->
		 					<span class="visioniconmore-v icon-more-v"></span>
					</button>
				</span>
			</div>
		</div>
		
		<div class="file-type">
			<div class="targetAttach" #targetAttach></div>
			<img class="file-type-icon" #fileTypeIcon src="{{ASSET_IMG_URL}}/svg/{{content?.fileType?.trim()?.toLowerCase()}}.svg">
		</div>
		
		<div *ngIf="content.isShared" class="isShared" >
			<img class="file-type-icon" #fileTypeIcon src="{{ASSET_IMG_URL}}/svg/shared.svg">
		</div>
	</div>
</div>

 <!-- <mat-menu #menu="matMenu" xPosition="before">
	<span *ngFor="let detailCode of detailOpts">
		  <div *ngIf="detailCode == 'S'"  id="main">
			  <button class="content-menu-item" mat-menu-item (click)="displayShare()">
			    <span>Share</span>
			  </button>
		  </div>
		  <button *ngIf="detailCode == 'F'" class="content-menu-item" mat-menu-item>
		    <span>View File Details</span>
		  </button>
		  <div *ngIf="detailCode == 'C'" id="contentUsage">
			  <button class="content-menu-item"  mat-menu-item (click)="viewUsage()">
			    <span>View Content Usage</span>
			  </button>
		  </div>
		  <button *ngIf="detailCode == 'D'" mat-menu-item class="content-menu-item" (click)="download();">
		    <span>Download</span>
		  </button>
		  <button *ngIf="detailCode == 'R'" mat-menu-item class="content-menu-item">
		    <span>Remove</span>
		  </button>
	</span>
</mat-menu>  -->

 <mat-menu #menu="matMenu" xPosition="before">
	  <div *ngIf="userRights.indexOf('S') > -1"  id="main">
		  <button class="content-menu-item" mat-menu-item (click)="displayShare()">
		    <span>Share</span>
		  </button>
	  </div>
	  <button *ngIf="userRights.indexOf('V') > -1" class="content-menu-item" mat-menu-item>
	    <span>View File Details</span>
	  </button>
	  <div *ngIf="userRights.indexOf('C') > -1" id="contentUsage">
		  <button class="content-menu-item"  mat-menu-item (click)="viewUsage()">
		    <span>View Content Usage</span>
		  </button>
	  </div>
	  <!-- Commented by Abhishek T on 23-Sep-19 [Display download option to every card] -->
	  <!--<button *ngIf="userRights.indexOf('V') > -1 && content.cacheOpt && !(content.cacheOpt == '0')" mat-menu-item class="content-menu-item" (click)="download();">-->
	  <button *ngIf="userRights.indexOf('V') > -1" mat-menu-item class="content-menu-item" (click)="download();">
	  <span>{{ downloadMenuName }}</span>
		 <!-- Added by Sonam K on 4-Oct-19 [To show indication while files get downloading in mobile device] START -->
	 	 <span  *ngIf="!isHostedMode">
			 <span *ngIf="downLoadInProgress" class="vision-ui-download_small downloadDoc blink" style="color:blue;font-size: medium;"></span>
	   	 </span>
		 <!-- Added by Sonam K on 4-Oct-19 [To show indication while files get downloading in mobile device] END -->
	  </button>
	  <button *ngIf="userRights.indexOf('R') > -1" mat-menu-item class="content-menu-item" (click)="deactivate();">
	    <span>Deactivate</span>
	  </button>
	  <button *ngIf="userRights.indexOf('O') > -1" mat-menu-item class="content-menu-item" (click)="goToAssocScreen();">
		<span>Associate</span>
	  </button>
	  <!-- Added By Pankaj T. on 26-02-2020 for Import Orders from content library -->
	  <button *ngIf="userRights.indexOf('O') > -1" mat-menu-item class="content-menu-item" (click)="importOrders();">
		<span>Import Order</span>
	  </button>
	  <!-- Added By Pankaj T. on 26-02-2020 for Import Orders from content library -->
</mat-menu>
 
