~shikharkohli/sahana-eden/gsoc1

<ul id="modulenav"><li style="float: left;"><div class="hoverable"><a href="/eden/default/open_module?id=1"><span class="S3menulogo"></span></a><span><a class="S3menuHome" href="/eden/default/open_module?id=1">Sahana Home</a></span></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/default/open_module?id=2">Administration</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/default/open_module?id=3">Mapping</a></div></li><li style="float: left;"><div class="hoverable"><a href="#">Person Management</a></div><ul><li><a href="/eden/default/open_module?id=5">Person Registry</a></li><li><a href="/eden/default/open_module?id=8">Missing Persons Registry</a></li><li><a href="/eden/default/open_module?id=9">Disaster Victim Registry</a></li><li><a href="/eden/default/open_module?id=11">Disaster Victim Identification</a></li></ul></li><li style="float: left;"><div class="hoverable"><a href="#">Aid Management</a></div><ul><li><a href="/eden/default/open_module?id=10">Human Resources</a></li><li><a href="/eden/default/open_module?id=6">Organization Registry</a></li><li><a href="/eden/default/open_module?id=12">Shelter Registry</a></li><li><a href="/eden/default/open_module?id=13">Volunteer Registry</a></li><li><a href="/eden/default/open_module?id=14">Request Management</a></li><li><a href="/eden/default/open_module?id=15">Budgeting Module</a></li><li><a href="/eden/default/open_module?id=17">Delphi Decision Maker</a></li><li><a href="/eden/default/open_module?id=4">Media Manager</a></li><li><a href="/eden/default/open_module?id=19">Hospital Management</a></li><li><a href="/eden/default/open_module?id=20">Ticketing Module</a></li></ul></li><li style="float: left;"><div class="hoverable"><a href="/eden/default/open_module?id=16">Messaging Module</a></div></li><li style="float: right;"><div class="hoverable"><a href="#null">Logged-in as: Fran Boon</a></div><ul><li><a href="/eden/default/user/logout">Logout</a></li><li><a href="/eden/default/user/profile">Edit Profile</a></li><li><a href="/eden/default/user/change_password">Change Password</a></li></ul></li><li style="float: right;"><div class="hoverable"><a href="/eden/default/contact">Contact us</a></div><ul><li><a href="/eden/default/about">About</a></li></ul></li></ul>

</div>

<ul id="subnav"><li style="float: left;"><div class="hoverable"><a href="/eden/gis/map_viewing_client">Map Viewing Client</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/gis/map_service_catalogue">Map Service Catalogue</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/media/bulk_upload">Bulk Uploader</a></div></li></ul>

</div>

<ul id="modulenav"><li style="float: left;"><div class="hoverable"><a href="/eden/default/index"><span class="S3menulogo"></span></a><span><a class="S3menuHome" href="/eden/default/index">Home</a></span></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/gis/index">Map</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/mpr/index">Missing Persons</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/rms/index">Requests</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/hms/index">Hospitals</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/vol/index">Volunteers</a></div></li><li style="float: left;"><div class="hoverable"><a href="#">more</a></div><ul><li><a href="/eden/org/index">Organization Registry</a></li><li><a href="/eden/cr/index">Shelter Registry</a></li><li><a href="/eden/ticket/index">Ticketing Module</a></li><li><a href="/eden/pr/index">Person Registry</a></li><li><a href="/eden/dvi/index">Disaster Victim Identification</a></li><li><a href="/eden/doc/index">Document Library</a></li><li><a href="/eden/delphi/index">Delphi Decision Maker</a></li><li><a href="/eden/irs/index">Incident Reporting</a></li><li><a href="/eden/budget/index">Budgeting Module</a></li><li><a href="/eden/msg/index">Messaging</a></li></ul></li><li style="float: right;"><div class="hoverable"><a href="#">Help</a></div><ul><li><a href="/eden/default/contact">Contact us</a></li><li><a href="/eden/default/about">About</a></li></ul></li><li style="float: right;"><div class="hoverable"><a href="/eden/default/user/login">Login</a></div><ul><li><a href="/eden/default/user/login">Login</a></li><li><a href="/eden/default/user/register">Register</a></li><li><a href="/eden/default/user/retrieve_password">Lost Password</a></li></ul></li></ul>

</div>

<ul id="subnav"><li style="float: left;"><div class="hoverable"><a href="/eden/gis/map_service_catalogue">Service Catalogue</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/gis/location">Locations</a></div></li><li style="float: left;"><div class="hoverable"><a href="/eden/gis/map_viewing_client">Map</a></div></li></ul>

</div>

</td></tr></table>

<script><!--

var map, mapPanel, toolbar;

<div id="map_wrapper"><link charset="utf-8" href="/eden/static/scripts/ext/resources/css/ext-all.min.css" media="screen" rel="stylesheet" type="text/css" /><link charset="utf-8" href="/eden/static/styles/gis/gis.min.css" media="screen" rel="stylesheet" type="text/css" /><div id="rheader_tabs"><span class="rheader_tab_other"><a href="/eden/gis/config/1/display">Defaults</a></span><span class="rheader_tab_other"><a href="/eden/gis/map_service_catalogue">Layers</a></span><span class="rheader_tab_other"><a href="/eden/gis/feature_class">Feature Classes</a></span><span class="rheader_tab_other"><a href="/eden/gis/feature_group">Feature Groups</a></span><span class="rheader_tab_other"><a href="/eden/gis/marker">Markers</a></span><span class="rheader_tab_other"><a href="/eden/gis/apikey">Keys</a></span><span class="rheader_tab_other"><a href="/eden/gis/projection">Projections</a></span></div><div id="map_panel"></div><table><tr><td style="border: 0px none ;" valign="top"><div id="status_osm"></div></td><td style="border: 0px none ;" valign="top"><div id="status_georss"></div><div id="status_kml"></div><div id="status_files"></div></td></tr></table><script src="/eden/static/scripts/ext/adapter/jquery/ext-jquery-adapter.js" type="text/javascript"></script><script src="/eden/static/scripts/ext/ext-all.js" type="text/javascript"></script><script src="/eden/static/scripts/gis/OpenLayers.js" type="text/javascript"></script><script src="/eden/static/scripts/gis/OpenStreetMap.js" type="text/javascript"></script><script src="/eden/static/scripts/gis/RemoveFeature.js" type="text/javascript"></script><script src="/eden/static/scripts/gis/GeoExt.js" type="text/javascript"></script><script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAgB-1pyZu7pKAZrMGv3nksRRi_j0U6kJrkFvY4-OX2XYmEAa76BSH6SJQ1KrBv-RzS5vygeQosHsnNw" type="text/javascript"></script><script src="http://api.maps.yahoo.com/ajaxymap?v=3.8&appid=euzuro-openlayers" type="text/javascript"></script><script><!--

var map, mapPanel, legendPanel, toolbar;

var currentFeature, popupControl, highlightControl;

var layerTree, wmsBrowser;

var wmsBrowser;

var printProvider;

var allLayers = new Array();

OpenLayers.ImgPath = '/eden/static/img/gis/openlayers/';

// avoid pink tiles

// See http://crschmidt.net/~crschmidt/spherical_mercator.html#reprojecting-points

var proj4326 = new OpenLayers.Projection('EPSG:4326');

var projection_current = new OpenLayers.Projection('EPSG:900913');

var lat = 18.58;

var lon = -72.42;

var center = new OpenLayers.LonLat(lon, lat);

center.transform(proj4326, projection_current);

var lat = 51.8;

var lon = -1.3;

