From 6f78a6a033f6cbe4aabfe1ccacefb047006e4089 Mon Sep 17 00:00:00 2001 From: Andy Gup Date: Fri, 20 Nov 2015 19:03:41 -0700 Subject: [PATCH] removed old demo apps --- demo/getstarted-agol.html | 862 ------------------------ demo/getstarted-editing.html | 1208 ---------------------------------- demo/getstarted-tiles.html | 785 ---------------------- demo/getstarted-tpk.html | 574 ---------------- demo/getstarted.html | 124 ---- 5 files changed, 3553 deletions(-) delete mode 100644 demo/getstarted-agol.html delete mode 100644 demo/getstarted-editing.html delete mode 100644 demo/getstarted-tiles.html delete mode 100644 demo/getstarted-tpk.html delete mode 100644 demo/getstarted.html diff --git a/demo/getstarted-agol.html b/demo/getstarted-agol.html deleted file mode 100644 index 5d802cf..0000000 --- a/demo/getstarted-agol.html +++ /dev/null @@ -1,862 +0,0 @@ - - - - - - - - - Offline-editor-js - - - - - - - - - - - - - - - - - - - - - - - -
-
-

Getting Started with ArcGIS.com

-

Basic steps for working with ArcGIS.com base maps for offline.

- -
-
- -
- -
-
- - - -
-
-

Step 1: Fill in the basics

-

Add the basic library references. Then test to make sure map loads.

-
- 
-                        
-<!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>Offline ArcGIS.com</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css"">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-        body {
-            background-color: #ffffff;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-        .floatRight {float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="container">
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "esri/arcgis/utils",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tiles-basic-src.js",
-        "dojo/domReady!"],
-        function(Map,on,arcgisUtils,BootstrapMap) {
-
-            var map;
-
-            // Load the map
-            arcgisUtils.createMap("bbc1a04a3eca4430be144d7a08b43a17","mapDiv").then(function(response){
-                var map = response.map;
-
-                map = response.map;
-
-                // Initialize BootstrapMap to make the map responsive
-                BootstrapMap.create(map);
-
-            });
-        });
-</script>
-
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
-
-
-

Step 2: Extend basemap using the offline library

-

This initializes the OfflineTilesEnabler library and tells it which tiled map service layer to use for offline. Test to make sure map loads.

-
- - 
-                        
-<!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>Offline ArcGIS.com</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        html, body, #map {
-            height: 100%;
-            width: 100%;
-            margin: 0;
-            padding: 0;
-        }
-        body {
-            background-color: #000000;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-        .floatRight {float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="row">
-    <div class="col-xs-12">
-        <div id="mapDiv"></div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "esri/arcgis/utils",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tiles-basic-src.js",
-        "dojo/domReady!"],
-        function(Map,on,arcgisUtils,BootstrapMap) {
-
-            var map, basemapLayer;
-            var offlineTilesEnabler = new O.esri.Tiles.OfflineTilesEnabler();
-
-            showMap();
-
-
-            function showMap(){
-                // Load the map
-                arcgisUtils.createMap("bbc1a04a3eca4430be144d7a08b43a17","mapDiv").then(function(response){
-                    map = response.map;
-
-                    // Initialize BootstrapMap to make the map responsive
-                    BootstrapMap.create(map);
-
-                    // Get the ArcGIS.com basemap that we want to use offline.
-                    // And then extend it for offline use.
-                    if(map.loaded)
-                    {
-                        basemapLayer = map.getLayer( map.layerIds[0] );
-                        initializeOfflineTiles();
-
-                    }
-                    else
-                    {
-                        map.on("load",function()
-                        {
-                            basemapLayer = map.getLayer( map.layerIds[0] );
-                            initializeOfflineTiles();
-                        });
-                    }
-
-                });
-            }
-
-            function initializeOfflineTiles(){
-                offlineTilesEnabler.extend(basemapLayer,function(success) {
-                    if (success) {
-                        console.log("ArcGIS.com map extended for offline!")
-                    }
-                })
-            }
-        });
-</script>
-
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
- -
- -
-

Step 3: Configure tiles download.

-

Enable the ability to download tiles as well the ability to toggle online and offline.

