import window from '@ohos.window';
import { SPHelper, WindowModel } from 'wdKit';
import { DateFormatUtil, PlayerConstants, WDPlayerController } from 'wdPlayer';
import { devicePLSensorManager, PlayError } from 'wdDetailPlayApi';
import { PlayerProgressBar } from './PlayerProgressBar';
import { PlayerTitle } from './PlayerTitle';

/**
 *  播放窗口上层的控制view
 */
@Component
export struct PlayControlViewContainer {
  playerController?: WDPlayerController;
  @Consume status: number;
  @Provide currentTime: string = "00:00";
  @Provide totalTime: string = "00:00";
  @Consume progressVal: number;
  @Provide isShowVolume: boolean = false;
  @Provide volumeProgress: number = 1;
  @Consume isFullScreen: boolean;
  @State isLocked: boolean = false;
  @Provide setAuto: number | undefined = undefined;
  @Consume canStart: boolean;
  @Consume userId: string;
  @Consume curContId: string;
  @Consume message: string;
  // 用于触发拖动手势事件，滑动的最小距离为5vp时拖动手势识别成功。
  private panOptionBright: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Vertical });
  private panOptionVolume: PanGestureOptions = new PanGestureOptions({ direction: PanDirection.Vertical });

  aboutToAppear() {
    if (this.playerController == null) {
      return
    }
    this.playerController.onTimeUpdate = (position, duration) => {
      this.currentTime = DateFormatUtil.secondToTime(position);
      this.totalTime = DateFormatUtil.secondToTime(duration);
      this.progressVal = Math.floor(position * 100 / duration);
      this.setPlayHistory(position);
    }

    this.playerController.onVolumeUpdate = (volume) => {
      this.volumeProgress = volume;
    }
  }

  aboutToDisappear() {
    this.playerController?.release();
  }

  build() {
    Stack({ alignContent: Alignment.Start }) {
      Stack() {
        Column() {
          PlayerTitle({ playerController: this.playerController })
            .width('100%')
            .height(44)
            .visibility(this.isFullScreen ? Visibility.Visible : Visibility.None)

          Row() {
            Column()
              .width('50%')
              .height('100%')
              .gesture(
                PanGesture(this.panOptionBright)
                  .onActionStart((event?: GestureEvent) => {
                    this.playerController?.onBrightActionStart(event!);
                  })
                  .onActionUpdate((event?: GestureEvent) => {
                    this.playerController?.onBrightActionUpdate(event!);
                  })
                  .onActionEnd(() => {
                    this.playerController?.onActionEnd();
                  })
              )
            Column()
              .width('50%')
              .height('100%')
              .gesture(
                PanGesture(this.panOptionVolume)
                  .onActionStart((event?: GestureEvent) => {
                    this.isShowVolume = true
                    this.playerController?.onVolumeActionStart(event!);
                  })
                  .onActionUpdate((event?: GestureEvent) => {
                    this.playerController?.onVolumeActionUpdate(event!);
                  })
                  .onActionEnd(() => {
                    setTimeout(() => {
                      this.isShowVolume = false
                    }, 500)
                    this.playerController?.onActionEnd();
                  })
              )
          }
          .width('100%')
          .layoutWeight(1)

          PlayerProgressBar({ playerController: this.playerController })
            .width('100%')
            .height(this.isFullScreen ? 66 : 44)
        }
        .height('100%')
        .width('100%')
        .zIndex(1)
        .gesture(TapGesture({ count: 2 })
          .onAction((event: GestureEvent) => {
            let curStatus = (this.status === PlayerConstants.STATUS_START);
            this.status = curStatus ? PlayerConstants.STATUS_PAUSE : PlayerConstants.STATUS_START;
            this.playerController?.switchPlayOrPause();
          }))

        Row() {
          Image($r('app.media.ic_volume'))
            .width(20)
            .height(20)
          Progress({ value: this.volumeProgress * 100, total: 100, type: ProgressType.Linear })
            .width(100)
            .height(5)
            .zIndex(2)
        }
        .width(140)
        .height(40)
        .borderRadius(4)
        .backgroundColor("#FFFFFF")
        .opacity(0.5)
        .justifyContent(FlexAlign.Center)
        .visibility(this.isShowVolume ? Visibility.Visible : Visibility.None)

      }.visibility(!this.canStart || this.isLocked ? Visibility.None : Visibility.Visible)

      Image(this.isLocked ? $r('app.media.ic_lock') : $r('app.media.ic_unlock'))
        .width(20)
        .height(20)
        .margin({ left: 20 })
        .borderRadius(4)
        .zIndex(2)
        .visibility(this.canStart && this.isFullScreen ? Visibility.Visible : Visibility.None)
        .gesture(TapGesture()
          .onAction((event: GestureEvent) => {
            this.isLocked = !this.isLocked;
            if (this.isLocked) {
              WindowModel.shared.setPreferredOrientation(window.Orientation.LOCKED);
              devicePLSensorManager.devicePLSensorOff();
            } else {
              WindowModel.shared.setPreferredOrientation(window.Orientation.AUTO_ROTATION_RESTRICTED);
            }
          }))

      PlayError()
        .width('100%')
        .height('100%')
        .zIndex(3)// zIndex值越大，显示层级越高，即zIndex值大的组件会覆盖在zIndex值小的组件上方。
        .visibility(this.canStart == undefined && this.message != undefined ? Visibility.Visible : Visibility.None)
    }
  }

  setPlayHistory(position: number) {
    if (this.userId && this.curContId) {
      SPHelper.default.get('playHistory', '').then((str) => {
        let result = str.toString();
        let playHistory: Record<string, Record<string, number>> = {};
        if (result != null && result != "") {
          playHistory = JSON.parse(result);
        }
        let userData = playHistory[this.userId] ?? {};
        userData[this.curContId] = position;
        playHistory[this.userId] = userData;
        SPHelper.default.save('playHistory', JSON.stringify(playHistory));
      })
    }
  }
}