SaveSession Widget

[#1]

The SaveSession Widget for ArcGIS Web AppBuilder enables users to save the current map settings into a session and restore them again later. A saved session includes the extent, visible layers and annotations of the current map. Sessions may be saved and loaded from files so they can be shared with others.

Using the Widget

The SaveSession Widget is an in-panel widget that will be displayed in the toolbar of your WebApp Builder application. Click the icon display the SaveSession panel.

Saving a Session

Once you have the map just the way you want it - zoomed to the area and layers turned on, enter a name for the session and click the Save button. The session will be added to the Saved Sessions list.

Restoring a Session

To return the map to the same state as when you saved the session, you can double-click the title of the session to load the map.

Managing Sessions in the List

Hover over the Actions column for a session entry to reveal the actions that can be performed on the entry.

Load Map = will load the restore the selected session to the current map

Download Map = will save the session entry to a file that may be shared.

Edit = allows the user to change the session name

*Move Up - Down * = lets you arrange the entries in the session list in the desired order

Delete = click the Delete button to remove the entry from the list

Sharing Sessions

Saved Sessions may be shared with other users or another browser on the same PC by saving the session to a file and then loading the session from the file into the session list.

To save a single session to a file, click the Download Map action for the entry. To save all sessions in the list to a file, click the Save to file link.

To load the sessions from a file, click the Load from file link to display the Load sessions from file dialog

Click the Choose File button and select the file to load. The selected file must be a saved session file. All sessions from the file will be loaded. If a loaded session has the same name as an existing session, a number will be appended to the session to make the name unique.

Widget Setup

Source code and installation instructions may be found at GitHub - softwhere/SaveSession-Widget

v2.7  - released on 4/3/2018

Download

Thanks to the City of Garland, Texas for sponsoring the initial development of the SaveSession Widget and releasing it to the community.

[RebeccaStrauch__GISP]

Added to resource list.  Thanks

[NicholasBarger]

Hi David,

Nice Widget.  It seems to work but I am experiencing a couple errors.  It successfully creates my session with the layers active and the extent saved.  It also stores it in the table.

However, when I click on the download map button or Save to file link it errors our.  It tries to redirect me to a website and I get a 405 error.  Now when I click on the Save to File it gives me the 405 error but still allows me to download the file.

I can import the file successfully without error.I get the same results regardless of whether I have the Use Server to Download option checked or unchecked.

What should I be placing in the URL ... or where should that be directing to?

I'm also using the local layer widget so I'm not sure if that has anything to do with this.

Thanks,

Nick

[NicholasBarger]

Solved my own problem by commenting out line 429... this.saveToFileForm.submit();  of the widget.js

I'm not sure if this is totally correct...but it works.

[DavidMcCourt]

That's right, Nicholas. I added a fix for this.

Thanks for letting me know.

[DanielChantlos1]

David,

I've been unsuccessful with this widget so far. I've edited the config.json file as mentioned and have used many other custom widgets in the past. I'm not sure if you have seen this error in the select widget window (see picture below). I can't seem to add it to my Web App either. Any ideas what could be going on?

[DavidMcCourt]

Sorry to hear about the problems, Daniel. When you add a widget to an existing app, the WAB should copy the widget folder to the app's widget folder. Can you double check that your app has the Widgets\SaveSession folder. If not, you may need to help it out by copying the arcgis-web-appbuilder\client\stemapp\widgets\SaveSession folder to the \arcgis-web-appbuilder\server\apps\[YOUR APP ID]\widgets\SaveSession folder.

Each app has a number you can see in the url.

Hope that helps.

[DanielChantlos1]

Thanks for the heads up. I didn't realize these weren't automatically pulling themselves in that folder like a few of the other widgets I've used. I think we're close, but now I'm getting this error in WAB when adding the widget (see picture below). Could you confirm the name of the widget folder to use?

Also I have the full config.json file as the following:

"widgets": [ 

    {

        "uri": "widgets/SaveSession/Widget"

    }

    ...

]

    "useServerToDownloadFile": true,

    "saveToFileUrl": "http://localhost/Service/SaveToFile/",

    "fileNameForAllSessions": "COGMAP_Sessions.json",

    "fileNameTplForSession": "COGMAP_Sessions_${name}.json"

}

Thanks for the help!

[DavidMcCourt]

The WAB should copy the widget folder, Daniel. I'm not sure why it's not, but I'm seeing the same thing. Maybe someone will have a suggestion on how to fix that.