-
- - - -
- - -
-
- 
-                            
-
-<!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>Offline ArcGIS.com</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-        body {
-            background-color: #ffffff;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-
-        .floatRight {float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="container">
-    <div class="row">
-        <div class="col-xs-10">
-            <div class="form form-group btn-group" data-toggle="buttons">
-                <button class="btn btn-success" id="btn-get-tiles">1. Download Tiles</button>
-                <button class="btn btn-success" disabled id="btn-online-offline">2. Go Offline</button>
-                <button class="btn btn-success" disabled id="btn-pan-left">3. Pan left</button>
-            </div>
-        </div>
-        <div class="col-xs-2">
-            <!-- this indicates whether app is offline (down) or online (up) -->
-            <button id="btn-state" class="btn btn-success btn-large floatRight">
-                <span id="state-span" class="glyphicon glyphicon-link"> Up</span>
-            </button>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "esri/arcgis/utils",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tiles-basic-src.js",
-        "dojo/domReady!"],
-        function(Map,on,arcgisUtils,BootstrapMap) {
-
-            var map, basemapLayer;
-            var offlineTilesEnabler = new O.esri.Tiles.OfflineTilesEnabler();
-
-            // Check if browser state is online or offline
-            Offline.check();
-            Offline.on('up down', updateState );
-
-            // For cancelling the download of tiles
-            var _wantToCancel;
-            var _downloadState = "downloaded";
-
-            // Set up min and max boundaries for retrieving tiles
-            var minZoomAdjust = -1, maxZoomAdjust = 1, mMinZoom, mMaxZoom;
-
-            // Set up button click listeners.
-            var btnGetTiles = document.getElementById("btn-get-tiles");
-            var btnOnlineOffline = document.getElementById("btn-online-offline");
-            var btnPanLeft = document.getElementById("btn-pan-left");
-
-            var imgOfflineIndicator = document.getElementById("state-span");
-            var btnState = document.getElementById("btn-state");
-
-            on(btnGetTiles,"click",downloadTiles);
-            on(btnOnlineOffline,"click",goOnlineOffline);
-            on(btnPanLeft,"click",panLeft);
-
-            showMap();
-
-
-            function showMap(){
-                // Load the map
-                arcgisUtils.createMap("bbc1a04a3eca4430be144d7a08b43a17","mapDiv").then(function(response){
-                    map = response.map;
-
-                    // Initialize BootstrapMap to make the map responsive
-                    BootstrapMap.create(map);
-
-                    // Get the ArcGIS.com basemap that we want to use offline.
-                    // And then extend it for offline use.
-                    if(map.loaded)
-                    {
-                        basemapLayer = map.getLayer( map.layerIds[0] );
-                        initializeOfflineTiles();
-
-                    }
-                    else
-                    {
-                        map.on("load",function()
-                        {
-                            basemapLayer = map.getLayer( map.layerIds[0] );
-                            initializeOfflineTiles();
-                        });
-                    }
-
-                });
-            }
-
-            function initializeOfflineTiles(){
-                offlineTilesEnabler.extend(basemapLayer,function(success) {
-                    if (success) {
-                        console.log("ArcGIS.com map extended for offline!")
-                    }
-                })
-            }
-
-            function downloadTiles(){
-
-                if(_downloadState == "downloading"){
-                    _wantToCancel = true;
-                }
-                else{
-                    _wantToCancel = false;
-
-                    // First delete any existing tiles from database
-                    basemapLayer.deleteAllTiles(function(success,err){
-                        var zoom = basemapLayer.getMinMaxLOD(minZoomAdjust,maxZoomAdjust);
-
-                        // Now download tiles
-                        basemapLayer.prepareForOffline(zoom.min, zoom.max, map.extent, function(progress){
-                            console.log("downloading tiles...");
-
-                            if(progress.hasOwnProperty("countNow")){
-                                var percent = Math.floor(progress.countNow / progress.countMax * 100);
-                                btnGetTiles.innerHTML = 'Saving to phone ' + percent + "% - Tap to Cancel";
-                            }
-
-                            if( progress.finishedDownloading )
-                            {
-                                btnGetTiles.innerHTML = "Saving to phone 100% - Tap to Cancel";
-
-                                if( progress.cancelRequested )
-                                {
-                                    alert("Tile download was cancelled");
-                                    _downloadState = "cancelled";
-                                }
-                                else
-                                {
-                                    alert("Tile download complete");
-                                    _downloadState = "downloaded";
-                                    btnOnlineOffline.disabled = false;
-                                }
-
-                                btnGetTiles.innerHTML = '1. Download Tiles';
-                            }
-                            return _wantToCancel; //determines if a cancel request has been issued
-                        });
-
-                        _downloadState = "downloading";
-
-                    });
-                }
-            }
-
-            // Force the tileLayer between online and offline
-            function goOnlineOffline(){
-
-                btnPanLeft.disabled = false;
-
-                if(btnOnlineOffline.innerHTML == "2. Go Offline"){
-                    toggleStateUp(false);
-                    console.log("Map is offline");
-                }
-                else{
-                    toggleStateUp(true);
-                    console.log("Map is online");
-                }
-            }
-
-            function toggleStateUp(state){
-                if(state){
-                    btnOnlineOffline.innerHTML = "2. Go Offline";
-                    basemapLayer.goOnline();
-                    imgOfflineIndicator.className = "glyphicon glyphicon-link";
-                    imgOfflineIndicator.innerHTML = " Up";
-                    btnState.className = "btn btn-success btn-large floatRight";
-                }
-                else{
-                    btnOnlineOffline.innerHTML = "2. Go Online";
-                    basemapLayer.goOffline();
-                    imgOfflineIndicator.className = "glyphicon glyphicon-thumbs-down";
-                    imgOfflineIndicator.innerHTML = " Down";
-                    btnState.className = "btn btn-danger btn-large floatRight";
-                }
-            }
-
-            // Set the ArcGIS.com map online or offline.
-            // When set offline it will look for tiles in the tiles database
-            function updateState(){
-                if(Offline.state === 'up'){
-                    if(typeof basemapLayer != "undefined") basemapLayer.goOnline();
-                    toggleStateUp(true);
-                }
-                else{
-                    if(typeof basemapLayer != "undefined") basemapLayer.goOffline();
-                    toggleStateUp(false);
-                }
-            }
-
-            // Pan left when "offline" to view only tiles that have been stored locally
-            function panLeft(){
-                map.panLeft();
-            }
-        });
-</script>
-
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-
-</body>
-</html>
-
-                            
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
-
- -
-
-
-
- - - -
-
-
- - -
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
- - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/demo/getstarted-editing.html b/demo/getstarted-editing.html deleted file mode 100644 index b7dbd77..0000000 --- a/demo/getstarted-editing.html +++ /dev/null @@ -1,1208 +0,0 @@ - - - - - - - - - Get Started Editing - - - - - - - - - - - - - - - - - - - - - - - -
-
-

Getting Started with Editing

-

Basic steps for working with Editing geographic features for offline.

- -
-
- -
- -
-
- - - -
-
-

Step 1: Fill in the basics

-

Add library references and build basic layout. Then test to make sure map loads. - A fully working and editable version of this step is included in /demo/samples/editing-step1.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>Offline Features</title>
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
-    <link rel="stylesheet" href="//js.arcgis.com/3.13/esri/css/esri.css">
-    <link rel="stylesheet" href="../widgets/modal/css/modal-popup.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        #img-offline-indicator {
-            padding: 8px;
-            position: relative; float: right;
-        }
-
-        /* Override mod-popup default */
-        .mod-popup-stop-input {color: black;}
-        .span-pending {color: blue; padding-left: 1em;}
-        .voffset20px { margin-top: 20px; }
-        .floatRight { float: right}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set how we pull in custom AMD modules
-        var path = location.pathname.replace(/[^\/]+$/, '');
-        var dojoConfig =
-        {
-            debug: true,
-            packages:[
-                {
-                    name: "widgets",
-                    location: path + "../widgets/modal/"
-                }]
-        }
-
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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="//js.arcgis.com/3.13/"></script>
-</head>
-
-<body>
-
-<div class="container voffset20px">
-    <div class="row">
-        <div class="col-xs-8">
-            <button class="btn btn-success" id="btn-online-offline">Go Offline</button>
-            <span class="span-pending">Pending Edits <span id="span-pending-edits" class="badge">0</span></span>
-        </div>
-        <div class="col-xs-4">
-            <button id="btn-state" class="btn btn-success btn-large floatRight">
-                <span id="state-span" class="glyphicon glyphicon-link"> Up</span>
-            </button>
-        </div>
-    </div>
-    <div class="row voffset20px">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-<!-- Stub for modal popup -->
-<div id="modal-popup"></div>
-
-<script>
-
-    require([
-                "esri/map","esri/tasks/query",
-                "dojo/on","dojo/parser", "esri/renderers/SimpleRenderer",
-                "esri/symbols/SimpleMarkerSymbol","esri/Color",
-                "widgets/popup","esri/layers/FeatureLayer",
-                "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-                "../../dist/offline-edit-src.js",
-                "dojo/domReady!"],
-            function(Map,Query,on,parser,SimpleRenderer,SimpleMarkerSymbol,
-                     Color,ModalPopup,FeatureLayer,BootstrapMap){
-
-                var map, popup, editsStore;
-                var defaultSymbol;
-                var offlineFeaturesManager;
-                var btnOnlineOffline, btnState, pendingEdits;
-                var imgOfflineIndicator;
-                var closeBtn,saveBtn,deleteBtn,stopMainID,stopID,stopRoutes,stopNames;
-
-                initMap();
-
-                function initMap(){
-
-                    map = BootstrapMap.create("mapDiv",{
-                        basemap: "topo",
-                        center: [-104.99,39.75], // longitude, latitude
-                        zoom: 15
-                    });
-                }
-            }
-    );
-
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: If you aren't building this in the offline repo directory, replace paths with your references.
-
-
-

