Hi all,
After my upgrade to version 3.2 of jDownloads on Joomla 3.2 my downloads are no clickable at all.
I tried IE, Firefox and Chrome.
In IE I can start a mp3 file with the player but the download button is also not clickable.
Template: default
Text selection: impossible in all browsers in the Files layout
Text selection is possible in the Category layout.
Text selection for the rest of the Joomla installation (like the menu) is possible
Problem is with and without mp3 files/player.
PHP version: 5.3.2
MySQL version: 5.5.37
Webserver: Apache 2.2.14 (Ubuntu)
Website works on a big Dutch webhosting company
I send a PM with a link to the webpage to Arno.
Thanks for any quick response!
Best regards,
SoundHunter
It looks like I already fixed the problem myself.
I use the Gantry Framework from Rockettheme.
In /libraries/gantry/css/grid-responsive.css on line 9 I deleted position: relative;
In the same file I also deleted on line 11 position: relative;
After that it looks like that did the trick.
But why must I delete those codes?
Some little problem in the jDownloads code or in the Gantry code?
Thanks for any answer.
Best Regards,
SoundHunter
Hi,
you are the second user which had this problems with jD and Rockettheme.
I hope that we can find and solve this problem.
Hello,
I'm using version 3.2 of jDownloads on Joomla 3.2 and just like [SoundHunter] in an earlier report, my downloads are no clickable at all.
That applies for all common webbrowsers.
PHP version: 5.3.2
MySQL version: 5.5.37
Webserver: Apache 2.2.14
I use a Rockettheme template using Gantry (framework).
What can be wrong? How exactly can I have access to the Gantry css as described in SoundHunter's solution?
Best regards,
NaNels
Hi NaNels,
You can find the Gantry CSS files in the following directory:
../libraries/gantry/css/grid-responsive.css
This directory is also mentioned in the post of SoundHunter.
Gerard
Hi
I have had a look at the problem and confirm it occurs.
The basis of the Gantry theme is a grid. It has many css definitions that are variants of the name 'rt-grid' It uses @media statements to select which particular definitions are used dependant on the screen size of the device.
The two lines of css in /libraries/gantry/css/grid-responsive.css that are thought to be responsible are
body [class*="rt-grid"] {display: inline;float: left;position: relative;margin: 0;}
.rt-container {width: 1200px;margin: 0 auto;position: relative;}The first of these is a wild card selector that basically says within the scope of <body> to </body> , which is basically the entire page, then if there is any class containing the string rt-grid such as say class="abcrt-gridxyz" then apply those css definitions in the {...}. This is a neat short hand way of being able to effectively add some css to a lot of classes.
Actually Gantry needs the position:relative; in the rt-grid classes to make it work for different devices and so on.
jDownloads works fine if the first position: relative; is left in. It is the second one in the .rt-container class that causes the 'challenge'.
Basically in that circumstance the relevant jDownloads html code that makes buttons and so on active is not generated.
The html is actually correctly generated on first load (I was using list all categories) but fails after going one level down. The correct code generates a sequence like
<div id="rt-main" class="mb12">
<div class="rt-container">
<div class="rt-grid-12">
<div class="rt-block">
<div id="rt-mainbody">
<div class="component-content">
<div class="item-page">The jDownloads 'code' starts with the <div class="item-page">. Note that the <div> sequence is
<div class="rt-container">
<div class="rt-grid-12">
When the position: relative; is removed from the rt-container class then the state is position:static; from the browsers defaults.
When the position:relative; is in the rt-container class then the generated html is as below
<div id="rt-transition">
<div id="rt-mainbody-surround"></div>
<footer id="rt-footer-surround">
<div id="rt-copyright">
<div class="rt-container"></div>
</div>
</footer>
</div>- no sign of the component code at all. Suggest someone brings this to the attention of Rocket Theme
Modification Please see post below giving a possible solution from within jDownloads The problem is all to do with the stacking order. However I still believe Rocket Theme as a reputable outfit should not cause an impact on Component suppliers in the effective environment they provide. One would hope that they would aim at a 'neutral' scheme as do other template providers.
Colin
Good findings GolinM!
I did some further research and found a user that uses Jumi, an other Joomla component.
This component had the same problems as jDownloads do with Gantry.
This user contacted RocketTheme and they send their solution here: http://2glux.com/forum/jumi/jumi-compatible-with-the-gantry-framework-t2402.html
I tested this out to change in the second line (line 11 with the .rt-container) the word relative to inherit.
So change line 11 in .../libraries/gantry/css/grid-responsive.css:
.rt-container {width: 1200px;margin: 0 auto;position: relative;}
To:
.rt-container {width: 1200px;margin: 0 auto;position: inherit;}
Looks good enough to me.
It also looks like the already now of this problem at RocketTheme...
Best Regards,
SoundHunter
Hi
I have found a solution that will work without any changes to the Rocket Theme Gantry template. :) It involves modifying jdownloads_fe.css which is in components/com_jdownloads/assets/css/ Part of the reason for looking further was the wide use of Rocket Theme templates and what I perceive as their probable unwillingness to change! :(
Now the jDownloads front end html starts with
<div class="item-page">
NB this will be changing in a later release to <div class="jd-item-page"> where it is planned that all the css classes and ids needed by the front end will have a pre-fix of 'jd-' so as not to be reliant on the template css for detail layout.
So include the following in jdownloads_fe.css
/* fix if template uses position:relative; in its containing div */
/* for future releases */
.jd-item-page {
position: relative;
z-index: 1;
}
/* for current beta release */
.item-page {
position: relative;
z-index: 1;
}There is a small chance that this mod could possibly affect some modal type views with video samples or pictures and so on. It needs investigating. The key will be to use a higher z-index value for those items but note z-index only applies when there is a positioning element.
Colin
Hi Colin,
QuoteI have found a solution that will work without any changes to the Rocket Theme Gantry template.
awesome message! Shall i insert the posted css additions for the next update?
I hope i can publish it at the evening. Or must i also do something else? ::)
Arno
Yes we can go with this as it should be quite safe. ;)
But I hope Rocket theme will sometime change the Gantry Template. Did you see my PM sent to Gerard?
Colin
Colin,
yes i have seen it, well done. ;)
A last question: i need only the zwo additional css classes? So we should use the jD-item-page solution first in a later release? No problem.
I will do it. ;D
Great if this will be fixed in the upcoming beta release.
Will directly do some testing once the release is there.
Thanks both for working hard on this bug!
Regards,
SoundHunter
I installed the new jDownloads 3.2.3 beta and tested this out.
Seems like it works great with Gantry now!
Thanks again for this fix!
Best Regards,
SoundHunter
Arno
I think that we should introduce all the jd prefixes in the CSS at the earliest opportunity as this will maximise the testing ;) but I will respect your view as it is you who has the most work to do with bug fixing! :)
Colin
PS have not yet downloaded latest version so you may have done some already ;D
Hi Colin,
Quotebut I will respect your view as it is you who has the most work to do with bug fixing!
We can do it in next beta release, no problem. ;D
Hi,
I have a bug close to that one : jd is displayed normally on the top level view, but once you click on a category, the result is displayed in the footer.
I also use gantry.
Regards
Hm... have you installed the last version 3.2.3?
If so, then try this tip:
http://www.jdownloads.com/forum/index.php?topic=6860.msg26681#msg26681
Yes I have 3.2.3.
Changing the rt-container class did nothing.
Hi Scab333
Thought we had sorted this one. :( Could you let me know please what version of Gantry you are using just in case it is a different version to the one we tested with. Also if it is possible could you detail your setup and the steps you used please a bit so we can try to reproduce. I will of course re-test.
It is interesting that you arrived at the footer because that is exactly the code sequence that Gantry develops when the problem occurs so it does seem a new variant of the same instance.
Also I would appreciate a copy of the relevant Gantry css file you changed. Apologies for the request for this extra info but we need to bottom this one out. And if possible could you PM both Arno and myself with the web address of the problem site and how one gets to the problem. Using Firefox diagnostics would probably shed some light on this murky bug - oh and a thought what browser and version are you using. I will test with the half dozen browsers I have on my poor test pc!!
Thanks
Colin
hi,
I use the latest version of gantry, with joomla 3.2.3.
I use also the gantry template in which I derived the css. if I remove this file , I have the same issue tis default template
Gantry lib is unchanged.
I installed jd by updating jd 1.9.2.10
I had the same issue by a full install on MAMP.
I'm on mac and facing this issue with safari, firefox & chrome
if I remove the float property from (grid-responsive.css) :
[class*="rt-grid"] {
display: inline;
float: left;
position: relative;
margin: 0;
}
the layout is broken but jd is now in the right position, I hope this will help
Regards
I found it : it was a div closing tag missing in the category layout.
thank you for your support
Phew! ;D Glad you spotted the missing </div>. I did recheck every thing last night specifically on Opera as well as other browsers.
Is the missing </div> itself a bug? :-\ - if it is could you supply more detail please. Or was it in one of the editable jDownloads layout files?
Thanks
Colin
the bug is on your side ! :)
I uninstall JD 3.2.3 and drop all the relevant tables.
Then I made a fresh install ( on MAMP ) and by default the category layout has the bug -->no closing div
.....
{cat_info_end}
{sub_categories}
<div style="clear:both">
<div style="float:right;">{checkbox_top}</div>
{files}
{form_hidden}
<div style="text-align:right">{form_button}</div>
closing div is missing after "clear:both"
regards
@scab333:
Thanks for the info.
@Colin:
i have changed it now to:
$JLIST_BACKEND_SETTINGS_TEMPLATES_CAT_DEFAULT = '{cat_title_begin}<div style="background-color:#EFEFEF; padding:6px;">{subcats_title_text}</div>{cat_title_end}
{cat_info_begin}
<table width="100%" style="border-bottom: 1px solid #cccccc;">
<tr valign="top" border="0px">
<td width="65%" style="padding:5px;">{cat_pic}<b>{cat_title}</b></td>
<td width="20%" style="padding:5px; text-align:right">{sum_subcats}</td>
<td width="15%" style="padding:5px; text-align:right">{sum_files_cat}</td>
</tr>
<tr valign="top" border="0px">
<td colspan="3" width="100%" style="padding:5px;">{cat_description}</td>
</tr>
</table>
{cat_info_end}
{sub_categories}
<div style="clear:both"></div>
<div style="float:right;">{checkbox_top}</div>
{files}
{form_hidden}
<div style="text-align:right">{form_button}</div>';
Is this okay for you?
by the way, no need to hack the css to address the issue :nothing clickable...
it was caused by the missing div
Arno
Yes go with the change. As we progress we will change the layouts to reference jd- css to be independent of template support.
Colin
Colin,
the new beta releases are published. ;)
Thanks guys for solving the issue ;)