Get the latest zip file. Then copy the SaveSession folder from the zip to the widgets folder so it should be \arcgis-web-appbuilder\server\apps\[YOUR APP ID]\widgets\SaveSession folder.

After that's copied you should be able to add and configure the widget. The error you show is that the WAB can't find a file it expects.

[btpbtp]

Hello,

I couldn’t succeed to save file to server from IE.

Is there any setting I supposed to do in the server side for this?

Thank you.

[NicholasBarger]

For what it’s worth… if I am following this conversation correctly… my Save Session Widget copies correctly to any of the widgets I placed it in. I’m using FireFox. The only other option I could see would be to make sure that you Copied the correct Folder. When these widgets are unzipped you see a SaveSession file folder. This is not the correct folder to copy to the server. Make sure you copy the next folder in, which should also be named SaveSession.

~ Nick

[NicholasBarger]

I responded to the incorrect message... see my message above.  I hope I have not misunderstood the problem in this thread.

[DanielChantlos1]

David, I've got it working now, but I had to use a different method than described. Should anyone else run across the same issues as myself, here's what I did:

1. Save unzipped widget folder here:

C:\WAB\client\stemapp\widgets

     -Config .json file

2. Unzip again and save widget folder here:

C:\WAB\server\apps\[APP ID]\widgets

     -Do not configure .json file

[btpbtp]

For me the widget works great. Besides the option to save the json file to server while using Internet Explorer.

That what I want to know, how can I configure the server to accept files from the widget/app.

Thank you for the fast response

[DavidMcCourt]

I'm glad you got it working, Daniel. However, that process does not sound right. The installation zip file may have been messed up.

Can you download the zip file again.

There should be a PDF to describe the install process and the folder structure

[DavidMcCourt]

Visit http://caniuse.com/#feat=download to see if your browser supports downloading from data urls. If not, then you'll need to enable the Use Server To Download File option and create a service that returns the session file as an attachment.

Note that a web service that downloads the session file is not included in the widget. It lives outside the widget on your own web server.

[DanielChantlos1]

I followed the PDF guide, and had the problems I previously mentioned above. It wasn't working for me until I configured the .json file only in C:\WAB\client\stemapp\widgets. Once I created an app, I had to manually copy the same widget folder into C:\WAB\server\apps\[APP ID]\widgets and remove the .json configuration described by your installation process. To be honest, I'm not sure why this method works, but I'm no longer experiencing problems using the widget on multiple apps.

[LefterisKoumis]

According to the link you provided, IE 10 is not supported, but it works on my workstation. So no need to use enable to use Server.

[JasonStanton__GISP]

David, This widget is awesome!  I'm having difficulty understanding what exactly is meant by "create a service that returns the session file as an attachment".  What type of service?  What parameters?  Do you have an example that you could provide?

[ShannonDeArmond]

Yes, an example would be very helpful, if possible

[AdamDrackley]

This is a great widget with some really neat applications.  A quick question; Is anyone else finding that while saved sessions are being re-added to the map properly, the checkboxes in the LayerList widget aren't properly reflecting the new layer visibilities?  I'm seeing this with both ArcGIS Online Maps and LocalLayer configurations.  Let me know if this is just me!

Edit; I should mention that I experience this using the 1.3 version of WAB.

[AdamVellutini]

Yes, I have noticed that same thing.  I haven't looked through the code, but I wonder if it's drawing a graphic of the visible layers when you save a map instead of making those layers active in the LayerList widget?  Something else I have noticed is that when you save a map session, it is not specific to the application you saved it in.  For example, we have several applications with different layers in the LayerList.  I can save a session from one application with a set of layers on, open a different application and see my saved session there.  When I click on it, it zooms to the correct extent and draws those layers even if they don't exist in the application LayerList.  Actually what it does is import the LayerList from application #1 into application #2, which is less than ideal.  I hope to have time to look through some of the code but wanted to post this to see if anyone has experienced this or has an ideas on it.  It's a great widget and very close to what we have been looking for! 

Thanks.

[AdamDrackley]

I've run into this kind of behaviour before with the LocalLayer widget.  It seemed like the Web AppBuilder's idea of a 'visible layer' differs somewhat from what's described in the API doc.

Currently, the SaveSession widget attempts to 'set' layer visibility using the following code on line 615 of Widget.js:

                    if (layerSettings.visibleLayers && layer.setVisibleLayers) {

                        layer.setVisibleLayers(layerSettings.visibleLayers);

                    }

