Popup keypad

[skiv71]

hi thanks for that...

i'm trying to merge that with what i got going on for popup keypad

var s="";

s+='<script type="text/javascript" src="keyboard.js" charset="UTF-8"></script>'

s+='<link rel="stylesheet" type="text/css" href="keyboard.css">';

s+='<input type="text" size=3 value=' "+value+" ' class="keyboardInput" ';

s+='onChange='mango.view.setPoint("+ point.id +", ""+ pointComponent.id +"", this.value )'>';

return s;

but its not having it... i get lost in the parenthesis..

help?? lol

[skiv71]

ok, did some alterations, and got this...

var s="";

s+="<script type='text/javascript' src='keyboard.js' charset='UTF-8'></script>"

s+="<link rel='stylesheet' type='text/css' href='keyboard.css'>";

s+="<input type='text' size=3 value=' "+value+" ' class='keyboardInput' ";

s+="onChange='mango.view.setPoint("+ point.id +", ""+ pointComponent.id +"", this.value )'>";

return s;

which does work, but i got no icon for me keyboard :-/

[Jokke]

Hi,

you can use ' instead of " as browsers are accepting it. But in scritps it cannot be swapped. :)

I put the keyboard .css, .js and png files into tomcat root. This seems kind of working(the keyboard is not bound into the component):

var s="";

s+= "<script type='text/javascript' ";
s+= "src='keyboard.js' charset='UTF-8'>";
s+= "</script> <link rel='stylesheet' type='text/css' href='keyboard.css'> ";

s+="<input type='text' size=3  value='"+value+"' ";
s+="onChange='mango.view.setPoint("+ point.id +", \""+ pointComponent.id +"\", this.value )'  class='keyboardInput' vki_attached='true'>";

return s;

the "vki_attached='true'" is one experiment you can remove.

I did not get it working yet in "imageless"(without need to click on the icon). It can be changed simply by setting inside keyboard.js the this.VKI_imageURI = "keyboard.png"; to this.VKI_imageURI = "";

BR
-Jokke

[Jokke]

It did not work as easily. The HTML component is different than serverside script from browser point of view. The serverside script has the mouseover events for the mango popups, even if the "show controls" is unchecked. I think these are overiding the keyboard.js event listeners or they are not loaded at all.

One thing to check could be to put the onchange function to the HTML component, with proper numbers instead point.id and pointComponent.id . it would work if the point exists on the view.(maybe as a hidden serverside script). This is bit tricky as it would not show the current value and it is not too comfortable to define multiple points.

BR
-Jokke

[mlohbihler]

Hi guys,

I gave this a try myself. It's honestly a little bit tricky. Assuming that you wanted something like this on the watchlist (to set point values), i made the following changes:

• added keyboard.* to resources/keyboard
• set the following in watchlist.jsp:

<tag:page dwr="WatchListDwr" js="view,keyboard/keyboard" onload="init">

• added this to page.tag:

  <link href="resources/keyboard/keyboard.css" type="text/css" rel="stylesheet"/>

• added this to changeContentText.jsp snippet:

<script type="text/javascript">
  var n = $("txtChange${componentId}");
  n.VKI_clickless = 10;
  VKI_attach(n);
</script>

• added the following in view.js at around line 280:

        if (state.change != null) {
            show($("p"+ state.id +"ChangeMin"));
            if (!mango.view.setEditing) {
                $set("p"+ state.id +"Change", state.change);
                mango.view.runScripts($("p"+ state.id +"Change"));
        	}
        }

The thing about watchlist set inputs is that they are dynamically created, so they must also be dynamically attached to the keyboard input. The runScripts method in view.js takes care of the rest.

But, the keyboard itself is no in the set point div, so the div disappears as soon as you touch or hover over the keyboard, so you can't see what you are typing. Also, the enter key doesn't trigger an event on the set point input, so you need to hover over the set wrench again, and click on "set". These problems may be circumventable, but i didn't spend any more time on it.

The solution - if there is one - will probably work on the graphical views too since the way they work is similar.

[skiv71]

oh dear... :-/

would it be much to adapt the mouse over field (from the spanner) to allow popup of keypad. sort of extending the box to reveal?

or allow the spanner popup box to remain active and another click to deactivate... so a page keypad/keyboard can be used?

[skiv71]

hey hey... i have a free pop up keyboard solution that requires little or no programming changes to your mango instance...

relies on using a decent web browser (my choice is chrome)...

http://www.greywyvern.com/code/javascript/keyboard.user.js

now anywhere you have an entry field... just double click and weh hey!

one problem though... and i'm hoping mathew can help...

the settable items (spanner link) only show while mouse over hover...

could do with it latching in view... and hiding when a click is made else where... allowing the keyboard to work properly....

[skiv71]

i've downloaded the *.js and embedded a link into my instances so the use can get cooking there an then...

pity about ie8

[mlohbihler]

Might not be too bad, no, but there are no plans to do this in M2M. M2M2 maybe...