import { _decorator, Component, EventTouch, Label, Node, UITransform, Vec2, Vec3 } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('test')
export class test extends Component {
    @property(Node) bg:Node = null;
    @property(Node) img:Node = null;
    @property(Node) img_point:Node = null;
    @property(Node) btn_rotate:Node = null;
    protected is_rotate:boolean = false;
    protected anchor_point:Vec2 = new Vec2(0.5,0.5)
    start() {
        this.img.on(Node.EventType.TOUCH_END, (et:EventTouch)=> {
            let p = new Vec3(et.getUILocation().x,et.getUILocation().y)
            let n_p = this.img.getComponent(UITransform).convertToNodeSpaceAR(p)
            // console.log('n_p',n_p)
            let img_position_x = n_p.x 
            let img_position_y = n_p.y
            this.img_point.position = new Vec3(img_position_x, img_position_y, 1)

            this.anchor_point = new Vec2(0.5,0.5)
            this.img.getComponent(UITransform).setAnchorPoint(this.anchor_point)

            let img_contentSize = this.img.getComponent(UITransform).contentSize
            let anchor_point_x = (img_contentSize.width / 2 + n_p.x) / img_contentSize.width
            let anchor_point_y = (img_contentSize.height / 2 + n_p.y) / img_contentSize.height
            this.anchor_point = new Vec2(anchor_point_x, anchor_point_y)
            console.log('当前锚点=',this.anchor_point)
        },this)

        this.btn_rotate.on(Node.EventType.TOUCH_END, ()=> {
            if(this.is_rotate) {
                // 归位
                this.btn_rotate.children[0].getComponent(Label).string = '旋转'
                this.img.angle = 0
                this.anchor_point = new Vec2(0.5,0.5)
                this.img_point.position = new Vec3(0, 0, 1)
            } else {
                // 旋转
                this.btn_rotate.children[0].getComponent(Label).string = '归位'
                this.img.angle = 10
            }
            this.img.getComponent(UITransform).setAnchorPoint(this.anchor_point)
            this.is_rotate = !this.is_rotate
        },this)
        
    }

}