Step 2: Configure modal popup

-

This initializes and configures the modal popup. Test to make sure map loads and popup displays. - You'll notice the buttons on the popup don't work yet. We'll fix that in the Step 3. - A full working version of this step is included in /demo/samples/editing-step2.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>Offline Features</title>
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
-    <link rel="stylesheet" href="//js.arcgis.com/3.13/esri/css/esri.css">
-    <link rel="stylesheet" href="../widgets/modal/css/modal-popup.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        #img-offline-indicator {
-            padding: 8px;
-            position: relative; float: right;
-        }
-
-        /* Override mod-popup default */
-        .mod-popup-stop-input {color: black;}
-        .span-pending {color: blue; padding-left: 1em;}
-        .voffset20px { margin-top: 20px; }
-        .floatRight { float: right}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set how we pull in custom AMD modules
-        var path = location.pathname.replace(/[^\/]+$/, '');
-        var dojoConfig =
-        {
-            debug: true,
-            packages:[
-                {
-                    name: "widgets",
-                    location: path + "../widgets/modal/"
-                }]
-        }
-
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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="//js.arcgis.com/3.13/"></script>
-</head>
-
-<body>
-
-<div class="container voffset20px">
-    <div class="row">
-        <div class="col-xs-8">
-            <button class="btn btn-success" id="btn-online-offline">Go Offline</button>
-            <span class="span-pending">Pending Edits <span id="span-pending-edits" class="badge">0</span></span>
-        </div>
-        <div class="col-xs-4">
-            <button id="btn-state" class="btn btn-success btn-large floatRight">
-                <span id="state-span" class="glyphicon glyphicon-link"> Up</span>
-            </button>
-        </div>
-    </div>
-    <div class="row voffset20px">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-<!-- Stub for modal popup -->
-<div id="modal-popup"></div>
-
-<script>
-
-    require([
-                "esri/map","esri/tasks/query",
-                "dojo/on","dojo/parser", "esri/renderers/SimpleRenderer",
-                "esri/symbols/SimpleMarkerSymbol","esri/Color",
-                "widgets/popup","esri/layers/FeatureLayer",
-                "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-                "../../dist/offline-edit-src.js",
-                "dojo/domReady!"],
-            function(Map,Query,on,parser,SimpleRenderer,SimpleMarkerSymbol,
-                     Color,ModalPopup,FeatureLayer,BootstrapMap){
-
-                var map, popup, editsStore;
-                var defaultSymbol;
-                var offlineFeaturesManager;
-                var btnOnlineOffline, btnState, pendingEdits;
-                var imgOfflineIndicator;
-                var closeBtn,saveBtn,deleteBtn,stopMainID,stopID,stopRoutes,stopNames;
-
-                initVars();
-                initMap();
-
-                function initMap(){
-
-                    map = BootstrapMap.create("mapDiv",{
-                        basemap: "topo",
-                        center: [-104.99,39.75], // longitude, latitude
-                        zoom: 15
-                    });
-
-                    map.on("load",function(evt){
-                        console.log("Map is loaded. Loading popup...")
-                        window.setTimeout(function(){
-                            popup.show();
-                        },2000);
-                    });
-                }
-
-                function initVars(){
-
-                    editsStore = new O.esri.Edit.EditStore();
-                    popup = new ModalPopup({animation: true, animationDuration: 1},"modal-popup");
-                    popup.startup();
-
-                    parser.parse();
-
-                    // Check if browser state is online or offline
-                    Offline.check();
-                    Offline.on('up down', updateState );
-
-
-                    btnOnlineOffline = document.getElementById("btn-online-offline");
-                    imgOfflineIndicator = document.getElementById("state-span");
-                    btnState = document.getElementById("btn-state");
-                    pendingEdits = document.getElementById("span-pending-edits");
-
-                    // Modify symbol size based on screen size.
-                    // Bigger screens get smaller symbols. Smaller screens get larger symbols.
-                    var width = window.innerWidth
-                            || document.documentElement.clientWidth
-                            || document.body.clientWidth;
-
-                    var height = window.innerHeight
-                            || document.documentElement.clientHeight
-                            || document.body.clientHeight;
-
-                    if (height >= 768 || width >= 1024) {
-                        defaultSymbol= new SimpleMarkerSymbol().setStyle(
-                                SimpleMarkerSymbol.STYLE_DIAMOND).setColor(
-                                new Color([255,0,0,0.5])).setSize(20);
-                    }
-                    else{
-                        defaultSymbol= new SimpleMarkerSymbol().setStyle(
-                                SimpleMarkerSymbol.STYLE_DIAMOND).setColor(
-                                new Color([255,0,0,0.5])).setSize(35);
-                    }
-
-                    // Variables for modal popup
-                    closeBtn = document.getElementById("mod-popup-close-btn");
-                    saveBtn = document.getElementById("mod-popup-save-btn");
-                    deleteBtn = document.getElementById("mod-popup-delete-btn");
-                    stopMainID = document.getElementById("stop-main-id");
-                    stopID = document.getElementById("stop-id");
-                    stopRoutes = document.getElementById("stop-routes");
-                    stopNames = document.getElementById("stop-names");
-
-                }
-
-                function setModalPopupClickListeners(){
-                    closeBtn.onclick = function(evt){
-                        hideModalPopup();
-                    }
-
-                    saveBtn.onclick = function(evt) {
-                        //TO-DO
-                    }
-
-                }
-
-                function showModalPopup(graphic){
-                    popup.graphic = graphic; // assign graphic to modPopup as a property.
-                    popup.show();
-                }
-
-                function hideModalPopup(){
-                    popup.hide();
-                }
-
-                // Force feature service offline
-                function goOnlineOffline(){
-
-                    if(btnOnlineOffline.innerHTML == "Go Offline"){
-                        toggleStateUp(false);
-                        console.log("Map is offline");
-                    }
-                    else{
-                        toggleStateUp(true);
-                        console.log("Map is online");
-                    }
-                }
-
-                // Set the UX to online or offline state
-                function toggleStateUp(state){
-                    if(state){
-                        btnOnlineOffline.innerHTML = "Go Offline";
-                        offlineFeaturesManager.goOnline();
-                        imgOfflineIndicator.className = "glyphicon glyphicon-link";
-                        imgOfflineIndicator.innerHTML = " Up";
-                        btnState.className = "btn btn-success btn-large floatRight";
-                    }
-                    else{
-                        btnOnlineOffline.innerHTML = "Go Online";
-                        offlineFeaturesManager.goOffline();
-                        imgOfflineIndicator.className = "glyphicon glyphicon-thumbs-down";
-                        imgOfflineIndicator.innerHTML = " Down";
-                        btnState.className = "btn btn-danger btn-large floatRight";
-                    }
-                }
-
-                // Automatically set the feature service online or offline.
-                function updateState(){
-                    if(Offline.state === 'up'){
-                        toggleStateUp(true);
-                    }
-                    else{
-                        toggleStateUp(false);
-                    }
-                }
-            }
-    );
-
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: If you aren't building this in the offline repo directory, replace paths with your references.
- -
- -
-

