import router from '@ohos.router';
import window from '@ohos.window';
import deviceInfo from '@ohos.deviceInfo';
import { WindowModel } from 'wdKit';
import { WDPlayerController } from 'wdPlayer';
import { devicePLSensorManager } from 'wdDetailPlayApi';
import { OperationListView } from './OperationListView';
import { ContentDetailDTO, RmhInfoDTO, UserInfoDTO } from 'wdBean/Index';
import { DetailDialog } from './DetailDialog';

@Component
export struct PlayerTitleComment {
  private playerController?: WDPlayerController;
  @State @Watch('watchSpeed') playSpeed: number = 1;
  @State comment: string = '';
  @Consume contentDetailData: ContentDetailDTO | undefined
  @Consume isFullScreen: boolean;
  @Consume progressVal: number;
  @Consume videoLandScape?: number
  @State isOpen: boolean = false
  dialogController: CustomDialogController = new CustomDialogController({
    builder: DetailDialog({
      name: this.getName(),
      title: this.getTitle(),
      summary: this.getSummary(),
      isOpen: this.isOpen

    }),
    autoCancel: false,
    customStyle: true,
    alignment: DialogAlignment.Bottom
  })

  aboutToAppear() {

  }

  watchSpeed() {
    this.playerController?.setSpeed(this.playSpeed);
  }

  getName() {
    return this.contentDetailData?.newsSourceName || this.contentDetailData?.editorName || ''
  }

  getTitle() {
    return this.contentDetailData?.newsTitle || this.contentDetailData?.newsSummary || ''
  }

  getSummary() {
    return this.contentDetailData?.newsSummary || ''
  }

  build() {
    Column() {

      if (this.contentDetailData?.videoInfo[0]?.videoLandScape === 1) {
        Column() {
          Row() {
            Image($r('app.media.ic_switch_orientation'))
              .width(34)
              .aspectRatio(1)
              .objectFit(ImageFit.Contain)
              .padding({ left: 10, right: 5 })
            Text("全屏观看")
              .fontColor(Color.White)
              .fontSize('14fp')
              .maxLines(2)
              .layoutWeight(1)
          }
          .width(100)
          .backgroundColor(Color.Gray)
          .borderRadius(10)
          .alignItems(VerticalAlign.Center)
          .visibility(this.videoLandScape == 2 ? Visibility.Hidden : Visibility.Visible)
          .onClick(() => {
            this.isFullScreen = !this.isFullScreen;
            WindowModel.shared.setPreferredOrientation(window.Orientation.LANDSCAPE);
            devicePLSensorManager.devicePLSensorOn(window.Orientation.LANDSCAPE);
          })
        }
        .width('100%')
        // .margin({ bottom: 120 })
        .alignItems(HorizontalAlign.Center)
      }


      Row() {
        Column() {
          if (this.getName()) {
            Text("@" + this.getName())
              .fontColor(Color.White)
              .fontSize(15)
              .maxLines(1)
              .textOverflow({ overflow: TextOverflow.Ellipsis })
          }
          if (this.getTitle()) {
            Text(this.getTitle())
              .fontColor(Color.White)
              .fontSize(15)
              .maxLines(3)
              .textOverflow({ overflow: TextOverflow.Ellipsis })
          }


          if (this.contentDetailData?.newsSummary) {
            Text('查看详情 > ')
              .margin({ top: 8 })
              .padding(6)
              .borderRadius(2)
              .backgroundColor('#636363')
              .fontColor(Color.White)
              .fontSize(12)
              .onClick(() => {
                console.log('click===', this.dialogController?.open)
                this.isOpen = true
                this.dialogController?.open()
              })
          }

        }
        .layoutWeight(1)
        .alignItems(HorizontalAlign.Start)
        .margin({ left: 16 })

        OperationListView()
          .width(48)
      }
      .width('100%')
      .alignItems(VerticalAlign.Bottom)

      Row() {
        Column() {
          Slider({
            value: this.progressVal,
            step: 1,
            style: SliderStyle.OutSet
          })
            .blockColor(Color.White)
            .trackColor($r('app.color.track_color'))
            .selectedColor($r('app.color.index_tab_selected_font_color'))
            .trackThickness(1)
            .width('100%')
            .onChange((value: number, mode: SliderChangeMode) => {
              this.playerController?.setSeekTime(value, mode);
            })

          Row() {
            Image($r('app.media.ic_back'))
              .width(24)
              .height(24)
              .aspectRatio(1)
              .onClick(() => {
                router.back();
              })

            TextInput({ placeholder: '说两句...', text: this.comment })
              .placeholderColor(Color.White)
              .placeholderFont({ size: 14 })
              .fontColor(Color.White)
              .fontSize(14)
              .maxLines(1)
              .layoutWeight(1)
              .backgroundColor('#1a1a1a')
              .borderRadius(2)
              .margin({ left: 12 })
          }
          .alignItems(VerticalAlign.Center)
          .padding({ left: 16, right: 16, top: 11, bottom: 11 })
        }
      }.backgroundColor(Color.Black)

    }
    .width('100%')
    // .height('40%')
    .alignItems(HorizontalAlign.Start)
    .opacity(this.isOpen ? 0 : 1)
    .animation({ duration: 200 })
  }
}