var center = new OpenLayers.LonLat(lon, lat);

center.transform(proj4326, projection_current);

var options = {

displayProjection: proj4326,

projection: projection_current,

function addLayers(map) {

// Base Layers

var mapnik = new OpenLayers.Layer.TMS( 'OSM Mapnik', 'http://tile.openstreetmap.org/', {type: 'png', getURL: osm_getTileURL, displayOutsideMaxExtent: true, attribution: '<a href="http://www.openstreetmap.org/">OpenStreetMap</a>' } );

// OSM

var mapnik = new OpenLayers.Layer.OSM.Mapnik('OSM Mapnik', {

keyid: 'mapnik',

displayOutsideMaxExtent: true,

wrapDateLine: true,

layerCode: 'M'

});

map.addLayer(mapnik);

var osmarender = new OpenLayers.Layer.OSM.Osmarender('OSM Osmarender', {

keyid: 'osmarender',

displayOutsideMaxExtent: true,

wrapDateLine: true,

layerCode: 'O'

});

map.addLayer(osmarender);

// Google

var googlesat = new OpenLayers.Layer.Google( 'Google Satellite' , {type: G_SATELLITE_MAP, 'sphericalMercator': true } );

map.addLayer(googlesat);

// Yahoo

var yahoosat = new OpenLayers.Layer.Yahoo( 'Yahoo Satellite' , {type: YAHOO_MAP_SAT, 'sphericalMercator': true } );

map.addLayer(yahoosat);

// Bing

// TMS

// WMS

// XYZ

// JS

100

// Overlays

100

101

var max_w = 25;

101

102

var max_h = 35;

102

var format_kml = new OpenLayers.Format.KML({

103

extractStyles: true,

104

extractAttributes: true,

105

maxDepth: 2

106

})

107

var format_georss = new OpenLayers.Format.GeoRSS();

108

103

var width, height;

104

var icon_img = new Image();

105

var iconURL;

106

109

107

// Features

108

109

var featureLayers = new Array();

110

var features = [];

111

var parser = new OpenLayers.Format.WKT();

112

var geom, featureVec;

113

114

function addFeature(feature_id, name, feature_class, geom, iconURL) {

115

geom = geom.transform(proj4326, projection_current);

116

// Set icon dims

117

icon_img.src = iconURL;

118

width = icon_img.width;

119

height = icon_img.height;

120

if(width > max_w){

121

height = ((max_w / width) * height);

122

width = max_w;

123

}

124

if(height > max_h){

125

width = ((max_h / height) * width);

126

height = max_h;

127

}

128

// Needs to be uniquely instantiated

129

var style_marker = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);

130

style_marker.graphicOpacity = 1;

131

style_marker.graphicWidth = width;

132

style_marker.graphicHeight = height;

133

style_marker.graphicXOffset = -(width / 2);

134

style_marker.graphicYOffset = -height;

135

style_marker.externalGraphic = iconURL;

136

// Create Feature Vector

137

var featureVec = new OpenLayers.Feature.Vector(geom, null, style_marker);

138

featureVec.fid = feature_id;

139

featureVec.attributes.name = name;

140

featureVec.attributes.feature_class = feature_class;

141

return featureVec;

142

}

143

144

function loadDetails(url, id, popup) {

145

//$.getS3(

146

$.get(

147

url,

148

function(data) {

149

$('#' + id + '_contentDiv').html(data);

150

popup.updateSize();

151

152

'html'

153

);

154

}

155

156

features = [];

157

// Style Rule For Clusters

158

var style_cluster = new OpenLayers.Style({

159

pointRadius: "${radius}",

160

fillColor: "#8087ff",

161

fillOpacity: 1,

162

strokeColor: "#2b2f76",

163

strokeWidth: 2,

164

strokeOpacity: 1

165

}, {

166

context: {

167

radius: function(feature) {

168

// Size For Unclustered Point

169

var pix = 6;

170

// Size For Clustered Point

171

if(feature.cluster) {

172

pix = Math.min(feature.attributes.count, 7) + 4;

173

}

174

return pix;

175

}

176

}

177

});

178

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

179

var featureClusterStyleMap = new OpenLayers.StyleMap({

180

"default": style_cluster,

181

"select": {

182

fillColor: "#ffdc33",

183

strokeColor: "#ff9933"

184

}

185

});

186

187

var featureLayerTowns = new OpenLayers.Layer.Vector(

188

'Towns',

189

{

190

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

191

styleMap: featureClusterStyleMap

192

}

193

);

194

featureLayerTowns.setVisibility(false);

195

map.addLayer(featureLayerTowns);

196

featureLayerTowns.events.on({

197

"featureselected": onFeatureSelectTowns,

198

"featureunselected": onFeatureUnselect

199

});

200

featureLayers.push(featureLayerTowns);

201

202

function onFeatureSelectTowns(event) {

203

// unselect any previous selections

204

tooltipUnselect(event);

205

var feature = event.feature;

206

if(feature.cluster) {

207

// Cluster

208

// Create Empty Array to Contain Feature Names

209

var clusterFeaturesArray = [];

210

// Add Each Feature To Array

211

for (var i = 0; i < feature.cluster.length; i++)

212

{

213

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

214

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

215

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

216

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

217

var clusterFeaturesArrayID = feature.cluster[i].fid;

218

219

// ToDo: Refine

220

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

221

222

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

223

};

224

} else {

225

// Single Feature

226

var selectedFeature = feature;

227

var id = 'featureLayerTownsPopup';

228

var popup = new OpenLayers.Popup.FramedCloud(

229

id,

230

feature.geometry.getBounds().getCenterLonLat(),

231

new OpenLayers.Size(200, 200),

232

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

233

null,

234

true,

235

onPopupClose

236

);

237

feature.popup = popup;

238

map.addPopup(popup);

239

// call AJAX to get the contentHTML

240

var uuid = feature.fid;

241

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

242

}

243

}

244

245

featureLayerTowns.addFeatures(features);

246

247

features = [];

248

// Style Rule For Clusters

249

var style_cluster = new OpenLayers.Style({

250

pointRadius: "${radius}",

251

fillColor: "#8087ff",

252

fillOpacity: 1,

253

strokeColor: "#2b2f76",

254

strokeWidth: 2,

255

strokeOpacity: 1

256

}, {

257

context: {

258

radius: function(feature) {

259

// Size For Unclustered Point

260

var pix = 6;

261

// Size For Clustered Point

262

if(feature.cluster) {

263

pix = Math.min(feature.attributes.count, 7) + 4;

264

}

265

return pix;

266

}

267

}

268

});

269

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

270

var featureClusterStyleMap = new OpenLayers.StyleMap({

271

"default": style_cluster,

272

"select": {

273

fillColor: "#ffdc33",

274

strokeColor: "#ff9933"

275

}

276

});

277

278

var featureLayerTransport = new OpenLayers.Layer.Vector(

279

'Transport',

280

{

281

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

282

styleMap: featureClusterStyleMap

283

}

284

);

285

featureLayerTransport.setVisibility(false);

286

map.addLayer(featureLayerTransport);

287

featureLayerTransport.events.on({

288

"featureselected": onFeatureSelectTransport,

289

"featureunselected": onFeatureUnselect

290

});

291

featureLayers.push(featureLayerTransport);

292

293

function onFeatureSelectTransport(event) {

294

// unselect any previous selections

295

tooltipUnselect(event);

296

var feature = event.feature;

297

if(feature.cluster) {

298

// Cluster

299

// Create Empty Array to Contain Feature Names

300

var clusterFeaturesArray = [];

301

// Add Each Feature To Array

302

for (var i = 0; i < feature.cluster.length; i++)

303

{

304

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

305

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

306

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

307

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

308

var clusterFeaturesArrayID = feature.cluster[i].fid;

309

310

// ToDo: Refine

311

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

312

313

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

314

};

315

} else {

316

// Single Feature

317

var selectedFeature = feature;

318

var id = 'featureLayerTransportPopup';

319

var popup = new OpenLayers.Popup.FramedCloud(

320

id,

321

feature.geometry.getBounds().getCenterLonLat(),

322

new OpenLayers.Size(200, 200),

323

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

324

null,

325

true,

326

onPopupClose

327

);

328

feature.popup = popup;

329

map.addPopup(popup);

330

// call AJAX to get the contentHTML

331

var uuid = feature.fid;

332

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

333

}

334

}

335

336

featureLayerTransport.addFeatures(features);

337

338

features = [];

339

// Style Rule For Clusters

340

var style_cluster = new OpenLayers.Style({

341

pointRadius: "${radius}",

342

fillColor: "#8087ff",

343

fillOpacity: 1,

344

strokeColor: "#2b2f76",

345

strokeWidth: 2,

346

strokeOpacity: 1

347

}, {

348

context: {

349

radius: function(feature) {

350

// Size For Unclustered Point

351

var pix = 6;

352

// Size For Clustered Point

353

if(feature.cluster) {

354

pix = Math.min(feature.attributes.count, 7) + 4;

355

}

356

return pix;

357

}

358

}

359

});

360

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

361

var featureClusterStyleMap = new OpenLayers.StyleMap({

362

"default": style_cluster,

363

"select": {

364

fillColor: "#ffdc33",

365

strokeColor: "#ff9933"

366

}

367

});

368

369

var featureLayerProgramme = new OpenLayers.Layer.Vector(

370

'Programme',

371

{

372

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

373

styleMap: featureClusterStyleMap

374

}

375

);

376

featureLayerProgramme.setVisibility(false);

377

map.addLayer(featureLayerProgramme);

378

featureLayerProgramme.events.on({

379

"featureselected": onFeatureSelectProgramme,

380

"featureunselected": onFeatureUnselect

381

});

382

featureLayers.push(featureLayerProgramme);

383

384

function onFeatureSelectProgramme(event) {

385

// unselect any previous selections

386

tooltipUnselect(event);

387

var feature = event.feature;

388

if(feature.cluster) {

389

// Cluster

390

// Create Empty Array to Contain Feature Names

391

var clusterFeaturesArray = [];

392

// Add Each Feature To Array

393

for (var i = 0; i < feature.cluster.length; i++)

394

{

395

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

396

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

397

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

398

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

399

var clusterFeaturesArrayID = feature.cluster[i].fid;

400

401

// ToDo: Refine

402

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

403

404

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

405

};

406

} else {

407

// Single Feature

408

var selectedFeature = feature;

409

var id = 'featureLayerProgrammePopup';

410

var popup = new OpenLayers.Popup.FramedCloud(

411

id,

412

feature.geometry.getBounds().getCenterLonLat(),

413

new OpenLayers.Size(200, 200),

414

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

415

null,

416

true,

417

onPopupClose

418

);

419

feature.popup = popup;

420

map.addPopup(popup);

421

// call AJAX to get the contentHTML

422

var uuid = feature.fid;

423

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

424

}

425

}

426

427

featureLayerProgramme.addFeatures(features);

428

429

features = [];

430

// Style Rule For Clusters

431

var style_cluster = new OpenLayers.Style({

432

pointRadius: "${radius}",

433

fillColor: "#8087ff",

434

fillOpacity: 1,

435

strokeColor: "#2b2f76",

436

strokeWidth: 2,

437

strokeOpacity: 1

438

}, {

439

context: {

440

radius: function(feature) {

441

// Size For Unclustered Point

442

var pix = 6;

443

// Size For Clustered Point

444

if(feature.cluster) {

445

pix = Math.min(feature.attributes.count, 7) + 4;

446

}

447

return pix;

448

}

449

}

450

});

451

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

452

var featureClusterStyleMap = new OpenLayers.StyleMap({

453

"default": style_cluster,

454

"select": {

455

fillColor: "#ffdc33",

456

strokeColor: "#ff9933"

457

}

458

});

459

460

var featureLayerHospitals = new OpenLayers.Layer.Vector(

461

'Hospitals',

462

{

463

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

464

styleMap: featureClusterStyleMap

465

}

466

);

467

featureLayerHospitals.setVisibility(false);

468

map.addLayer(featureLayerHospitals);

469

featureLayerHospitals.events.on({

470

"featureselected": onFeatureSelectHospitals,

471

"featureunselected": onFeatureUnselect

472

});

473

featureLayers.push(featureLayerHospitals);

474

475

function onFeatureSelectHospitals(event) {

476

// unselect any previous selections

477

tooltipUnselect(event);

478

var feature = event.feature;

479

if(feature.cluster) {

480

// Cluster

481

// Create Empty Array to Contain Feature Names

482

var clusterFeaturesArray = [];

483

// Add Each Feature To Array

484

for (var i = 0; i < feature.cluster.length; i++)

485

{

486

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

487

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

488

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

489

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

490

var clusterFeaturesArrayID = feature.cluster[i].fid;

491

492

// ToDo: Refine

493

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

494

495

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

496

};

497

} else {

498

// Single Feature

499

var selectedFeature = feature;

500

var id = 'featureLayerHospitalsPopup';

501

var popup = new OpenLayers.Popup.FramedCloud(

502

id,

503

feature.geometry.getBounds().getCenterLonLat(),

504

new OpenLayers.Size(200, 200),

505

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

506

null,

507

true,

508

onPopupClose

509

);

510

feature.popup = popup;

511

map.addPopup(popup);

512

// call AJAX to get the contentHTML

513

var uuid = feature.fid;

514

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

515

}

516

}

517

518

featureLayerHospitals.addFeatures(features);

519

520

features = [];

521

// Style Rule For Clusters

522

var style_cluster = new OpenLayers.Style({

523

pointRadius: "${radius}",

524

fillColor: "#8087ff",

525

fillOpacity: 1,

526

strokeColor: "#2b2f76",

527

strokeWidth: 2,

528

strokeOpacity: 1

529

}, {

530

context: {

531

radius: function(feature) {

532

// Size For Unclustered Point

533

var pix = 6;

534

// Size For Clustered Point

535

if(feature.cluster) {

536

pix = Math.min(feature.attributes.count, 7) + 4;

537

}

538

return pix;

539

}

540

}

541

});

542

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

543

var featureClusterStyleMap = new OpenLayers.StyleMap({

544

"default": style_cluster,

545

"select": {

546

fillColor: "#ffdc33",

547

strokeColor: "#ff9933"

548

}

549

});

550

110

551

var featureLayerOffices = new OpenLayers.Layer.Vector(

111

552

'Offices',

112

553

{

113

projection: proj4326,

114

strategies: [ new OpenLayers.Strategy.Fixed(), new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

115

protocol: new OpenLayers.Protocol.HTTP({

116

url: '/eden/default/download/gis_cache.file.Offices.kml',

117

format: format_kml

118

})

554

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

555

styleMap: featureClusterStyleMap

119

556

}

120

557

);

121

558

featureLayerOffices.setVisibility(false);

122

559

map.addLayer(featureLayerOffices);

123

560

featureLayerOffices.events.on({

124

"featureselected": onKmlFeatureSelectOffices,

125

"featureunselected": onFeatureUnselect

126

});

127

allLayers.push(featureLayerOffices);

561

"featureselected": onFeatureSelectOffices,

562

"featureunselected": onFeatureUnselect

563

});

564

featureLayers.push(featureLayerOffices);

565

566

function onFeatureSelectOffices(event) {

567

// unselect any previous selections

568

tooltipUnselect(event);

569

var feature = event.feature;

570

if(feature.cluster) {

571

// Cluster

572

// Create Empty Array to Contain Feature Names

573

var clusterFeaturesArray = [];

574

// Add Each Feature To Array

575

for (var i = 0; i < feature.cluster.length; i++)

576

{

577

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

578

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

579

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

580

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

581

var clusterFeaturesArrayID = feature.cluster[i].fid;

582

583

// ToDo: Refine

584

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

585

586

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

587

};

588

} else {

589

// Single Feature

590

var selectedFeature = feature;

591

var id = 'featureLayerOfficesPopup';

592

var popup = new OpenLayers.Popup.FramedCloud(

593

id,

594

feature.geometry.getBounds().getCenterLonLat(),

595

new OpenLayers.Size(200, 200),

596

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

597

null,

598

true,

599

onPopupClose

600

);

601

feature.popup = popup;

602

map.addPopup(popup);

603

// call AJAX to get the contentHTML

604

var uuid = feature.fid;

605

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

606

}

607

}

608

609

featureLayerOffices.addFeatures(features);

610

611

features = [];

612

// Style Rule For Clusters

613

var style_cluster = new OpenLayers.Style({

614

pointRadius: "${radius}",

615

fillColor: "#8087ff",

616

fillOpacity: 1,

617

strokeColor: "#2b2f76",

618

strokeWidth: 2,

619

strokeOpacity: 1

620

}, {

621

context: {

622

radius: function(feature) {

623

// Size For Unclustered Point

624

var pix = 6;

625

// Size For Clustered Point

626

if(feature.cluster) {

627

pix = Math.min(feature.attributes.count, 7) + 4;

628

}

629

return pix;

630

}

631

}

632

});

633

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

634

var featureClusterStyleMap = new OpenLayers.StyleMap({

635

"default": style_cluster,

636

"select": {

637

fillColor: "#ffdc33",

638

strokeColor: "#ff9933"

639

}

640

});

641

642

var featureLayerPeople = new OpenLayers.Layer.Vector(

643

'People',

644

{

645

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

646

styleMap: featureClusterStyleMap

647

}

648

);

649

featureLayerPeople.setVisibility(false);

650

map.addLayer(featureLayerPeople);

651

featureLayerPeople.events.on({

652

"featureselected": onFeatureSelectPeople,

653

"featureunselected": onFeatureUnselect

654

});

655

featureLayers.push(featureLayerPeople);

656

657

function onFeatureSelectPeople(event) {

658

// unselect any previous selections

659

tooltipUnselect(event);

660

var feature = event.feature;

661

if(feature.cluster) {

662

// Cluster

663

// Create Empty Array to Contain Feature Names

664

var clusterFeaturesArray = [];

665

// Add Each Feature To Array

666

for (var i = 0; i < feature.cluster.length; i++)

667

{

668

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

669

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

670

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

671

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

672

var clusterFeaturesArrayID = feature.cluster[i].fid;

673

674

// ToDo: Refine

675

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

676

677

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

678

};

679

} else {

680

// Single Feature

681

var selectedFeature = feature;

682

var id = 'featureLayerPeoplePopup';

683

var popup = new OpenLayers.Popup.FramedCloud(

684

id,

685

feature.geometry.getBounds().getCenterLonLat(),

686

new OpenLayers.Size(200, 200),

687

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

688

null,

689

true,

690

onPopupClose

691

);

692

feature.popup = popup;

693

map.addPopup(popup);

694

// call AJAX to get the contentHTML

695

var uuid = feature.fid;

696

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

697

}

698

}

699

700

featureLayerPeople.addFeatures(features);

701

702

features = [];

703

// Style Rule For Clusters

704

var style_cluster = new OpenLayers.Style({

705

pointRadius: "${radius}",

706

fillColor: "#8087ff",

707

fillOpacity: 1,

708

strokeColor: "#2b2f76",

709

strokeWidth: 2,

710

strokeOpacity: 1

711

}, {

712

context: {

713

radius: function(feature) {

714

// Size For Unclustered Point

715

var pix = 6;

716

// Size For Clustered Point

717

if(feature.cluster) {

718

pix = Math.min(feature.attributes.count, 7) + 4;

719

}

720

return pix;

721

}

722

}

723

});

724

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

725

var featureClusterStyleMap = new OpenLayers.StyleMap({

726

"default": style_cluster,

727

"select": {

728

fillColor: "#ffdc33",

729

strokeColor: "#ff9933"

730

}

731

});

732

733

var featureLayerProjects = new OpenLayers.Layer.Vector(

734

'Projects',

735

{

736

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

737

styleMap: featureClusterStyleMap

738

}

739

);

740

featureLayerProjects.setVisibility(false);

741

map.addLayer(featureLayerProjects);

742

featureLayerProjects.events.on({

743

"featureselected": onFeatureSelectProjects,

744

"featureunselected": onFeatureUnselect

745

});

746

featureLayers.push(featureLayerProjects);

747

748

function onFeatureSelectProjects(event) {

749

// unselect any previous selections

750

tooltipUnselect(event);

751

var feature = event.feature;

752

if(feature.cluster) {

753

// Cluster

754

// Create Empty Array to Contain Feature Names

755

var clusterFeaturesArray = [];

756

// Add Each Feature To Array

757

for (var i = 0; i < feature.cluster.length; i++)

758

{

759

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

760

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

761

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

762

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

763

var clusterFeaturesArrayID = feature.cluster[i].fid;

764

765

// ToDo: Refine

766

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

767

768

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

769

};

770

} else {

771

// Single Feature

772

var selectedFeature = feature;

773

var id = 'featureLayerProjectsPopup';

774

var popup = new OpenLayers.Popup.FramedCloud(

775

id,

776

feature.geometry.getBounds().getCenterLonLat(),

777

new OpenLayers.Size(200, 200),

778

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

779

null,

780

true,

781

onPopupClose

782

);

783

feature.popup = popup;

784

map.addPopup(popup);

785

// call AJAX to get the contentHTML

786

var uuid = feature.fid;

787

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

788

}

789

}

790

791

featureLayerProjects.addFeatures(features);

792

793

features = [];

794

// Style Rule For Clusters

795

var style_cluster = new OpenLayers.Style({

796

pointRadius: "${radius}",

797

fillColor: "#8087ff",

798

fillOpacity: 1,

799

strokeColor: "#2b2f76",

800

strokeWidth: 2,

801

strokeOpacity: 1

802

}, {

803

context: {

804

radius: function(feature) {

805

// Size For Unclustered Point

806

var pix = 6;

807

// Size For Clustered Point

808

if(feature.cluster) {

809

pix = Math.min(feature.attributes.count, 7) + 4;

810

}

811

return pix;

812

}

813

}

814

});

815

// Define StyleMap, Using 'style_cluster' rule for 'default' styling intent

816

var featureClusterStyleMap = new OpenLayers.StyleMap({

817

"default": style_cluster,

818

"select": {

819

fillColor: "#ffdc33",

820

strokeColor: "#ff9933"

821

}

822

});

823

824

var featureLayerVehicles = new OpenLayers.Layer.Vector(

825

'Vehicles',

826

{

827

strategies: [ new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

828

styleMap: featureClusterStyleMap

829

}

830

);

831

featureLayerVehicles.setVisibility(false);

832

map.addLayer(featureLayerVehicles);

833

featureLayerVehicles.events.on({

834

"featureselected": onFeatureSelectVehicles,

835

"featureunselected": onFeatureUnselect

836

});

837

featureLayers.push(featureLayerVehicles);

838

839

function onFeatureSelectVehicles(event) {

840

// unselect any previous selections

841

tooltipUnselect(event);

842

var feature = event.feature;

843

if(feature.cluster) {

844

// Cluster

845

// Create Empty Array to Contain Feature Names

846

var clusterFeaturesArray = [];

847

// Add Each Feature To Array

848

for (var i = 0; i < feature.cluster.length; i++)

849

{

850

var clusterFeaturesArrayName = feature.cluster[i].attributes.name;

851

var clusterFeaturesArrayType = feature.cluster[i].attributes.feature_class;

852

var clusterFeaturesArrayX = feature.cluster[i].geometry.x;

853

var clusterFeaturesArrayY = feature.cluster[i].geometry.y;

854

var clusterFeaturesArrayID = feature.cluster[i].fid;

855

856

// ToDo: Refine

857

var clusterFeaturesArrayEntry = "<li>" + clusterFeaturesArrayName + "</li>";

858

859

clusterFeaturesArray.push(clusterFeaturesArrayEntry);

860

};

861

} else {

862

// Single Feature

863

var selectedFeature = feature;

864

var id = 'featureLayerVehiclesPopup';

865

var popup = new OpenLayers.Popup.FramedCloud(

866

id,

867

feature.geometry.getBounds().getCenterLonLat(),

868

new OpenLayers.Size(200, 200),

869

"Loading...<img src='/eden/static/img/ajax-loader.gif' border=0>",

870

null,

871

true,

872

onPopupClose

873

);

874

feature.popup = popup;

875

map.addPopup(popup);

876

// call AJAX to get the contentHTML

877

var uuid = feature.fid;

878

loadDetails('/eden/gis/location/read.popup?location.id=' + '?location.uid=' + uuid, id, popup);

879

}

880

}

881

882

featureLayerVehicles.addFeatures(features);

883

884

allLayers = allLayers.concat(featureLayers);

885

128

886

129

887

// GeoRSS

130

var georssLayers = new Array();

131

132

function onGeorssFeatureSelect(event) {

133

// unselect any previous selections

134

tooltipUnselect(event);

135

var feature = event.feature;

136

var selectedFeature = feature;

137

if (undefined == feature.attributes.description) {

138

var popup = new OpenLayers.Popup.FramedCloud("chicken",

139

feature.geometry.getBounds().getCenterLonLat(),

140

new OpenLayers.Size(200,200),

141

"<h2>" + feature.attributes.title + "</h2>",

142

null, true, onPopupClose);

143

} else {

144

var popup = new OpenLayers.Popup.FramedCloud("chicken",

145

feature.geometry.getBounds().getCenterLonLat(),

146

new OpenLayers.Size(200,200),

147

"<h2>" + feature.attributes.title + "</h2>" + feature.attributes.description,

148

null, true, onPopupClose);

149

};

150

feature.popup = popup;

151

popup.feature = feature;

152

map.addPopup(popup);

153

}

154

155

function addGeorssLayerEarthquakes() {

156

var iconURL = "/eden/default/download/gis_marker.image.Geo_Earth_Quake_Epicenter.png";

157

var style_marker = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);

158

style_marker.graphicOpacity = 1;

159

var icon_img = new Image();

160

icon_img.src = iconURL;

161

var width = icon_img.width;

162

var height = icon_img.height;

163

if(width > max_w){

164

height = ((max_w / width) * height);

165

width = max_w;

166

}

167

if(height > max_h){

168

width = ((max_h / height) * width);

169

height = max_h;

170

}

171

style_marker.graphicWidth = width;

172

style_marker.graphicHeight = height;

173

style_marker.graphicXOffset = -(width / 2);

174

style_marker.graphicYOffset = -height;

175

style_marker.externalGraphic = iconURL;

176

var georssLayerEarthquakes = new OpenLayers.Layer.Vector( "Earthquakes", {

177

projection: proj4326,

178

strategies: [ new OpenLayers.Strategy.Fixed(), new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

179

style: style_marker,

180

protocol: new OpenLayers.Protocol.HTTP({

181

url: "/eden/default/download/gis_cache.file.Earthquakes.rss",

182

format: format_georss

183

})

184

});

185

georssLayerEarthquakes.setVisibility(false);

186

187

map.addLayer(georssLayerEarthquakes);

188

georssLayers.push(georssLayerEarthquakes);

189

georssLayerEarthquakes.events.on({ "featureselected": onGeorssFeatureSelect, "featureunselected": onFeatureUnselect });

190

}

191

addGeorssLayerEarthquakes()

192

193

function addGeorssLayerVolcanoes() {

194

var iconURL = "/eden/default/download/gis_marker.image.Geo_Volcanic_Threat.png";

195

var style_marker = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);

196

style_marker.graphicOpacity = 1;

197

var icon_img = new Image();

198

icon_img.src = iconURL;

199

var width = icon_img.width;

200

var height = icon_img.height;

201

if(width > max_w){

202

height = ((max_w / width) * height);

203

width = max_w;

204

}

205

if(height > max_h){

206

width = ((max_h / height) * width);

207

height = max_h;

208

}

209

style_marker.graphicWidth = width;

210

style_marker.graphicHeight = height;

211

style_marker.graphicXOffset = -(width / 2);

212

style_marker.graphicYOffset = -height;

213

style_marker.externalGraphic = iconURL;

214

var georssLayerVolcanoes = new OpenLayers.Layer.Vector( "Volcanoes", {

215

projection: proj4326,

216

strategies: [ new OpenLayers.Strategy.Fixed(), new OpenLayers.Strategy.Cluster({distance: 5, threshold: 2}) ],

217

style: style_marker,

218

protocol: new OpenLayers.Protocol.HTTP({

219

url: "/eden/default/download/gis_cache.file.Volcanoes.rss",

220

format: format_georss

221

})

222

});

223

georssLayerVolcanoes.setVisibility(false);

224

225

map.addLayer(georssLayerVolcanoes);

226

georssLayers.push(georssLayerVolcanoes);

227

georssLayerVolcanoes.events.on({ "featureselected": onGeorssFeatureSelect, "featureunselected": onFeatureUnselect });

228

}

229

addGeorssLayerVolcanoes()

230

231

allLayers = allLayers.concat(georssLayers);

888

889

890

// GPX

891

892

893

// KML

894

232

895

}

