Commit 904a33664ca389771d8fb733f37db540e1ba607f

  • avatar
  • arvind
  • Thu May 31 14:30:09 IST 2012
Framed cloud
  • myVector.js 113 -------------------------------------------++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
  • Diff rendering mode:
  • inline
  • side by side

myVector.js

18 check1: false,18 check1: false,
19 check2: false,19 check2: false,
20 trigger: function() {20 trigger: function() {
21 if(handler.check == false)
22 {
23 handler.check = true;
24 myjson = {"temple":[
25 {"period": "16th century"},
26 {"location":"13.80338 - 77.61067"},
27 {"sthapati":"Shivakumar"},
28 {"innerloc": "MaharangaMandapa"}
29 ],
30 "size": "311110px X 4668 px",
31 "narrative": "Narrative",
32 "muralTradition": "XYZ",
33 "muralTechnique": "Foo",
34 "muralContent": "Bar"
35 };
36 var x = document.getElementById("content");
37 for (var i in myjson)
38 {
39 if(i == "temple")
40 {
41 for(var y =0; y <myjson[i].length;y++)
42 {
43 for(var z in myjson[i][y])
44 {
45 x.innerHTML += z+': '+'<i>'+myjson[i][y][z]+'</i>; ';
46 }
47 }
48 }
49 else{
50 x.innerHTML += i+': '+'<i>'+myjson[i]+'</i>; ';
51 }
52 }
53 }
54 else{
55 var x = document.getElementById("content");
56 x.innerHTML ='';
57 handler.check = false;
58 }
21 // if(handler.check == false)
22 // {
23 // handler.check = true;
24 // myjson = {"temple":[
25 // {"period": "16th century"},
26 // {"location":"13.80338 - 77.61067"},
27 // {"sthapati":"Shivakumar"},
28 // {"innerloc": "MaharangaMandapa"}
29 // ],
30 // "size": "311110px X 4668 px",
31 // "narrative": "Narrative",
32 // "muralTradition": "XYZ",
33 // "muralTechnique": "Foo",
34 // "muralContent": "Bar"
35 // };
36 // var x = document.getElementById("content");
37 // for (var i in myjson)
38 // {
39 // if(i == "temple")
40 // {
41 // for(var y =0; y <myjson[i].length;y++)
42 // {
43 // for(var z in myjson[i][y])
44 // {
45 // x.innerHTML += z+': '+'<i>'+myjson[i][y][z]+'</i>; ';
46 // }
47 // }
48 // }
49 // else{
50 // x.innerHTML += i+': '+'<i>'+myjson[i]+'</i>; ';
51 // }
52 // }
53 // }
54 // else{
55 // var x = document.getElementById("content");
56 // x.innerHTML ='';
57 // handler.check = false;
58 // }
59 onMyFeatureSelect(map);
59 },60 },
60 trigger1: function() {61 trigger1: function() {
61 if(handler.check1 == false)62 if(handler.check1 == false)
……
129};129};
130function onFeatureSelect(feature)130function onFeatureSelect(feature)
131{131{
132 z = new OpenLayers.Popup(
132 z = new OpenLayers.Popup.FramedCloud(
133 "test",133 "test",
134 new OpenLayers.LonLat(4263.0000, -1630.33337),
134 feature.geometry.getBounds().getCenterLonLat(),
135 new OpenLayers.Size(640,480),135 new OpenLayers.Size(640,480),
136 '<iframe width="480" height="360" src="http://www.youtube.com/embed/WwNUnmZ_aww" frameborder="0" allowfullscreen></iframe>',true);
136 '<iframe width="480" height="360" src="http://www.youtube.com/embed/WwNUnmZ_aww" frameborder="0" allowfullscreen></iframe>',null,true);
137 feature.popup = z;137 feature.popup = z;
138 z.panMapIfOutOfView = true;138 z.panMapIfOutOfView = true;
139 map.addPopup(z);139 map.addPopup(z);
140}140}
141function onMyFeatureSelect(feature)
142{
143 z = new OpenLayers.Popup.FramedCloud(
144 "test",
145 new OpenLayers.LonLat(15555, -2334), // Always should be at the center of the map, not the center of viewport.
146 new OpenLayers.Size(640,480),
147 "<pre><b><center>Temple</center></b>\n"+
148 "period: 16th century\n"+
149 "location: 13.80338 - 77.61067\n"+
150 "sthapati: Shivakumar\n"+
151 "innerloc: MaharangaMandapa\n"+
152 "size: 311110px X 4668 px\n"+
153 "narrative: Narrative\n"+
154 "muralTradition: XYZ\n"+
155 "muralTechnique: Foo\n"+
156 "muralContent: Bar</pre>"
157 ,null,true);
158 feature.popup = z;
159 z.panMapIfOutOfView = true;
160 map.addPopup(z);
161}
141function init(){162function init(){
142 var options = {163 var options = {
143 controls: [],164 controls: [],
……
184 box = new OpenLayers.Feature.Vector(bounds.toGeometry());184 box = new OpenLayers.Feature.Vector(bounds.toGeometry());
185 box2.addFeatures(box);185 box2.addFeatures(box);
186 }186 }
187 box3 = new OpenLayers.Layer.Vector( "Boxes" );
187 box3 = new OpenLayers.Layer.Vector( "Boxes");
188 for (var i = 0; i < box_extents1.length; i++) {188 for (var i = 0; i < box_extents1.length; i++) {
189 ext = box_extents1[i];189 ext = box_extents1[i];
190 bounds = OpenLayers.Bounds.fromArray(ext);190 bounds = OpenLayers.Bounds.fromArray(ext);
……
197 selectControl = new OpenLayers.Control.SelectFeature(box3,197 selectControl = new OpenLayers.Control.SelectFeature(box3,
198 {onSelect: onFeatureSelect});198 {onSelect: onFeatureSelect});
199 199
200 MapselectControl = new OpenLayers.Control.SelectFeature(map,
201 {onSelect: onMyFeatureSelect});
202
200 drawControls = {203 drawControls = {
201 box : new OpenLayers.Control.DrawFeature(boxes,204 box : new OpenLayers.Control.DrawFeature(boxes,
202 OpenLayers.Handler.RegularPolygon, {205 OpenLayers.Handler.RegularPolygon, {
……
209 }209 }
210 }210 }
211 ),211 ),
212 select: selectControl
212 select: selectControl,
213 mySelect: MapselectControl
213 };214 };
214 map.zoomToExtent( mapBounds ); 215 map.zoomToExtent( mapBounds );
215 for(var key in drawControls){216 for(var key in drawControls){
216 map.addControl(drawControls[key]);217 map.addControl(drawControls[key]);
217 }218 }
218 drawControls['select'].activate();219 drawControls['select'].activate();
220 drawControls['mySelect'].activate();
219 addLabel('3759.0000','-1274.33337','Face');221 addLabel('3759.0000','-1274.33337','Face');
220 addLabel('3719','-1771','Jewelery');222 addLabel('3719','-1771','Jewelery');
221 addLabel('4263.0000','-1630.33337', 'Video')223 addLabel('4263.0000','-1630.33337', 'Video')