import { Component, OnInit } from '@angular/core';
import { BsModalService } from 'ngx-bootstrap/modal';
import { AjaxService } from '../../../../../core/service/ajax.service';
import { FrameService } from '../../../../../core/service/frame.service';
import { MsgService } from '../../../../../core/service/msg.service';
import { FramePageComponent } from '../../../../frame/core/page/frame.page';

@Component({
  selector: 'app-paint-exam-score',
  templateUrl: './paint-exam-score.component.html',
  styleUrls: ['./paint-exam-score.component.scss']
})
export class PaintExamScoreComponent extends FramePageComponent implements OnInit {


  currentStep: any;
  flag = false;
  firstFlag  = true;
  imageWidth : any;
  imageHeight : any;
  showWidth = 1600;
  showHeight = 800;
  vrotate = 0;
  
  agentArr = []; //考点列表
  dateArr = []; //考试日期
  roomArr = []; //考场列表
  stdArr = [];
  paint: any;
  std: any;
  widthFlag = false;
  maxSeq: any;
  roomName: any;
  exam_seq: any;
  maxStd: any;
   viewerOptions: any = {
    navbar: false,
    toolbar: {
      zoomIn: 4,
      zoomOut: 4,
      oneToOne: 4,
      reset: 4,
      prev: false,
      play: {
        show: 4,
        size: 'small'
      },
      next: false,
      rotateLeft: 4,
      rotateRight: 4,
      flipHorizontal: 4,
      flipVertical: 4,
    }
  };

  constructor(private modalService: BsModalService) {
    super(modalService);
   }

  ngOnInit(): void {
    this.currentStep ='Init';
    this.dateArr = [];
    this.agentArr = [];
    this.roomArr = [];
    this.paint = {};
    this.std = {};
    this.stdArr = [];
    // AjaxService.requestArray('layout/ly/agent/list.htm', {}, (array) => {
    //   this.agentArr = array;
    //   if(this.agentArr && this.agentArr.length == 1) {
    //     this.paint.agent_id = this.agentArr[0].ly_agent_id;
    //     this.listExamDate();
    //   }
    // });
    this.startScore();
    this.getMaxStdNum();
  }

  // 获取考试日期
  listExamDate() {
    AjaxService.requestArray('exam/checkin/init/date.htm', this.paint, (array) => {
      if (FrameService.FrameOptr.optr_id !== 0) {
        for (const d of array) {
          if (d.ly_room_id === 0) {
            const s = new Array();
            s.push(d);
            this.dateArr = s;
            break;
          }
        }
        if (this.dateArr === undefined || this.dateArr.length == 0) {
          this.dateArr = array;
        }
      } else {
        this.dateArr = array;
      }

      if (this.dateArr && this.dateArr.length == 1) {
        this.paint.exam_date = this.dateArr[0].exam_date;
        this.listRoomArr();
      }

    });
  }

  //获取
  listRoomArr() {
    AjaxService.requestArray('exam/room/list/by/date.htm', this.paint, (array) => {
      this.roomArr = array;
      if(this.roomArr && this.roomArr.length == 1) {
        this.paint.ly_room_id = this.roomArr[0].ly_room_id;
      }
      for(const room of this.roomArr) {
        room.room_name = room.group_name+'第【' + room.room_seq+ '】考场';
      }
    });
  }

  startScore() {
    this.currentStep = 'Score';
    // this.getRoomName();
    AjaxService.requestEntity('std/paint/room/get/maxseq.htm', {ly_room_id : this.paint.ly_room_id}, (entity) => {
      if(!entity) {
        this.maxSeq = 1;
      } else {
        this.maxSeq = entity;
      }
      this.initStd();
    });
  }

  initStd() {
    AjaxService.requestArray('std/paint/score/next.htm', {
      next_seq : this.maxSeq,
      ly_room_id : this.paint.ly_room_id 
    }, (array) => {
      this.stdArr = array;
      if(this.stdArr && this.stdArr.length>0) {
        this.std = this.stdArr[0];
      }
      // setTimeout(() => {
      //   this.drawImage(document.getElementById('photo'), this.showWidth, this.showHeight);
      // }, 300);
    });
  }
  
  //查询考场名称
  getRoomName() {
    for(const room of this.roomArr) {
      if(room.ly_room_id == this.paint.ly_room_id) {
        this.roomName = room.group_name +'第' + room.room_seq+ '考场';
        break;
      }
    }
  }