233

896

234

function loadDetails(url, id) {

235

$.getS3(

236

url,

237

function(data) {

238

$('#' + id).html(data);

239

240

'html',

241

'popup'

242

);

243

}

244

245

function onKmlFeatureSelectOffices(event) {

246

// unselect any previous selections

247

tooltipUnselect(event);

248

var feature = event.feature;

249

var selectedFeature = feature;

250

var id = 'featureLayerOffices' + '_' + Math.floor(Math.random()*1001)

251

var popup = new OpenLayers.Popup.FramedCloud(

252

id,

253

feature.geometry.getBounds().getCenterLonLat(),

254

new OpenLayers.Size(400, 400),

255

"<div style='height: 400px; width: 400px; overflow: auto;'>Loading...<img src='/eden/static/img/ajax-loader.gif' border=0></div>",

256

null,

257

true,

258

onPopupClose

259

);

260

feature.popup = popup;

261

map.addPopup(popup);

262

// call AJAX to get the data

263

var uuid = feature.attributes.styleUrl.replace(new RegExp('^[#"]+', 'g'), '');

264

loadDetails('/eden/gis/location' + '?location.uid=' + uuid, id);

265

}

266

267

268

897

269

898

function osm_getTileURL(bounds) {

270

899

var res = this.map.getResolution();

271

900

var x = Math.round((bounds.left - this.maxExtent.left) / (res * this.tileSize.w));

279

908

return this.url + z + '/' + x + '/' + y + '.' + this.type;

280

909

}

281

910

}

