var PropertyEditor = {
    init: function () {
        this.show_prop = z.bom.getLocationSearchParam("prop") === 'true'

        this.initView();
        this.initEditor();
        this.initTestData();
    },
    initView: function () {
        this.initGView();
        this.initSheet();
    },
    initEditor: function () {
        var gvEditor = this.gvEditor = new pro.GVEditController(this.gView, this.sheet, {
            getEditProperties: EditorProps.getSheetProperties/*,
            onValueChange:function (){
                z.bom.setLocalStorage("property_editor_value",gvEditor.getValue());
            }*/
        })
        /*var cache_value = z.bom.getLocalStorage("property_editor_value");
        if(cache_value){
            gvEditor.setValue(cache_value);
        }*/
    }
};
z.util.mergeObject(PropertyEditor, {
    initGView: function () {
        var gView = this.gView = z.gv.GView({
            appendTo: "#gvDiv",
            grid_line_visible: true,
            select_mode: "single"
        });
        gView.onDataDblClick(function (evt) {
            var data = evt.data;
            this.gvEditor.removeObjectValue(data);
        }, this);
        gView.expandAll();
        pro.GVUtil.initToolbar(gView);
    },
    initSheet: function () {
        var _this = this;
        var sheet = this.sheet = new pro.PropertySheet({
            appendTo: "#sheetDiv",
            editable: true,
            overflow: "scroll",
            property_column_properties: {
                width: 320,
                field: "label",
                render: function (td, data) {
                    var label = data.get("label");
                    if (_this.show_prop === true) {
                        var property = data.get("property");
                        if (property) {
                            label += "<br><small>" + property + "</small>"
                        }
                    }
                    td.innerHTML = "<span class='propery-name'>" + label + "</span>"
                }
            }
        });
        pro.GridUtil.addInputFilter(sheet, "#filterInput", null, {
            highlight: true
        });
    },
    initTestData: function () {
        var group = new z.gv.Group({
            name: "Group"
        });
        var arr = [group, new z.gv.Node({name: "Node-A", parent: group, x: 100, y: 100}),
            new z.gv.Node({name: "Node-B", parent: group, x: 220, y: 100}),
            new z.gv.Node({name: "Node-C", parent: group, x: 220, y: 220}),
            new z.gv.Node({name: "Node-D", image: "../_icons/topology/cisco/router.svg", x: 600, y: 300, info: "hello"})];
        arr.push(new z.gv.Link(arr[2], arr[4], {info: "Link", type: "ra_hv"}));
        arr.push(new z.gv.Link(arr[1], arr[2], {name: "Link", type: "ra_top"}));
        arr.push(new z.gv.Link(arr[3], arr[4], {name: "Link-1"}));
        arr.push(new z.gv.Link(arr[3], arr[4], {name: "Link-2"}));
        arr.push(new z.gv.Node({name: "line", fill: null, points: [{x: 100, y: 400}, {x: 300, y: 400}]}))
        arr.push(new z.gv.Node({name: "curve", fill: null, points: [{x: 350, y: 450, seg: "quadratic_curve_to"}, {x: 450, y: 350}, {x: 550, y: 450}]}))

        arr.forEach(function (item, index) {
            item.set("edit_id", index)
        });
        this.gView.setData(arr);
        this.gView.expandAll();
    }
});
z.ready(function () {
    PropertyEditor.init();
});