File

src/app/modules/workspace/components/collaborating-on/collaborating-on.component.ts

Extends

WorkSpace

Implements

OnInit AfterViewInit

Metadata

Index

Properties
Methods

Constructor

constructor(searchService: SearchService, workSpaceService: WorkSpaceService, frameworkService: FrameworkService, paginationService: PaginationService, activatedRoute: ActivatedRoute, route: Router, userService: UserService, toasterService: ToasterService, resourceService: ResourceService, config: ConfigService, modalService: SuiModalService, navigationhelperService: NavigationHelperService)

Constructor to create injected service(s) object Default method of Draft Component class

Parameters :
Name Type Optional Description
searchService SearchService No
workSpaceService WorkSpaceService No
frameworkService FrameworkService No
paginationService PaginationService No

Reference of PaginationService

activatedRoute ActivatedRoute No

Reference of ActivatedRoute

route Router No

Reference of Router

userService UserService No
toasterService ToasterService No
resourceService ResourceService No
config ConfigService No

Reference of ConfigService

modalService SuiModalService No
navigationhelperService NavigationHelperService No

Methods

contentClick
contentClick(content)
Parameters :
Name Optional
content No
Returns : void
fecthAllContent
fecthAllContent(limit: number, pageNumber: number, bothParams)

This method sets the make an api call to get all collaborating with page No and offset

Parameters :
Name Type Optional
limit number No
pageNumber number No
bothParams No
Returns : void
inview
inview(event)
Parameters :
Name Optional
event No
Returns : void
navigateToPage
navigateToPage(page: number)

This method helps to navigate to different pages. If page number is less than 1 or page number is greater than total number of pages is less which is not possible, then it returns.

Parameters :
Name Type Optional Description
page number No

Variable to know which page has been clicked

Example :
navigateToPage(1)
Returns : undefined | void
ngAfterViewInit
ngAfterViewInit()
Returns : void
ngOnInit
ngOnInit()
Returns : void
Public onCloseLockInfoPopup
onCloseLockInfoPopup()
Returns : void
sortColumns
sortColumns(column)
Parameters :
Name Optional
column No
Returns : void
trackByFn
trackByFn(index, item)

Used to dispaly content

Parameters :
Name Optional Description
index No

Give position for current entry

item No

Give postion

Returns : any
delete
delete(contentIds)
Inherited from WorkSpace
Defined in WorkSpace:111

Delete Api call .

Parameters :
Name Optional
contentIds No
Returns : any
getBatches
getBatches(searchParams)
Inherited from WorkSpace
Defined in WorkSpace:128

Batchlist Api call

Parameters :
Name Optional
searchParams No
Returns : any
getChannelDetails
getChannelDetails(channelId)
Inherited from WorkSpace
Defined in WorkSpace:164

get channel Api call

Parameters :
Name Optional
channelId No
Returns : any
getLinkedCollections
getLinkedCollections(contentId: ContentIDParam)
Inherited from WorkSpace
Defined in WorkSpace:157

search collection Api call

Parameters :
Name Type Optional
contentId ContentIDParam No
Returns : any
handleContentLockError
handleContentLockError(errObj)
Inherited from WorkSpace
Defined in WorkSpace:142

handle content lock api error

Parameters :
Name Optional
errObj No
Returns : string
lockContent
lockContent(content)
Inherited from WorkSpace
Defined in WorkSpace:97

this call will prepare reuest object and call lock api

Parameters :
Name Optional
content No
Returns : any
removeContent
removeContent(contentList, requestData)
Inherited from WorkSpace
Defined in WorkSpace:120

Method to remove content localcaly

Parameters :
Name Optional
contentList No
requestData No
Returns : any
search
search(searchParams)
Inherited from WorkSpace
Defined in WorkSpace:33

Search Api call

Parameters :
Name Optional
searchParams No
Returns : any
searchContentWithLockStatus
searchContentWithLockStatus(searchParams)
Inherited from WorkSpace
Defined in WorkSpace:40

