c80_map_floors 0.1.0.1

data/app/assets/javascripts/c80_map_floors.js.coffee

@@ -0,0 +1,23 @@
+#= require history_jquery
+#= require bootstrap/transition
+#= require bootstrap/modal
+#= require bootstrap/tooltip
+#= require bootstrap/alert
+#= require bootstrap/dropdown
+#= require bootstrap-select
+
+#= require ./svg_elements/helper.js
+#= require ./svg_elements/polygon.js
+#= require ./svg_elements/area_label.js
+#= require ./svg_elements/building_label.js
+
+#= require_directory ./events
+#= require_directory ./map_objects
+#= require_directory ./view
+#= require_tree ./buttons
+
+#= require ./src/utils/utils.js
+#= require ./src/utils/opacity_buttons_utils.js
+#= require ./src/utils/map_utils.js
+#= require ./src/state_controller.js
+#= require ./src/main.js

data/app/assets/javascripts/events/app_event.js

@@ -0,0 +1,15 @@
+
+/* AppEvent constructor */
+function AppEvent(target, eventType, func) {
+    console.log("<AppEvent.new> target = " + target);
+
+    this.target = target;
+    this.eventType = eventType;
+    this.func = func;
+
+    target.addEventListener(eventType, func, false);
+}
+
+AppEvent.prototype.remove = function () {
+    this.target.removeEventListener(this.eventType, this.func, false);
+};

data/app/assets/javascripts/map_objects/area.js

