Welcome, Guest
Username: Password: Remember me

TOPIC: Custom Template: New image at end of each group

Custom Template: New image at end of each group 2 years 8 months ago #95925

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 5396
  • Thank you received: 1148
  • Karma: 477
what if you have some confition in group ? Not sure the number is the same ?
I think the groups are assigned sequential numbers even if they are hidden by conditions.
        $_gseq = -1;
        foreach ($_SESSION[$LEMsessid]['grouplist'] as $gl)
        {
            $gid = $gl['gid'];
            ++$_gseq;
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #95929

  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • Moderator Lime
  • Posts: 8184
  • Thank you received: 1117
  • Karma: 331
\o/ Great then !
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #95937

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
I implemented the CSS version and all works swimmingly. You guys rock.
There is one issue that I can't seem to resolve.

I want to use a placeholder image as described above, because...well...that makes sense. But, the placeholder image always shows...even when the group specific image loads. It seems to be "above" the group specific image, in Chrome anyway.

Any thoughts?
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #95954

  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • Moderator Lime
  • Posts: 8184
  • Thank you received: 1117
  • Karma: 331
If you use the css method
( CSS BACKGROUND IMAGES in first post of Tony)

There are no placeholder

No ?
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #95986

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
Of course. Now all is well.
Thank you both.
David
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96002

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
Gents,
One more thing. Do you know of a preloader script that would be worthwhile to use?
Also, in what file would you put it?
Any advice you have would as always be appreciated.
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96018

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 5396
  • Thank you received: 1148
  • Karma: 477
I have used this in the past:
$(document).ready(function(){	
	preload([
		'path/to/images/group_0.png',
		'path/to/images/group_1.png',
		'path/to/images/group_2.png',
		'path/to/images/group_3.png'
	]);
});
 
function preload(arrayOfImages) {
	$(arrayOfImages).each(function(){
		$('<img/>')[0].src = this;
	});
}

(remember not to put a comma after the last image in the array)
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
Last Edit: 2 years 8 months ago by tpartner.
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96034

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
In what file would you place it? At the end of template.js?
David
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96038

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 5396
  • Thank you received: 1148
  • Karma: 477
That would work or you could wrap it in a <script> tag and place it in the question source.
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96253

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
Hi Tony,
I have implemented the follwoing in the template.js.

$(document).ready(function(){
preload([
'www.mydomain.com/survey/upload/templates...roupDemo/group_0.png',
'www.mydomain.com/survey/upload/templates...roupDemo/group_1.png',
'www.mydomain.com/survey/upload/templates...roupDemo/group_2.png',
'www.mydomain.com/survey/upload/templates...roupDemo/group_3.png',
]);
});

function preload(arrayOfImages) {
$(arrayOfImages).each(function(){
$('<img/>')[0].src = this;
});
}

As you can see i included the full path to the images.Is it possible this is not the right approach. I ask because the images don;t seem to preload. There is a delay before they are presented on the page.

Is there a chance there is another setting that needs to be changed?
Any thoughts you have are most appreciated.
David
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96259

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Team
  • Posts: 5396
  • Thank you received: 1148
  • Karma: 477
Does the path contain "http://"? I don't see it in your code.
Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.

LimeSurvey is open-source and run entirely by volunteers so please consider donating to support the project.
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96260

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
Yes, the http;// are all there; I'm not sure why I pasted the code without them.
"www.springboltconsulting.com/survey/uplo...roupDemo/group_0.png",

I am asking, because I am working on another issue related to script and images, and am wondering if there is something I am making a fundamental mistake on.

Thank you,
David
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96294

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
I have been working with Denis to insert images as button in the survey. We could not make it work. Until Denis realized I had an error in the CorrectPNG function. I fixed the error to no avail. I had to comment out the entire function to make it work - and that solved the image preloading issue I was having as well.

See: : www.limesurvey.org/en/forum/installation...buttons-images/96265 for the long story.

Thank you,
David
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96305

  • dweisser
  • dweisser's Avatar
  • Offline
  • Gold Lime
  • Posts: 210
  • Thank you received: 5
  • Karma: 5
One more thing,
Is it possible that you know how to accomplish the hover effect with the images as buttons (detailed at the end of the post above). The css, if in fact it is still css, is simply beyond me. This is last detail in my quest to accomplish buttons as images on surveys. Any thoughts you have are greatly appreciated.
P.S. I became a Gold Donor this morning. ;)
Nebraska
The administrator has disabled public write access.

Custom Template: New image at end of each group 2 years 8 months ago #96306

  • DenisChenu
  • DenisChenu's Avatar
  • Offline
  • Moderator Lime
  • Posts: 8184
  • Thank you received: 1117
  • Karma: 331
Hello,

For hover : 2 manner.

1st : use css only for background without hover and with hover.
2nd: use .hover() jquery function to change img src url
The administrator has disabled public write access.
Moderators: ITEd
Time to create page: 0.245 seconds