WABDE: Difference between revisions

From Wildsong
Jump to navigationJump to search
Brian Wilson (talk | contribs)
Brian Wilson (talk | contribs)
mNo edit summary
 
(One intermediate revision by the same user not shown)
Line 4: Line 4:
and in [https://github.com/Wildsong/docker-ArcGISWebAppBuilder Github] now.
and in [https://github.com/Wildsong/docker-ArcGISWebAppBuilder Github] now.


== Open Source part ==
== 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
 
{| border=1
|-
| 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 [https://hub.docker.com/r/wildsong/wabde wildsong/wabde from Docker Hub]
These commands assume you know what Docker is, have it installed, and have read
the [https://github.com/Wildsong/docker-ArcGISWebAppBuilder/README.md 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,
Reading the license file tells me they built it on a lot of open source,

Latest revision as of 21:29, 17 March 2021

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

  1. edit
  2. test
  3. 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

...and more but I am tired of typing