<schema2jsonld *ngIf="url" [URL]="url" [name]="title" type="other"></schema2jsonld>
<div class="uk-section uk-padding-remove-bottom uk-padding-remove-top">
  <div class="communityPanelBackground uk-padding-small">
    <div class="uk-container uk-container-large uk-margin-top uk-margin-bottom">
      <!-- <ul class="uk-breadcrumb">
         <li><a class="breadcrumb" routerLinkActive="router-link-active" routerLink="{{depositLearnHowPage}}"
                [queryParams]="properties.environment!='development'?{}:routerHelper.createQueryParam('communityId',communityId)">
           Deposit
         </a></li>
         <li><span class="active">Deposit in Zenodo</span></li>
       </ul>-->
      <breadcrumbs [light]="true" [breadcrumbs]="breadcrumbs"></breadcrumbs>
    </div>
  </div>
</div>
<div class="">
  <div class=" uk-section  uk-margin-small-top tm-middle uk-container uk-container-large " id="tm-main">
    <helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
            [texts]="pageContents['top']"></helper>
    <div class="uk-container uk-container-large uk-margin-bottom">
      <div class="uk-h2">
        <span class="uk-text-bold">Deposit</span> in Zenodo
      </div>
      <div>
        <div *ngIf="masterZenodoCommunity" class="uk-animation-fade  uk-margin-large-top">
          Main Zenodo community
          <div class=" uk-card uk-card-default uk-card-body uk-padding-remove-horizontal uk-margin-top">
            <!-- <div class="uk-text-large uk-margin-bottom"  >Master Zenodo community</div> -->
            <div class="uk-comment-header uk-grid-medium uk-flex-middle  uk-padding uk-padding-remove-vertical" uk-grid>

              <div class="uk-width-auto">
                <a target="_blank" [href]="masterZenodoCommunity.link">
                  <img *ngIf="masterZenodoCommunity.logoUrl" class="uk-comment-avatar"
                       src="{{masterZenodoCommunity.logoUrl}}" width="80" height="80" alt="">
                </a>
              </div>
              <div class="uk-width-expand">
                <h4 class="uk-comment-title uk-margin-remove">
                  <a *ngIf="masterZenodoCommunity.link" class="uk-text-large uk-text-bold" target="_blank"
                     href="{{masterZenodoCommunity.link}}">
                    <span class="custom-external custom-icon large"></span>
                    <span class="space"></span>
                    <span *ngIf="masterZenodoCommunity.title">{{masterZenodoCommunity.title}}</span>
                    <span *ngIf="!masterZenodoCommunity.title">[no name available]</span>
                  </a>
                  <span *ngIf="!masterZenodoCommunity.link" class=" uk-text-large  uk-text-bold">
                    <span *ngIf="masterZenodoCommunity.title">{{masterZenodoCommunity.title}}</span>
                    <span *ngIf="!masterZenodoCommunity.title">[no name available]</span>
                  </span>
                </h4>
                <div *ngIf="masterZenodoCommunity.date" class="uk-comment-meta ">
                  last update: {{masterZenodoCommunity.date | date:'yyyy/MM/dd'}}
                </div>

              </div>
              <!--                    <div>-->
              <!--                          <a class="uk-button portal-button" target="_blank" [href]="depositLink + masterZenodoCommunity.id " >-->
              <!--                            <span  class="uk-icon"> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="upload" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></span>-->
              <!--                            <span> New upload</span>-->

              <!--                          </a>-->
              <!--                    </div>-->
              <span class="uk-width-expand uk-flex uk-flex-bottom uk-flex-right">
          <a [href]="depositLink + masterZenodoCommunity.id " target="_blank" type="submit"
             class=" zenodoButton uk-float-right uk-button portal-button uk-padding uk-padding-remove-vertical uk-margin-small-left">
            <span><span>New upload</span><span uk-icon="arrow-right"></span></span>
          </a>
        </span>
            </div>
            <div class="uk-comment-body uk-overflow-auto uk-height-max-medium  uk-padding uk-padding-remove-vertical">
              <p *ngIf="masterZenodoCommunity.description" [innerHtml]=masterZenodoCommunity.description></p>
            </div>
          </div>
        </div>

      </div>
      <div *ngIf="zenodoSearchUtils.status == errorCodes.LOADING "
           class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert">
        <span class="loading-gif  uk-align-center"></span>
      </div>
      <div
          *ngIf=" (zenodoSearchUtils.status == errorCodes.ERROR || zenodoSearchUtils.status == errorCodes.NONE) && !masterZenodoCommunity "
          class="uk-animation-fade uk-margin-top  uk-width-1-1 uk-alert uk-alert-warning" role="alert">
        No zenodo communities found
      </div>
      <div class="uk-margin-large-top">Other related Zenodo communities <span *ngIf="communityIds &&
      communityIds.length <= size">({{communityIds.length}})</span></div>
      <no-load-paging *ngIf="communityIds && communityIds.length > size" [type]="'Zenodo communities'"
                      (pageChange)="getCommunities($event)"
                      [page]="page" [pageSize]="size"
                      [totalResults]="communityIds.length" >
      </no-load-paging>
      <ul *ngIf="communityIds && communityIds.length > 0" class="uk-list  uk-margin ">

        <ng-template ngFor let-item [ngForOf]="communityIds" let-i="index" >
        <li *ngIf="i>=((page-1)*size) && i < communityIds.length && i< this.page * this.size &&
        communities[this.communityIds[i]['zenodoid']]"
            class="uk-animation-fade uk-margin-top">
          <div class=" uk-card uk-card-default uk-card-body uk-padding-remove-horizontal">
            <div class="uk-comment-header uk-grid-medium uk-flex-middle uk-padding uk-padding-remove-vertical" uk-grid>
              <div class="uk-width-auto">
                <a target="_blank" [href]="communities[this.communityIds[i]['zenodoid']].link">
                  <img *ngIf="communities[this.communityIds[i]['zenodoid']].logoUrl" class="uk-comment-avatar" src="{{communities[this.communityIds[i]['zenodoid']].logoUrl}}" width="80" height="80"
                       alt="">
                </a>
              </div>
              <div class="uk-width-expand">
                <h4 class="uk-comment-title uk-margin-remove">
                  <a class="uk-width-expand" target="_blank" href="{{communities[this.communityIds[i]['zenodoid']].link}}">
                    <span class="custom-external custom-icon large"></span>
                    <span class="space"></span>
                    <span *ngIf="communities[this.communityIds[i]['zenodoid']].title">{{communities[this.communityIds[i]['zenodoid']].title}}</span>
                    <span *ngIf="!communities[this.communityIds[i]['zenodoid']].title">[no name available]</span>
                  </a>
                </h4>
                <div class="uk-comment-meta ">
                  last update: {{communities[this.communityIds[i]['zenodoid']].date | date:'yyyy/MM/dd'}}
                </div>
              </div>
              <!--                    <div>-->
              <!--                          <a class="uk-button portal-button" target="_blank" [href]="depositLink + communities[this.communityIds[i]['zenodoid']].id " >-->
              <!--                            <span  class="uk-icon"> <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="upload" ratio="1"><polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline><rect x="3" y="17" width="13" height="1"></rect><line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></span>-->
              <!--                            <span> New upload</span>-->

              <!--                          </a>-->
              <!--                    </div>-->
              <span class="uk-width-expand uk-flex uk-flex-bottom uk-flex-right">
          <a [href]="depositLink + communities[this.communityIds[i]['zenodoid']].id " target="_blank" type="submit"
             class=" zenodoButton uk-float-right uk-button portal-button uk-padding uk-padding-remove-vertical uk-margin-small-left">
            <span><span>New upload</span><span uk-icon="arrow-right"></span></span>
          </a>
        </span>
            </div>
            <div class="uk-comment-body uk-overflow-auto uk-height-max-medium uk-padding uk-padding-remove-vertical">
              <p *ngIf="communities[this.communityIds[i]['zenodoid']].description"
                 [innerHtml]="communities[this.communityIds[i]['zenodoid']].description"></p>
            </div>
          </div>
        </li>
        </ng-template>
      </ul>
    </div>
    <helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
            [texts]="pageContents['bottom']"></helper>
  </div>
</div>
