Portal Engine Questions on portal engine and web parts.
Version 4.x > Portal Engine > Multiple Lightbox on the same page View modes: 
User avatar
Member
Member
tspring-allegra - 8/5/2009 11:08:12 AM
   
Multiple Lightbox on the same page
Hi

I'm trying to place two lightbox webparts on the same page. The problem is whichever lightbox is placed below the other, the fullsize-click-though (i.e. when you click on the thumbnail to enlarge to fullsize) does not work. It just sits with the loading animation playing.

This still happens even if you make the top lightbox webpart invisible.

There's nothing wrong with the individual lightbox settings and transforms, because if I swap the two webparts around the previous bottom lightbox works when its now above the other; and the previous top lightbox stops working when its below.

Is there anyway to fix this problem??

I get the feeling it might be something to do with whichever lightbox webpart on the top (in this case lightbox1 is above lightbox2) the following code is inserted:
<script type="text/javascript" language="javascript">
<!--
function getLightboxContent(path){ if (beforeLightBoxLoad(path, path + 'plcRoot$Layout$zoneContent$PagePlaceholder$PagePlaceholder$Layout$zoneLeft$lightbox1')) { WebForm_DoCallback('plcRoot$Layout$zoneContent$PagePlaceholder$PagePlaceholder$Layout$zoneLeft$lightbox1',path,setLightboxContent,null,null,false) } }function setLightboxContent(content, context){ loadLightBoxContent(content); }
-->
</script>

But there's no similar code inserted for the bottom 'lightbox2'.

I tried manually inserting similar additional code with a change of '...zoneLeft$lightbox1' to '...zoneLeft$lightbox2'. This only reversed the problem, i.e. the bottom webpart would work and the top one fail.

Can anyone help?

User avatar
Member
Member
tspring-allegra - 8/5/2009 12:22:19 PM
   
RE:Multiple Lightbox on the same page
Sorry, I just reading back my post I dont think I made myself clear.

The problem happens when there are two lightbox webparts visible on the CMSDesk. But actually on the live site only one of them is shown. This is because I've setup two login types for the live site and each login will only see one of the lightbox galleries depending on the login.

If the user logs-in that accesses the lower lightbox webpart, if fails to work properly. The login for the top lightbox webpart works fine.

I've found a work around by putting a dummy lightbox webpart that is always on top of the others and visible for any login, but just displays nothing. This seams to allow all lightbox webparts below to work.

User avatar
Kentico Developer
Kentico Developer
kentico_helenag - 8/5/2009 3:44:21 PM
   
RE:Multiple Lightbox on the same page
Hi,

I tested two lightboxes on the same page and they work correctly. Could you please test it on the sample Corporate site in Examples sections – find the Light box example and add the second similar lightbox. Does the same problem occur?

Best regards,
Helena Grulichova

User avatar
Member
Member
tspring-allegra - 8/6/2009 3:27:00 AM
   
RE:Multiple Lightbox on the same page
Hi,

The problem seams to be if you have two of more lightbox webparts on the same page, but if you hide the very top lightbox (as listed in CMSDesk view) i.e. you make it invisible via the webpart settings or in my case its not visible to the site user due to restricted login access. Then the following lightbox webparts underneither it stop working. I suspect its due the the code I mentioned in my inital post. As the CMS inserts this section of code that relates to the top lightbox webpart. When this webpart exists in the CMSDesk (so the relating code gets inserted) but not on the live site as mentioned above, the other lightbox fail to properly initiate.

User avatar
Kentico Developer
Kentico Developer
kentico_helenag - 8/6/2009 8:57:18 AM
   
RE:Multiple Lightbox on the same page
Hello,

could you please confirm me that you tested it on sample Corporate site, too? I was not able to reproduce your issue on it.

What web parts do you use on the same page? Do you use some custom code on that page (e.g. JavaScript)?

Best regards,
Helena Grulichova

User avatar
Member
Member
tspring-allegra - 8/6/2009 10:01:20 AM
   
RE:Multiple Lightbox on the same page
Hi

I setup a very basic site to show the problem: http://www.allegrastrategies.com/site/home.aspx

Where pages Home & Home2 are exact copies apart from on Home I have set the top lightbox webpart to be invisible, to simulate a user logging onto the site with restricted access to one of the two webparts. If I try clicking on the bottom gallery thumbnail on the Home page it fails to load the image properly for me. Do you get the same? There are no other webparts or custom code on the page.

User avatar
Kentico Developer
Kentico Developer
kentico_helenag - 8/7/2009 3:14:57 AM
   
RE:Multiple Lightbox on the same page
Hi,

finally, I was able to reproduce the issue. It relates to invisibility of one lightbox. If all lightboxes are visible then the problem does not occur.

In your case please use this workaround:
You would need to chenge the Lightbox web part code behind. Please follow these instructions: http://devnet.kentico.com/docs/devguide/modifying_the_code_of_standard_web_parts.htm

Then find the OnLoad method (line about 825) and replace its code by this one:
/// <summary>
/// OnLoad override, register loading javascript
/// </summary>
protected override void OnLoad(EventArgs e)
{
if (this.Visible)
{
string callbackRef = this.Page.ClientScript.GetCallbackEventReference(this, "path", "setLightboxContent", null);
string lightBoxJavaScript = "function getLightboxContent(path){ if (beforeLightBoxLoad(path, path + '" + this.UniqueID + "')) { " + callbackRef + " } }";
string lightBoxJavaScriptRaise = "function setLightboxContent(content, context){ loadLightBoxContent(content); }";

this.Page.ClientScript.RegisterClientScriptBlock(typeof(string), "LightBoxScript", ScriptHelper.GetScript(lightBoxJavaScript + lightBoxJavaScriptRaise));
this.Page.ClientScript.RegisterClientScriptInclude("LightBoxLoader", ResolveUrl("~/CMSWebParts/Viewers/lightbox_files/lightboxloader.js"));
}
base.OnLoad(e);
}

I am sorry for your inconveniences and hope this change will help you.


Best regards,
Helena Grulichova