buttonDown / buttonUp

Workarounds and usability notes.

buttonDown / buttonUp

Postby John Robin Dove » Sat Apr 25, 2015 11:32 am

I need to use buttonDown and buttonUp but these don't exist in the TB Actions interface. I have managed to achieve this by using pgGotoURL to go to this html:

Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <title></title>
  <style type="text/css">
button {
 font-size: 1.2em;
 font-family: Times New Roman, sans-serif, Arial;
 margin-right: 30px;
}
</style>
  </head>
  <body bgcolor="#FFFF99">
 
  <button onmouseover="setTruck()">move truck</button>
  <button onmouseover="setBall()">move ball</button>
 
  <script>
  addEventListener("mousedown", function(event){
    sendDown();
    }, true);

    addEventListener("mouseup", function(event){
    sendUp(); 
    }, true);
   
  function setTruck() {
  top.tbfunction_pgTBObjSet("objectSelected","text","truck");
  }
 
  function setBall() {
  top.tbfunction_pgTBObjSet("objectSelected","text","ball");
  }

  function sendDown()
  {
  top.tbfunction_pgTBObjSet("startTimer","trigger");
  }

  function sendUp()
  {
  top.tbfunction_pgTBObjSet("stopTimer","trigger");
  }
 
  </script>

  </body>
</html>


You can see the result here http://www.mediacours.com/tb_examples/buttondown-up Apologies for the naf example :D but it does what I will require i.e. start and stop a timer.

Could I have done this without resorting to pgGotoURL?
And if not how could I make the buttons look more like Toolbook buttons?
John Robin Dove
 
Posts: 486
Joined: Thu Jan 23, 2014 4:35 am

Re: buttonDown / buttonUp

Postby Clifton » Sat Apr 25, 2015 12:24 pm

We've go you covered on mouse events.

Take a look at userProperty() as it can dynamically add/remove mouse/down/up events for any object. The function leverages the user event to get you notification of the events.
Clifton
Site Admin
 
Posts: 732
Joined: Tue Jan 14, 2014 1:04 am

Re: buttonDown / buttonUp

Postby John Robin Dove » Sat Apr 25, 2015 12:32 pm

OK. Many thanks.
John Robin Dove
 
Posts: 486
Joined: Thu Jan 23, 2014 4:35 am

Re: buttonDown / buttonUp

Postby Clifton » Sat Apr 25, 2015 1:10 pm

Here is a working example of a page responding to mouse up/down events and it shows some of the things that can be done with CSS styles when applies to fields and/or buttons.

http://www.pgsoftwaretools.com/powerpac/assessments/lirr_buttoncss

Sorry, but this is in ToolBook v11.5 so I cannot provide the example in v9.01 unless I rebuild it. Nevertheless, the action code is pretty basic really.
Clifton
Site Admin
 
Posts: 732
Joined: Tue Jan 14, 2014 1:04 am

Re: buttonDown / buttonUp

Postby John Robin Dove » Sat Apr 25, 2015 1:19 pm

Hi Clifton,

I tried to test userProperty(). I put a button on the page and for on click added userProperty(name of self, "mouseEvents"). (I also added actions to on User event to try to retrieve the mouseUp and mouseDown events.)

When I exported to DHTML I got this error message: Unexpected error <com.toolbook.mercury.export.axf2dhtml.common.PropertyParameters property=...> is missing or not valid. but the export process continued. The new DHTML loaded and functioned normally but the button I added was not displayed.

UPDATE I've just tried with a field and this seems to function correctly. Maybe buttons should not be used for this?
John Robin Dove
 
Posts: 486
Joined: Thu Jan 23, 2014 4:35 am

Re: buttonDown / buttonUp

Postby John Robin Dove » Sat Apr 25, 2015 2:13 pm

Hmm .. a bit frustrating! No problems if I use a field. However, If I use createStyledButton() to make the field look like a button I get a nice button but the userProperty() function does not work. If I disable createStyledButton() userProperty() works again.
John Robin Dove
 
Posts: 486
Joined: Thu Jan 23, 2014 4:35 am

Re: buttonDown / buttonUp

Postby Clifton » Sat Apr 25, 2015 3:26 pm

Mouse events will be set for the field which contains your styled button rather than the styled button itself. Currently, the function createStyledButton() does not support mouse up/down events. This function uses the field as a container to size and build a styled (or themed) button. Therefore, when you click the button, the field never receives the mouse events—instead only the styled button is targeted.

I would recommend using a CSS stylesheet and create a button class. OR create resource graphics for your buttons. The advantage of either of these approaches is the buttons will look the same in all browsers and devices, whereas a styled button created with createStyledButton() will take non the themed look of the OS and browser of the client device.

Web-based CSS Stylesheet button generators:
(Each one has their advantages and limitations. Some are easier to use and others offer more features. Which to use depends on the look and feel you are trying to achieve.)
To create and use a CSS stylesheet button:
  1. Create a button style using one of the generator links above and download the CSS stylesheet that is generated.
  2. Add the stylesheet to the list of exported files for PowerPac to include in the export.
  3. Load the stylesheet for the on load page event using pgExtFiles()
  4. Assign the class name from the stylesheet to the field which will act as your button using userProperty()
  5. If mouse up/down events are needed, execute userProperty() again to create the mouse events for the field that contains the styled button.

Download example:
Note: This example DOES NOT use a CSS styled button.
setMouseEvents_v901.zip
Setting mouse events with userProperty() TB v9.01 file
(40.32 KiB) Downloaded 66 times
Clifton
Site Admin
 
Posts: 732
Joined: Tue Jan 14, 2014 1:04 am

Re: buttonDown / buttonUp

Postby John Robin Dove » Sun Apr 26, 2015 3:16 am

Many thanks for your help and the 9.01 file.

UPDATE: I now know why my previous attempt failed. I omitted to specify "set" because I imagined I was getting not setting. As for the more exotic "Toolbook-Mercury etc" error I haven't seen it again. Maybe Toolbook was too tired yesterday evening! :D
John Robin Dove
 
Posts: 486
Joined: Thu Jan 23, 2014 4:35 am


Return to General Discussion

Who is online

Users browsing this forum: No registered users and 5 guests

cron