Search code examples
javascripttwitter-bootstrapbootstrap-tour

Bootstrap Tour - URL with different value per user


I've looked over other questions/answers but I just can't find one that addresses my issue. I looked at the original document here but the solution doesn't make sense to me.

The path in the following code changes from user to user.

onNext: function(){
        document.location.href = 'http://localhost:8080/web/client/biography';
      },

so on next the user is directed to a different path based on their username.

How can i make sure the URL is correct for each user?

http://localhost:8080/web/client/biography
http://localhost:8080/web/client1/biography
http://localhost:8080/web/client2/biography

My code:

 <script>
// Instance the tour
var tour = new Tour({
	name: "tour",
  steps: [],
  container: "body",
  keyboard: true,
  storage: window.localStorage,
  debug: false,
  backdrop: true,
  backdropContainer: 'body',
  backdropPadding: 0,
  steps: [
  {
    element: ".logo",
    title: "Setup Wizard",
    content: "Synergistically visualize maintainable metrics vis-a-vis.",
  },
  {
    //element: "#groups",
    //backdrop: false,
  //  title: "Setup Wizard",
   // content: "Synergistically visualize maintainable metrics vis-a-vis."
   
  },
  {
    element: ".group-content",
    //backdrop: false,
    onNext: function(){
        document.location.href = 'http://localhost:8080/web/client/biography';
      },
    title: "Setup Wizard",
    content: "To get started we'd like you to setup your group subscriptions, and later tell us a bit more about yourself. Please tick your interested groups and click on Save"
  },
  {
    element: ".user-profile-portlet",
    onEnd: function(){
        document.location.href = 'http://localhost:8080/user/client/home';
      },
    title: "Setup Wizard",
    content: "Go ahead and click on 'edit' and tell us a bit more about yourself."
    
  }
 
]});

// Initialize the tour
tour.init();

// Start the tour
tour.start();
    </script>
 


Solution

  • @Adriano Repetti's answer is good and actually should be considered best practice. however, for many reasons I am not able to change many things on the server side, using liferay portal is one of them!

    If anyone else is also interested to know the answer here's my solution:

    inside your script add:

    onNext: function(){
            var n=window.location.href;
            //alert(n);
            n=n.replace('/user/','/web/').replace('/groups','/biography');
            document.location.href = n;
          },
    

    This tells tour to find the current url and assign it to n. Then replace /user/ with /web/ and so on and so forth. Then give the new value to n and tell onNext function to hit it!

    I hope this helps :)