[Mr Dini]

Hi,

The site I am developing an addon for has a captcha solution implemented. Basically there is a background image and an icon placed on this randomly that the user has to click on and then send the position of the icon. I haven't found a way to get the cursor position from kodi, so I decided to use a skin instead. I am rendering the captcha image and on top of that I want to render a 90x90 image border which is to "aim" the captcha. I am subscribed to actions on this dialog and whenever the user presses left, the border should jump 10px to the left and so on.

Code:

<control type="image" id="50">
<description>Captcha image</description>
<visible>true</visible>
<left>760</left> <!-- Centering the image horizontally (1920 - 400) / 2 -->
<top>340</top> <!-- Centering the image vertically (1080 - 400) / 2 -->
<width>400</width>
<height>400</height>
<texture>$INFO[Window.Property(captcha)]</texture>
</control>
<control type="image" id="51">
<description>Border image</description>
<visible>true</visible>
<left>$INFO[Window.Property(border_left)]</left>
<top>$INFO[Window.Property(border_top)]</top>
<width>90</width>
<height>90</height>
<texture>border90.png</texture>
</control>

I have tried doing that, but it doesn't seem to be possible to set left and top values as strings. I have read about a single workaround which would be using conditional includes. But that would be a lot of combinations... Any other way? I am open to crazy ones as well such as adding some invisible list elements to a grid or so that force the item's position to move.

[Hitcher]

Maybe you could use a panel control instead where the content displays the image you want to user to select. Then you can use Container(id).Column and Container(id).Row to return the column and row number of the focused position in the panel.

[Mr Dini]

Its a single image sadly. Or I am not sure if I follow. Based on this thread I have tried to do it the ugly way: https://forum.kodi.tv/showthread.php?tid=355474


I have this right now: https://paste.kodi.tv/egexebojaj.kodi

And my class to create it looks like this:

Code:


class GUI(xbmcgui.WindowXML):
def __init__(self, *args, **kwargs):
self.captcha_path = kwargs.get("captcha_path")
self.border_top = 340
self.border_left = 760
super(GUI, self).__init__(*args, **kwargs)
def onInit(self) -> None:
xbmc.executebuiltin('Container.SetViewMode(50)')
# get path of skins folder of this addon
self.setProperty('captcha', self.captcha_path)
self.setProperty('border_top', str(self.border_top))
self.setProperty('border_left', str(self.border_left))
xbmc.sleep(100)
self.setFocusId(self.getCurrentContainerId())


The image and the border image renders fine, but the border image is at the top left corner like if both top and left would be 0.

[Hitcher]

Includes are only checked when a window loads. Maybe you could use slide animations instead.

[Mr Dini]

I dont mind recreating the window. But at the moment even at loading time it wont have the right value. Do I have to set the property before onInit?

[Mr Dini]

Do you have docs to slide animations?

EDIT: I have tried doing:

Code:

<animation effect="slide" time="1000" start="0" end="1000" condition="left760">Conditonal</animation>

And it doesn't seem to be working either.

[Mr Dini]

Wonderful. I ended up doing this from Python and there is seems to be rather simple: obakohumic (paste)

However I added these arrows for touchscreen/mouse pointer users so they can also interact with the window. But upon clicking anywhere I don't seem to have the onClick function called. I also tried the same with buttons...