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 { RmhInfoDTO, UserInfoDTO } from 'wdBean/Index';

@Component
export struct PlayerTitleComment {
  private playerController?: WDPlayerController;
  @Consume newsSourceName?: string
  @Consume newsTitle?: string
  @Consume editorName?: string
  @Consume newsSummary?: string;
  @State @Watch('watchSpeed') playSpeed: number = 1;
  @Consume isFullScreen: boolean;
  @State comment: string = '';
  @Consume progressVal: number;
  @Consume videoLandScape?: number

  aboutToAppear() {
  }

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

  build() {
    Column() {
      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.newsSourceName || this.editorName) {
            Text("@" + (this.newsSourceName || this.editorName))
              .fontColor(Color.White)
              .fontSize(15)
              .maxLines(1)
              .textOverflow({ overflow: TextOverflow.Ellipsis })
          }
          if (this.newsTitle || this.newsSummary) {
            Text(this.newsTitle || this.newsSummary)
              .fontColor(Color.White)
              .fontSize(15)
              .maxLines(3)
              .textOverflow({ overflow: TextOverflow.Ellipsis })
          }

          Text('查看详情 > ')
            .margin({ top: 5 })
            .fontColor(Color.White)
            .fontSize(12)
            .maxLines(2)
        }
        .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(() => {
                if (this.isFullScreen) {
                  if (deviceInfo.deviceType != "phone") {
                    WindowModel.shared.getWindowSize().then((size) => {
                      if (size.width > size.height) {
                        router.back();
                      } else {
                        this.isFullScreen = !this.isFullScreen;
                        WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT);
                        devicePLSensorManager.devicePLSensorOn(window.Orientation.PORTRAIT);
                      }
                    })
                  } else {
                    this.isFullScreen = !this.isFullScreen;
                    WindowModel.shared.setPreferredOrientation(window.Orientation.PORTRAIT);
                    devicePLSensorManager.devicePLSensorOn(window.Orientation.PORTRAIT);
                  }
                } else {
                  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)
  }
}