import {Component, OnInit} from '@angular/core';
import {Subscription} from 'rxjs';
import {LayoutService} from "../../openaireLibrary/services/layout.service";
import {properties} from "../../../environments/environment";
declare var UIkit;

@Component({
  selector: 'connect-admin-customization',
  template: `
    <div page-content>
      <div header>
        <div class="uk-flex uk-flex-middle uk-margin-top info">
          <img src="assets/common-assets/placeholder.png" class="uk-margin-right">
          <div>
            <div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">Admin Dashboard - Manage Options</div>
            <h1 class="uk-h4 uk-margin-remove">Super Admin</h1>
          </div>
        </div>
        <admin-tabs tab="customization" portal="connect"></admin-tabs>
        
      </div>
       
      <div inner>
        <div class="uk-alert uk-alert-warning ">
          <div class="uk-text-large">Use only after connect deployment. And only if there are css updates!</div>
          Press the following button to update the timestamp in the saved layouts and recreate the css files. 
        </div>
        <button (click)="updateCss()" class="uk-button uk-button-danger" [class.uk-disabled]="savingChanges"> Update CSS</button>
      </div>
    </div>
    
  `
})
export class ConnectAdminCustomizationComponent implements OnInit {
  private subscriptions: any[] = [];
  savingChanges = false;

  constructor( private layoutService: LayoutService,) {
  }

  ngOnInit() {
    // this.sub =this.communityService.getCommunityAsObservable().subscribe(community => {
    //   this.community = community;
    // });
  }
  ngOnDestroy() {

    this.subscriptions.forEach(subscription => {
      if (subscription instanceof Subscription) {
        subscription.unsubscribe();
      }
    });
  }
  updateCss(){
    let date = new Date();
    this.savingChanges = true;
    this.subscriptions.push(this.layoutService.getLayouts(properties, ).subscribe(layouts => {

      for(let layout of layouts){
        if(layout.portalPid != 'connect'){
          layout.date = date;
          this.subscriptions.push(this.layoutService.saveLayout(properties, layout.portalPid, layout, "community").subscribe(data =>{
            this.subscriptions.push(this.layoutService.createCSS(layout.portalPid,properties.connectPortalUrl, layout.date.valueOf(), layout.layoutOptions).subscribe(data =>{
              UIkit.notification(layout.portalPid +"-"+ layout.date.valueOf() +  ".css " + " was created successfully! ", {
                status: 'success',
                timeout: 6000,
                pos: 'bottom-right'
              });

            }));
          }));
        }
      }
    }));
  }
}