-
Notifications
You must be signed in to change notification settings - Fork 70
How To: Adding a custom scan again button to my awe app
Some awe designers want to add a persistent button to their awe app that will take their users directly to the Scan UI
.
In the object editor UI:
- select the object you want as your
Scan
button - click on the
...
button - select
Actions
then selectCustom script
Then in the Javascript area add this code.
util.setURLData(application.current_view.name+"/scan");
Now go to the live preview
and tap or click on that object and you will be taken to the Scan UI
. See the note below about What if not all my views are image based?
Click on the orange circle in the bottom left corner (the doodat), then select Settings
, then select the Custom code
section. Then add the code below inside the default go()
function defined in the Javascript area. This code will add an onclick handler
to your HTML overlay image (defined under the Custom branding
section of your Settings
area). Please make sure that the On select
option of your HTML overlay image is set to Do nothing
to avoid any conflicts.
function setup_overlay_image() {
if (!overlay_image) {
overlay_image = document.getElementById('user_overlay_image')
}
if (overlay_image) {
overlay_image.addEventListener('click', function(){
util.setURLData(application.current_view.name+"/scan");
})
}
}
If this is the case then not all your views will support the /scan
sub-path. So links on these non-image views that point to application.current_view.name+"/scan"
will break. To avoid this just replace the application.current_view.name
part with a pre-defined image view name. e.g.
Change this
util.setURLData(application.current_view.name+"/scan");
Into this
util.setURLData("/your_default_image_view_name_goes_here/scan");
NOTE: Please make sure you include the /
in front of your_default_image_view_name_goes_here
When you first open the Custom code
section of your app's Settings
section you'll see some default Javascript. This shows you how to setup a simple function that is called once your app has fully loaded. By putting your code inside here you are ensuring it is only run after all the relevant parts of your awe app are fully setup. This default function is named go()
. Here's the code again in case you have removed it.
if (awe_boot._state == 'ready') { go(); } else { awe_boot.subscribe_to_state('ready', go); }
function go() {
// put your code here
}