diff --git a/assets/css/index.css b/assets/css/index.css index bc285ab5..5ba210f4 100644 --- a/assets/css/index.css +++ b/assets/css/index.css @@ -24,23 +24,24 @@ height: 100%; width: 100%; min-height: 700px; - } +} - #content { - padding: 0; - margin: 0; - height: 100%; - width: 100%; - min-height: 650px; - } +#content { + padding: 0; + margin: 0; + height: 100%; + width: 100%; + min-height: 650px; +} - .navigatorMenu { - padding-right: 0 !important; - } +.sidebarMenu { + padding-right: 0 !important; + position: fixed +} - #HomeButton { - position: absolute; - top: 100px; - left: 15px; - z-index: 50; +#HomeButton { + position: absolute; + top: 100px; + left: 15px; + z-index: 50; } \ No newline at end of file diff --git a/index.html b/index.html index e3146034..e87613cf 100644 --- a/index.html +++ b/index.html @@ -19,7 +19,7 @@
-
+
@@ -61,13 +61,13 @@
-
-
@@ -81,8 +81,8 @@
-
-
+
+
Buffer Proccess @@ -115,8 +115,42 @@
-
-
+
+
+
+ + Print Proccess +
+ + +
+
+ + +
+
+ + +
+
+
+ +
+
+ +
+
+ +
+
+
+
+
diff --git a/main.js b/main.js index c4469d6b..fad96e46 100644 --- a/main.js +++ b/main.js @@ -11,8 +11,9 @@ $(document).ready(function () { "esri/Graphic", "esri/rest/support/LinearUnit", "esri/rest/geoprocessor", - "esri/layers/FeatureLayer" - ], (esriConfig, WebMap, MapView, Home, LayerList, GraphicsLayer, Graphic, LinearUnit, geoprocessor, FeatureLayer) => { + "esri/layers/FeatureLayer", + "esri/widgets/Print" + ], (esriConfig, WebMap, MapView, Home, LayerList, GraphicsLayer, Graphic, LinearUnit, geoprocessor, FeatureLayer, Print) => { esriConfig.portalUrl = "https://dev.gisportal.id/portal"; const gpUrl = "https://dev.gisportal.id/server/rest/services/mfajri/Buffer_Sample_Geoprocessing/GPServer/Buffer"; @@ -131,6 +132,14 @@ $(document).ready(function () { $('#Layer').append('') }) }) + + const print = new Print({ + view: view, + // specify your own print service + printServiceUrl: + "https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task" + }); + view.ui.add(print, "bottom-right"); }) @@ -144,9 +153,43 @@ $(document).ready(function () { const foundLayer = webmap.allLayers.find(function(layer) { return layer.title === "PIPELINE INSPECTION"; }); - // console.log("Layer",foundLayer) } + document.getElementById('bufferTogle').addEventListener('click', e => { + $("#collapsePrint").collapse('hide'); + $("#map").removeClass("col-md-12"); + $("#map").addClass("col-md-10"); + }) + + $('#collapseBuffer').on('hidden.bs.collapse', function () { + $("#map").removeClass("col-md-10"); + $("#map").addClass("col-md-12"); + if($('#collapsePrint').hasClass('collapse')){ + } + else{ + $("#map").removeClass("col-md-12"); + $("#map").addClass("col-md-10"); + } + }); + + document.getElementById('printTogle').addEventListener('click', e => { + $("#collapseBuffer").collapse('hide'); + $("#map").removeClass("col-md-12"); + $("#map").addClass("col-md-10"); + }) + + $('#collapsePrint').on('hidden.bs.collapse', function () { + $("#map").removeClass("col-md-10"); + $("#map").addClass("col-md-12"); + if($('#collapseBuffer').hasClass('collapse')){ + } + else{ + $("#map").removeClass("col-md-12"); + $("#map").addClass("col-md-10"); + } + }); + +