282

283

// ol_vector_registerEvents.js (for Draft Features)

284

285

// ol_controls_features.js

286

287

// Supports selectControl for All Feature Layers

911

912

913

// Supports popupControl for All Vector Layers

288

914

function onFeatureUnselect(event) {

289

915

var feature = event.feature;

290

916

if (feature.popup) {

298

924

popupControl.unselectAll();

299

925

}

300

926

301

// Supports highlightControl for All Feature Layers

927

// Supports highlightControl for All Vector Layers

302

928

var lastFeature = null;

303

929

var tooltipPopup = null;

304

930

function tooltipSelect(event){

305

931

var feature = event.feature;

306

var selectedFeature = feature;

307

// if there is already an opened details window, don't draw the tooltip

308

if(feature.popup != null){

309

return;

310

}

311

// if there are other tooltips active, destroy them

312

if(tooltipPopup != null){

313

map.removePopup(tooltipPopup);

314

tooltipPopup.destroy();

315

if(lastFeature != null){

316

delete lastFeature.popup;

317

tooltipPopup = null;

318

}

319

}

320

lastFeature = feature;

321

tooltipPopup = new OpenLayers.Popup("activetooltip",

322

feature.geometry.getBounds().getCenterLonLat(),

323

new OpenLayers.Size(80, 12),

324

feature.attributes.name,

325

true

326

);

327

// should be moved to CSS

328

tooltipPopup.contentDiv.style.backgroundColor='ffffcb';

329

tooltipPopup.closeDiv.style.backgroundColor='ffffcb';

330

tooltipPopup.contentDiv.style.overflow='hidden';

331

tooltipPopup.contentDiv.style.padding='3px';

332

tooltipPopup.contentDiv.style.margin='0';

333

tooltipPopup.closeOnMove = true;

334

tooltipPopup.autoSize = true;

335

feature.popup = tooltipPopup;

336

map.addPopup(tooltipPopup);

932

if(feature.cluster) {

933

// Cluster

934

// no tooltip

935

} else {

936

// Single Feature

937

var selectedFeature = feature;

938

// if there is already an opened details window, don't draw the tooltip

939

if(feature.popup != null){

940

return;

941

}

942

// if there are other tooltips active, destroy them

943

if(tooltipPopup != null){

944

map.removePopup(tooltipPopup);

945

tooltipPopup.destroy();

946

if(lastFeature != null){

947

delete lastFeature.popup;

948

tooltipPopup = null;

949

}

950

}

951

lastFeature = feature;

952

if (undefined == feature.attributes.name) {

953

// GeoRSS

954

tooltipPopup = new OpenLayers.Popup("activetooltip",

955

feature.geometry.getBounds().getCenterLonLat(),

956

new OpenLayers.Size(80, 12),

957

feature.attributes.title,

958

true

959

);

960

} else {

961

// KML

962

tooltipPopup = new OpenLayers.Popup("activetooltip",

963

feature.geometry.getBounds().getCenterLonLat(),

964

new OpenLayers.Size(80, 12),

965

feature.attributes.name,

966

true

967

);

968

}

969

// should be moved to CSS

970

tooltipPopup.contentDiv.style.backgroundColor='ffffcb';

971

tooltipPopup.closeDiv.style.backgroundColor='ffffcb';

972

tooltipPopup.contentDiv.style.overflow='hidden';

973

tooltipPopup.contentDiv.style.padding='3px';

974

tooltipPopup.contentDiv.style.margin='0';

975

tooltipPopup.closeOnMove = true;

976

tooltipPopup.autoSize = true;

977

feature.popup = tooltipPopup;

978

map.addPopup(tooltipPopup);

979

}

337

980

}

338

981

function tooltipUnselect(event){

339

982

var feature = event.feature;

346

989

}

347

990

}

