c80_map 0.1.0.21 → 0.1.0.22

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: dcb8746dde69d4b6043844a01ce922cb062248f9
-  data.tar.gz: 2bf3bc0a45fd86b392866e00ad49333ecc89e501
+  metadata.gz: 3be2ba4e2ab8645392a50803e3ab11ab62095888
+  data.tar.gz: 3a75282e3a1c15bbd126478cd236ece64a9f1e6d
 SHA512:
-  metadata.gz: 900258b0e3a6e3f5114d2f49c305581c795556d0f0d1ab99886de6e5a852504f181aea56ea49b5b42524dc50e0f8596351651bb91878d4998a697405ba2df089
-  data.tar.gz: 3f1599de655b824421c61f561a69fda53562859bc414736cd3238af8bbec160c42784b2a57c1851f0d4c8ddf8f111a67b662866a8195a88279811d6948fcb0e8
+  metadata.gz: 27aa0c100ea5bdb44ea474c16a2242c2e6446f28eb45235b1a39f685bd40b2a67b0e000b457a6d32a30357e2b96520dd0c920e7afdf1f52f5b53c6aa49f06296
+  data.tar.gz: 6b21b26eacf7bbe165641e8504a9c1191768c4b366b982a3dd8e5ae051a8de3e116b60de83cd1d4b0a3251371bbe1b8ba56c3487eb3f67746b3ef498146b0153

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

@@ -1,6 +1,7 @@
 #= 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

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

@@ -216,6 +216,10 @@ function Building() {
         _polygon.building = _this;
 
         _this._calcBBox();
+
+        // подпись над зданием - сколько свободных площадей
+        _this._label = new BuildingLabel(options, _map);
+
     };
 
     _this.enter = function () {

data/app/assets/javascripts/src/main.js

@@ -1132,7 +1132,19 @@ var clog = function () {
                 self.data = data["updated_locations_json"];
             });
 
-        }
+        };
+
+        self.show_free_areas_hint = function () {
+            // рисуем в слое #svg_overlay,
+            // а т.к. находимся в режиме просмотра карты,
+            // этот слой пуст, можно им пока воспользоваться
+
+
+
+        };
+        self.hide_free_areas_hint = function () {
+
+        };
 
     };
 

data/app/assets/javascripts/src/state_controller.js