@@ -0,0 +1,251 @@
+"use strict";
+
+function Area() {
+
+    var _map = null;
+    var _this = this;
+    _this.id = null;
+
+    //var _polygon = null;
+    //var _polygon_overlay = null;
+
+
+    // экранные координаты левой верхней точки, куда надо вписать полигон здания
+    //var _left_page_x = 342;
+    //var _left_page_y = 65;
+
+    // bounding box полигона (в логических координатах)
+    var _bbox = null;
+
+    // центр полигона (в логических координатах)
+    var _cx = null;
+    var _cy = null;
+
+    // если is_new, значит был полигон был
+    // нарисован и ждёт сохранения на сервере
+    //_this.is_new = false;
+
+    _this.init = function (options, parent_building_hash, pself) {
+        clog("<Area.init>");
+        //clog(parent_building_hash); // => see building.js init comment
+
+        //clog(options);
+        /*{
+            "id": 1,
+            "object_type": "area",
+            "area_hash": {
+                "id": 2,
+                "title": "Площадь 2.12",
+                "is_free": false,
+                "props": {
+                "square": "100 кв.м.",
+                "floor_height": "6 кв. м",
+                "column_step": "2 м",
+                "gate_type": "распашные",
+                "communications": "Интернет, электричество, водоснабжение",
+                "price": "от 155 руб/кв.м в месяц"
+            }
+        },
+            "coords": [998.8649298732183,1717.326608643258,998.8649298732183,1717.326608643258,1230.8649298732184,1631.326608643258,1254.8649298732184,1663.326608643258,1160.8649298732184,1695.326608643258,1214.8649298732184,1803.326608643258,1066.8649298732184,1862.326608643258
+        ]
+        }*/
+
+        _map = pself;
+        _this._options = options;
+        if (typeof _this._options["coords"] == "string") { /* когда нажимаем ENTER в редакторе и завершаем рисование полигона - приходит массив */
+            _this._options["coords"] = _this._options["coords"].split(',');
+        }
+        _this.id = options["id"];
+
+        // [4ddl5df]
+        if (_this._options["id"] == undefined) {
+            _this._options["id"] = Math.ceil((Math.random()*100000));
+        }
+
+        // [NOTE::56dfaw1: парсим координаты объекта на карте, поданные в виде строки]
+        for (var i=0; i<_this._options.coords.length; i++) {
+            _this._options.coords[i] = Number(_this._options.coords[i]);
+        }
+
+        _this._options.parent_building_hash = parent_building_hash;
+        //clog(_this._options.parent_building_hash);
+
+
+        _this._polygon = Polygon.createFromSaved(options, false, _map);
+        _this._polygon.area = _this;
+        _this._polygon.parent_building_hash = parent_building_hash;
+        _this._polygon = $(_this._polygon.polygon);
+
+        // подпись над полигоном показываем только админам
+        if (IS_ADMIN) {
+           _this._label = new AreaLabel(options, _map);
+        }
+
+        _this._polygon_overlay = Polygon.createFromSaved(options, true, _map);
+        _this._polygon_overlay.area = _this;
+        _this._polygon_overlay = $(_this._polygon_overlay.polygon);
+        _this._polygon_overlay.hover(_this._mouse_in, _this._mouse_out);
+        _this._calcBBox();
+
+        var k = 'unassigned';
+        if (options.area_hash != undefined) {
+            if (typeof options.area_hash.id !== 'undefined') {
+                k = 'free';
+                if (!options.area_hash.is_free) {
+                    k = 'busy';
+                }
+            }
+        }
+        _this._polygon.parent().attr("class", k);
+
+    };
+
+    // optimisation
+    var timeoutEnter = function () {
+        _map.showAreaInfo(_this._options.area_hash, _this._options.parent_building_hash);
+        _map.setMode('view_area');
+    };
+
+    _this.enter = function () {
+        console.log("<Area.enter>");
+        //clog(_this._options);
+
+        /* рассчитаем масштаб, при котором можно вписать прямоугольник дома в прямоугольник рабочей области */
+
+        var scaleX = _map.calcScale(_bbox.xmin, _bbox.xmax, _map.X1S, _map.X2S);
+        var scaleY = _map.calcScale(_bbox.ymin, _bbox.ymax, _map.Y1S, _map.Y2S);
+        var scale = (scaleX < scaleY) ? scaleX : scaleY;
+
+        //_map.scale = scale;
+
+        // совмещаем точку на экране, в которую надо центрировать дома, с центром дома с учётом рассчитанного масштаба
+        //_map.x = _map.normalizeX(_map.CX - _map.scale * _cx - _map.container.offset().left);
+        //_map.y = _map.normalizeY(_map.CY - _map.scale * _cy - _map.container.offset().top);
+
+        var x = _map.normalizeX({
+            x: _map.CX - scale * _cx - _map.container.offset().left,
+            scale: scale
+        });
+
+        var y = _map.normalizeY({
+            y: _map.CY - scale * _cy - _map.container.offset().top,
+            scale: scale
+        });
+
+        //clog("<Area.enter> [qq] moveTo: " + _map.x + ", " + _map.y);
+        //clog("<Area.enter> Call moveTo.");
+        _map.moveTo(x, y, scale, 400, 'easeInOutCubic');
+
+        setTimeout(timeoutEnter, 400);
+
+        var k;
+        if (_map.current_area != null) {
+            k = _map.current_area._polygon.parent().attr('class');
+            //clog("k = " + k);
+            k = k.split('viewing_area').join("");
+            _map.current_area._polygon.parent().attr("class", k);
+        }
+
+        // <g class='busy viewing_area'>..<polygon >.</g>
+        k = _this._polygon.parent().attr("class");
+        k += " viewing_area";
+        _this._polygon.parent().attr("class", k);
+
+        _this.invalidateAnimationMask();
+
+        _map.current_area = _this;
+        _map.mark_virgin = false;
+
+    };
+
+    _this.exit = function () {
+        console.log('<Area.exit>');
+    };
+
+    this.invalidateAnimationMask = function () {
+        $("#masked").attr('style', _this._calc_polygon_attr);
+    };
+
+    // выдать центр площади в логических координатах
+    _this.cx = function () {
+        return _cx;
+    };
+    _this.cy = function () {
+        return _cy;
+    };
+
+    // рассчитаем bounding box полигона (в логических координатах)
+    _this._calcBBox = function () {
+
+        var coords = _this._options.coords;
+        var xmin = Number.MAX_VALUE;
+        var ymin = Number.MAX_VALUE;
+        var xmax = Number.MIN_VALUE;
+        var ymax = Number.MIN_VALUE;
+
+        var ix, iy;
+        for (var i = 0, c = coords.length; i < c; i += 2) {
+            ix = coords[i];
+            iy = coords[i + 1];
+
+            //clog(xmin + " VS " + ix);
+            xmin = (ix < xmin) ? ix : xmin;
+            ymin = (iy < ymin) ? iy : ymin;
+
+            xmax = (ix > xmax) ? ix : xmax;
+            ymax = (iy > ymax) ? iy : ymax;
+        }
+
+
+        _bbox = {
+            xmin: xmin,
+            ymin: ymin,
+            xmax: xmax,
+            ymax: ymax
+        };
+
+        _cx = xmin + (xmax - xmin) / 2;
+        _cy = ymin + (ymax - ymin) / 2;
+
+        //clog("<Area._calcBBox> " +
+            //xmin + "," + ymin + "; " + xmax + "," + ymax +
+        //"; center logical: " + _cx + "," + _cy + ", center screen: " + _map.rightX(_cx) + ", " + _map.rightY(_cy));
+    };
+
+    _this._mouse_in = function () {
+        //clog('<Area._mouse_in>');
+        //clog(_this._polygon);
+        _this._polygon.attr('class', 'hover');
+    };
+
+    _this._mouse_out = function () {
+        //clog('<Area._mouse_out>');
+        _this._polygon.attr('class', '');
+    };
+
+    _this._calc_polygon_attr = function () {
+        var res = "";
+
+        var coords = _this._options["coords"];
+        var ix, iy;
+        for (var i = 0, c = coords.length; i < c; i += 2) {
+            ix = _map.scale * coords[i];
+            iy = _map.scale * coords[i + 1];
+            res += ix + "px " + iy + "px,"
+        }
+
+        //clog("<Area._calc_polygon_attr> res = " + res);
+        res = res.slice(0, res.length - 1);
+        res = "-webkit-clip-path:polygon(" + res + ")";
+        return res;
+
+    }
+
+    _this.to_json = function () {
+        return {
+            id:                 _this._options["id"],
+            coords:             _this._options["coords"],
+            parent_building_id: _this._options.parent_building_hash["id"]
+        }
+    }
+}

