How to use a black hotspot as background for several "flyin out" pictures ?

  • Hi,

    I wanted a black "screen" set to alpha="0.6" as background for my pictures displayed via a "showpic" hotspot.
    ex Click on the polygonal hotspot.

    It works great so now i'd like to add it in an other pano with 3 pictures. It works only for two of them.
    ex Click on the blue camera hotspots.

    Here the code :

    I can't figure it out!

    Any suggestions?

    Thanks everybody. *smile*

    Steph.

  • Hi Tuur,

    You're right.

    Thing is i solved the problem with the last tour by get back one of the three picture. Howver i still have the same kind of problem with this one. I put a black hotspot in each scene but it looks like it works as it want. Sometimes it appears some times no!

    Here the code :

    I can't find the reason why it's not working properly.

    Thanks for any help! *smile*
    Steph.

  • Hi,

    I've tried many ways to use a black hotspot as background when displaying a picture or a video in my tour (they are quite a lot inside).
    Check here if you want to see (some scenes it works, some not?!):
    Tour
    Problem still the same, it doesn't work for each picture in this tour?!

    My last try was to write this black hotspot in each scene :

    Then called from the showpic action :

    And hide it with the flyout action:


    Does anybody would be ok to give me a hand on that?
    Anymore idea to test.

    Thanks. *smile*
    Steph

  • Hi Sachagriffin,

    Thanks for details. However i mean hotspot. If it's plugin, the picture displayed through "flyin" action will be behind the black mask, this is not what i want. Did you have time to check my example link upon?

    Thanks again.
    Steph.

  • I tried to solve the same problem a while ago ... if you just want a black background it would be easier to do something like :

    Code
    tween(image.layer.alpha, 0.5);


    You can control the background color so if you wanted a red background, I guess that would work too. Flyout hotspots give a nice effect, but then it's a pain to control their position relative to the screen or other elements ... If anybody knows a good way to control that, I would love to get pointed in the right direction.

  • Hi nils,

    Thanks for your suggestion. Could you be a bit more clear. Your tween var would be used in the flyin action with my black mask hotspot? Or do i have to set the background color of the player and then change the pano alpha like you wrote upon? If so where do you set the background, i never did this?

    Thanks

    About the position relative to the screen you could may be set a x and y position to your flyin picture in addition to : getcenter(hsath,hsatv); in the showpic action.
    About others elements, if they're plugins, may be set the same align setting instead of getcenter and then add a x and y setting to your flyin picture.
    With my knowledge that's all i could propose you. Hope this help a little bit.

    Steph.

  • Here's the link about the backgroundcolor : https://krpano.com/docu/xml/#krpano.bgcolor

    The idea make the pano transparent so that you can see the color from the background (see above) and use that in your flyout action, then on the flyback action, you just tween back the alpha to 1 ... this way, the pano gets darker, and you don't need to worry about the black hotspot which is kind of a dirty trick I think.
    But I'm afraid things are a little more complicated than I remembered, and I have been too optimistic *unsure* ... Seems the image.layer property is not usable in XML scripting, but only in AS3 : https://krpano.com/docu/xml/#image.layer
    To use it, you would have to create a simple plugin with a function that you could use to tween the image.layer.alpha property. It works fine (I have used it in AS3 myself, but I didn't think it couldn't be used in XML *wacko* ). Actually since "flyout" is only possible in flash it won't mess up with iPad/iPhone version of the tour ... but it requires creating a plugin for that purpose *pinch* , and i don't know if you've done this before ...

    I'm not able to check you virtual tour from where I live at the moment, so I can only guess from what I know of what you're trying to do ... here is what I would try with XML :
    - have a small black 10x10px png
    - use it as a hotspot ... but note the flying and distorted attributes ... I could not see that in your code. Then when you make the background visible, make sure it is at least the size of the screen.

    You could use these functions in your flyout and flyback functions ... actually it would be more efficient to just add this behavior directly in your default flyout/flyback actions if you use it all the time ...
    Not sure how that will work ... I used this before but recently I just worked with AS3 and I'm just getting back to XML these days.

    Thanks for the information about the getcenter(h,v) function. I didn't know about it. I'm really not sure that's what I need for my purpose, but I'll play with it ... I'm sure I'll be using it somehow.

    Hope this helps ...

  • I see hotspots can't be over plugins.
    I almost have the mystery solved.


    Hi Sachagriffin,

    Thanks for details. However i mean hotspot. If it's plugin, the picture displayed through "flyin" action will be behind the black mask, this is not what i want. Did you have time to check my example link upon?

    Thanks again.
    Steph.

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!