usablica / intro.js

Lightweight, user-friendly onboarding tour library
http://introjs.com
Other
22.8k stars 2.59k forks source link

How to continue and make two way (branch) #137

Closed rmalenko closed 7 years ago

rmalenko commented 11 years ago

Hi!

Help me please.

First step is sign in. After user have filled up form and have pushed button he will come to his profile where I wish to continue display guide.

I use this code for star at first page:

<script type="text/javascript">
      document.getElementById('startbuttontutor').onclick = function() {
        introJs().setOption('doneLabel', 'Next page').start().oncomplete(function() {
          window.location.href = 'profile_view';
        });
      };
</script>

<a id="startbuttontutor" href="javascript:void(0);"><?php echo __('step_one'); ?></li>

<form id="login_form" action=... class="login" method="POST" data-step="1" data-intro="...">

At next page profile_view intro isn't start and display. I use this code:

<script type="text/javascript">
        if (RegExp('multipage', 'gi').test(window.location.search)) {
        introJs().setOption('Next page').start();.oncomplete(function() {
        window.location.href = 'index.php/profile_settings';
        });
      };
</script>

<a data-intro='Hello step two!' data-step='2' data-position='bottom' title="..." class="settings">Settings</a>

Can you tell me please where I was wrong?

Second question: How to make two way? User can simply login or if he doesn't have an account he can press register link on tool-tip or push button, etc... Hereafter he will come Sign up form with own guide. After user push button save he will come to page profile_view.

Login -> Profile_view Sign Up -> Sign Up form - > Profile_view

afshinm commented 11 years ago

When you want to show the introduction from last page, you should include ?multipage=true in the URL of second page. So, in the first page edit this line:

window.location.href = 'profile_view';

to

window.location.href = 'profile_view?multipage=true';

Let me know if your problem solved by this solution.

rmalenko commented 11 years ago

Thanks! If I filled up field login, pass and press button I go to link /profile_view without ?multipage=true Should I put ?multipage=true into my php code where link generate?

rmalenko commented 11 years ago

I have done other pages for example. Still is not working. Click to "Sign in and fill up your profile" you will see guide (1). There is link "Sign in" in the help text. First page

<script type="text/javascript">
      document.getElementById('startbuttontutor').onclick = function() {
        introJs().setOption('doneLabel', 'Next page').start().oncomplete(function() {
          window.location.href = '/auth/index?multipage=true';
        });
      };
</script>

<form id="login_form" action=... class="login" method="POST" data-step="1" data-intro="...">

Second page - Sign Up form

<script type="text/javascript">
        if (RegExp('multipage', 'gi').test(window.location.search)) {
        introJs().setOption('Next page').goToStep(2).start();.oncomplete(function() {
        window.location.href = 'home/registered?multipage=true';
        });
      };
</script>

There are buttons on pages just for check.

bozdoz commented 7 years ago

Looks to me like there is a problem with your JavaScript:

introJs().setOption('Next page') (Not a valid option)

.goToStep(2).start();.oncomplete (semi-colon in the wrong place)