data/app/assets/javascripts/map_objects/building.js

@@ -0,0 +1,294 @@
+"use strict";
+
+function Building() {
+
+    var _map = null;
+    var _this = this;
+    var _options = null;
+    var _polygon = null;
+
+
+    // экранные координаты левой верхней точки, куда надо вписать полигон здания
+    //var _left_page_x = 342;
+    //var _left_page_y = 65;
+
+    // bounding box полигона (в логических координатах)
+    var _bbox = null;
+
+    // центр полигона (в логических координатах)
+    var _cx = null;
+    var _cy = null;
+
+    var _image_bg = null;
+    var _image_overlay = null;
+
+    var _zoomToMe = function () {
+
+        /* рассчитаем масштаб, при котором можно вписать прямоугольник дома в прямоугольник рабочей области */
+
+        var scaleX = _map.calcScale(_bbox.xmin, _bbox.xmax, _map.X1, _map.X2);
+        var scaleY = _map.calcScale(_bbox.ymin, _bbox.ymax, _map.Y1, _map.Y2);
+        //console.log("<Building.enter> scaleX = " + scaleX + ", scaleY = " + scaleY);
+
+        var scale = (scaleX < scaleY) ? scaleX : scaleY;
+        //var selfX = _map.calcCoord(scale, _map.X1, _bbox.xmin);
+        //var selfY = _map.calcCoord(scale, _map.Y1, _bbox.ymin);
+
+        //_map.scale = scale;
+        //_map.x = selfX;
+        //_map.y = selfY;
+
+        /* по-отдельности */
+
+        //var scaleX = _map.calcScale(_bbox.xmin, _bbox.xmax, _map.X1, _map.X2);
+        //console.log("<Building.enter> scaleX = " + scaleX);
+        //var selfX = _map.calcCoord(scaleX, _map.X1, _bbox.xmin);
+        //_map.scale = scaleX;
+        //_map.x = selfX;
+
+        //var scaleY = _map.calcScale(_bbox.ymin, _bbox.ymax, _map.Y1, _map.Y2);
+        //console.log("<Building.enter> scaleY = " + scaleY);
+        //var selfY = _map.calcCoord(scaleY, _map.Y1, _bbox.ymin);
+        //_map.scale = scaleY;
+        //_map.y = selfY;
+
+        // совмещаем точку на экране, в которую надо центрировать дома, с центром дома с учётом рассчитанного масштаба
+        // или, другими словами, перегоняем логические координаты в систему координат экрана
+        //_map.x = _map.normalizeX(_map.CX - scale * _cx - _map.container.offset().left);
+        //_map.y = _map.normalizeY(_map.CY - scale * _cy - _map.container.offset().top);
+
+        var x = _map.normalizeX({
+            x: _map.CX - scale * _cx - _map.container.offset().left,
+            scale: scale
+        });
+
+        var y = _map.normalizeY({
+            y: _map.CY - scale * _cy - _map.container.offset().top,
+            scale: scale
+        });
+
+        //console.log("<Building.enter> [qq] moveTo: " + _map.x + ", " + _map.y);
+        _map.moveTo(x, y, scale, 400, 'easeInOutCubic');
+    };
+
+    // the_floor - это as_json модели C80MapFloors::Floor
+    /*{
+        "map_building_id": 7,
+        "img_bg": {
+            "url": "/uploads/map/floors/floor_e7dc.gif",
+            "thumb": {"url": "/uploads/map/floors/thumb_floor_e7dc.gif"}
+        },
+        "img_overlay": {
+            "url": null,
+            "thumb": {"url": null}
+        },
+        "id": 2,
+        "title": "Первый этаж",
+        "tag": "first_test_floor",
+        "ord": 1,
+        "coords": "",
+        "class_name": "C80MapFloors::Floor",
+        "areas": [
+        {
+            "floor_id": 2,
+            "id": 2,
+            "tag": "test_area",
+            "coords": "10,12,110,112",
+            "area_representator_id": null,
+            "class_name": "C80MapFloors::Area"
+        }
+    ]
+    }*/
+    var _draw_floor = function (the_floor) {
+        console.log('<Building._draw_floor>');
+
+        // это тот самый код, который остался без изменений с версии c80_map (прошлой версии)
+        if (the_floor["img_overlay"]["url"] != "null") {
+            //_image_overlay = _map.draw_child_bg_image(the_floor["img_overlay"]["url"], 'building', true);
+        }
+        if (the_floor["img_bg"]["url"] != "null") {
+
+            // картинку этажа рисуем не по bounding box здания, а по значениям из базы
+            var tmp = _options["coords_img"].split(",");
+            var xx = tmp[0];
+            var yy = tmp[1];
+
+            // просим карту нарисовать картинку с данными характеристиками
+            _image_bg = _map.draw_map_object_image_bg(the_floor["img_bg"]["url"], {
+                //x: _bbox.xmin,
+                //y: _bbox.ymin,
+                x: xx,
+                y: yy,
+                width: the_floor["img_bg_width"],
+                height: the_floor["img_bg_height"]
+            }/*, 'building'*/);
+
+        }
+
+        // просим карту нарисовать площади
+        _map.draw_childs(the_floor["areas"]/*, _options["rent_building_hash"]*/);
+
+    };
+
+    // options_floors - as_json массива этажей модели C80MapFloors::Floor
+    var _parse_floors = function (options_floors) {
+
+        // NOTE:: тестово возьмем 1й этаж
+        var the_first_floor = options_floors[0];
+
+        _draw_floor(the_first_floor);
+
+    };
+
+    var _proccess_floors_data = function () {
+
+        if (_options["floors"] != undefined && _options["floors"].length) {
+            _parse_floors(_options["floors"]);
+        } else {
+            alert('У здания нет этажей, а должны быть.');
+        }
+
+    };
+
+    _this.init = function (options, link_to_map) {
+
+        if (options['coords'] != undefined && options['coords'].length) {
+            console.log("<Building.init>");
+
+            _map = link_to_map;
+            _options = options;
+            _this.options = options;
+            if (typeof _this.options["coords"] == 'string') { /* когда нажимаем ENTER в редакторе и завершаем рисование полигона - приходит массив */
+                _this.options["coords"] = _this.options["coords"].split(',');
+            }
+            _this.id = options["id"];
+
+            // [NOTE::56dfaw1: парсим координаты объекта на карте, поданные в виде строки]
+            for (var i=0; i<_this.options.coords.length; i++) {
+                _this.options.coords[i] = Number(_this.options.coords[i]);
+            }
+
+            // [4ddl5df]: в случае, если это только что отрисованное Здание - генерим временный случайный id
+            if (_this.options["id"] == undefined) {
+                _this.options["id"] = Math.ceil((Math.random()*100000));
+            }
+
+            _polygon = Polygon.createFromSaved(options, false, _map);
+            _polygon.building = _this;
+
+            _this._calcBBox();
+
+            // подпись над зданием - сколько свободных площадей
+            _this._label = new BuildingLabel(options, _map);
+
+        }
+    };
+
+    _this.enter = function () {
+        //console.log("<Building.enter>");
+        //console.log(_options);
+
+        _zoomToMe();
+
+
+        setTimeout(function () {
+
+            // попросим изменить состояние окружающей среды
+            _map.setMode('view_building');
+
+            // попросим показать информацию о Rent::Building здании (привязанному к данному C80MapFloors::MapBuilding)
+            //_map.showBuildingInfo(_options["rent_building_hash"]);
+
+            // запустим внутренний механизм парсинга этажей и их отрисовки
+            _proccess_floors_data();
+
+        }, 400);
+
+        _map.svgRemoveAllNodes();
+
+        _map.current_building = _this;
+        //console.log("<Building.enter> id: " + _this.id);
+        _map.mark_virgin = false;
+
+    };
+
+    _this.exit = function () {
+        _image_bg.remove();
+        if (_image_overlay != null) {
+            _image_overlay.remove();
+        }
+        _image_bg = null;
+        _image_overlay = null;
+        //_zoomToMe();
+    };
+
+    // выдать центр дома в логических координатах
+    _this.cx = function () {
+        return _cx;
+    };
+    _this.cy = function () {
+        return _cy;
+    };
+
+    // рассчитаем bounding box полигона (в логических координатах)
+    _this._calcBBox = function () {
+
+        var coords = _options.coords;
+        var xmin = Number.MAX_VALUE;
+        var ymin = Number.MAX_VALUE;
+        var xmax = Number.MIN_VALUE;
+        var ymax = Number.MIN_VALUE;
+
+        var ix, iy;
+        for (var i = 0, c = coords.length; i < c; i += 2) {
+            ix = coords[i];
+            iy = coords[i + 1];
+
+            //console.log(xmin + " VS " + ix);
+            xmin = (ix < xmin) ? ix : xmin;
+            ymin = (iy < ymin) ? iy : ymin;
+
+            xmax = (ix > xmax) ? ix : xmax;
+            ymax = (iy > ymax) ? iy : ymax;
+        }
+
+
+        _bbox = {
+            xmin: xmin,
+            ymin: ymin,
+            xmax: xmax,
+            ymax: ymax
+        };
+
+        _cx = xmin + (xmax - xmin) / 2;
+        _cy = ymin + (ymax - ymin) / 2;
+
+        //console.log("<Building._calcBBox> " +
+            //xmin + "," + ymin + "; " + xmax + "," + ymax +
+        //"; center logical: " + _cx + "," + _cy + ", center screen: " + _map.rightX(_cx) + ", " + _map.rightY(_cy));
+
+        console.log('<Building._calcBBox> ' + xmin + ', ' + ymin);
+    };
+
+    // при редактировании здания (т.е. изменении полигонов и holer-ов площадей)
+    // необходимо, чтобы оверлейный слой с колоннами не мешал кликам мышки
+    // добраться до слоя с svg
+    // эти методы для этого имплементированы
+    _this.changeOverlayZindex = function () {
+        if (_image_overlay != null) {
+            _image_overlay.css('z-index', '1');
+        }
+    };
+    _this.resetOverlayZindex = function () {
+        if (_image_overlay != null) {
+            _image_overlay.css('z-index', '3');
+        }
+    };
+
+    _this.to_json = function () {
+        return {
+            id:     _this.options["id"],
+            coords: _this.options["coords"]
+        }
+    }
+}