@@ -96,6 +96,9 @@ function StateController() {
                 _map.save_button_klass.show();
                 _map.save_button_klass.check_and_enable();
 
+                // скроем подсказки - сколько свободных площадей где есть
+                _map.hide_free_areas_hint();
+
                 break;
 
             // перешли в состояние
@@ -153,6 +156,9 @@ function StateController() {
                     _map.save_button_klass.hide();
                 }
 
+                // покажем подсказки - сколько свободных площадей где есть
+                _map.show_free_areas_hint();
+
                 break;
 
             // перешли в состояние рисования полигона
@@ -213,6 +219,9 @@ function StateController() {
 
                 _this.mzoom_buttons.css('opacity', '1');
 
+                // скроем подсказки - сколько свободных площадей где есть
+                _map.hide_free_areas_hint();
+
             break;
 
             // редактируем, находясь в здании

data/app/assets/javascripts/svg_elements/building_label.js

@@ -0,0 +1,65 @@
+"use strict";
+
+var BuildingLabel = function (options, link_to_map) {
+
+    if (    options.building_hash != undefined &&
+            typeof options.building_hash.id != 'undefined' &&
+            options.building_hash.props.free_areas_count != 0
+    ) {
+
+        this._x = options.coords[0];
+        this._y = options.coords[1];
+        this._map = link_to_map;
+
+        var center_for_cicrle_x = this._x;
+        var center_for_cicrle_y = this._y - 100;
+
+        // создадим узел, который будет помещён в дерево и будет виден пользователю
+        this._g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
+        this._g.setAttribute("class","free_areas_label");
+
+        this._bg_pulse = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        this._bg_pulse.setAttribute("cx",center_for_cicrle_x);
+        this._bg_pulse.setAttribute("cy",center_for_cicrle_y);
+        this._bg_pulse.setAttribute("r", 40);
+        this._bg_pulse.setAttribute("class","pulse");
+        
+        this._bg_pulse2 = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        this._bg_pulse2.setAttribute("cx",center_for_cicrle_x);
+        this._bg_pulse2.setAttribute("cy",center_for_cicrle_y);
+        this._bg_pulse2.setAttribute("r", 40);
+        this._bg_pulse2.setAttribute("class","pulse2");
+        
+        this._bg_circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        this._bg_circle.setAttribute("cx",center_for_cicrle_x);
+        this._bg_circle.setAttribute("cy",center_for_cicrle_y);
+        this._bg_circle.setAttribute("r",40);
+        this._bg_circle.setAttribute("class","circle");
+        
+        this._text_element_ns = document.createElementNS('http://www.w3.org/2000/svg', 'text');
+        this._text_element_ns.setAttribute('x', center_for_cicrle_x);
+        this._text_element_ns.setAttribute('y', center_for_cicrle_y);
+        this._text_element_ns.setAttribute('class', 'text');
+        this._text_element_ns.textContent = options.building_hash.props.free_areas_count;
+
+        this._aLine = document.createElementNS('http://www.w3.org/2000/svg', 'line');
+        this._aLine.setAttribute('x1', this._x);
+        this._aLine.setAttribute('y1', this._y);
+        this._aLine.setAttribute('x2', center_for_cicrle_x);
+        this._aLine.setAttribute('y2', center_for_cicrle_y);
+        this._aLine.setAttribute('stroke', '#39BD5F');
+        this._aLine.setAttribute('stroke-width', '2');
+
+
+        // цепляем НЕ в #svg_overlay (об этом нам говорит is_overlay = false аргумент)
+        this._map.addNodeToSvg(this._g, false);
+        
+        this._g.appendChild(this._aLine);
+        this._g.appendChild(this._bg_pulse);
+        this._g.appendChild(this._bg_pulse2);
+        this._g.appendChild(this._bg_circle);
+        this._g.appendChild(this._text_element_ns);
+
+    }
+    
+};

data/app/assets/stylesheets/view/elems/free_areas_label.scss

@@ -0,0 +1,116 @@
+
+g.free_areas_label {
+
+  > * {
+    transform-origin: 50% 50%;
+    transform: matrix(1, 0, 0, 1, 0, 0);
+    display: block;
+
+    &.text {
+      font-size: 40px;
+      font-weight: bold;
+      fill: #ffffff;
+      transform: translateY(12px) translateX(-12px);
+      text-shadow: 0 0 1px rgba(0, 0, 0, 0.58);
+    }
+
+    &.pulse {
+
+      animation: pulseAnimation 3s infinite;
+      transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+      -webkit-transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+      -moz-transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+
+      fill: rgba(57, 189, 95, 0.39);
+      -webkit-animation-duration: 3s;
+      -moz-animation-duration: 3s;
+      animation-duration: 3s;
+
+    }
+
+    &.pulse2 {
+
+      animation: pulseAnimation 3s 0.75s infinite;
+      transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+      -webkit-transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+      -moz-transition: all 0.65s cubic-bezier(0.175, 0.885, 0.32, 1.275);
+
+      fill: rgba(57, 189, 95, 0.69);
+
+      -webkit-animation-duration: 2s;
+      -moz-animation-duration: 2s;
+      animation-duration: 2s;
+
+    }
+
+    &.circle {
+      fill: rgba(57, 189, 95, 0.53);
+    }
+
+    &.line {
+      stroke: rgba(57, 189, 95, 0.99);
+      stroke-width: 1px;
+    }
+
+  }
+
+}
+
+@-webkit-keyframes pulseAnimation {
+  0% {
+    -webkit-transform: scale(1);
+    opacity: 0
+  }
+  20% {
+    opacity: 1
+  }
+  75% {
+    -webkit-transform: scale(1.5);
+    opacity: 0
+  }
+  100% {
+    opacity: 0
+  }
+}
+
+@-moz-keyframes pulseAnimation {
+  0% {
+    -moz-transform: scale(1);
+    opacity: 0
+  }
+  20% {
+    opacity: 1
+  }
+  75% {
+    -moz-transform: scale(1.5);
+    opacity: 0
+  }
+  100% {
+    opacity: 0
+  }
+}
+
+@keyframes pulseAnimation {
+  0% {
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1);
+    opacity: 0
+  }
+  20% {
+    opacity: 1
+  }
+  75% {
+    -webkit-transform: scale(1.5);
+    -moz-transform: scale(1.5);
+    -ms-transform: scale(1.5);
+    -o-transform: scale(1.5);
+    transform: scale(1.5);
+    opacity: 0
+  }
+  100% {
+    opacity: 0
+  }
+}

data/app/models/c80_map/building_representator.rb

@@ -57,7 +57,8 @@ module C80Map
                 desc: self.desc,
                 column_step: self.column_step,
                 communications: self.communications,
-                price: self.price_string
+                price: self.price_string,
+                free_areas_count: self.free_areas_count # NOTE: free_areas_count находися в Rent::Building проекта vorsa
             }
         }
         res

data/lib/c80_map/version.rb

@@ -1,3 +1,3 @@
 module C80Map
-  VERSION = "0.1.0.21"
+  VERSION = "0.1.0.22"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: c80_map
 version: !ruby/object:Gem::Version
-  version: 0.1.0.21
+  version: 0.1.0.22
 platform: ruby
 authors:
 - C80609A
@@ -90,6 +90,7 @@ files:
 - app/assets/javascripts/src/utils/opacity_buttons_utils.js
 - app/assets/javascripts/src/utils/utils.js
 - app/assets/javascripts/svg_elements/area_label.js
+- app/assets/javascripts/svg_elements/building_label.js
 - app/assets/javascripts/svg_elements/helper.js
 - app/assets/javascripts/svg_elements/polygon.js
 - app/assets/javascripts/view/save_preloader.js
@@ -97,6 +98,7 @@ files:
 - app/assets/stylesheets/map.scss
 - app/assets/stylesheets/view/buttons/area_order_button.scss
 - app/assets/stylesheets/view/buttons/button_back_to_map.scss
+- app/assets/stylesheets/view/elems/free_areas_label.scss
 - app/assets/stylesheets/view/modal_window.scss
 - app/assets/stylesheets/view/save_preloader.scss
 - app/controllers/c80_map/application_controller.rb