Find the answer to your Linux question:
Results 1 to 7 of 7
Hi everyone!! I am developing a firefox os app and the app will have several screens. I am wondering how to implement several screens. I see two options: To create ...
Enjoy an ad free experience by logging in. Not a member yet? Register.
  1. #1
    Linux Newbie
    Join Date
    Nov 2009
    Posts
    104

    several screens in a firefox os app


    Hi everyone!!

    I am developing a firefox os app and the app will have several screens. I am wondering how to implement several screens.

    I see two options:

    To create only one file (index.html) and use several divs (sections) in that file.

    Code:
    <div id="presentation" class="page" data-role="page">
                   
    </div>
    
    <div id="page_signin" class="page" data-role="page">
                    
    </div>


    The second option would be to use several files, and in the index.html use several "<a>" elements and href attribute. So when you click on the "a" element a new page, lets say signin.html will open.


    Code:
    <div id="presentation">
    	<a href=”signin.html”>Sign in</a>    
    	<a href=”help.html”>help</a>           
    
    </div>

    Which option would you prefer? Let me know if you would prefer a new solution.

    Thank you very much!

  2. #2
    Trusted Penguin
    Join Date
    May 2011
    Posts
    4,353
    hi,

    generally, i like to keep away from links that open new pages (i.e., "popup" widows), b/c their appearance is not fully under your control, and sometimes the user's browser settings can even prevent them from opening.

    what i like to do is use your "one div for each screen of content" choice. let's say i have four difference categories all that get their own "screen". i make all four of them hidden (using CSS display:none), initially. each div has a hyperlink/button on the main page. when the category one button link is clicked, then I use a javascript onclick binding to change the CSS of that associated hidden div to become visible (and all 3 other divs must be made hidden, in case one of them was clicked previously). all four divs can be placed in the same area on the main page, since only one will be shown there at a time.

    the nice thing about this approach is that there is no page reload when a button/link is clicked; it's just a similar bit of javascript code getting run to change CSS, it appears to be very fast to the user. the drawback is that all the content has to be loaded initially, even though none of the different categories have been clicked yet (there's all there, just hidden). this approach obviously does not work if javascript is disabled in the user's browser, too.

  3. #3
    Penguin of trust elija's Avatar
    Join Date
    Jul 2004
    Location
    Either at home or at work or down the pub
    Posts
    3,482
    Assuming a Firefox OS app is downloaded as a single package and executed locally, which seems logical as it could still be used with no connection, then I would go with the separate pages approach as each piece of code would be simpler and easier to maintain. Of course the benefit of that depends on the complexity of the app you are writing.
    What do we want?
    Time machines!

    When do we want 'em?
    Doesn't really matter does it!?


    Conkybots: Interactive plugins for your Conkys!

  4. #4
    Trusted Penguin
    Join Date
    May 2011
    Posts
    4,353
    Quote Originally Posted by elija View Post
    I would go with the separate pages approach as each piece of code would be simpler and easier to maintain.
    that's interesting, elija. i like to keep things in a single file to make it easier (on me) to maintain. just goes to show how differently we're all wired!

  5. #5
    Penguin of trust elija's Avatar
    Join Date
    Jul 2004
    Location
    Either at home or at work or down the pub
    Posts
    3,482
    Quote Originally Posted by atreyu View Post
    that's interesting, elija. i like to keep things in a single file to make it easier (on me) to maintain. just goes to show how differently we're all wired!
    I think it comes from working in an environment where code testability is very important and where we have a possibility of starting to follow the tdd methodology; although it's a difficult change to make your brain do when you have been coding for more than 30 years, I do like the code you end up with as there are lots of simple classes and methods interacting instead of fewer and individually more complex classes and methods.
    What do we want?
    Time machines!

    When do we want 'em?
    Doesn't really matter does it!?


    Conkybots: Interactive plugins for your Conkys!

  6. #6
    Linux Newbie
    Join Date
    Nov 2009
    Posts
    104
    My opinion is closer to that of elija, that is, to have several separated html files.

    But each page could have some “popups” inside that occupies the whole screen when open.

    Now I have another question. How would you implement a common header in a firefox os application?

    I could implement that with PHP in every page, but in an app you can not use PHP nor any server side language

    Thanks to all of you!

  7. #7
    Trusted Penguin
    Join Date
    May 2011
    Posts
    4,353
    Quote Originally Posted by jesusitoLinux View Post
    Now I have another question. How would you implement a common header in a firefox os application?
    off the bat, i'd say you could do that with HTML frames or javascript. you could probably even do with with an external CSS page, included by each html page.

Posting Permissions

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