2

I am building an app with Meteor and I am looking to create a first time user launch screen- something like an "About/Welcome" page. Essentially, something that would pull a one-time screen after launching the app for the first time and never appear again; if the user has already opened the app they would be directed to another page.

I am not using login credentials, so I need a different solution than checking to see if the user is logged in or not.

How would I go about configuring this? I have tried searching all over the web and can't seem to find a solution for this. Please note this is different from a "Launch Screen".

  • that's a bit hard because they can usually clear their browser cookies and local storage -- how accurate does it have to be? – corvid Oct 26 '15 at 23:01
  • It doesn't need to be super accurate. Just looking to have a one-time "tutorial" type of screen. – Paulina Hernandez Oct 26 '15 at 23:31
  • Possible duplicate of [Meteor: How do I show a page when a user signs up](http://stackoverflow.com/questions/32956291/meteor-how-do-i-show-a-page-when-a-user-signs-up) – Michel Floyd Oct 27 '15 at 02:52

2 Answers2

1

You will need to either use localstorage, or set a cookie.

I'd suggest trying localstorage first. There are several packages on atmosphere that should help,

Using the frozeman:storage package (meteorpad example):

Template.body.helpers({
  beenHereBefore: function() {
    var beenHereBefore = LocalStore.get('BeenHereBefore',  {reactive: false});
    console.log(LocalStore.get('BeenHereBefore',  {reactive: false}));
    if (beenHereBefore !== true){
      LocalStore.set('BeenHereBefore', true, {reactive: false})

      console.log(LocalStore.get('BeenHereBefore',  {reactive: false}));
    }
    return beenHereBefore;
  },
});


<body>
  {{#unless beenHereBefore}}
    <h1> Welcome first time visitor! </h1>  
  {{else}}
    <div class="outer">
      <div class="logo"></div>
      <h1 class="title">Leaderboard</h1>
      <div class="subtitle">Select a scientist to give them points</div>
      {{> leaderboard}}
    </div>
  {{/unless}}
</body>
JeremyK
  • 3,240
  • 1
  • 11
  • 24
0

Just some simple JavaScript should do the trick:

if (Boolean(localStorage.getItem('visitedApp'))) {
  // user's been here before
} else {
  // do stuff for first time user
  localStorage.setItem('visitedApp', true);
}
ffxsam
  • 26,428
  • 32
  • 94
  • 144
  • Tried this and did not seem to work... :( I added to a js file in client. – Paulina Hernandez Oct 26 '15 at 23:29
  • Well, it can't just be by itself in a file. It has to be in the right place in your code that checks if a user is new or not (that part is up to you since I can't see all your code, I wouldn't know where it goes). – ffxsam Oct 27 '15 at 04:44
  • This would probably go in the `onRendered` callback for your layout template. – ffxsam Oct 27 '15 at 04:45