Latest Contributions by StephenSylvia

Emily, You will need to "set up you project folder" where you cloned the project (location in your first screenshot) but you will need to be using the Git Shell and not just the normal command line. If you type in "git" you should see a list of commands. This will indicate that you are using the correct command line tool. From there, you will want to run the 4 commands that are in "setup project folder" section. This will install the dependent files and apps to test and build your app. Then you can run 'bundle exec middleman' and open http://0.0.0.0:4567/‌ when that is running. The runs a local server on your computer that displays a test version of your app. When this is running, modify the source files and refresh your browser to see changes. When you have all the changes in place, run 'bundle exec middleman build' to create a deployable version of your app. ... View more

Also, make sure you are running these commands from within the project directory that contains the playlist files. Here’s a trick to get there easily: http://lifehacker.com/5989434/quickly-open-a-command-prompt-from-the-windows-explorer-address-bar ... View more

Emily, The first thing you'll need to do is make sure you are using the developer download of the Playlist app. Instructions for setting up your computer for testing your app, building it for production, and source code are available here: Esri/playlist-storytelling-template-js · GitHub‌. After you have added the additional photo icons to the correct folder, open up the MapConfig.js file (source > app > javascript > playlist > config > MapConfig.js). On line 19 you can increase the 'maxAllowablePoints' variable. Then make sure you build you app for production before deploying to your server. ... View more

Yes, if you go to the item's detail's page for any web map or layer in ArcGIS Online, under the properties section there is a credit field. If you are the owner, you can edit this credit's property. Anything that has been added here will show up in the citation section of the map. ... View more

This should work: $('.button').click(function() {   $(".playlist-item").addClass("hidden-layer");   $(".playlist-item[layer-id='" + you_first_layer_id + "']").removeClass("hidden-layer"); }); $('.button2').click(function() {   $(".playlist-item").addClass("hidden-layer");   $(".playlist-item[layer-id='" + you_second_layer_id + "']").removeClass("hidden-layer"); }); ... View more

try using "projectType" instead of "Project Type." It's possible that the space is messing things up. Also, make sure to change it in both the app config and the point layer in the map. ... View more

Yes, you should use a single web map with multiple point layers. In the developer download, the config is in the data > config.yml file ... View more

This should actually be pretty easy to do in the playlist app if you have a little html/css/javascript knowledge. The playlist is populated with one or more point layers in your map. Normally, you would create a single point layer and add a field for both the filter and the icon color. In your case, you will want to add a new point layer for each tab that you want to create. Within each point layer, add an icon color field and filter name field as you want them to be displayed in the final version. When you first load the map into the playlist, all the points from multiple layers will show up in a single list. If you inspect one of the playlist items wrappers in the side panel (e.g. the strip that contains the icon, thumbnail image, and title text) with a web debugger (make sure the element you are looking at has the class "playlist-item"), you should see the follow 3 data attributes: layer-id, object-id, and data-filter. Now you can add tabs to the html and hook them up to a new event function within the "addEvents" function in the List.js file. For each tab, you should add a click event that will select all the "playlist-items" and add the class "hidden-layer" then select all the "playlist-items" that also have the "layer-id" that matches the layer you want to display and remove the class "hidden-layer." You'll also want to do something similar to update what checkboxes appear in the filter dropdown. At the end of this function, call "setItemResults()" to update the playlist and sync the points displayed on the map. Once you have added the JavaScript, you'll need to add this line of CSS to the _list.scss file: .hidden-layer{ display:none; } If you have done this correctly, when you click a tab, the app will hide all the playlist items that do not match that layer id, then the "setItemResults()" function will run and find all the hidden playlist items and also hide the corresponding points on the map. ... View more

Yes, it is technically possible to bypass ArcGIS Online and reconfigure the storytelling templates to use an service from ArcGIS Server instead of building a web map. However, this requires the user to have JavaScript developer on hand to construct the map definition within the code of the app. Within every app, there is a function that loads the web map, if you switch this function to use a standard map through the JavaScript API and it matches the app required layers, it should just work. Loading a web map through the API is basically the same as loading a standard map except the web map will bring across all the layer definitions, popups, etc. that were configured through ArcGIS Online. We have decided to make all of our apps use web maps because they allow our users to configure various layer types without having to know JavaScript. ... View more

In order to change the symbology of the map, you will need to go into the code and create a custom renderer. This requires the developer version of the source code and will require you to install a couple apps to build the code for production use. Once you have done that, you can open the MapConfig.js (source > app > javascript > playlist > config >MapConfig.js), set the use default renderer variable to false, and fill in a new renderer function in the else statement of the getRenderer function. Here's the story locator MapConfig.js file to help you out: https://github.com/ssylvia/playlist-storytelling-template-js/blob/world-of-story-maps/source/app/javascript/playlist/config/MapConfig.js Once you have it working, you can build your app and publish it on a server. ... View more

How are you adding your images from Picasa? Are you adding them through Picasa uploader that is built into the app or are you pasting the url to the photo into the app? First make sure your photo is shared publicly through in Picasa. We cannot display private images. Also, if you are pasting the URL to the photo, make you you copy the photo's url and not a webpage with the photo in it. The url should have a ".jpg" ending. Many photo hosting sights, like picasa, will display the image within the a webpage when you click to expand it. Instead of copying the url in the browser's url bar, right click on the photo and choose "Copy photo link" or "Copy photo url." If you still have issues, let us know. ... View more

You have to first have Grunt-CLI installed (seperate from the npm install) before you are able to access the grunt command in the project. I've update the GitHub readme to help other users. ... View more

Can you run the follow command in the terminal bundle exec middleman build Then save what get's printed to console and attach it so I can see if there are any errors. ... View more