Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

What is considered a bare "skeleton app" HTML? #7

Open
twss opened this issue Apr 12, 2014 · 4 comments
Open

What is considered a bare "skeleton app" HTML? #7

twss opened this issue Apr 12, 2014 · 4 comments
Labels
enhancement question

Comments

@twss
Copy link
Owner

twss commented Apr 12, 2014

Working on the generator for initial application layout that everything else will then build on top of.

@nolimits4web, I as just wondering what, in your opinion, you'd consider to be a base application?

I was thinking of going with this, any thoughts?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
        <meta name="mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <title>Framework7</title>
        <link rel="stylesheet" href="../dist/css/framework7.min.css">
        <link rel="stylesheet" href="css/kitchen-sink.css">
    </head>
    <body>
        <div class="statusbar-overlay"></div>
        <div class="panel-overlay"></div>
        <div class="views">
        </div>
        <script type="text/javascript" src="../dist/js/framework7.min.js"></script>
        <script type="text/javascript" src="js/kitchen-sink.js"></script>
    </body>
</html>
@twss twss added this to the Application Helper milestone Apr 12, 2014
@twss twss changed the title What is considered to be bare "skeleton app" HTML? What is considered a bare "skeleton app" HTML? Apr 12, 2014
@nolimits4web
Copy link

For very low-level skeleton yes, this would be good, but if no need panels then also remove .panel-overlay. But i would prefer something more closer to dist/ app with very basic functionality, with empty panels, through dynamic navbar and starter page, like:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>My App</title>
    <link rel="stylesheet" href="css/framework7.min.css">
    <link rel="stylesheet" href="css/my-app.css">
  </head>
  <body>
    <div class="panel-overlay"></div>
    <div class="panel panel-left panel-reveal">
      <div class="content-block">
        <p>Left panel content goes here</p>
      </div>
    </div>
    <div class="panel panel-right panel-cover">
      <div class="content-block">
        <p>Right panel content goes here</p>
      </div>
    </div>
    <div class="views">
      <div class="view view-main">
        <div class="navbar">
          <div class="navbar-inner">
            <div class="center sliding">Awesome App</div>
          </div>
        </div>
        <div class="pages navbar-through">
          <div data-page="index" class="page">
            <div class="page-content">
              <p>Here comes your content</p>
              <p>Open <a href="#" class="open-panel" data-panel="left">left panel</a></p>
              <p>Open <a href="#" class="open-panel" data-panel="right">right panel</a></p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script type="text/javascript" src="js/framework7.min.js"></script>
    <script type="text/javascript" src="js/my-app.js"></script>
  </body>
</html>

And in my-app.js:

var myApp = new Framework7();
var $$ = Framework7.$;
var mainView = myApp.addView('.view-main', {
    dynamicNavbar: true
});

So it is always easy to remove something not needed, instead of trying to make it work, right?:)

@twss
Copy link
Owner Author

twss commented Apr 12, 2014

For my skeleton app, I was thinking of wrapping the Framework7 instance in another class, so I don't have to worry about stamping on variables for the views.

In my class the views would be stored in a private object and could still be accessed using a method such as app.getView('mainView').

@nolimits4web
Copy link

If you mean my JS example, no problem, wrap it. Idea was to have already initialized and working app right in skeleton

@twss
Copy link
Owner Author

twss commented Sep 17, 2014

Going to re-visit the whole skeleton app thing at some point, but have decided to get all the helpers etc. out there first, so that people can start pounding on them and improving them.

@twss twss modified the milestone: Application Helper Sep 18, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement question
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@twss @nolimits4web