using two different index.xml files for one tour   [SOLVED] - View the solution

This sub-forum is for discussing and reporting bugs on any content that is not available by default in Panotour, so this concerns custom HTML templates, extra plugins (both Kolor-provided and third-party), etc...

Ce sous-forum a été créé pour discuter et/ou rapporter des bugs sur tout contenu qui n'est pas disponible par défaut dans Panotour, donc cela concerne les templates HTML customisés, plugins supplémentaires, etc...
User avatar
Siewers
Member
 
Topic author
Posts: 104
Likes: 4 posts
Liked in: 14 posts
Joined: Mon Nov 23, 2015 3:40 pm
Location: Netherlands
Info

using two different index.xml files for one tour

by Siewers » Fri Jan 13, 2017 6:00 pm

I want to have different hotspot styles for the mobile and the desktop version of the tour, the hotspot style is embedded in the index.xml file, so I want to use 2 different .xml files in one tour. is this possible?

User avatar
Annis
Kolor Team
 
Posts: 6062
Likes: 801 posts
Liked in: 444 posts
Joined: Mon Aug 12, 2013 12:47 pm
Location: France
Info

Re: using two different index.xml files for one tour

by Annis » Mon Jan 16, 2017 9:34 am

The hotspot style is set in the _skin.xml not the main index.xml (that's where your hotspot positions are).

And you can set your tour to use a different _skin.xml following the tutorial here: http://www.kolor.com/wiki-en/action/vie ... ic_devices

User avatar
Siewers
Member
 
Topic author
Posts: 104
Likes: 4 posts
Liked in: 14 posts
Joined: Mon Nov 23, 2015 3:40 pm
Location: Netherlands
Info

Re: using two different index.xml files for one tour

by Siewers » Mon Jan 16, 2017 2:25 pm

I want to have a different style but also a different action behind the hotspots, because if I open a web page on a mobile tour i't doesn't get aligned nicely. thats why I would like to use to index.xml files
Attachments
Screen Shot 2017-01-16 at 14.22.29.png

User avatar
Annis
Kolor Team
 
Posts: 6062
Likes: 801 posts
Liked in: 444 posts
Joined: Mon Aug 12, 2013 12:47 pm
Location: France
Info

Re: using two different index.xml files for one tour

by Annis » Mon Jan 16, 2017 3:35 pm

In that case it would be much more complicated, and the device check based in the html instead.

Probably similar to this but instead of opening a different tour you're opening different xml.

I'll have to do some tests and get back to you.

User avatar
Annis
Kolor Team
 
Posts: 6062
Likes: 801 posts
Liked in: 444 posts
Joined: Mon Aug 12, 2013 12:47 pm
Location: France
Info

Re: using two different index.xml files for one tour  [SOLVED]

by Annis » Mon Jan 16, 2017 5:05 pm

Alright, as I warned, this is quite complicated.

For these edits to work, you must have already set up your index_mobile.xml and index_mobile_skin.xml and their _vr versions (index_skin_mobile_vr & index_mobiles_vr) files.
Make sure the include at the top of the index_mobile.xml and index_mobile_vr files link to the mobile version of their skin file.

Now, open your index.html file in a text editor.
  1. Search for
    Code: Select all
    jQuery( document ).ready(function() {
  2. Above the JQuery line, add a line and paste this
    Code: Select all
    var isMobile = false;
  3. Underneath the jQuery line, add
    Code: Select all
                var mobilecheck = function() {
                              var check = false;
                              (function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|awa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4)))check = true})
                (navigator.userAgent||navigator.vendor||window.opera);
                              return check;
                            }
                            
                            isMobile = mobilecheck();
                
                            if (isVRModeRequested()){
                                           accessWebVr();
                                        }else{
                                           accessStdVr();
                                        }
  4. Now lower down, search for
    Code: Select all
    function loadPlayer(isWebVr)
  5. Just below you'll find
    Code: Select all
    ,xml:"indexdata/index_vr.xml"
    add
    Code: Select all
    "+(isMobile?"_mobile":"")+"
    between index and _vr.xml, so the result would be
    Code: Select all
    ,xml:"indexdata/index"+(isMobile?"_mobile":"")+"_vr.xml"
  6. Repeat the last step a few lines down for
    Code: Select all
    ,xml:"indexdata/index.xml"
  7. Last step, search the bottom of your html file for
    Code: Select all
                <script type="text/javascript">
                   if (isVRModeRequested()){
                      accessWebVr();
                   }else{
                      accessStdVr();
                   }
                </script>
    and remove this section.

Because of the extensive modifications this couldn't be handled by PTP, or even in a custom html template, so you'd have to do these edits manually each time. Make sure you do this at the end once you don't need to build the tour anymore and backup your files.

I'm attaching a modified version of the html file that you can use to COMPARE to a normal tour html file, but you can not replace yours with this one since the data won't match.
isMobile.zip
(3.55 KiB) Downloaded 154 times

Siewers likes this post.

User avatar
Siewers
Member
 
Topic author
Posts: 104
Likes: 4 posts
Liked in: 14 posts
Joined: Mon Nov 23, 2015 3:40 pm
Location: Netherlands
Info

Re: using two different index.xml files for one tour

by Siewers » Mon Jan 16, 2017 5:07 pm

thank you very much, I'm going to test it right now :-)


Who is online

Users browsing this forum: No registered users and 0 guests