Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

DPS 2015 API Documantation

jzhang2016
Level 5
Level 5

Hi, Is there any more documentation out there on how to implement the Gesture APIs? I have the sample files, we just cant figure out how to apply the API to our HTML overlays from the current documentation. Mainly we are trying to stop the nav bar from coming down when a user taps on an html overlay.

Thanks!

Jeff

1 Accepted Solution
Neil_Enns_-_Ado
Correct answer by
Employee
Employee
7 Replies
Neil_Enns_-_Ado
Correct answer by
Employee
Employee
jzhang2016
Level 5
Level 5

Thanks Neil. I've had these files for weeks and my programer has yet to understand how to call the API in the html or apply the API to the html content from the available documentation.

He is confused by the example given in the pdf as he is struggling to find '#slideshow-container-one' in the example code to see how it works etc. We only want to stop the nav from coming down regardless of where the user taps on the web overlay.

Can you provide a clearer understanding of how to use the API for this? What would the html look like for a web overlay that's calling the API to disable the chrome?

Jeff

Neil_Enns_-_Ado
Employee
Employee

You need to:

1) Include the .js file in your HTML

2) Wire up an event handler when the document loads

3) Call adobeDPS.Gesture.disableNavigation() and pass in the top-level element for your page (I guess the body element)

Unfortunately I'm not much of a JavaScript developer, however steps #2 and #3 (passing the top-level element to a function) are pretty fundamental JS tasks that should be well-documented on the web.

Neil

jzhang2016
Level 5
Level 5

Thanks, I'll pass on the info as I also know little about JavaScript.

Jeff

mikecyang
Employee
Employee

Hi Jeff,

You can wrap the function call that Neil mentioned in the standard $(document).ready():

<html>

<head></head>

<body>

<script src="/path/to/dpsHTMLGestureAPI.min.js"></script>

<script>

     $(document).ready(function() {

          adobeDPS.Gesture.disableNavigation();

     });

</script>

</body>

</html>

The PDF example was showing how you can disable a particular element within the HTML  (i.e. a slideshow) by passing in the element(s) into the disableNavigation() function. If you just call disabledNavigation(), as shown above, you will disable the navigation for all elements.

jzhang2016
Level 5
Level 5

Awesome! Thank you for this piece!

Jeff

jzhang2016
Level 5
Level 5

Just a followup, we have achieved success using the code example you provided! Thank you!

Jeff