Step 3: Configure offline editing.

-

Enable the ability to store features (points, lines and polygons) while offline, and resync features when internet is restored. - A full working version of this step is included in /demo/samples/editing-step3.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>Offline Features</title>
-    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
-    <link rel="stylesheet" href="//js.arcgis.com/3.13/esri/css/esri.css">
-    <link rel="stylesheet" href="//esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <link rel="stylesheet" href="../widgets/modal/css/modal-popup.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        #img-offline-indicator {
-            padding: 8px;
-            position: relative;
-            float: right;
-        }
-
-        /* Override mod-popup default */
-        .mod-popup-stop-input {
-            color: black;
-        }
-
-        .span-pending {
-            color: blue;
-            padding-left: 1em;
-        }
-
-        .voffset20px {
-            margin-top: 20px;
-        }
-
-        .floatRight {
-            float: right
-        }
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set how we pull in custom AMD modules
-        var path = location.pathname.replace(/[^\/]+$/, '');
-        var dojoConfig =
-        {
-            debug: true,
-            packages: [
-                {
-                    name: "widgets",
-                    location: path + "../widgets/modal/"
-                }]
-        }
-
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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="//js.arcgis.com/3.13/"></script>
-</head>
-
-<body>
-
-<div class="container voffset20px">
-    <div class="row">
-        <div class="col-xs-8">
-            <button class="btn btn-success" id="btn-online-offline">Go Offline</button>
-            <span class="span-pending">Pending Edits <span id="span-pending-edits" class="badge">0</span></span>
-        </div>
-        <div class="col-xs-4">
-            <button id="btn-state" class="btn btn-success btn-large floatRight">
-                <span id="state-span" class="glyphicon glyphicon-link"> Up</span>
-            </button>
-        </div>
-    </div>
-    <div class="row voffset20px">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-<!-- Stub for modal popup -->
-<div id="modal-popup"></div>
-
-<script>
-
-    require([
-                "esri/map", "esri/tasks/query",
-                "dojo/on", "dojo/parser", "esri/renderers/SimpleRenderer",
-                "esri/symbols/SimpleMarkerSymbol", "esri/Color",
-                "widgets/popup", "esri/layers/FeatureLayer",
-                "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-                "../../dist/offline-edit-src.js",
-                "dojo/domReady!"],
-            function (Map, Query, on, parser, SimpleRenderer, SimpleMarkerSymbol,
-                      Color, ModalPopup, FeatureLayer, BootstrapMap) {
-
-                var map, popup, editsStore;
-                var defaultSymbol;
-                var offlineFeaturesManager;
-                var btnOnlineOffline, btnState, pendingEdits;
-                var imgOfflineIndicator;
-                var closeBtn, saveBtn, deleteBtn, stopMainID, stopID, stopRoutes, stopNames;
-                var busStopFeatureLayer;
-
-                initVars();
-                initMap();
-
-                function initMap() {
-
-                    map = BootstrapMap.create("mapDiv", {
-                        basemap: "topo",
-                        center: [-104.99, 39.75], // longitude, latitude
-                        zoom: 15
-                    });
-
-                    busStopFeatureLayer = new FeatureLayer("http://services1.arcgis.com/M8KJPUwAXP8jhtnM/arcgis/rest/services/Denver_Bus_Stops/FeatureServer/0", {
-                        mode: FeatureLayer.MODE_SNAPSHOT,
-                        outFields: ["OBJECTID", "BSID", "ROUTES", "STOPNAME"]
-                    });
-
-                    //Set the graphics to red boxes to make it easy to click on them
-                    //on a mobile device.
-                    busStopFeatureLayer.setRenderer(new SimpleRenderer(defaultSymbol));
-                    busStopFeatureLayer.on("update-end", function (evt) {
-
-                        // Now we can enable the button click listener
-                        on(btnOnlineOffline, "click", goOnlineOffline);
-
-                        initOfflineFeaturesMgr();
-                        setFeatureLayerClickHandler();
-                        setModalPopupClickListeners();
-                    });
-
-                    map.addLayer(busStopFeatureLayer);
-                }
-
-                function initVars() {
-
-                    editsStore = new O.esri.Edit.EditStore();
-                    popup = new ModalPopup({animation: true, animationDuration: 1}, "modal-popup");
-                    popup.startup();
-
-                    parser.parse();
-
-                    // Check if browser state is online or offline
-                    Offline.check();
-                    Offline.on('up down', updateState);
-
-
-                    btnOnlineOffline = document.getElementById("btn-online-offline");
-                    imgOfflineIndicator = document.getElementById("state-span");
-                    btnState = document.getElementById("btn-state");
-                    pendingEdits = document.getElementById("span-pending-edits");
-
-                    // Modify symbol size based on screen size.
-                    // Bigger screens get smaller symbols. Smaller screens get larger symbols.
-                    var width = window.innerWidth
-                            || document.documentElement.clientWidth
-                            || document.body.clientWidth;
-
-                    var height = window.innerHeight
-                            || document.documentElement.clientHeight
-                            || document.body.clientHeight;
-
-                    if (height >= 768 || width >= 1024) {
-                        defaultSymbol = new SimpleMarkerSymbol().setStyle(
-                                SimpleMarkerSymbol.STYLE_DIAMOND).setColor(
-                                new Color([255, 0, 0, 0.5])).setSize(20);
-                    }
-                    else {
-                        defaultSymbol = new SimpleMarkerSymbol().setStyle(
-                                SimpleMarkerSymbol.STYLE_DIAMOND).setColor(
-                                new Color([255, 0, 0, 0.5])).setSize(35);
-                    }
-
-                    // Variables for modal popup
-                    closeBtn = document.getElementById("mod-popup-close-btn");
-                    saveBtn = document.getElementById("mod-popup-save-btn");
-                    deleteBtn = document.getElementById("mod-popup-delete-btn");
-                    stopMainID = document.getElementById("stop-main-id");
-                    stopID = document.getElementById("stop-id");
-                    stopRoutes = document.getElementById("stop-routes");
-                    stopNames = document.getElementById("stop-names");
-
-                }
-
-                /**
-                 * ************************************
-                 * OFFLINE FEATURE SERVICE HANDLER CODE
-                 * ************************************
-                 */
-
-                function initOfflineFeaturesMgr() {
-                    offlineFeaturesManager = new O.esri.Edit.OfflineFeaturesManager();
-
-                    // IMPORTANT!!!
-                    // A proxy page may be required to upload attachments.
-                    // If you are using a CORS enabled server you may be able to set the proxyPath to null.
-                    // Refer to "Using the Proxy Page" for more information:
-                    //https://developers.arcgis.com/en/javascript/jshelp/ags_proxy.html
-                    offlineFeaturesManager.proxyPath = null;
-
-                    // IMPORTANT!!!
-                    // This tells the database which graphic.attribute property to use as a unique identifier
-                    // You can lok this information up in your feature service directory under the "Fields" category.
-                    // Example: http://services1.arcgis.com/M8KJPUwAXP8jhtnM/arcgis/rest/services/Denver_Bus_Stops/FeatureServer/0
-                    offlineFeaturesManager.DB_UID = "FID";
-
-                    offlineFeaturesManager.on(offlineFeaturesManager.events.EDITS_ENQUEUED, updatePendingEditStatus);
-                    offlineFeaturesManager.on(offlineFeaturesManager.events.EDITS_SENT, updatePendingEditStatus);
-                    offlineFeaturesManager.on(offlineFeaturesManager.events.ALL_EDITS_SENT, updatePendingEditStatus);
-
-                    offlineFeaturesManager.on(offlineFeaturesManager.events.EDITS_ENQUEUED_ERROR, function(errorsArray){
-                        alert("There was an error attempting to write to the database: " + JSON.stringify(errorsArray));
-                    });
-
-                    offlineFeaturesManager.extend(busStopFeatureLayer, function (success, error) {
-                        if (success) {
-                            console.log("offlineFeaturesManager initialized.");
-
-                            Offline.check();
-                            Offline.on('up down', updateState);
-                        }
-                        else {
-                            alert("Unable to enable feature layer for offline usage. " + error);
-                        }
-                    });
-                }
-
-                // Display modal popup when someone clicks on a feature
-                // and load the fields with data from the feature service.
-                function setFeatureLayerClickHandler() {
-                    busStopFeatureLayer.on("click", function (evt) {
-
-                        showModalPopup(evt.graphic);
-                        var atts = evt.graphic.attributes;
-                        stopID.value = atts.BSID;
-                        stopMainID.value = atts.FID;
-                        stopNames.value = atts.STOPNAME;
-                        stopRoutes.value = atts.ROUTES;
-
-                    }.bind(this));
-                }
-
-                function updatePendingEditStatus() {
-                    busStopFeatureLayer.pendingEditsCount(function(count){
-                        pendingEdits.innerHTML = count;
-                    });
-                }
-
-
-                function setModalPopupClickListeners() {
-                    closeBtn.onclick = function (evt) {
-                        hideModalPopup();
-                    };
-
-                    saveBtn.onclick = function (evt) {
-                        popup.graphic.attributes.ROUTES = stopRoutes.value;
-                        popup.graphic.attributes.STOPNAME = stopNames.value;
-
-                        busStopFeatureLayer.applyEdits(null, [popup.graphic], null, function (result) {
-                                    console.log("Successfully saved changes to: " +
-                                    popup.graphic.attributes.STOPNAME);
-                                    hideModalPopup();
-                                },
-                                function (err) {
-                                    alert("There was a problem while trying to save: " +
-                                    popup.graphic.attributes.STOPNAME);
-                                })
-                    };
-
-                    deleteBtn.onclick = function (evt) {
-                        busStopFeatureLayer.applyEdits(null, null, [popup.graphic], function (result) {
-                                    console.log("Successfully deleted: " + popup.graphic.attributes.STOPNAME);
-                                    hideModalPopup();
-                                },
-                                function (err) {
-                                    alert("There was a problem while trying to delete: " +
-                                    popup.graphic.attributes.STOPNAME);
-                                })
-                    }
-
-                }
-
-                function showModalPopup(graphic) {
-                    popup.graphic = graphic; // assign graphic to modPopup as a property.
-                    popup.show();
-                }
-
-                function hideModalPopup() {
-                    popup.hide();
-                }
-
-                /**
-                 * ************************************
-                 * GO OFFLINE/ONLINE HANDLER CODE
-                 * ************************************
-                 */
-
-                // Force feature service offline
-                function goOnlineOffline() {
-
-                    if (btnOnlineOffline.innerHTML == "Go Offline") {
-                        toggleStateUp(false);
-                        console.log("Map is offline");
-                    }
-                    else {
-                        toggleStateUp(true);
-                        console.log("Map is online");
-                    }
-                }
-
-                // Set the UX to online or offline state
-                function toggleStateUp(state) {
-                    if (state) {
-                        offlineFeaturesManager.goOnline();
-                        btnOnlineOffline.innerHTML = "Go Offline";
-                        imgOfflineIndicator.className = "glyphicon glyphicon-link";
-                        imgOfflineIndicator.innerHTML = " Up";
-                        btnState.className = "btn btn-success btn-large floatRight";
-                    }
-                    else {
-                        offlineFeaturesManager.goOffline();
-                        btnOnlineOffline.innerHTML = "Go Online";
-                        imgOfflineIndicator.className = "glyphicon glyphicon-thumbs-down";
-                        imgOfflineIndicator.innerHTML = " Down";
-                        btnState.className = "btn btn-danger btn-large floatRight";
-                    }
-                }
-
-                // Automatically set the feature service online or offline.
-                function updateState() {
-                    if (Offline.state === 'up') {
-                        toggleStateUp(true);
-                    }
-                    else {
-                        toggleStateUp(false);
-                    }
-                }
-            }
-    );
-
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                            
-
-
NOTE: If you aren't building this in the offline repo directory, replace paths with your references.
-
- -
-
-
- - Pending Edits 0 -
-
- -
-
-
-
-
-
-
- -
-
-
-
- -
-
-
-
-
- - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/demo/getstarted-tiles.html b/demo/getstarted-tiles.html deleted file mode 100644 index 5ba871b..0000000 --- a/demo/getstarted-tiles.html +++ /dev/null @@ -1,785 +0,0 @@ - - - - - - - - - Offline-editor-js - - - - - - - - - - - - - - - - - - - - - - - -
-
-

