×

Discussion Board

Results 1 to 7 of 7
  1. #1
    Registered User
    Join Date
    Jun 2007
    Posts
    10

    Question about controlling UI when editing a textarea

    I've been playing around with the WRT (hopefully I'll have something to post soon), however, I had a question about editing textareas in an HTML form. I'm using the FP2 emulator for now, and my widget is calling menu.showSoftkeys() on startup so the softkey information is being displayed at all times.

    My issue happens when in portrait mode (240x320) and a textarea is selected. When this happens, a 20 pixel header automatically appears at the top of the screen indicating the typing mode you are using. If you are in landscape mode, this 20 pixel header does not appear (because the text indicator is across the bottom of the softkey menu).

    What I want to do is to make it so my UI programatically adjusts itself whenever this 20 pixel header appears in portrait mode. Unlike menu.onShow, there doesn't seem to be an event model to support this. Is there a better solution to detect this?

    The only workaround I've thought of so far is to call setTimeout when the textarea receives an onClick, and then in the timeout function, I could check window.innerHeight to see if things have changed. For instance:

    <textarea name="input_text" id="input_text" cols="40" rows="4" onClick="setTimeout('showHeight()',200)"></textarea>

    function showHeight() {
    alert(window.innerHeight);
    }

    Does anyone have a better alternative? Am I missing some other basic Javascript event that is called when entering editing mode? Thanks,

    -Will

  2. #2
    Registered User
    Join Date
    Jun 2007
    Posts
    10

    Re: Question about controlling UI when editing a textarea

    One more question along these same lines. Does WRT support the onOrientation() event. I know there's a boolean indicating that orientations are supported, and then you can manually change the orientation via code, however, in the case of something like the N95 where someone can slide the phone and change it from portrait to landscape, does the widget have a way of knowing this has happened?

  3. #3
    Registered User
    Join Date
    Jun 2008
    Posts
    1

    Re: Question about controlling UI when editing a textarea

    Quote Originally Posted by wturnage View Post
    I had a question about editing textareas in an HTML form. I'm using the FP2 emulator for now, and my widget is calling menu.showSoftkeys() on startup so the softkey information is being displayed at all times.

    My issue happens when in portrait mode (240x320) and a textarea is selected. When this happens, a 20 pixel header automatically appears at the top of the screen indicating the typing mode you are using. If you are in landscape mode, this 20 pixel header does not appear (because the text indicator is across the bottom of the softkey menu).

    What I want to do is to make it so my UI programatically adjusts itself whenever this 20 pixel header appears in portrait mode. Unlike menu.onShow, there doesn't seem to be an event model to support this. Is there a better solution to detect this?

    The only workaround I've thought of so far is to call setTimeout when the textarea receives an onClick, and then in the timeout function, I could check window.innerHeight to see if things have changed. For instance:

    <textarea name="input_text" id="input_text" cols="40" rows="4" onClick="setTimeout('showHeight()',200)"></textarea>

    function showHeight() {
    alert(window.innerHeight);
    }

    Does anyone have a better alternative? Am I missing some other basic Javascript event that is called when entering editing mode? Thanks,

    -Will
    Is there some way to hide that 20 pixel header when texteditor is open?

  4. #4
    Regular Contributor
    Join Date
    Dec 2007
    Posts
    60

    Re: Question about controlling UI when editing a textarea

    Quote Originally Posted by wturnage View Post
    One more question along these same lines. Does WRT support the onOrientation() event. I know there's a boolean indicating that orientations are supported, and then you can manually change the orientation via code, however, in the case of something like the N95 where someone can slide the phone and change it from portrait to landscape, does the widget have a way of knowing this has happened?
    Orientation changes result in that the window size changes and that can be detected by normal DOM events.

    It is not possible to programmatically hide the bars that appear for text editing as they are needed for showing the editing state (T9 on/off, numeric/text, caps-lock, etc.).

  5. #5
    Registered User
    Join Date
    May 2008
    Location
    California
    Posts
    13

    Re: Question about controlling UI when editing a textarea

    The widget object support for setting the orientiation (setDisplayPortrait() and setDisplayLandscape()) and finding out if the device support orientation chages (isrotationsupported property).

    Like already indicated the DOM already have events for size change. Alternatively using CSS you could give your textarea relative sizes and let the browser re-size.

  6. #6
    Registered User
    Join Date
    Jul 2008
    Posts
    1

    Re: Question about controlling UI when editing a textarea

    Hi,

    Here is the way to detect the orientation mode and then handle the display accordingly:

    window.onresize = handleOrientation;

    function handleOrientation()
    {
    // landscape mode
    if (window.screen.width > window.screen.height) {
    ...
    }
    else { // portrait mode
    ...
    }
    }

    Br,

  7. #7
    Registered User
    Join Date
    Nov 2008
    Posts
    4

    Re: Question about controlling UI when editing a textarea

    That code is not working for me. It seems the 'window.screen.width and 'window.screen.height' don't change when the orientation changes. Here is my code.

    HTML
    <script>
    var windowWidth = window.screen.width;
    var windowHeight = window.screen.height;
    var screen_Orientation = "undetermined";
    window.onresize = handleOrientation;
    </script>

    Javascript
    function handleOrientation()
    {
    windowWidth = window.screen.width;
    windowHeight = window.screen.height;
    // landscape mode
    if (window.screen.width > window.screen.height) {
    screen_Orientation = "landscape";
    document.writeln("<h2>Landscape</h2>");
    }
    else { // portrait mode
    screen_Orientation = "portait";
    document.writeln("<h2>Potrait</h2>");
    }

    document.writeln("<h2>Width = " + windowWidth + "</h2>");
    document.writeln("<h2>Height = " + windowHeight + "</h2>");
    }

Similar Threads

  1. N81 BUG: Web Services Parser an question marks???
    By masterchief2004 in forum Mobile Java General
    Replies: 1
    Last Post: 2008-03-07, 17:59
  2. a question about command and a question about s60
    By t4kesting in forum Mobile Java General
    Replies: 0
    Last Post: 2006-01-24, 08:21
  3. Replies: 2
    Last Post: 2004-01-08, 18:36
  4. Sending data using iAcceptedSocket (Urgent question)
    By okegame in forum Bluetooth Technology
    Replies: 1
    Last Post: 1970-01-01, 02:00

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
×