For some reasons related to how the jimu.js libary interprets layer visibility, I'm finding that changing this section to use the code below results in the LayerList widget 'properly' interpreting which layers should currently be visible.  This code is similar to some code we use in the LocalLayer widget as well to accomplish the same purpose.  As an example of the WAB's oddness, note that in order to properly interpret a layer as truly 'off', it requires an array consisting only of three '-1' values.  Any light that could be shed on this by anyone would be great!

                    if (layerSettings.visibleLayers && layer.setVisibleLayers) {

                        var visibleLayers = lang.clone(layerSettings.visibleLayers);

                        if (layerSettings.visibleLayers.length == 0) {

                            visibleLayers = [];

                            visibleLayers.push(-1);

                            visibleLayers.push(-1);

                            visibleLayers.push(-1);

                        }else{

                            var removeItem = []

                            array.forEach(visibleLayers,function(visibleLayer, index){

                                if (visibleLayer == -1){

                                    removeItem.push(index)

                                }

                            })

                            for (var i = removeItem.length; i-- > 0;){

                                visibleLayers.splice(i, 1)

                            }

                        }

                        layer.setVisibleLayers(visibleLayers);

                    }

In any case, this enhanced code works well for me.  If other adventurous people want to give it a try, I'd be happy to fork the repo for an enhancement if it would benefit the widget.

[AdamVellutini]

I tried the enhanced code and it works perfectly!  Thanks so much for posting that; very appreciated.

[RobertScheitlin__GISP]

Adam,

  Strange that it would be three -1s have you tried to pass an array like [,,-1] to see if it is just the third item that WAB needs as -1?

[AdamDrackley]

Haven't tried Robert, but I think the three "-1"s are necessary.  If you peek into jimu.js/LayerInfos/LayerInfoForMapService.js, you can see it gets pretty nutty.

Line 633:

      if(visibleLayers[0] === -1 &&

         visibleLayers[1] === -1 &&

         visibleLayers[2] === -1) {

        this._subLayerVisibleChanged();

        this._isShowInMapChanged2();

        return;

      }

Line 644:

var visibleLayersForSetVisibleLayers = [-1, -1, -1];

Line 211:

      var ary = [-1, -1, -1], index;

The WAB really seems to be marching to the undocumented beat of its own drummer on these; The best I think we can try to do in our own widgets is emulate it as best as possible.

[RobertScheitlin__GISP]

Adam,

Wooh... OK they are doing something screwy there. I will have to look closer to see if I can figure out why.

[LefterisKoumis]

This a great widget. When you load up at the first the widget runs fine. However, after a couple saves, I get the message:

"Widget.js:950 Uncaught QuotaExceededError: Failed to execute 'setItem' on 'Storage': Setting the value of 'sessions' exceeded the quota.

even though I already cleared up the cache (F5), and there are no sessions listed on the table. I even used the localStorage.clear() at the console.

I am using Chrome, the latest version.

Ideas?

Thanks.

[DavidMcCourt]

Chrome should store about 5 million characters in localStorage. Is your sessions string longer than that?

You can use the resources tab on Chrome developer tools to view the contents of localStorage. The quota is applied to all apps in the same domain, so there could be other apps that are also using localStorage.

[LefterisKoumis]

Thanks for the reply.

I check periodically the Local Storage and Session Storage and they're both empty. It is bizarre because I get the "quota exceeded.." when they are empty.

I am testing the application on my workstation, not on the server, and there are no other apps running. To avoid similar problems with other users, perhaps I modify the script to provide the option to the users to save the session file at a location of their preference. Of course they will have to retrieve every time they open the browser, but it is more trouble-free approach.

[MariaNieves]

Hi,

I am trying to add this widget to my web application but I am getting errors when I try using it. I can successfully configure the widget on WAB 2.0. I can save multiple sessions on the app however, when I go from one saved session to another, the application slows down significantly to the point the my ArcGIS Server service stops responding. When the service finally responds, the application displays all the layers available regardless of the layer visibility setup in the map service. The application continues having performance issues until i refresh the browser and remove the saved sessions. I don't experience any performance issues once I remove this widget from the app.

Ideas?

Maria

[helenchu]

Hi ,

It is a great widget.  Thank you very much.

Is it possible that you add 'Disable Popup' of each layer to this SaveSession widget ?  I think it's very helpful too.