Getting Started with Tiles

-

Basic steps for working with tiled base map services for offline.

- -
-
- -
- -
-
- - - -
-
-

Step 1: Fill in the basics

-

Add the basic library references. Then test to make sure map loads.

-
- 
-                        
-<!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>Offline Tiles</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        body {
-            background-color: #ffffff;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-
-        .floatRight {float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-<div class="row">
-    <div class="col-xs-12">
-        <div id="mapDiv"></div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require(["esri/map","dojo/on","//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js","../dist/offline-tiles-advanced-min.js", "dojo/domReady!"],
-        function(Map,on,Bootstrapmap) {
-
-        // Initialize our map to be responsive
-        var map = Bootstrapmap.create("mapDiv",{
-            basemap: "topo",
-            center: [-122.45, 37.75], // longitude, latitude
-            zoom: 15
-        });
-
-    });
-</script>
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
-
-
-

Step 2: Configure tiled basemap to work offline

-

This initializes the offline-editor-js library. Test to make sure map loads.

-
- - 
-                        
-<!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>Offline Tiles</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        body {
-            background-color: #ffffff;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-
-       .floatRight {float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-<div class="row">
-    <div class="col-xs-12">
-        <div id="mapDiv"></div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require(["esri/map","dojo/on","//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js","../dist/offline-tiles-advanced-min.js", "dojo/domReady!"],
-        function(Map,on,Bootstrapmap) {
-
-        // Check if browser state is online or offline
-        Offline.check();
-        Offline.on('up down', updateState );
-
-        // Initialize our map to be responsive
-        var map = Bootstrapmap.create("mapDiv",{
-            //basemap: "topo", // comment out this basemap!
-            center: [-122.45, 37.75], // longitude, latitude
-            zoom: 15
-        });
-
-        // Now we initialize a topo tiled basemap service to be offline-enabled.
-        var tileLayer = O.esri.Tiles.OfflineTileEnablerLayer(
-                "http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer",
-                function(evt){
-                    console.log("Offline tile lib enabled. App is: " + Offline.state);
-                },
-                true);
-
-        // Add our offline tile layer to the map instead of using the default basemap!
-        map.addLayer(tileLayer);
-
-        // Set the tileLayer online or offline.
-        // When set to offline, the map will look for tiles in the local tiles database
-        function updateState(){
-            if(Offline.state === 'up'){
-                if(typeof tileLayer != "undefined") tileLayer.goOnline();
-            }
-            else{
-                if(typeof tileLayer != "undefined") tileLayer.goOffline();
-            }
-        }
-
-    });
-</script>
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
- -
- -
-

Step 3: Configure tiles download.

-

Enable the ability to download tiles as well the ability to toggle online and offline.

-
- - - -
- - -
-
- 
-                            
-
-<!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>Offline Tiles</title>
-
-    <!-- Bootstrap core CSS -->
-    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
-
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 500px;
-            max-height: 1000px;
-        }
-
-        body {
-            background-color: #ffffff;
-            overflow: hidden;
-            font-family: "Trebuchet MS";
-        }
-
-        .floatRight { float: right;}
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to offline.js which detects online/offline conditions -->
-    <script src="../vendor/offline/offline.min.js"></script>
-    <script>
-        // Set the online/offline detection options.
-        // More info at: http://github.hubspot.com/offline/docs/welcome/
-        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>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<!-- Our buttons and online/offline indicator -->
-<div class="container">
-    <div class="row">
-        <div class="col-xs-10">
-            <div class="form form-group btn-group" data-toggle="buttons">
-                <button class="btn btn-success" id="btn-get-tiles">1. Download Tiles</button>
-                <button class="btn btn-success" disabled id="btn-online-offline">2. Go Offline</button>
-                <button class="btn btn-success" disabled id="btn-pan-left">3. Pan left</button>
-            </div>
-        </div>
-        <div class="col-xs-2">
-            <!-- this indicates whether app is offline (down) or online (up) -->
-            <button id="btn-state" class="btn btn-success btn-large floatRight">
-                <span id="state-span" class="glyphicon glyphicon-link"> Up</span>
-            </button>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tiles library within the require statement!
-    require(["esri/map","dojo/on","//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tiles-advanced-min.js", "dojo/domReady!"],
-        function(Map,on,Bootstrapmap){
-
-            var map,basemapLayer;
-
-            // Check if browser state is online or offline
-            Offline.check();
-            Offline.on('up down', updateState );
-
-            // For cancelling the download of tiles
-            var _wantToCancel = false;
-            var _downloadState = "downloaded";
-
-            // Set up min and max boundaries for retrieving tiles
-            var minZoomAdjust = -1, maxZoomAdjust = 1;
-
-            // Set up button click listeners.
-            var btnGetTiles = document.getElementById("btn-get-tiles");
-            var btnOnlineOffline = document.getElementById("btn-online-offline");
-            var btnPanLeft = document.getElementById("btn-pan-left");
-
-            on(btnGetTiles,"click",downloadTiles);
-            on(btnOnlineOffline,"click",goOnlineOffline);
-            on(btnPanLeft,"click",panLeft);
-
-            var imgOfflineIndicator = document.getElementById("state-span");
-            var btnState = document.getElementById("btn-state");
-
-            showMap();
-
-            function showMap(){
-
-                // Initialize our map to be responsive
-                map = Bootstrapmap.create("mapDiv",{
-                    //basemap: "topo", // comment out this basemap!
-                    center: [-122.45, 37.75], // longitude, latitude
-                    zoom: 15
-                });
-
-                // Now we initialize the basemap to be offline-enabled. This is out new basemap.
-                basemapLayer = O.esri.Tiles.OfflineTileEnablerLayer(
-                        "http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer",
-                        function(evt){
-                            console.log("Offline tile lib enabled. App is: " + Offline.state);
-                        },
-                        true);
-
-                // Add our offline tile layer to the map instead of using the default basemap!
-                map.addLayer(basemapLayer);
-            }
-
-            function downloadTiles(){
-
-                if(_downloadState == "downloading"){
-                    _wantToCancel = true;
-                }
-                else{
-                    _wantToCancel = false;
-
-                    // First delete any existing tiles from database
-                    basemapLayer.deleteAllTiles(function(success,err){
-                        var zoom = basemapLayer.getMinMaxLOD(minZoomAdjust,maxZoomAdjust);
-
-                        // Now download tiles
-                        basemapLayer.prepareForOffline(zoom.min, zoom.max, map.extent, function(progress){
-                            console.log("downloading tiles...");
-
-                            if(progress.hasOwnProperty("countNow")){
-                                var percent = Math.floor(progress.countNow / progress.countMax * 100);
-                                btnGetTiles.innerHTML = 'Saving to phone ' + percent + "% - Tap to Cancel";
-                            }
-
-                            if( progress.finishedDownloading )
-                            {
-                                btnGetTiles.innerHTML = "Saving to phone 100% - Tap to Cancel";
-
-                                if( progress.cancelRequested )
-                                {
-                                    alert("Tile download was cancelled");
-                                    _downloadState = "cancelled";
-                                }
-                                else
-                                {
-                                    alert("Tile download complete");
-                                    _downloadState = "downloaded";
-                                    btnOnlineOffline.disabled = false;
-                                }
-
-                                btnGetTiles.innerHTML = '1. Download Tiles';
-                            }
-                            return _wantToCancel; //determines if a cancel request has been issued
-                        });
-
-                        _downloadState = "downloading";
-
-                    });
-                }
-            }
-
-            // Force the tileLayer between online and offline
-            function goOnlineOffline(){
-
-                btnPanLeft.disabled = false;
-
-                if(btnOnlineOffline.innerHTML == "2. Go Offline"){
-                    toggleStateUp(false);
-                    console.log("Map is offline");
-                }
-                else{
-                    toggleStateUp(true);
-                    console.log("Map is online");
-                }
-            }
-
-            function toggleStateUp(state){
-                if(state){
-                    btnOnlineOffline.innerHTML = "2. Go Offline";
-                    basemapLayer.goOnline();
-                    imgOfflineIndicator.className = "glyphicon glyphicon-link";
-                    imgOfflineIndicator.innerHTML = " Up";
-                    btnState.className = "btn btn-success btn-large floatRight";
-                }
-                else{
-                    btnOnlineOffline.innerHTML = "2. Go Online";
-                    basemapLayer.goOffline();
-                    imgOfflineIndicator.className = "glyphicon glyphicon-thumbs-down";
-                    imgOfflineIndicator.innerHTML = " Down";
-                    btnState.className = "btn btn-danger btn-large floatRight";
-                }
-            }
-
-            // Set the ArcGIS.com map online or offline.
-            // When set offline it will look for tiles in the tiles database
-            function updateState(){
-                if(Offline.state === 'up'){
-                    if(typeof basemapLayer != "undefined") basemapLayer.goOnline();
-                    toggleStateUp(true);
-                }
-                else{
-                    if(typeof basemapLayer != "undefined") basemapLayer.goOffline();
-                    toggleStateUp(false);
-                }
-            }
-
-            // Pan left when "offline" to view only tiles that have been stored locally
-            function panLeft(){
-                map.panLeft();
-            }
-
-    });
-</script>
-
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                            
-
-
NOTE: Replace paths with your references. Or build your app in the /demo directory
-
- -
-
-
-
- - - -
-
-
- - -
-
-
-
-
-
-
- -
-
-
-
- -
-
-
-
-
- - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/demo/getstarted-tpk.html b/demo/getstarted-tpk.html deleted file mode 100644 index c86507f..0000000 --- a/demo/getstarted-tpk.html +++ /dev/null @@ -1,574 +0,0 @@ - - - - - - - - - Offline-editor-js - - - - - - - - - - - - - - - - - - - - - - - -
-
-

Getting Started with TPKs

-

Basic steps for working with TPK packages for offline.

- -
-
- -
- -
-
- - - -
-
-

Step 1: Fill in the basics

-

Add the basic library references and CSS. Then test to make sure application loads. - There won't be a map to display just yet, you'll only see the header bar.

-
- 
-                        
-<!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>Offline TPK</title>
-    <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" media="screen">
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css"">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 300px;
-            max-height: 1000px;
-        }
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="container">
-    <div class="row">
-        <div class="col-lg-12">
-            <div class="form form-group input-group">
-                <input id="url-input" type="text" class="form-control"
-                            value="../samples/tpks/Beirut.zip">
-            <span class="input-group-btn">
-                <button id="url-btn" class="btn btn-success" type="button">Go!</button>
-            </span>
-            </div>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tpk library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tpk-src.js", "dojo/domReady!"],
-            function(Map,on,BootstrapMap) {
-
-                var map, tpkLayer;
-
-                var url = document.getElementById("url-input");
-                var urlInputBtn = document.getElementById("url-btn");
-
-            }
-    );
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references.
-
-
-

Step 2: Retrieve TPK.

-

Download and unzip the TPK. You should get an alert when TPK is fully downloaded.

-

NOTE: If you have a TPK file you will have to change its type to .zip for the browser to recognize it.

-
- - 
-                        
-<!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>Offline TPK</title>
-    <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" media="screen">
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 300px;
-            max-height: 1000px;
-        }
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="container">
-    <div class="row">
-        <div class="col-lg-12">
-            <div class="form form-group input-group">
-                <input id="url-input" type="text" class="form-control"
-                       value="../samples/tpks/Beirut.zip">
-            <span class="input-group-btn">
-                <button id="url-btn" class="btn btn-success" type="button">Go!</button>
-            </span>
-            </div>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tpk library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tpk-src.js", "dojo/domReady!"],
-            function(Map,on,BootstrapMap) {
-
-                var map, tpkLayer;
-
-                var url = document.getElementById("url-input");
-                var urlInputBtn = document.getElementById("url-btn");
-                urlInputBtn.onclick = function(){
-                    getTPK();
-                };
-
-                // Retrieve the TPK file via an HTTP request
-                function getTPK(){
-                    urlInputBtn.innerHTML = "Get file via url";
-
-                    var xhrRequest = new XMLHttpRequest();
-                    xhrRequest.open("GET", url.value, true);
-                    xhrRequest.responseType = "blob";
-                    xhrRequest.onprogress = function(evt){
-                        var percent = (parseFloat(evt.loaded / evt.totalSize) * 100).toFixed(0);
-                        urlInputBtn.innerHTML = "Get file via url " + percent + "%";
-                        console.log("Begin downloading remote tpk file...")
-                    }
-
-                    xhrRequest.error = function(err){console.log("ERROR")}
-
-                    xhrRequest.onload = function(oEvent) {
-                        if(this.status == 200) {
-                            console.log("Remote tpk download finished.")
-                            zipParser(this.response);
-                        }
-                        else{
-                            alert("There was a problem loading the file. " + this.status + ": " + this.statusText )
-                        }
-                    };
-
-                    xhrRequest.send();
-                }
-
-                // Parse the zip file contents into a zip.Entries object
-                function zipParser(blob){
-
-                    O.esri.zip.createReader(new O.esri.zip.BlobReader(blob), function (zipReader) {
-                        zipReader.getEntries(function (entries) {
-                            if(entries) alert("TPK downloaded and unzipped!");
-                            zipReader.close(function(evt){
-                                console.log("Done reading zip file.")
-                            })
-                        }, function (err) {
-                            alert("There was a problem reading the file!: " + err);
-                        })
-                    })
-                }
-
-            }
-    );
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                        
-
-
NOTE: Replace paths with your references.
- -
- -
-

