Using the modal popup box

ECXnicky
Joomla! Apprentice
Joomla! Apprentice
Posts: 14
Joined: Tue Apr 29, 2008 2:03 pm

Using the modal popup box

Postby ECXnicky » Thu Jun 12, 2008 9:21 am

I've been wondering how i could use the modal popupbox that's inside joomla.

it's used to edit parameters in the backend and such, how can i use this in the frontend?

User avatar
millermulti
Joomla! Apprentice
Joomla! Apprentice
Posts: 42
Joined: Fri Jun 13, 2008 11:05 pm
Location: Minneapolis
Contact:

Re: Using the modal popup box

Postby millermulti » Fri Jun 13, 2008 11:20 pm

I just figured this out for myself and thought it worth sharing. For Joomla 1.5 users, add the following to the very top of your template:

<?php JHTML::_('behavior.modal'); ?>

To open a modal window, use a link formatted like <a href="your_url" class="modal">Your text or image</a>

That's it. Works great for image popups. I wondered if I could add text content from an article. After analyzing the URL from the admin area I came up with a link that looks something like:

<a href="/index.php?option=com_content&id=##&tmpl=component&task=preview" class="modal">Text link here</a>

Substitute the Article ID for the ## characters. Worked like a champ for me. I still need to find where the Modal dimensions are set. It would be nice to have a wider window.
http://www.MillerMultimedia.net
180 Joomla Sites and Counting

ewel
Joomla! Guru
Joomla! Guru
Posts: 522
Joined: Mon Oct 01, 2007 11:35 am

Re: Using the modal popup box

Postby ewel » Fri Jun 20, 2008 8:37 am

Have you found out how to set options like dimensions?

Looking at line 116 in the source of behavior.php (see http://api.joomla.org/__filesource/fsource_Joomla-Framework_HTML_joomlahtmlhtmlbehavior.php.html) I see that the modal function is as follows:

Code: Select all

function modal($selector='a.modal', $params = array())


What I think this means is that it should be possible to pass a selector (for example a.myselector instead of a.modal). I am not sure what the selector is, though, but I think it is class. The rel attribute of a link I think does not serve as the selector but to set the options for a link, whereas the modal class of links is used as selector.

Also, it should be possible to set other parameters such as size. Lower down in line 144 the size option is set by reference to the params array. By setting these options in calling behavior.modal, I think it should be possible to skip the rel attribute of links altogether.

So, all in all it should be possible to use a custom class (such as 'mylinkclass') and a size (such as 800 by 600) in calling behavior.modal and then all links with that class ('mylinkclass') will get the predefined size (800x600) without any need to set the rel attribute in those links.

However, I do not know how to actually code this, and I would like to know how exactly this is done. Would it be something like this?

Code: Select all

<?php
$myselector = "mylinkclass";
$mysizex = 800;
$mysizey = 600
JHTML::_('behavior.modal($myselector,'size'{x:$mysizex, y:$mysizey})');
?>


I hope someone has the answers because this will enable me to make a little plugin that for example scans for all links to yourdomain.com and gives them the class 'mylinkclass' so that they open in a Squeezebox of a given size without affecting the use of Squeezebox by any other extension.

ber1370
Joomla! Fledgling
Joomla! Fledgling
Posts: 1
Joined: Mon Aug 25, 2008 2:34 am

Re: Using the modal popup box

Postby ber1370 » Mon Aug 25, 2008 2:39 am

I think what you want is described at http://www.aikidokatech.com/index.php?option=com_content&view=article&id=44:popbutton&catid=34:howto&Itemid=2. The relevant part for me was adding

Code: Select all

 rel="{handler: 'iframe', size: {x: 500, y: 400}}"
to the a tag.

ewel
Joomla! Guru
Joomla! Guru
Posts: 522
Joined: Mon Oct 01, 2007 11:35 am

Re: Using the modal popup box

Postby ewel » Mon Aug 25, 2008 7:02 am

In that way you can set the dimensions from the html, but what I am after is to leave the html alone and force the opening of a squeezebox using only php and/or javascript. The whole point of what I am trying to achieve is that you do not have to change the html of links manually.


Return to “Joombie Coding Q/A”

Who is online

Users browsing this forum: No registered users and 2 guests