Search Api call and returns contents with lock status of each one

Parameters :
Name Optional
searchParams No
Returns : any
UserList
UserList(searchParams)
Inherited from WorkSpace
Defined in WorkSpace:135

userList Api call

Parameters :
Name Optional
searchParams No
Returns : any

Properties

Private activatedRoute
Type : ActivatedRoute

To send activatedRoute.snapshot to router navigation service for redirection to draft component

collaboratingContent
Type : Array<IContents>
Default value : []

Contains list of published course(s) of logged-in user

column
Type : string
Default value : ''

column name which we want to sort

Public config
Type : ConfigService

To get url, app configs

Public frameworkService
Type : FrameworkService
inviewLogs
Type : []
Default value : []

inviewLogs

loaderMessage
Type : ILoaderMessage

loader message

lockPopupData
Type : object

lock popup data for locked contents

Public modalService
Type : SuiModalService
Public navigationhelperService
Type : NavigationHelperService
noResult
Default value : false

To show / hide no result message when no result found

noResultMessage
Type : INoResultMessage

no result message

pageLimit
Type : number

Contains page limit of inbox list

pageNumber
Type : number
Default value : 1

Current page number of inbox list

pager
Type : IPagination

Contains returned object of the pagination service which is needed to show the pagination on all content view

Private paginationService
Type : PaginationService

For showing pagination on draft list

query
Type : string

value typed

queryParams
Type : any

route query param;

Public resourceService
Type : ResourceService

To call resource service which helps to use language constant

reverse
Default value : false

reverse

route
Type : Router

To navigate to other pages

Public searchService
Type : SearchService
Inherited from WorkSpace
Defined in WorkSpace:152
showError
Default value : false

To show / hide error

showLoader
Default value : true

To show / hide loader

showLockedContentModal
Default value : false

To show content locked modal

sort
Type : object

sort for filter;

sortByOption
Type : string

sortingOptions ;

sortDirection
Type : string
Default value : ''

sortDirection

Public sortingOptions
Type : Array<ISort>

sortingOptions ;

state
Type : string

state for content editor

status
Type : string

status for content;

telemetryImpression
Type : IImpressionEventInput

telemetryImpression

Private toasterService
Type : ToasterService

To show toaster(error, success etc) after any API calls

totalCount
Type : Number

totalCount of the list

