;
// (function($, document, CheckBox, FChart, echarts, HttpService, DataUtil, MapUtil, Util) {
function RealTimeMode(options) {
  this.inited = false
  this.isEnable = false

  this.factorMode = 'type0' //type0: 无人机和车载；type1：无人船

  this.fetchingTask = undefined
  this.isFetching = false //记录本次获取实时数据操作是否完成
  this.lastestTime = '' //当前获取的数据的最新时间
  this.deviceCode = '0a0000000001' // 当前展示的设备编号
  this.originData = [] // 原始数据

  this.selectedFactor = ["1"] //实时仪表盘默认展示的监测因子
  this.lastestData = new Object() // 最新的一个实时数据
  this.chartOptions = new Map() //实时仪表盘的配置

  this.lineChart
  this.lineChartOption
  this.xAxis = []
  this.realTimeDatas = {
    datas: [],
    physicalQuantity: []
  } //实时数据

  this.setCenter = true
  this.factorType = 0 //3d地图当前展示的监测因子id
  this.factorName = 'NO2'
  this.drawMode = 0 //绘制模式，0：自动模式，自动计算当前数据的范围，绘制合适的比例；1：手动模式，根据页面设置的绘图范围进行绘制
  /**
   * {
   * factorId: Factor
   * }
   */
  this.factorDatas = new FactorDatas()

  this.mapMaker = options.mapMaker

}

