
import HandleManage from './cesiumEvent'
import CesiumUtil from './cesiumUtil'

const { viewer, Cesium } = <any>window
export default class CesiumDraw {
    viewer = null
    handler = null
    drawer = null
    drawSource = null
    cesiumUtil = null
    
    constructor (viewer) {
        this.viewer = viewer
        this.handler = new HandleManage(viewer)
        this.cesiumUtil = new CesiumUtil(viewer)
        this.drawSource = new Cesium.CustomDataSource('drawSource')
        this.viewer.dataSources.add(this.drawSource)
    }

    start (callback) {
        let points = [], movePoints = []
        this.drawer = this.handler.create('move', m => {    
            let pos = m.startPosition
            let movePoint = this.cesiumUtil.xy2Car3(pos)
            let { lon, lat, height } = CesiumUtil.car32Degrees(movePoint)
            movePoints = [lon, lat]
            draw.bind(this)()
        })
        let startEvent = this.handler.create('lclick', c => {
            let { car3 } = c
            let { lon, lat, height } = CesiumUtil.car32Degrees(car3)
            points.push([lon, lat])
        })
        let endEvent = this.handler.create('rclick', e => {
            this.handler.removeAll()
            callback([movePoints, ...points, movePoints])
        })

        function draw () {
            let feas = []
            let coors = [movePoints, ...points, movePoints]
            if (coors.length > 0) {
                if (coors.length >= 2){
                    let line = this.getLine(Cesium.Cartesian3.fromDegreesArray(coors.flat()))
                    feas.push(line)
                    if (coors.length > 2) {
                        let polygon = this.getPolygon(Cesium.Cartesian3.fromDegreesArray(coors.flat()))
                        feas.push(polygon)
                    }
                }
                coors.forEach(p => {
                    let point = this.getPoint(CesiumUtil.degrees2Car3(p[0], p[1], 0))
                    feas.push(point)
                })
            }
            this.clear()
            this.addFeatrues(feas)
        }
    }
    
    clear () {
        this.drawSource.entities.removeAll()
    }

    addFeatrues (feas) {
        feas.forEach(f => this.drawSource.entities.add(f))
    }

    end () {
        this.clear()
        this.viewer.dataSources.remove(this.drawSource)
    }

    getPoint (position) {
        return new Cesium.Entity({
            position,
            point: {
                color: Cesium.Color.RED,
                outlineColor: Cesium.Color.YELLOW,
                outlineWidth: 3,
                pixelSize: 10,
                show: true,
                heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND
            }
        })
    }

    getLine (positions) {
        return new Cesium.Entity({
            polyline: {
                positions,
                width: 3,
                material: Cesium.Color.YELLOW,
                // new Cesium.PolylineDashMaterialProperty ({
                //     color: 
                //     dashLength: 20
                // })
            }
        })
    }

    getPolygon (positions) {
        return new Cesium.Entity({
            polygon: {
                height: 0,
                hierarchy: new Cesium.PolygonHierarchy(positions),
                material: new Cesium.Color.fromCssColorString("#FFD700").withAlpha(.2),
                perPositionHeight: true,
            }
        })
    }
}