WebCompDev / COMPONENTS

Commit 7e835531422b8885fe33a542a57fb3642fb67ace

Authored by Andrea Petta
1 parent b4190b56

generic cards container controllet

Inline Side-by-side
Showing 3 changed files with 49 additions and 33 deletions
controllets/fullsize-page-with-card-controllet/fullsize-page-with-card-controllet.html
  View file @7e83553
... ... @@ -38,7 +38,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
38 38 <div id="fixed" class="fixed" style$="background-color:{{color}}"></div>
39 39 <div id="card" class="card" style$="background-color:{{color}}">
40 40 <template is="dom-if" if="{{_checkUndefined(publicRoom)}}">
41   - <iframe id="public_room_iframe" src="public-room/{{publicRoom}}" width="100%" height="100%"></iframe>
  41 + <iframe id="public_room_iframe" src="/public-room/{{publicRoom}}" width="100%" height="100%"></iframe>
42 42 </template>
43 43 </div>
44 44  
... ... @@ -122,6 +122,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
122 122  
123 123 _computeFixedBackgroundClass: function(color) {
124 124 this.$.fixed = color;
  125 + },
  126 +
  127 + attached: function()
  128 + {
  129 + this.fire('fullsize-page-with-card-controllet_attached');
125 130 }
126 131  
127 132 });
... ...
controllets/generic-cards-container-controllet/generic-cards-container-controllet.html
  View file @7e83553
... ... @@ -91,6 +91,14 @@ Example:
91 91 display: none;
92 92 }
93 93  
  94 + ::content .card_grid .modify{
  95 + display: none;
  96 + }
  97 +
  98 + ::content .card_grid .open{
  99 + display: none;
  100 + }
  101 +
94 102 ::content .empty{
95 103 position: absolute;
96 104 right: 0;
... ...
datalets/leafletjs-datalet/leafletjs-datalet.html
  View file @7e83553
... ... @@ -52,7 +52,7 @@ Example:
52 52 <template>
53 53 <link rel="stylesheet" href="leafletsjs/leaflet.css" />
54 54 <style>
55   - #leafletjs { height: 600px; }
  55 + #leafletjs {height: 600px;}
56 56 </style>
57 57  
58 58 <div id="leafletjs"></div>
... ... @@ -73,32 +73,45 @@ Example:
73 73 * @method transformData
74 74 */
75 75 presentData: function(){
76   -
77   - var coordinates = [];
78   - var isArray = (this.data[0].data[0].constructor === Array) ? true : false;
79 76  
80   - for(var i=0; i<this.data[0].data.length; i++)
81   - {
82   - if(isArray)
83   - coordinates.push([parseFloat(this.data[0].data[i][0]), parseFloat(this.data[0].data[i][1])]);
84   - else
85   - coordinates.push([parseFloat(this.data[0].data[i]), parseFloat(this.data[1].data[i])]);
  77 + var t = this;
  78 + this._component.map = L.map(this._component.$.leafletjs).setView([0, 0], 13, {reset:true});
  79 +
  80 + L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  81 + maxZoom: 18,
  82 + attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
  83 + }).addTo(this._component.map);
  84 +
  85 + setTimeout(function() {
86 86  
87   - var marker = L.marker([coordinates[i][0], coordinates[i][1]]).addTo(this._component.map);
  87 + L.Icon.Default.imagePath = 'http://services.routetopa.eu/DEEalerProvider/COMPONENTS/datalets/leafletjs-datalet/leafletsjs/images';
88 88  
89   - if(this.data.length > 2)
  89 + var coordinates = [];
  90 + var isArray = t.data[0].data[0].constructor === Array;
  91 +
  92 + for(var i=0; i<t.data[0].data.length; i++)
90 93 {
91   - if(this.data[this.data.length - 1].data[i].match(new RegExp("^(http[s]?:\\/\\/(www\\.)?|ftp:\\/\\/(www\\.)?|www\\.){1}([0-9A-Za-z-\\.@:%_\+~#=]+)+((\\.[a-zA-Z]{2,3})+)(/(.)*)?(\\?(.)*)?")))
92   - var popup = L.popup().setContent('<image height="100" width="100" src="' + this.data[this.data.length - 1].data[i] + '" />');
  94 + if(isArray)
  95 + coordinates.push([parseFloat(t.data[0].data[i][0]), parseFloat(t.data[0].data[i][1])]);
93 96 else
94   - var popup = L.popup().setContent('<span>' + this.data[this.data.length - 1].data[i] + '</span>');
95   - marker.bindPopup(popup);
  97 + coordinates.push([parseFloat(t.data[0].data[i]), parseFloat(t.data[1].data[i])]);
  98 +
  99 + var marker = L.marker([coordinates[i][0], coordinates[i][1]]).addTo(t._component.map);
  100 +
  101 + if(t.data.length > 2)
  102 + {
  103 + if(t.data[t.data.length - 1].data[i].match(new RegExp("^(http[s]?:\\/\\/(www\\.)?|ftp:\\/\\/(www\\.)?|www\\.){1}([0-9A-Za-z-\\.@:%_\+~#=]+)+((\\.[a-zA-Z]{2,3})+)(/(.)*)?(\\?(.)*)?")))
  104 + var popup = L.popup().setContent('<image height="100" width="100" src="' + t.data[t.data.length - 1].data[i] + '" />');
  105 + else
  106 + var popup = L.popup().setContent('<span>' + t.data[t.data.length - 1].data[i] + '</span>');
  107 + marker.bindPopup(popup);
  108 + }
96 109 }
97   - }
98 110  
99   - this._component.map.invalidateSize();
100   - this._component.map.fitBounds(coordinates);
101   -
  111 + t._component.map._onResize();
  112 + t._component.map.invalidateSize(false);
  113 + t._component.map.fitBounds(coordinates);
  114 + }, 1000)
102 115 }
103 116 };
104 117  
... ... @@ -148,19 +161,9 @@ Example:
148 161 *
149 162 * @method ready
150 163 */
151   - ready: function(){
152   -
153   - this.map = L.map(this.$.leafletjs).setView([0, 0], 13);
154   -
155   - L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
156   - maxZoom: 18,
157   - attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
158   - }).addTo(this.map);
159   -
160   - L.Icon.Default.imagePath = 'http://services.routetopa.eu/DEEalerProvider/COMPONENTS/datalets/leafletjs-datalet/leafletsjs/images';
161   -
  164 + attached: function(){
162 165 this.behavior = $.extend(true, {}, BaseDataletBehavior, WorkcycleBehavior, AjaxJsonJsonPathBehavior, leafletjsBehavior);
163   - this.async(function(){this.behavior.init(this)},0);
  166 + this.behavior.init(this);
164 167 }
165 168 });
166 169 </script>
... ...