Public workSpaceService
Type : WorkSpaceService
Inherited from WorkSpace
Defined in WorkSpace:153
Public userService
Type : UserService
Inherited from WorkSpace
Defined in WorkSpace:26
import {combineLatest as observableCombineLatest } from 'rxjs';
import { Component, OnInit, AfterViewInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { WorkSpace } from '../../classes/workspace';
import { SearchService, UserService, ISort, FrameworkService } from '@sunbird/core';
import {
  ServerResponse, PaginationService, ConfigService, ToasterService, IPagination,
  ResourceService, ILoaderMessage, INoResultMessage, IContents, NavigationHelperService
} from '@sunbird/shared';
import { WorkSpaceService } from '../../services';
import * as _ from 'lodash-es';
import { IImpressionEventInput } from '@sunbird/telemetry';
import { SuiModalService } from 'ng2-semantic-ui-v9';
@Component({
  selector: 'app-collaborating-on',
  templateUrl: './collaborating-on.component.html'
})
export class CollaboratingOnComponent extends WorkSpace implements OnInit, AfterViewInit {
  /**
  * state for content editor
  */
  state: string;
  /**
   * To navigate to other pages
   */
  route: Router;
  /**
   * To send activatedRoute.snapshot to router navigation
   * service for redirection to draft  component
  */
  private activatedRoute: ActivatedRoute;
  /**
   * Contains list of published course(s) of logged-in user
  */
  collaboratingContent: Array<IContents> = [];
  /**
   * To show / hide loader
  */
  showLoader = true;
  /**
   * loader message
  */
  loaderMessage: ILoaderMessage;
  /**
   * To show / hide no result message when no result found
  */
  noResult = false;
  /**
     * To show content locked modal
    */
  showLockedContentModal = false;
  /**
     * lock popup data for locked contents
    */
    lockPopupData: object;

  /**
   * To show / hide error
  */
  showError = false;
  /**
  * no result  message
  */
  noResultMessage: INoResultMessage;
  /**
  * For showing pagination on draft list
  */
  private paginationService: PaginationService;
  /**
  * To get url, app configs
  */
  public config: ConfigService;
  /**
  * Contains page limit of inbox list
  */
  pageLimit: number;
  /**
  * Current page number of inbox list
  */
  pageNumber = 1;
  /**
  * totalCount of the list
  */
  totalCount: Number;
  /**
    status for content;
  */
  status: string;
  /**
  route query param;
  */
  queryParams: any;
  /**
  sortingOptions ;
  */
  public sortingOptions: Array<ISort>;
  /**
  sortingOptions ;
  */
  sortByOption: string;
  /**
  sort for filter;
  */
  sort: object;
  /**
	 * inviewLogs
	*/
  inviewLogs = [];
  /**
* value typed
*/
  query: string;
  /**
  * Contains returned object of the pagination service
  * which is needed to show the pagination on all content view
  */
  pager: IPagination;
  /**
  * To show toaster(error, success etc) after any API calls
  */
  private toasterService: ToasterService;
  /**
	 * telemetryImpression
	*/
  telemetryImpression: IImpressionEventInput;
  /**
  * To call resource service which helps to use language constant
  */
  public resourceService: ResourceService;
  /**
  * column name which we want to sort
  */
  column = '' ;
  /**
  * sortDirection
  */
  sortDirection = '';
  /**
  *reverse
  */
   reverse = false;
  /**
    * Constructor to create injected service(s) object
    Default method of Draft Component class
    * @param {SearchService} SearchService Reference of SearchService
    * @param {UserService} UserService Reference of UserService
    * @param {Router} route Reference of Router
    * @param {PaginationService} paginationService Reference of PaginationService
    * @param {ActivatedRoute} activatedRoute Reference of ActivatedRoute
    * @param {ConfigService} config Reference of ConfigService
  */
  constructor(public searchService: SearchService,
    public workSpaceService: WorkSpaceService,
    public frameworkService: FrameworkService,
    paginationService: PaginationService,
    activatedRoute: ActivatedRoute,
    route: Router, userService: UserService,
    toasterService: ToasterService, resourceService: ResourceService,
    config: ConfigService, public modalService: SuiModalService,
    public navigationhelperService: NavigationHelperService) {
    super(searchService, workSpaceService, userService);
    this.paginationService = paginationService;
    this.route = route;
    this.activatedRoute = activatedRoute;
    this.toasterService = toasterService;
    this.resourceService = resourceService;
    this.config = config;
    this.state = 'collaborating-on';
    this.loaderMessage = {
      'loaderMessage': this.resourceService.messages.stmsg.m0124,
    };
    this.noResultMessage = {
      'messageText': 'messages.stmsg.m0123'
    };
    this.sortingOptions = this.config.dropDownConfig.FILTER.RESOURCES.collaboratingOnSortingOptions;
  }

  ngOnInit() {
    observableCombineLatest(
      this.activatedRoute.params,
      this.activatedRoute.queryParams,
      (params: any, queryParams: any) => {
        return {
          params: params,
          queryParams: queryParams
        };
      })
      .subscribe(bothParams => {
        if (bothParams.params.pageNumber) {
          this.pageNumber = Number(bothParams.params.pageNumber);
        }
        this.queryParams = bothParams.queryParams;
        this.query = this.queryParams['query'];
        this.fecthAllContent(this.config.appConfig.WORKSPACE.PAGE_LIMIT, this.pageNumber, bothParams);
      });
  }
  /**
  * This method sets the make an api call to get all collaborating with page No and offset
  */
  fecthAllContent(limit: number, pageNumber: number, bothParams) {
    this.showLoader = true;
    if (bothParams.queryParams.sort_by) {
      const sort_by = bothParams.queryParams.sort_by;
      const sortType = bothParams.queryParams.sortType;
      this.sort = {
        [sort_by]: _.toString(sortType)
      };
    } else {
      this.sort = { lastUpdatedOn: this.config.appConfig.WORKSPACE.lastUpdatedOn };
    }
    const preStatus = ['Draft', 'FlagDraft', 'Review', 'Processing', 'Live', 'Unlisted', 'FlagReview'];
    const primaryCategories = _.compact(_.concat(this.frameworkService['_channelData'].contentPrimaryCategories,
    this.frameworkService['_channelData'].collectionPrimaryCategories));
    const searchParams = {
      filters: {
        status: bothParams.queryParams.status ? bothParams.queryParams.status : preStatus,
        collaborators: [this.userService.userid],
        primaryCategory: _.get(bothParams, 'queryParams.primaryCategory') || (!_.isEmpty(primaryCategories) ? primaryCategories :
        this.config.appConfig.WORKSPACE.primaryCategory),
        objectType: this.config.appConfig.WORKSPACE.objectType,
        board: bothParams.queryParams.board,
        subject: bothParams.queryParams.subject,
        medium: bothParams.queryParams.medium,
        gradeLevel: bothParams.queryParams.gradeLevel
      },
      limit: limit,
      offset: (pageNumber - 1) * (limit),
      query: _.toString(bothParams.queryParams.query),
      sort_by: this.sort
    };
    this.searchContentWithLockStatus(searchParams).subscribe(
      (data: ServerResponse) => {
        if (data.result.count && !_.isEmpty(data.result.content)) {
          this.collaboratingContent = data.result.content;
          this.totalCount = data.result.count;
          this.pager = this.paginationService.getPager(data.result.count, pageNumber, limit);
          this.showLoader = false;
          this.noResult = false;
        } else {
          this.showError = false;
          this.noResult = true;
          this.showLoader = false;
        }
      },
      (err: ServerResponse) => {
        this.showLoader = false;
        this.noResult = false;
        this.showError = true;
        this.toasterService.error(this.resourceService.messages.fmsg.m0084);
      }
    );
  }
  /**
   * This method helps to navigate to different pages.
   * If page number is less than 1 or page number is greater than total number
   * of pages is less which is not possible, then it returns.
	 *
	 * @param {number} page Variable to know which page has been clicked
	 *
	 * @example navigateToPage(1)
	 */
  navigateToPage(page: number): undefined | void {
    if (page < 1 || page > this.pager.totalPages) {
      return;
    }
    this.pageNumber = page;
    this.route.navigate(['workspace/content/collaborating-on', this.pageNumber], { queryParams: this.queryParams });
  }

  contentClick(content) {
    if (_.size(content.lockInfo) && this.userService.userid !== content.lockInfo.createdBy) {
        this.lockPopupData = content;
        this.showLockedContentModal = true;
    } else {
      if (content.status.toLowerCase() === 'draft') {  // only draft state contents need to be locked
        this.workSpaceService.navigateToContent(content, this.state);
      }
    }
  }

  public onCloseLockInfoPopup () {
    this.showLockedContentModal = false;
  }

  inview(event) {
    _.forEach(event.inview, (inview, key) => {
      const obj = _.find(this.inviewLogs, (o) => {
        return o.objid === inview.data.identifier;
      });
      if (obj === undefined) {
        this.inviewLogs.push({
          objid: inview.data.identifier,
          objtype: inview.data.contentType,
          index: inview.id
        });
      }
    });
    this.telemetryImpression.edata.visits = this.inviewLogs;
    this.telemetryImpression.edata.subtype = 'pageexit';
    this.telemetryImpression = Object.assign({}, this.telemetryImpression);
  }
  sortColumns(column) {
    this.column = column;
    this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
    this.reverse = !this.reverse;
  }

  ngAfterViewInit () {
    setTimeout(() => {
      this.telemetryImpression = {
        context: {
          env: this.activatedRoute.snapshot.data.telemetry.env
        },
        edata: {
          type: this.activatedRoute.snapshot.data.telemetry.type,
          pageid: this.activatedRoute.snapshot.data.telemetry.pageid,
          subtype: this.activatedRoute.snapshot.data.telemetry.subtype,
          uri: this.activatedRoute.snapshot.data.telemetry.uri + '/' + this.activatedRoute.snapshot.params.pageNumber,
          visits: this.inviewLogs,
          duration: this.navigationhelperService.getPageLoadTime()
        }
      };
      this.inview({ inview: [] });
    });
  }
  /**
   * Used to dispaly content
   *@param {number} index Give position for current entry
   *@param {number} item  Give postion
   */
  trackByFn(index, item) {
    return item.identifier;
  }
}

<app-collaboration-content-filter></app-collaboration-content-filter>
<div class="twelve wide column mt-20" *ngIf="showLoader ">
  <app-loader [data]="loaderMessage"></app-loader>
</div>
<div *ngIf="noResult && !showLoader">
  <app-no-result [data]="noResultMessage"></app-no-result>
</div>

<table class="ui single line sortable upForReviewTable table" *ngIf="collaboratingContent.length > 0 && !showLoader && !noResult ">
  <thead>
    <tr>
      <th (click)="sortColumns('name')" class="five wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' && 
      column === 'name','descending':sortDirection === 'desc' && column === 'name'}">
        {{ resourceService?.frmelmnts?.lbl?.contentLabel}}
      </th>
      <th (click)="sortColumns('creator')" class="four wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' && 
      column === 'creator','descending':sortDirection === 'desc' && column === 'creator'}">{{ resourceService?.frmelmnts?.lbl?.creator}}
      </th>
      <th (click)="sortColumns('lastUpdatedOn')" class="four wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' && 
      column === 'lastUpdatedOn','descending':sortDirection === 'desc' && column === 'lastUpdatedOn'}">
        {{ resourceService?.frmelmnts?.lbl?.lastupdatedCaps}}
      </th>
      <th (click)="sortColumns('status')" class="two wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' && 
      column === 'status','descending':sortDirection === 'desc' && column === 'status'}">
        {{ resourceService?.frmelmnts?.lbl?.status}}
      </th>
      <th class="two wide UpReviewTableHeader sorted bl-0">{{ resourceService?.frmelmnts?.lbl?.edit}}
      </th>
    </tr>
  </thead>
  <tbody [appTelemetryImpression]="telemetryImpression" [throttle]="1000" [trigger]="collaboratingContent">
    <tr class="UpForReviewListHover" *ngFor="let content of collaboratingContent; trackBy: trackByFn let i = index;"
      [id]="i" [data]="content" appTelemetryInteract [telemetryInteractObject]="{id:content.identifier,type:content.contentType,ver:content.pkgVersion ? content.pkgVersion.toString(): '1.0' }"
      [telemetryInteractEdata]="{id:'collaborating-on',type:'click',pageid:'CollaboratingOn'}">
      <td>
        <h5 class="ui image header">
          <img src="{{content.appIcon || 'assets/images/default.png' | cdnprefixurl}}" class="ui tiny image UpReviewTinyImage">
          <div class="content ">
            <div class="UpReviewHeader" title="{{content.name}}">{{content.name | slice:0:25}}
              <i *ngIf="content.name.length > 25">...</i>
            </div>
            <div class="UpReviewSubHeader">{{content.primaryCategory}}
            </div>
          </div>
        </h5>
      </td>
      <td>
        <h5 class="ui image header">
          <div class="content">
            <div class="UpReviewHeader">{{content.creator}}</div>
          </div>
        </h5>
      </td>
      <td>
        <h5 class="ui image header">
          <div class="content">
            <div class="UpReviewSubHeader">{{content.lastUpdatedOn | fromNow }}
            </div>
          </div>
        </h5>
      </td>
      <td class="UpForReviewStatusOrange">{{content.status}}</td>
      <td *ngIf= "content.status.toLowerCase() === 'draft' && !content.lockInfo">
        <i appTelemetryInteract [telemetryInteractObject]="{id:content.identifier,type:content.contentType,ver:content.pkgVersion ? content.pkgVersion.toString(): '1.0' }"
          [telemetryInteractEdata]="{id:'edit',type:'click',pageid:'CollaboratingOn'}"  (click)="contentClick(content)" class="edit icon cursor-pointer">
        </i>
      </td>
      <td *ngIf="content.lockInfo">
        <span matTooltip="{{resourceService?.frmelmnts?.lbl?.lockPopupTitle | interpolate:'{collaborator}':content?.lockInfo?.creatorInfo?.name | interpolate:'{contentName}':content?.name}}" [matTooltipPosition]="'left'">
          <i class="lock icon large"  ></i>
        </span>
      </td>
    </tr>
  </tbody>