Step 3: Display TPK tiles.

-

In this step we hand the zip file entries over to TPKLayer to inflate the map.

-
- - - -
- - -
-
- 
-                            
-
-<!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>Offline TPK</title>
-    <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" media="screen">
-    <link rel="stylesheet" href="http://js.arcgis.com/3.11/esri/css/esri.css">
-    <link rel="stylesheet" type="text/css" href="http://esri.github.io/bootstrap-map-js/src/css/bootstrapmap.css">
-    <style>
-        #mapDiv {
-            min-height: 300px;
-            max-height: 1000px;
-        }
-        .container { padding: 20px;}
-    </style>
-
-    <!-- Include a reference to IndexedDBShim for library to work on Safari 7.x -->
-    <script src="../vendor/IndexedDBShim/dist/IndexedDBShim.js"></script>
-
-    <script src="http://js.arcgis.com/3.11/"></script>
-</head>
-
-<body>
-
-<div class="container">
-    <div class="row">
-        <div class="col-lg-12">
-            <div class="form form-group input-group">
-                <input id="url-input" type="text" class="form-control"
-                       value="../samples/tpks/Beirut.zip">
-            <span class="input-group-btn">
-                <button id="url-btn" class="btn btn-success" type="button">Go!</button>
-            </span>
-            </div>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-xs-12">
-            <div id="mapDiv"></div>
-        </div>
-    </div>
-</div>
-
-<script>
-
-    // Make sure to reference the tpk library within the require statement!
-    require([
-        "esri/map",
-        "dojo/on",
-        "//esri.github.com/bootstrap-map-js/src/js/bootstrapmap.js",
-        "../dist/offline-tpk-src.js", "dojo/domReady!"],
-            function(Map,on,BootstrapMap) {
-
-                var map, tpkLayer;
-
-                var url = document.getElementById("url-input");
-                var urlInputBtn = document.getElementById("url-btn");
-                urlInputBtn.onclick = function(){
-                    getTPK();
-                };
-
-                // Retrieve the TPK file via an HTTP request
-                function getTPK(){
-                    urlInputBtn.innerHTML = "Get file via url";
-
-                    var xhrRequest = new XMLHttpRequest();
-                    xhrRequest.open("GET", url.value, true);
-                    xhrRequest.responseType = "blob";
-                    xhrRequest.onprogress = function(evt){
-                        var percent = (parseFloat(evt.loaded / evt.totalSize) * 100).toFixed(0);
-                        urlInputBtn.innerHTML = "Get file via url " + percent + "%";
-                        console.log("Begin downloading remote tpk file...")
-                    }
-
-                    xhrRequest.error = function(err){console.log("ERROR")}
-
-                    xhrRequest.onload = function(oEvent) {
-                        if(this.status == 200) {
-                            console.log("Remote tpk download finished.")
-                            zipParser(this.response);
-                        }
-                        else{
-                            alert("There was a problem loading the file. " + this.status + ": " + this.statusText )
-                        }
-                    };
-
-                    xhrRequest.send();
-                }
-
-                // Parse the zip file contents into a zip.Entries object
-                function zipParser(blob){
-
-                    O.esri.zip.createReader(new O.esri.zip.BlobReader(blob), function (zipReader) {
-                        zipReader.getEntries(function (entries) {
-                            initMap(entries);
-                            //if(entries)alert("TPK downloaded and unzipped!");
-                            zipReader.close(function(evt){
-                                console.log("Done reading zip file.")
-                            })
-                        }, function (err) {
-                            alert("There was a problem reading the file!: " + err);
-                        })
-                    })
-                }
-
-                // Initialize the Map and the TPKLayer
-                function initMap(entries){
-
-                    map = BootstrapMap.create("mapDiv",{});
-
-                    tpkLayer = new O.esri.TPK.TPKLayer();
-                    tpkLayer.on("progress", function (evt) {
-                        console.log("TPK loading...");
-                    })
-                    tpkLayer.extend(entries);
-
-                    map.addLayer(tpkLayer);
-                }
-
-            }
-    );
-</script>
-<!-- Bootstrap core JavaScript
-================================================== -->
-<!-- Placed at the end of the document so the pages load faster -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
-<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
-</body>
-</html>
-
-                            
-
-
NOTE: Replace paths with your references. This sample may look different than our live sample.
-
- -
-
-
-
- - - - -
-
-
-
-
-
-
-
- -
- -
-
- -
-
-
-
-
- - - - - - - - - - - - - - - \ No newline at end of file diff --git a/demo/getstarted.html b/demo/getstarted.html deleted file mode 100644 index 90c5743..0000000 --- a/demo/getstarted.html +++ /dev/null @@ -1,124 +0,0 @@ - - - - - - - - - Offline-editor-js - - - - - - - - - - - - - - - - - - - - - - - -
-
-

Getting Started Samples

-

Basic responsive samples on how to work with the ArcGIS API for JavaScript while offline.

- -
-
- -
- -
-
-
-

Choose from the following tutorials

-
-
- Offline Tiled Map Services - Offline ArcGIS Online tiled maps - Offline Editing - Offline TPKs (Tile Packages) -
-
-
- -
-
-
-

Fork or clone offline-editor-js

-
-
-

Here are the important directories to know:

-
    -
  • \dist - minified library files and concatenated source (for debugging).
    • -
  • \samples - more examples that demonstrate the library's functionality.
    • -
  • \vendor - contains IndexedDBShim and offline.js helper libraries
    • -
-
- -
-
-
- -
- - - - - - - - - - - - - \ No newline at end of file