RealTimeMode.prototype = {
  init: function() {
    this.initChart()
    this.initLineChart()
    this.initDeviceType()
    var that = this
    $('#realtime_device_code').on('change', function () {
      that.deviceCode = $(this).val()
      
        // that.mapMaker.stop()

        // that.initChart()
        // that.initCheckBox()

        // that.fetchingData()
    })
    $('#btn_r_search').on('click', function () {
      
        that.mapMaker.stop()
        MapUtil

        that.initChart()
        that.initCheckBox()

        that.fetchingData()
    })
  },
  enable: function() {
    this.isEnable = true
    this.uichange(true)
    // this.mapMaker.changeSpeed(1)
    this.mapMaker.setDynamicSpeed(true, 4)//打开动态绘制速度调整，并设置两个坐标点之间的时间间隔
	  MapUtil.clear3D()
    if (!this.inited) {
      this.fetchingData()
      this.inited = true
    } else {
      //todo 1.将原来保存的数据重新绘制
      //todo 2.重新刷新界面上的绘制范围
    }
  },
  disable: function() {
    this.isEnable = false
    this.uichange(false)
    this.mapMaker.stop()
  },
  uichange: function(isShow) {
    // var r = $('#btn_realtime')
    // r.addClass('btn-unselected')
    if (isShow) {
      setTimeout(() => {
        // r.removeClass()
        // r.addClass('btn-selected margin-left-8')

        $('#realtimebox').slideDown("fast")
        $('#realtimebox2').slideDown("fast")
        // $('#backgroundbox').slideDown("fast")
        $('#rmode_type').slideDown("fast")

        $('#legend').css('right', '0px')
        $('#legend').css('left', 'auto')
        $('#rangeset').removeClass('map-range-set')
        $('#rangeset').addClass('map-range-set-2')

        $('#rangeset').slideUp('fast')
        $('#legend').show("fast")

        $('.map-factor-selector').show("fast")
      }, 500)
    } else {
      // DataUtil.hideAll()
    }
  },
  //设置绘图范围
  setRange: function(range) {
    this.drawMode = 1
    this.factorDatas.setRange(this.factorType + 1 + "", range)
    this.drawMesh(false, this)
  },
  resetRange: function() {
    this.drawMode = 0
    this.factorDatas.resetRange(this.factorType + 1 + "")
    this.drawMesh(false, this)
  },
  standardRange: function() {
    this.factorDatas.standardRange(this.factorType + 1 + "")
    this.drawMesh(false, this)
  },
  //设置3d地图当前展示的监测因子
  setFactorType: function(factorType, factorMode, factorName) {
    this.factorMode = factorMode
    this.factorType = factorType
    this.factorName = factorName
    this.mapMaker.setFactorType(factorType)
    this.refreshLegend(this.factorDatas, true)
    if (!this.mapMaker.runStatus()) {
      this.drawMesh(false, this)
    }
  },
  /********************************* 设备类型选择 - start ************************************/
  initDeviceType: function() {
    $('#rmode_type_box').empty()
    CheckBox.newRadioBox('rmode_type_box', 'deviceType', Util.deviceType, ['0a'], this.onChangeType, this)
  },
  //切换类型。目前一共有两组数据，车载和无人机为一组，无人船为一组，具体监测因子见 util.js
  onChangeType: function(obj, that) {
    // $(obj).attr('checked', true)
    var type = obj.value.split(',')[0]
    var tD = $('#realtime_device_code')
    tD.empty()
    var options2 = []
    switch (type) {
      case "0a":
        that.factorMode = "type0"
        options2.push('0a0000000001')
        options2.push('0a0000000002')
      case "0b":
        that.factorMode = "type0"
        options2.push('0b0000000001')
		    options2.push('0b0000000002')
        break;
      case "0c":
        that.factorMode = "type1"
        options2.push('0c0000000001')
        break;
      default:
        that.factorMode = "type0"
        options2.push('0a0000000001')
        options2.push('0a0000000002')
        break;
    }
    options2.forEach(element => {
      var op = $('<option></option>')
      op.text(element)
      tD.append(op)
    });
    that.deviceCode = tD.val()
  },
  /********************************* 设备类型选择 - end ************************************/
  /********************************* 实时数据获取 - start ************************************/
  fetchInit: function() {
    this.isFirstFetch = true
    this.originData = []
    this.xAxis = []
    this.realTimeDatas = {
      datas: [],
      physicalQuantity: []
    }
    this.factorDatas.clearData()
  },
  fetchingData: function() {
    console.log('deviceCode: ' + this.deviceCode);
    this.fetchInit()
    var that = this
    // 先获取最新的100个数据作为初始数据进行图表的绘制
    DataUtil.toggleLoading()
    HttpService.getRealtimeData(that.deviceCode, 100, function(datas) {
      // HttpService.getHistoryData(that.deviceCode, "2021-11-01 10:00:00", "2021-11-01 10:00:20", 1, 100, function(datas) {
      DataUtil.toggleLoading()
      if (datas.length == 0) {
        that.lastestTime = '----/--/-- --:--:--'
      } else {
        var type = DataUtil.refreshVehicleType(that.deviceCode)
        that.mapMaker.setVehicleType(type)
        
        // 更新最新的数据时间
        that.lastestTime = datas[datas.length - 1].time
        // datas.forEach(d => {
        that.onOneData(datas, that)
        // });
        that.onFetchDataDone(that)
      }
    })

    if (that.fetchingTask != undefined) {
      clearInterval(that.fetchingTask)
      that.isFetching = false
    }

    var debugCount = 0
    // 开始定时获取最新的数据
    that.fetchingTask = setInterval(() => {

      if (!that.isEnable || that.isFetching) {
        console.log("disEnable");
        return
      }
      var perPage = 3
      if (debugCount == 3) {
        perPage = 50
        debugCount = 0
      }

      that.isFetching = true
      HttpService.getNextData(that.deviceCode, that.lastestTime, perPage, function(datas) {
        console.log(new Date());
        if (datas.length == 0) {
          that.isFetching = false
          return
        }
        // 更新最新的数据时间
        that.lastestTime = datas[datas.length - 1].time
        // datas.forEach(d => {
        that.onOneData(datas, that)
        // });
        that.onFetchDataDone(that)

        that.isFetching = false
      })

      debugCount++
    }, 10000);
  },
  onOneData: function(data, that) {
    if (data.length == 0) {
      return
    }
    if (data[0].lng == 0) {
      return
    }
    that.originData.push.apply(that.originData, data)
    that.onLineChartOneData(data, that)
    that.onMapOneData(data, that)
  },
  onFetchDataDone: function(that) {
    // 根据当前绘图范围统一计算所有点的高度
    // for (const k in that.factorDatas.factor) {
    //     that.factorDatas.factor[k].getHeight()
    // }
    // 刷新仪表盘数据
    that.refreshChartData(that)
    // 刷新折线图数据
    that.refreshLineChart(true, that)
    // 刷新3d地图
    // that.drawMesh(false, that)
  },
  /********************************* 实时数据获取 - end ************************************/

  /********************************* 实时仪表盘区域 - start ************************************/
  initChart: function() {
    // 1.初始化监测因子复选框
    $('#realtime_chart_factorbox').empty()
    CheckBox.newCheckBox('realtime_chart_factorbox', Util.selectOptions3[this.factorMode], this.selectedFactor, this.onCheckChart, this)
  },
  // 监测因子复选框点击事件监听
  onCheckChart: function(obj, that) {
    var factorType = obj.value
    that.refreshFactors(factorType, that)
  },
  // 刷新监测因子选择记录
  refreshFactors: function(factorType, that) {
    var index = that.selectedFactor.indexOf(factorType)
    if (index == -1) {
      that.selectedFactor.push(factorType)
    } else {
      that.selectedFactor.splice(index, 1)
    }
    that.refreshChart(that.selectedFactor, that)
  },
  // 根据选择的监测因子id显示或隐藏仪表盘
  refreshChart: function(factorIdList, that) {
    var datas = []
    that.lastestData.values.forEach(f => {
      if (factorIdList.indexOf(f.factorId) != -1) {
        datas.push(f)
      }
    });

    var chartDiv = $('#realtime_chart')
    var needHideCharts = []
    var a = chartDiv.children()
    for (let i = 0; i < a.length; i++) {
      const d = a[i];
      needHideCharts.push(d.id)
    }

    datas.forEach(e => {
      var chartId = "realtime_chart_" + e.factorId

      var index = needHideCharts.indexOf(chartId)
      if (index != -1) {
        needHideCharts.splice(index, 1)
      }

      if (document.getElementById(chartId)) {
        $('#' + chartId).fadeIn('fast')
      } else {
        var div = document.createElement("div")
        div.id = chartId
        div.style.height = '280px';
        div.style.width = '260px';
        chartDiv.append(div)

        var gauge = echarts.init(div)
        var option = FChart.genGauge(gauge, e.factorName + '\n(μg/m³)', e.factorData)
        this.chartOptions.set(e.factorId, [gauge, option])
      }
    });

    needHideCharts.forEach(e => {
      $('#' + e).fadeOut('fast')
    });
  },
  // 刷新仪表盘数据
  refreshChartData: function(that) {
    // console.log("newData");
    if (!that.originData || that.originData.length == 0) return
    var data = that.originData[that.originData.length - 1].values
    $('#realtime_temp').text("温度：" + data[7].factorData.toFixed(2) + "℃")
    $('#realtime_hum').text("湿度：" + data[8].factorData.toFixed(2) + "%")
    $('#realtime_v').text("车速：" + data[13].factorData.toFixed(2) + "km/h")
    $('#realtime_wind_direction').text("风向：" + Util.windDir(data[16].factorData))
    $('#realtime_wind_speed').text("风速：" + data[15].factorData.toFixed(2) + "m/s")
    $('#realtime_time').text("采样时间：" + data[14].statusList[0])

    var isFirst = that.lastestData.values == undefined
    that.lastestData['values'] = data
    if (isFirst) {
      that.refreshChart(that.selectedFactor, that)
    }

    for (const e of data) {
      var o = that.chartOptions.get(e.factorId)
      if (o != undefined) {
        o[1].series[0].data[0].value = e.factorData;
        o[0].setOption(o[1], true);
      }
    }
  },
  /********************************* 实时仪表盘区域 - end ************************************/

  /********************************* 实时折线图区域 - start ************************************/
  initLineChart: function() {
    // 1.初始化折线图
    var div = document.getElementById('chart_2')
    $('#chart_2').empty()
    this.lineChart = echarts.init(div)
    // 2.初始化监测因子复选框
    this.initCheckBox()
    // 3.创建初始折线图
    this.drawLineChart(undefined, undefined, this)
  },
  initCheckBox: function() {
    $('#realtime_chart_2_factorbox').empty()
    CheckBox.newCheckBox('realtime_chart_2_factorbox', Util.selectOptions3[this.factorMode], ['1'], this.onCheckLineChart, this)
  },
  // 复选框监测因子监听事件
  onCheckLineChart: function(obj, that) {
    var _factorType = parseInt(obj.value) - 1

    that.realTimeDatas.datas[_factorType].show = obj.checked
    that.realTimeDatas.physicalQuantity[_factorType].show = obj.checked

    var series = that.realTimeDatas.datas
    that.lineChartOption = FChart.lineChartOnLegend(that.lineChart, that.xAxis, series, that.lineChartOption)
  },
  // 格式化单个数据
  onLineChartOneData: function(dataList, that) {
    dataList.forEach(data => {
      that.xAxis.push(data.time.split(" ")[1])
      for (let i = 0; i < data.values.length; i++) {
        var v = data.values[i]
        if (that.realTimeDatas.datas.length < i + 1) {
          that.realTimeDatas.datas.push({
            name: Util.factorName[v.factorName],
            type: 'line',
            data: [v.factorData],
            showAllSymbol: true,
            animationDelay: function(idx) {
              return idx * 10;
            },
            show: i == 0
          })
          that.realTimeDatas.physicalQuantity.push({
            name: Util.factorName[v.factorName] + '-物理量',
            type: 'line',
            data: [v.physicalQuantity],
            showAllSymbol: true,
            show: i == 0
          })
        } else {
          that.realTimeDatas.datas[i].data.push(v.factorData)
          that.realTimeDatas.physicalQuantity[i].data.push(v.physicalQuantity)
        }
      };
    });
  },
  // 创建初始折线图
  drawLineChart: function(data, merge, that) {
    that.lineChartOption = FChart.genLineChart(that.lineChart, that.xAxis, [], false)
  },
  refreshLineChart: function(merge, that) {
    if (merge) {
      var series = that.realTimeDatas.datas
      that.lineChartOption = FChart.lineChartOnLegend(that.lineChart, that.xAxis, series, that.lineChartOption, 100, 100)
    } else {
      //x坐标
      that.xAxis = []
      //y轴数据集
      that.realTimeDatas.datas = []
      that.realTimeDatas.physicalQuantity = []

      that.drawLineChart(undefined, merge, that)
    }
  },
  /********************************* 实时折线图区域 - end ************************************/

  /********************************* 实时3d曲线图区域 - start ************************************/
  onMapOneData: function(dataList, that) {
    var startIndex = that.factorDatas.length() - 1
    if (that.isFirstFetch) {
      startIndex = dataList.length - 2
      that.isFirstFetch = false
    }
    startIndex = startIndex < 0 ? 0 : startIndex
    that.factorDatas.addData(dataList, that.drawMode, true, function () {
      that.refreshLegend(that.factorDatas)

      that.mapMaker.moveAnimation(that.factorDatas, that.factorType, startIndex)
    })

    // var gps = []
    // dataList.forEach(data => {
    //   gps.push([data.lng, data.lat])
    // });

    // MapUtil.convertFromGPS(gps, function(result) {
      
    // })
  },
  refreshLegend: function(_factorDatas, animation) {
    var f = _factorDatas.factor[this.factorType + 1 + ""]
    $('#in_min').val(f.min.toFixed(1))
    $('#in_max').val(f.max.toFixed(1))
    Legend.refreshLegend('legend_content', f.factorName, animation == true, f.legendType, f.min, f.max)
  },
  drawMesh: function(merge, that) {
    // 1.获取当前选择的监测因子的数据
    var f = that.factorDatas.factor[that.factorType + 1 + ""]
    // 3.绘制3d图形
    MapUtil.drawMesh_Test(that.factorDatas, f, merge, that.setCenter)

    // that.setCenter = false
  },
  /********************************* 实时3d曲线图区域 - end ************************************/
}

$.fn.realTimeMode = function(options) {
  return new RealTimeMode(options);
}
// })(jQuery, document, CheckBox, FChart, echarts, HttpService, DataUtil, MapUtil, Util);