</table>
<div class="ui grid">
  <div class="two wide column"></div>
  <div class="ten wide column">
    <div class="pb-10" *ngIf="collaboratingContent && totalCount > config.appConfig.WORKSPACE.PAGE_LIMIT && !showLoader && !showError && !noResult">
      <div class="ui pagination menu mt-10 right-floated pt-0" *ngIf="pager.pages.length ">
        <a [ngClass]="{disabled:pager.currentPage===1 }" class="item " (click)="navigateToPage(1) ">First</a>
        <a [ngClass]="{disabled:pager.currentPage===1 }" class="item " (click)="navigateToPage(pager.currentPage - 1)">Previous</a>
        <a *ngFor="let page of pager.pages" [ngClass]="{active:pager.currentPage===page}" (click)="navigateToPage(page)" class="item">{{page}}</a>
        <a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" (click)="navigateToPage(pager.currentPage + 1)" class="item">Next</a>
        <a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" (click)="navigateToPage(pager.totalPages)" class="item ">Last</a>
      </div>
    </div>
  </div>
</div>

<ng-template let-context let-modal="modal" #modalTemplate>
  <div class="sb-modal sb-error">
    <div class="ui modal visible active small">
      <i class="icon close" (click)="modal.deny('denied')" tabindex="0"></i>
      
      <!--Header-->
      <div class="sb-modal-header">
        {{resourceService?.frmelmnts?.lbl?.deletecontent}}
      </div>
      <!--/Header-->

      <!--Content-->
      <div class="sb-modal-content">
        <p>{{resourceService?.frmelmnts?.lbl?.deleteconfirm}}</p>
      </div>
      <!--/Content-->

      <!--Actions-->
      <div class="sb-modal-actions">
        <button 
          class="sb-btn sb-btn-normal sb-btn-error" 
          (click)="modal.approve('approved')" 
          autofocus
        >
          {{resourceService?.frmelmnts?.btn?.yes}}
        </button>
        <button 
          class="sb-btn sb-btn-normal sb-btn-outline-error" 
          (click)="modal.deny('denied')"
        >
          {{resourceService?.frmelmnts?.btn?.no}}
        </button>
      </div>
      <!--/Actions-->

    </div>
  </div>
</ng-template>

<app-contentlock-info-popup [content]="lockPopupData" (closeEvent)="onCloseLockInfoPopup($event)" *ngIf="showLockedContentModal"></app-contentlock-info-popup>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""