  /**************
   *   图片等比缩放
   */
  drawImage(ImgObj, maxWidth, maxHeight){
    var image = new Image();
    //原图片原始地址（用于获取原图片的真实宽高，当<img>标签指定了宽、高时不受影响）
    image.src = ImgObj.src;
    // 用于设定图片的宽度和高度
    var tempWidth;
    var tempHeight;
    if(this.firstFlag) {
      this.imageWidth = image.width;
      this.imageHeight = image.height;
    }
    
    if(image.width > 0 && image.height > 0){
        //原图片宽高比例 大于 指定的宽高比例，这就说明了原图片的宽度必然 > 高度
        if (image.width/image.height >= maxWidth/maxHeight) {
            if (image.width > maxWidth) {
                tempWidth = maxWidth;
                // 按原图片的比例进行缩放
                tempHeight = (image.height * maxWidth) / image.width;
            } else {
                // 按原图片的大小进行缩放
                tempWidth = image.width;
                tempHeight = image.height;
            }
        } else {// 原图片的高度必然 > 宽度
            if (image.height > maxHeight) {  
                tempHeight = maxHeight;
                // 按原图片的比例进行缩放
                tempWidth = (image.width * maxHeight) / image.height;      
            } else {
                // 按原图片的大小进行缩放
                tempWidth = image.width;
                tempHeight = image.height;
            }
        }
        // 设置页面图片的宽和高
        ImgObj.height = tempHeight;
        ImgObj.width = tempWidth;
        // 提示图片的原来大小
        ImgObj.alt = image.width + "×" + image.height;
    }
    this.firstFlag = false;
  }

  /**********
   *   原始图片大小
   */
  recover() {
    if(this.flag) {
      document.getElementById('photo').style.height = this.imageHeight + 'px';
      document.getElementById('photo').style.width = this.imageWidth + 'px';
      this.flag = false;
    } else {
      this.setImgSize();
      this.flag = true;
    }
  }

  /*****************
   *  下一个考生
   */
  nextStd() {
    this.firstFlag = true;
    this.flag = false;
    AjaxService.requestArray('std/paint/score/next.htm', {
      next_seq: this.stdArr[0].score_exam_seq+1,
      ly_room_id : this.paint.ly_room_id 
    }, (array) => {
      this.stdArr = array;
      // this.getImgSize();
    }, {RequestWithLoading: true});
  }

  /*************
   *  上一个考生
   */
  preStd() {
    this.firstFlag = true;
    this.flag = false;
    if(this.stdArr && this.stdArr[0].length>=1 && this.stdArr[0].score_exam_seq == 1) {
      MsgService.errorAlert('无上一个考生！');
      return ;
    }
    AjaxService.requestArray('std/paint/score/pre.htm', {
      pre_seq: this.stdArr[0].score_exam_seq-1,
      ly_room_id : this.paint.ly_room_id 
    }, (array) => {
      this.stdArr = array;
      // this.getImgSize();
    }, {RequestWithLoading: true});
  }

  // 旋转
  tranform() {
    this.vrotate++;
      if(this.vrotate == 1) {
        document.getElementById('photo').style.transform = 'rotate(90deg)';
        this.setImgSize();
        this.widthFlag = true;
      } else if(this.vrotate == 2) {
        document.getElementById('photo').style.transform = 'rotate(180deg)';
        this.setImgSize();
        this.widthFlag = false;
      } else if(this.vrotate == 3) {
        document.getElementById('photo').style.transform = 'rotate(270deg)';
        this.setImgSize();
        this.widthFlag = true;
      } else if(this.vrotate == 4) {
        document.getElementById('photo').style.transform = 'rotate(360deg)';
        this.vrotate = 0;
        this.setImgSize();
        this.widthFlag = false;
      }
  }

  setImgSize() {
    document.getElementById('photo').style.height = '';
    document.getElementById('photo').style.width = '';
    this.drawImage(document.getElementById('photo'), this.showWidth, this.showHeight);
  }

  getImgSize() {
    var imgUrl = this.std.material_file;
    var img = new Image();
    img.src = imgUrl;
    img.onload = function(){
      document.getElementById('photo').style.height = img.height +'px';
      document.getElementById('photo').style.width = img.width +'px';
    }
  }

  //查询考生
  searchStd() {
    if(this.exam_seq) {
      AjaxService.requestArray('std/paint/socre/by/seq.htm', {
        exam_seq: this.exam_seq
      }, (array) => {
        this.stdArr = array;
      }, {RequestWithLoading: true});
    }
  }

  getMaxStdNum() {
    AjaxService.request('std/paint/socre/get/max/seq.htm', { }, (entity) => {
      this.maxStd = entity.entity;
    });
  }

}
