WABDE
WABDE = Esri Web App Builder, Developer Edition
I have it working in Docker, and publish it on the Docker Hub and in Github now.
Predefined apps
When you create an app in WABDE it gives you a choice of a few predefined apps, based on the contents of an internal "predefined_apps" folder.
Some apps allow you to choose themes after creating the app
| Name | internal name | default theme | choose theme? | choose widgets? |
| Ground Zero | basic_viewer | Dart Theme | no | no, they are predefined but you can turn them off |
| Infographic dashboard | infogaphic_dashboard | Dashboard Theme | no | no says "add widgets through the widgets tab" but there is none |
| Default 2D | default | Foldable Theme | yes | yes |
| Editor | editor | Jewelry Box Theme | no | no, just a few widgets are included |
| Maplet | simple_map_viewer | Jewelry Box Theme | no | no but comes with a 3 predefined locations that you can't alter (??) |
Conclusion: use only the default app template, because it's the only one that lets you choose both themes and widgets. Use the default template, then select the LaunchPad theme because it allows multiple widgets to open at the same time, handy for development.
When you create a new app, it copies the predefined app into the apps/ folder, and when you add more widgets, it copies them in there too.
So normally there will be a themes/ folder with just one theme in it.
In config.json, there is not a list of themes, just the one. I can change it out by copying another theme into themes/ and editing config.json.
Themes have widget controllers in them for example DartTheme has DartController and PlateauTheme has HeadController. They also have panel controllers, for example, DartTheme has and PlateauTheme has DockablePanel and FoldablePanel.
Widget development
Set up a copy of WABDE, for instance using wildsong/wabde from Docker Hub These commands assume you know what Docker is, have it installed, and have read the README to generate a signininfo.json file.
docker pull wildsong/wabde docker run -d --name wabde \ -v ./apps:/srv/server/apps \ -v wabde_db:/srv/server/db \ -v wabde_widgets:/srv/client/stemapp/widgets -v signininfo.json:/srv/server/signininfo.json \ -p 3344:3344 wildsong/wabde
Create a new repository for your widget, you could use my template to do this. Find it at https://github.com/Wildsong/arcgis-wab-widget-template
Clone it to some convenient temporary place.
git clone [email protected]:brian32768/wab-table-widget.git WildsongTableWidget
Edit WildsongTableWidget/manifest.json to put in the correct name. It has to exactly match the folder name, WildsongTableWidget in this case.
Copy the widget into the widgets folder.
docker cp WildsongTableWidget wabde:/srv/widgets/
Now you should be able to create an app and add the widget.
Use your IDE (Visual Studio Code) to edit files in apps/2/widgets/WildsongTableWidget. Note that this is a copy of the code you just checked out, so the workflow could be
- edit
- test
- git push
Then when you want to create a new app, make sure you copy your changes back into the client widget folder by doing a "git pull" over there in client widgets folder.
Open Source code used by Esri in WABDE
Reading the license file tells me they built it on a lot of open source, this is an interesting source of information about what people are using in their projects.
- dojo
- dijit
- dojox
- dgrid
- xstyle
- put-selector
- dstore
- esri/workers/libs/rtree.js
- esri/workers/libs/kdtree.js
- bigjs
- pdf.js
- png.js
- unitBezier.js
- mapbox-gl-js
- glmatrix.js
- hershey fonts
- glfx.js
- ace.js
- jsPdf https://github.com/MrRio/jsPDF
- store.js
- usng.js
- qrcode generator https://github.com/kazuhikoarase/qrcode-generator
- jquery
...and more but I am tired of typing