348

991

349

// ol_functions.js

350

351

992

Ext.onReady(function() {

352

993

map = new OpenLayers.Map('center', options);

353

994

addLayers(map);

354

355

// ol_layers_features_all.js

995

356

996

map.addControl(new OpenLayers.Control.ScaleLine());

357

997

map.addControl(new OpenLayers.Control.MGRSMousePosition());

358

998

map.addControl(new OpenLayers.Control.Permalink());

359

999

map.addControl(new OpenLayers.Control.OverviewMap({mapOptions: options}));

360

1000

361

1001

// Popups

362

1002

// onClick Popup

363

1003

popupControl = new OpenLayers.Control.SelectFeature(

364

1004

allLayers, {

365

1005

toggle: true,

366

clickout: true

1006

clickout: true,

1007

multiple: false

367

1008

}

368

1009

);

369

1010

// onHover Tooltip

370

1011

highlightControl = new OpenLayers.Control.SelectFeature(

371

allLayers, {

1012

allLayers, {

372

1013

hover: true,

373

1014

highlightOnly: true,

374

1015

renderIntent: "temporary",

375

1016

eventListeners: {

376

featurehighlighted: tooltipSelect,

1017

featurehighlighted: tooltipSelect,

377

1018

featureunhighlighted: tooltipUnselect

378

1019

}

379

1020

}

383

1024

highlightControl.activate();

384

1025

popupControl.activate();

385

1026

386

var mapPanel = new GeoExt.MapPanel({

1027

1028

1029

mapPanel = new GeoExt.MapPanel({

387

1030

region: 'center',

388

height: 600,

389

width: 800,

1031

height: 400,

1032

width: 640,

390

1033

id: 'mappanel',

391

1034

xtype: 'gx_mappanel',

392

1035

map: map,

393

1036

center: center,

394

1037

zoom: 7,

1038

plugins: [],

395

1039

tbar: new Ext.Toolbar()

396

1040

});

397

1041

398

var layerTreeBase = new GeoExt.tree.BaseLayerContainer({

1042

1043

1044

1045

toolbar = mapPanel.getTopToolbar();

1046

1047

// OpenLayers controls

1048

1049

// Measure Controls

1050

var measureSymbolizers = {

1051

'Point': {

1052

pointRadius: 5,

1053

graphicName: 'circle',

1054

fillColor: 'white',

1055

fillOpacity: 1,

1056

strokeWidth: 1,

1057

strokeOpacity: 1,

1058

strokeColor: '#f5902e'

1059

1060

'Line': {

1061

strokeWidth: 3,

1062

strokeOpacity: 1,

1063

strokeColor: '#f5902e',

1064

strokeDashstyle: 'dash'

1065

1066

'Polygon': {

1067

strokeWidth: 2,

1068

strokeOpacity: 1,

1069

strokeColor: '#f5902e',

1070

fillColor: 'white',

1071

fillOpacity: 0.5

1072

}

1073

};

1074

var styleMeasure = new OpenLayers.Style();

1075

styleMeasure.addRules([

1076

new OpenLayers.Rule({symbolizer: measureSymbolizers})

1077

]);

1078

var styleMapMeasure = new OpenLayers.StyleMap({'default': styleMeasure});

1079

1080

var length = new OpenLayers.Control.Measure(

1081

OpenLayers.Handler.Path, {

1082

geodesic: true,

1083

persist: true,

1084

handlerOptions: {

1085

layerOptions: {styleMap: styleMapMeasure}

1086

}

1087

}

1088

);

1089

length.events.on({

1090

'measure': function(evt) {

1091

alert('The length is ' + evt.measure.toFixed(2) + ' ' + evt.units);

1092

}

1093

});

1094

var area = new OpenLayers.Control.Measure(

1095

OpenLayers.Handler.Polygon, {

1096

geodesic: true,

1097

persist: true,

1098

handlerOptions: {

1099

layerOptions: {styleMap: styleMapMeasure}

1100

}

1101

}

1102

);

1103

area.events.on({

1104

'measure': function(evt) {

1105

alert('The area is ' + evt.measure.toFixed(2) + ' ' + evt.units + '2');

1106

}

1107

});

1108

1109

1110

// Controls for Draft Features

1111

// - interferes with Feature Layers!

1112

//var selectControl = new OpenLayers.Control.SelectFeature(featuresLayer, {

1113

// onSelect: onFeatureSelect,

1114

// onUnselect: onFeatureUnselect,

1115

// multiple: false,

1116

// clickout: true,

1117

// isDefault: true

1118

//});

1119

1120

//var removeControl = new OpenLayers.Control.RemoveFeature(featuresLayer,

1121

// {onDone: function(feature) {console.log(feature)}

1122

//});

1123

1124

var nav = new OpenLayers.Control.NavigationHistory();

1125

1126

// GeoExt Buttons

1127

var zoomfull = new GeoExt.Action({

1128

control: new OpenLayers.Control.ZoomToMaxExtent(),

1129

map: map,

1130

iconCls: 'zoomfull',

1131

// button options

1132

tooltip: 'Zoom to maximum map extent'

1133

});

1134

1135

var zoomout = new GeoExt.Action({

1136

control: new OpenLayers.Control.ZoomBox({ out: true }),

1137

map: map,

1138

iconCls: 'zoomout',

1139

// button options

1140

tooltip: 'Zoom Out: click in the map or use the left mouse button and drag to create a rectangle',

1141

toggleGroup: 'controls'

1142

});

1143

1144

var zoomin = new GeoExt.Action({

1145

control: new OpenLayers.Control.ZoomBox(),

1146

map: map,

1147

iconCls: 'zoomin',

1148

// button options

1149

tooltip: 'Zoom In: click in the map or use the left mouse button and drag to create a rectangle',

1150

toggleGroup: 'controls'

1151

});

1152

1153

var pan = new GeoExt.Action({

1154

control: new OpenLayers.Control.Navigation(),

1155

map: map,

1156

iconCls: 'pan-off',

1157

// button options

1158

tooltip: 'Pan Map: keep the left mouse button pressed and drag the map',

1159

toggleGroup: 'controls',

1160

allowDepress: false,

1161

pressed: true

1162

});

1163

1164

// 1st of these 2 to get activated cannot be deselected!

1165

var lengthButton = new GeoExt.Action({

1166

control: length,

1167

map: map,

1168

iconCls: 'measure-off',

1169

// button options

1170

tooltip: 'Measure Length: Click the points along the path & end with a double-click',

1171

toggleGroup: 'controls',

1172

allowDepress: true,

1173

enableToggle: true

1174

});

1175

1176

var areaButton = new GeoExt.Action({

1177

control: area,

1178

map: map,

1179

iconCls: 'measure-area',

1180

// button options

1181

tooltip: 'Measure Area: Click the points around the polygon & end with a double-click',

1182

toggleGroup: 'controls',

1183

allowDepress: true,

1184

enableToggle: true

1185

});

1186

1187

1188

1189

var selectButton = new GeoExt.Action({

1190

//control: selectControl,

1191

map: map,

1192

iconCls: 'searchclick',

1193

// button options

1194

tooltip: 'Query Feature',

1195

toggleGroup: 'controls',

1196

enableToggle: true

1197

});

1198

1199

//var pointButton = new GeoExt.Action({

1200

// control: new OpenLayers.Control.DrawFeature(featuresLayer, OpenLayers.Handler.Point),

1201

// map: map,

1202

// iconCls: 'drawpoint-off',

1203

// tooltip: 'Add Point',

1204

// toggleGroup: 'controls'

1205

//});

1206

1207

//var lineButton = new GeoExt.Action({

1208

// control: new OpenLayers.Control.DrawFeature(featuresLayer, OpenLayers.Handler.Path),

1209

// map: map,

1210

// iconCls: 'drawline-off',

1211

// tooltip: 'Add Line',

1212

// toggleGroup: 'controls'

1213

//});

1214

1215

//var polygonButton = new GeoExt.Action({

1216

// control: new OpenLayers.Control.DrawFeature(featuresLayer, OpenLayers.Handler.Polygon),

1217

// map: map,

1218

// iconCls: 'drawpolygon-off',

1219

// tooltip: 'Add Polygon',

1220

// toggleGroup: 'controls'

1221

//});

1222

1223

//var dragButton = new GeoExt.Action({

1224

// control: new OpenLayers.Control.DragFeature(featuresLayer),

1225

// map: map,

1226

// iconCls: 'movefeature',

1227

// tooltip: 'Move Feature: Drag feature to desired location',

1228

// toggleGroup: 'controls'

1229

//});

1230

1231

//var resizeButton = new GeoExt.Action({

1232

// control: new OpenLayers.Control.ModifyFeature(featuresLayer, { mode: OpenLayers.Control.ModifyFeature.RESIZE }),

1233

// map: map,

1234

// iconCls: 'resizefeature',

1235

// tooltip: 'Resize Feature: Select the feature you wish to resize & then Drag the associated dot to your desired size',

1236

// toggleGroup: 'controls'

1237

//});

1238

1239

//var rotateButton = new GeoExt.Action({

1240

// control: new OpenLayers.Control.ModifyFeature(featuresLayer, { mode: OpenLayers.Control.ModifyFeature.ROTATE }),

1241

// map: map,

1242

// iconCls: 'rotatefeature',

1243

// tooltip: 'Rotate Feature: Select the feature you wish to rotate & then Drag the associated dot to rotate to your desired location',

1244

// toggleGroup: 'controls'

1245

//});

1246

1247

//var modifyButton = new GeoExt.Action({

1248

// control: new OpenLayers.Control.ModifyFeature(featuresLayer),

1249

// map: map,

1250

// iconCls: 'modifyfeature',

1251

// tooltip: 'Modify Feature: Select the feature you wish to deform & then Drag one of the dots to deform the feature in your chosen manner',

1252

// toggleGroup: 'controls'

1253

//});

1254

1255

//var removeButton = new GeoExt.Action({

1256

// control: removeControl,

1257

// map: map,

1258

// iconCls: 'removefeature',

1259

// tooltip: 'Remove Feature: Select the feature you wish to remove & press the delete key',

1260

// toggleGroup: 'controls'

1261

//});

1262

1263

var navPreviousButton = new Ext.Toolbar.Button({

1264

iconCls: 'back',

1265

tooltip: 'Previous View',

1266

handler: nav.previous.trigger

1267

});

1268

1269

var navNextButton = new Ext.Toolbar.Button({

1270

iconCls: 'next',

1271

tooltip: 'Next View',

1272

handler: nav.next.trigger

1273

});

1274

1275

var saveButton = new Ext.Toolbar.Button({

1276

// ToDo: Make work!

1277

iconCls: 'save',

1278

tooltip: 'Save: Default Lat, Lon & Zoom for the Viewport',

1279

handler: function saveViewport(map) {

1280

// Read current settings from map

1281

var lonlat = map.getCenter();

1282

var zoom_current = map.getZoom();

1283

// Convert back to LonLat for saving

1284

//var proj4326 = new OpenLayers.Projection('EPSG:4326');

1285

lonlat.transform(map.getProjectionObject(), proj4326);

1286

//alert('Latitude': ' + lat);

1287

// Use AJAX to send back

1288

var url = '/eden/gis/config/1.json/update';

1289

}

1290

});

1291

1292

// Add to Map & Toolbar

1293

toolbar.add(zoomfull);

1294

toolbar.add(zoomout);

1295

toolbar.add(zoomin);

1296

toolbar.add(pan);

1297

toolbar.addSeparator();

1298

// Measure Tools

1299

toolbar.add(lengthButton);

1300

toolbar.add(areaButton);

1301

toolbar.addSeparator();

1302

1303

// Draw Controls

1304

//toolbar.add(selectButton);

1305

//toolbar.add(pointButton);

1306

//toolbar.add(lineButton);

1307

//toolbar.add(polygonButton);

1308

//toolbar.add(dragButton);

1309

//toolbar.add(resizeButton);

1310

//toolbar.add(rotateButton);

1311

//toolbar.add(modifyButton);

1312

//toolbar.add(removeButton);

1313

//toolbar.addSeparator();

1314

// Navigation

1315

map.addControl(nav);

1316

nav.activate();

1317

toolbar.addButton(navPreviousButton);

1318

toolbar.addButton(navNextButton);

1319

toolbar.addSeparator();

1320

// Save Viewport

1321

toolbar.addButton(saveButton);

1322

1323

1324

1325

var mapSearch = new GeoExt.ux.geonames.GeoNamesSearchCombo({

1326

map: map,

1327

zoom: 8

1328

});

1329

1330

var searchCombo = new Ext.Panel({

1331

title: 'Search Geonames',

1332

layout: 'border',

1333

rootVisible: false,

1334

split: true,

1335

autoScroll: true,

1336

collapsible: true,

1337

collapseMode: 'mini',

1338

lines: false,

1339

html: 'Geonames.org search requires Internet connectivity!',

1340

items: [{

1341

region: 'center',

1342

items: [ mapSearch ]

1343

}]

1344

});

1345

1346

1347

var layerTreeBase = {

399

1348

text: 'Base Layers',

400

layerStore: mapPanel.layers,

401

leaf: false,

402

expanded: true

403

});

404

405

var layerTreeFeaturesInternal = new GeoExt.tree.OverlayLayerContainer({

1349

nodeType: 'gx_baselayercontainer',

1350

layerStore: mapPanel.layers,

1351

leaf: false,

1352

expanded: true

1353

};

1354

1355

var layerTreeFeaturesExternal = {

1356

text: 'External Features',

1357

nodeType: 'gx_overlaylayercontainer',

1358

layerStore: mapPanel.layers,

1359

leaf: false,

1360

expanded: true

1361

};

1362

1363

var layerTreeFeaturesInternal = {

406

1364

//text: 'Internal Features',

407

1365

text: 'Overlays',

1366

nodeType: 'gx_overlaylayercontainer',

408

1367

layerStore: mapPanel.layers,

409

1368

leaf: false,

410

1369

expanded: true

411

});

412

413

var root = new Ext.tree.AsyncTreeNode({

414

expanded: true,

415

loader: new GeoExt.tree.WMSCapabilitiesLoader({

416

url: OpenLayers.ProxyHost + 'http%3A//preview.grid.unep.ch%3A8080/geoserver/ows%3Fservice%3DWMS%26request%3DGetCapabilities',

417

layerOptions: {buffer: 0, singleTile: true, ratio: 1},

418

layerParams: {'TRANSPARENT': 'TRUE'},

419

// customize the createNode method to add a checkbox to nodes

420

createNode: function(attr) {

421

attr.checked = attr.leaf ? false : undefined;

422

return GeoExt.tree.WMSCapabilitiesLoader.prototype.createNode.apply(this, [attr]);

423

}

424

})

425

});

426

wmsBrowser = new Ext.tree.TreePanel({

427

id: 'wmsbrowser',

428

title: 'Risk Maps',

429

root: root,

430

rootVisible: false,

431

split: true,

432

autoScroll: true,

433

collapsible: true,

434

collapseMode: 'mini',

435

lines: false,

436

listeners: {

437

// Add layers to the map when checked, remove when unchecked.

438

// Note that this does not take care of maintaining the layer

439

// order on the map.

440

'checkchange': function(node, checked) {

441

if (checked === true) {

442

mapPanel.map.addLayer(node.attributes.layer);

443

} else {

444

mapPanel.map.removeLayer(node.attributes.layer);

445

}

446

}

447

}

448

});

449

450

451

layerTree = new Ext.tree.TreePanel({

1370

};

1371

1372

1373

1374

var layerTree = new Ext.tree.TreePanel({

452

1375

id: 'treepanel',

453

//title: 'Layers',

1376

title: 'Layers',

1377

loader: new Ext.tree.TreeLoader({applyLoader: false}),

454

1378

root: new Ext.tree.AsyncTreeNode({

455

1379

expanded: true,

456

1380

children: [

457

1381

layerTreeBase,

1382

//layerTreeFeaturesExternal,

458

1383

layerTreeFeaturesInternal

459

//layerTreeFeaturesExternal

460

1384

]

461

1385

}),

462

1386

rootVisible: false,

463

1387

split: true,

465

1389

collapsible: true,

466

1390

collapseMode: 'mini',

467

1391

lines: false,

468

enableDD: true,

1392

enableDD: true

469

1393

});

470

1394

471

var panel = new Ext.Panel({

472

renderTo: "map_panel",

1395

1396

1397

1398

var win = new Ext.Window({

1399

collapsible: true,

1400

constrain: true,

473

1401

1402

autoScroll: true,

474

1403

maximizable: true,

475

1404

titleCollapse: true,

476

height: 600,

477

width: 800,

1405

height: 400,

1406

width: 640,

478

1407

layout: 'border',

479

1408

items: [{

480

1409

region: 'west',

483

1412

border: true,

484

1413

width: 250,

485

1414

collapsible: true,

1415

collapsed: false,

486

1416

split: true,

487

1417

items: [

488

1418

layerTree,

489

wmsBrowser

1419

searchCombo

490

1420

]

491

1421

492

1422

mapPanel

493

1423

]

494

1424

});

1425

1426

win.show();

1427

win.maximize();

1428

1429

1430

Ext.QuickTips.init();

495

1431

});

1432

496

1433

//--></script></div>

497

</div>

498

</div>

1434

1435

</div>

1436

</div>

499

1437

</div>

500

1438

501

1439

502

1440

<p>

503

<a class="help" target="_blank" href="http://sahanafoundation.org/chat" title="Chat">Chat on IRC</a> |

504

<a class="help" target="_blank" href="http://eden.sahanafoundation.org/report" title="Report a Bug">Report a Bug</a>

505

</p>

506

<hr/>

507

<p>

508

1441

<a target='_blank' href='http://eden.sahanafoundation.org' title='Powered by Sahana Eden'><img src='/eden/static/img/S3menu_logo.png' width='30' height='28' style='vertical-align: middle;' alt='Powered by Sahana Eden' />Powered by Sahana Eden</a>

509

1442

</p>

510

1443

511

1444

</div>

Older »