Sie sind nicht angemeldet.

Lieber Besucher, herzlich willkommen bei: krpano.com Forum. Falls dies Ihr erster Besuch auf dieser Seite ist, lesen Sie sich bitte die Hilfe durch. Dort wird Ihnen die Bedienung dieser Seite näher erläutert. Darüber hinaus sollten Sie sich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutzen Sie das Registrierungsformular, um sich zu registrieren oder informieren Sie sich ausführlich über den Registrierungsvorgang. Falls Sie sich bereits zu einem früheren Zeitpunkt registriert haben, können Sie sich hier anmelden.

1

Montag, 10. März 2014, 17:38

HTML5 Editable Textfield PlugIn

Hi Coders,

cause I urgently needed a HTML5 editable Textfield PlugIn I wrote my first Plugin...So far so good, it works and I learned a lot, but I didn`t managed it to get the focus on the editable textfields on touchDevices...

Even with this:
window.activekrpanowindow=null
(from this post: [SOLVED] HTML5 KrPano Viewer interfere in the external forms)
I did not get the focus on the input fields...

My solution right now is a transparent layer over the input field, which could capture a click event and focus my inputTextField...
Not the best way but it works...

Has someone experience with that? That point makes me really crazy, cause everything works perfect, inc. the right position of the inputFileds with the keyboard on the touchScreen, but how do I get the focus on an editable TextField in HTML5 on touchDevices????? Grrrrr...... *cry* *cry* *cry*

The problem occurs on ALL touchDevices with HTML5, Flash works like it should...

Thanks for help,
steve

PS: Thanks a lot to Aldo for his treasure of coding-examples with his "open source" PlugIns...THANK YOU ALDO *thumbsup*

2

Montag, 10. März 2014, 19:10

Hi,

sorry, but that's difficult to say without an example or any source of course...

I have now quickly made a super simple html5 plugin which provides a <input> element for text input and there the focus was working fine...

Here the example:
http://krpano.com/examples/html5plugin-t…/textinput.html

Here for downloading - the whole example as zip, the plugin and the example xml:
http://krpano.com/examples/html5plugin-t…t/textinput.zip
http://krpano.com/examples/html5plugin-t…ut/textinput.js
http://krpano.com/examples/html5plugin-t…t/textinput.xml

Here the plugin source:

Quellcode

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
var krpanoplugin = function()
{
    var local = this;

    var krpano = null;
    var plugin = null;

    var inputelement = null;

    local.registerplugin = function(krpanointerface, pluginpath, pluginobject)
    {
        krpano = krpanointerface;
        plugin = pluginobject;

        inputelement = document.createElement("input");
        inputelement.type = "text";
        inputelement.style.width  = "100%";
        inputelement.style.height = "100%";

        plugin.registerattribute("text", "", text_set, text_get);
        plugin.registerattribute("onchanged", null);

        inputelement.addEventListener("change", text_changed, true);

        plugin.sprite.appendChild(inputelement);
    }

    local.unloadplugin = function()
    {
        plugin = null;
        krpano = null;
    }

    function text_set(newtext)
    {
        inputelement.value = newtext;
    }

    function text_get()
    {
        return inputelement.value;
    }

    function text_changed()
    {
        krpano.call(plugin.onchanged, plugin);
    }
};


The plugin itself has a 'text' variable for setting or getting the current text value, and an 'onchanged' event for getting notified when the text has got changed.

For details about the plugin code itself, please see the plugin interface documentation here:
http://krpano.com/docu/plugininterface/#js

Best regards,
Klaus

3

Dienstag, 18. März 2014, 11:20

Hi Klaus,

thank you very much for your help, but even you`re example does not work so good as expectet...On desktop, everything is fine (so with mine) but on touchdevices you have more than "press" on Screen to get the focus of the textfield...or is that normal? I´m comparing the usability with the inputFields on normal webpages...testet on Android 4.3 with Chrome

The other problem is that on desktop the tf looses the focus if I click on the screen, with the touchdevices the focus will always be on the tf, even when I click on the pano...means that the keyboard will always be shown, if I look around in the pano...

Klaus, should I mail you my tf plugin to get a perfect one, and then share it with the community?
Either it`s not so easy as expectet or I´m totally wrong....

Best regards,
Steve

4

Dienstag, 18. März 2014, 14:27

Hi,
you have more than "press" on Screen to get the focus of the textfield...or is that normal?
What exactly do you mean with 'more than press'?
I have no Android device with me yet, but on iOS just one touch into the input field is necessary...

The other problem is that on desktop the tf looses the focus if I click on the screen, with the touchdevices the focus will always be on the tf, even when I click on the pano...means that the keyboard will always be shown, if I look around in the pano...
Yes, that example is just very basic, the requirement of several tweaks for mobile browsers is not very uncommon. It seems that touching the pano does't automatically change the focus (I don't know why yet), so it might necessary to do that manually.

I will look into that focus issue and post an updated example (but probably not before next week).

Best regards,
Klaus

5

Dienstag, 18. März 2014, 16:08

Hi Klaus,

tested now with different browsers on Android, that "press-Problem" seems to be a problem with chrome and Android...with the bulid in Browser called Android Browser 4.0 I get the focus of the tf by "soft-touch"...same with Firefox

Zitat

What exactly do you mean with 'more than press'?

I have no Android device with me yet, but on iOS just one touch into the input field is necessary...
With "press" I mean you have to touch the tf more than two seconds...but perhaps that`s normal...???