Thank you

[RichBell]

Could I get the code change to let the user decide where to save the session file as stated above from

Lefteris Koumis

Thank You

Richard Bell

[LefterisKoumis]

I would send the code to you, when I figure out how to attach a file....

[RobertScheitlin__GISP]

There is no advanced editor on a document like this. Rich will have to start a new thread and tag Lefteris in it.

[DavidMcCourt]

Pull requests are accepted, Lefteris. Or if you prefer to send me the code I can merge in your changes.

[LefterisKoumis]

I created a button "Save to Local File" and this is the function shown below associated with the click. It uses the session name as the file name and each browser act different. Chrome saves it in the download folder but IE prompts the user to select destination folder. I think Robert Scheitlin used this code in another widget and I thought it would be handy here.

onSaveButtonClicked: function () {

                console.log('SaveSession :: onSaveButtonClicked :: begin');
                var session,
                sessionName = "";
                sessionName = this.sessionNameTextBox.get("value");
                if (!sessionName ||  sessionName==="") {
                    alert("Please enter a name");
                    session="";
                    this.sessions=[];
                    return}
                else {
                    session = this.getSettingsForCurrentMap();
                    session.name = sessionName;
                    this.sessions=[];
                    this.sessions.push(session);
                    var sessionString = JSON.stringify(this.sessions);

                    var blob = new Blob([sessionString], {type: "application/json"});
                    var url  = URL.createObjectURL(blob);

                    var a = document.getElementById("content");
                    var thefileName = sessionName + ".json";
                    if (a.download !== undefined) { //feature detection)
                        var att = document.createAttribute("download");
                        att.value= thefileName;
                        a.setAttributeNode(att);
                        var att2 = document.createAttribute("href");
                        att2.value=url;
                        a.setAttributeNode(att2);
                        }
                    else {
                        a.setAttribute("href", url);
                        a.addEventListener("click", function(event) {
                        navigator.msSaveBlob(blob, thefileName);
                        }, false);
                    }
                }
               }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

[RichBell]

Thank You for the help!

But When I replaced the onSaveButtonClicked: function. The session will not save and the “Save to file” button will not highlight.

I think I may be missing something else, Config change maybe?

Rich

[LefterisKoumis]

Based on the suggestions of my customers who wanted a simple way to save the session to a local file, I removed all the actions, except the save to a file and load from a file.

If you wish, I can send you the modified widget in a zip file. 

[RichBell]

Yes Please , I just want to be able to save the file to my local drive using IE.

It works in Chrome???

Rich

[LefterisKoumis]

PM with your email.

Yes it does in Chrome. It will save it in the download folder. 

IE will prompt you where you want to save it. 

[RichBell]

Maybe if you could send me the whole widget as a zip?

That would be great…!

Rich

[deleted-user-0W0-oLHxDjCX]

This widget is awesome. Beyond that does anyone knows how to clean cache on WAB? I think this features are complementary.

[deleted-user-CQZbjNeBXm49]

Hi Lefteris,

Would it be possible for you to send me same please?, because I do have staffs who had like to save on their local drive as they don't have access to the server.

Most appreciated

Baba

[JasonStanton__GISP]

Same here please!  Thank you!!

[LefterisKoumis]

The modified save session widget is posted at:

https://community.esri.com/docs/DOC-8914-savesessionzip 

[deleted-user-CQZbjNeBXm49]

Appreciated lkoumis

[JasonStanton__GISP]

Thank you very much!  It is greatly appreciated!!

[RichBell]

Thank You!

I found that the original widget may not be the problem. The “Save to File” works inside of WAB with IE, but it does not Save to File when NOT using WAB.

I get an internet error for the blob data being sent and it runs endlessly? Any ideas what to change in IE? Download file is enabled in the internet settings?

Richard

[JosephDavies]

Hi guys,

Has anyone tried saving a layer which is generated by the user through a filter? (the filter sets the layerDefinitions for an ArcGISDynamicMapServiceLayer). 

I've noticed that there is a function getOptionsForDynamicLayer(), but layerDefinitions is not an options property.

And for feature layers there also seems to be no way of saving and loading the definitionExpression.

Does anyone have any experience with this?

Joe

[GisGKAuckland]

I installed it fine and I could share the file to someone in my team.

One of the things that I noticed is the state of the map isn't restored, I happen to pan the map to a certain region but my colleague couldn't reflect it on his machine with the file I shared.