mirror of
https://github.com/Esri/offline-editor-js.git
synced 2025-12-15 15:20:05 +00:00
149 lines
5.7 KiB
HTML
149 lines
5.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
|
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
|
|
<title>Simple Map</title>
|
|
<link rel="stylesheet" href="http://js.arcgis.com/3.8/js/esri/css/esri.css">
|
|
<style>
|
|
html, body, #map {
|
|
height: 100%;
|
|
width: 100%;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
body {
|
|
background-color: #FFF;
|
|
overflow: hidden;
|
|
font-family: "Trebuchet MS";
|
|
}
|
|
.dj_ie .infowindow .window .top .right .user .content { position: relative; }
|
|
.dj_ie .simpleInfoWindow .content {position: relative;}
|
|
|
|
.popup-table{
|
|
font-size: 12px;
|
|
}
|
|
.popup-table-row{
|
|
height: 24px;
|
|
}
|
|
.popup-table-textarea{
|
|
height: 17px;
|
|
}
|
|
</style>
|
|
<script src="../vendor/offline/offline.min.js"></script>
|
|
<script>
|
|
Offline.options = {
|
|
checks: {
|
|
image: {
|
|
url: function() {
|
|
return 'http://esri.github.io/offline-editor-js/tiny-image.png?_=' + (Math.floor(Math.random() * 1000000000));
|
|
}
|
|
},
|
|
active: 'image'
|
|
}
|
|
}
|
|
</script>
|
|
<script src="http://js.arcgis.com/3.8/"></script>
|
|
<script>
|
|
var map,busStopsFeatureLayer;
|
|
|
|
require([
|
|
"esri/map",
|
|
"esri/layers/FeatureLayer",
|
|
"dojo/domReady!"],
|
|
function(Map,FeatureLayer) {
|
|
|
|
map = new Map("map", {
|
|
basemap: "topo",
|
|
center: [-104.98,39.74], // long, lat
|
|
zoom: 10,
|
|
sliderStyle: "small"
|
|
});
|
|
|
|
busStopsFeatureLayer = new FeatureLayer("http://services.arcgis.com/IZtlGBUe4KTzLOl4/arcgis/rest/services/BPX_RTD_BusStops2/FeatureServer/0",{
|
|
mode: FeatureLayer.MODE_SNAPSHOT,
|
|
outFields: ["OBJECTID","BSID","ROUTES","STOPNAME"]
|
|
})
|
|
|
|
map.on("layers-add-result",initEditing);
|
|
|
|
map.addLayers([busStopsFeatureLayer]);
|
|
|
|
function initEditing(evt){
|
|
map.infoWindow.on("hide", function() {
|
|
busStopsFeatureLayer.clearSelection();
|
|
});
|
|
|
|
// var layerInfos = [{
|
|
// 'featureLayer': busStopsFeatureLayer,
|
|
// 'showAttachments': false,
|
|
// 'isEditable': true,
|
|
// 'fieldInfos': [
|
|
// {'fieldName': 'OBJECTID', 'isEditable':false, 'label':'ID:'},
|
|
// {'fieldName': 'BSID', 'isEditable':false, 'label':'Bus stop ID:'},
|
|
// {'fieldName': 'ROUTES', 'isEditable':false,'label':'Routes:'},
|
|
// {'fieldName': 'STOPNAME', 'isEditable':true, 'label':'Stop name:'}
|
|
// ]
|
|
// }];
|
|
//
|
|
// var attInspector = new AttributeInspector({
|
|
// layerInfos:layerInfos
|
|
// }, domConstruct.create("div"));
|
|
//
|
|
// //add a save button next to the delete button
|
|
// var saveButton = new Button({ label: "Save", "class": "saveButton"});
|
|
// domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after");
|
|
//
|
|
// saveButton.on("click", function(){
|
|
// busStopsFeatureLayer.applyEdits(null, [updateFeature], null);
|
|
// });
|
|
//
|
|
// attInspector.on("attribute-change", function(evt) {
|
|
// //store the updates to apply when the save button is clicked
|
|
// updateFeature.attributes[evt.fieldName] = evt.fieldValue;
|
|
// });
|
|
//
|
|
// attInspector.on("next", function(evt) {
|
|
// updateFeature = evt.feature;
|
|
// console.log("Next " + updateFeature.attributes.objectid);
|
|
// });
|
|
//
|
|
// attInspector.on("delete", function(evt){
|
|
// evt.feature.getLayer().applyEdits(null,null,[updateFeature]);
|
|
// map.infoWindow.hide();
|
|
// });
|
|
|
|
|
|
busStopsFeatureLayer.on("click", function(evt) {
|
|
var feature = evt.graphic
|
|
map.infoWindow.setTitle(feature.attributes.STOPNAME);
|
|
map.infoWindow.setContent(
|
|
"<table class='popup-table'>" +
|
|
"<tr class='popup-table-row'><td>ID:</td><td> " + feature.attributes.OBJECTID + "</td></tr>" +
|
|
"<tr class='popup-table-row'><td>Routes:</td><td> " + feature.attributes.ROUTES + "</td></tr>" +
|
|
"<tr class='popup-table-row'><td>Stops:</td><td><textarea class='popup-table-textarea'> " + feature.attributes.STOPNAME + "</textarea></td></tr>" +
|
|
"<tr class='popup-table-row'><td><button>Save</button></td><td><button>Delete</button></td></tr>" +
|
|
"</table>"
|
|
)
|
|
map.infoWindow.show(evt.screenPoint,map.getInfoWindowAnchor(evt.screenPoint));
|
|
}.bind(this));
|
|
|
|
map.infoWindow.resize(350, 240);
|
|
|
|
}
|
|
|
|
function updateFeature(){
|
|
|
|
}
|
|
|
|
function deleteFeature(){
|
|
|
|
}
|
|
});
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="map"></div>
|
|
</body>
|
|
</html> |