Zitat

Yes, that example is just very basic, the requirement of several tweaks
for mobile browsers is not very uncommon. It seems that touching the
pano does't automatically change the focus (I don't know why yet), so it
might necessary to do that manually.
ok, I was wondering if perhaps an internal Function in your player keeps the focus or something like that...

Thanks for your help,
Steve

6

Montag, 26. Mai 2014, 16:02

I will look into that focus issue and post an updated example (but probably not before next week).
Hi Klaus

I am also interested in a solution for this. When the input receives focus, you enter some text, and you close the device keyboard, and start moving the pano around with your fingers, the device keyboard pops up again, because the input never lost its focus.

Any solutions to this yet?

Ciao
Bjorn

7

Dienstag, 27. Mai 2014, 08:17

This is so cool, Klaus *g* Could you please provide this plugin for flash and html5? Right now I´m also using less-than-ideal solutions and I would love to have a proper editable textfield coming with krpano *squint*

BR
Nupsi

8

Dienstag, 27. Mai 2014, 11:00

Also discovered that on my Samsung Galaxy S3, the text input doesn't respond by opening the keyboard when I touch it. This happens for Chrome and the phone's built in browser. Works fine in Firefox on the device.

This only happens when I add the element like this

Quellcode

1
plugin.sprite.appendChild(inputelement);



It works fine if I do it the following way, but then I lose the functionality that the plugin interface provides

Quellcode

1
document.getElementsByTagName('body')[0].appendChild(element);

9

Montag, 1. September 2014, 12:28

Yes, that example is just very basic, the requirement of several tweaks for mobile browsers is not very uncommon. It seems that touching the pano does't automatically change the focus (I don't know why yet), so it might necessary to do that manually.

I will look into that focus issue and post an updated example (but probably not before next week).
Klaus, did you manage to look into this problem and why krpano doesn't allow the html5 input to lose focus when touching away from the input?

Cheers

10

Montag, 1. September 2014, 12:31

No sorry.

11

Montag, 1. September 2014, 12:32

Any idea when you might be able to have a look Klaus?

12

Montag, 1. September 2014, 12:33

That topic is still on my list, but I don't know yet where there will be time for it.

13

Montag, 1. September 2014, 12:34

Ok, thanks Klaus

14

Montag, 24. August 2015, 20:50

That topic is still on my list, but I don't know yet where there will be time for it.
Dear Klaus,

it's been almost a year since the last update in this topic, but I'm facing this problem right now. Did you perhaps have any success in solving this or creating a workaround?

No text inputs are working on Android with the Chrome browser. I checked Firefox, still works.

This is a serious issue as this prevents us from developing any serious plugins...

Anybody else is also welcome to answer, if someone has a solution...thanks!

15

Mittwoch, 26. August 2015, 12:54

No solution, sorry. But I also still looking forward to the final release of this plugin *squint*

Beiträge: 1 850

Beruf: Virtual Tours - Photography - Krpano developer

  • Nachricht senden

16

Mittwoch, 26. August 2015, 16:59

Use normal html forms and javascript.
KRPano Developer: Portfolio ::Gigapixel Tagging Solutions - Porfolio 2 :: Facebook :: Twitter :: reddit.com/r/VirtualTour

17

Mittwoch, 26. August 2015, 23:11

Use normal html forms and javascript.
I am, that's how I encountered the problem.

18

Mittwoch, 26. Oktober 2016, 14:00

Hello, i have an isue with the input text plugin on mobile, the field not work (i need to stay 5s on it to work on android / iphone , and on winphone this display the context menu)

Ideas to fix it ?

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »MrTie« (27. Oktober 2016, 08:36)


19

Donnerstag, 27. Oktober 2016, 11:10

Found solution :


inputelement.addEventListener('touchstart',text_click, false);


function text_click()
{
inputelement.focus();
}

Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von »MrTie« (8. November 2016, 14:14)


20

Sonntag, 8. April 2018, 13:28

Hello!

At me textinput.js does not work in krpano 1.19-pr15 (build 2018-03-28).


ERROR: parsing 'textinput.js' failed:SyntaxError: Unexpected token ;



How can I correct the error, tell me please



*sad* *confused* *question*

Ähnliche Themen