[MODULE] Home Featured in Column (JQuery)

[nickcfc]

Hello everyone

I'm using the program recently and decided to first learn a lot about it.

This is a module I made for my use, and would like to share it with everyone.

This is my first module, the starting point was the documentation of the module "Sliding accordion" that taught me a lot.


Thanks and Credits.

1) rocky - Module "Sliding Accordion" because of its documentation could make this module. - Link -

2) Module "Featured Home" Did not find the original author's name.

3) The module was based on the following scrip JQuery - Link -


DEMO (Left) : - Modulo -


Installation

Copy the folder "cfcspy" into modules, go to modules and install it.

Enter the "css" in your stylesheet.

Obs:

Okay, still has many things to improve, but I believe it is a starting point.
I think it's good module to use the other pages of the site where there is no homefeatured.

Sorry my english, it is the fault of Google

Attached File(s)

•  cfcspy.JPG (19bytes)
  Number of downloads: 10589

[nickcfc]

Download

I do not know how to put on the forum download

:(

Click HERE to download

[Ardian Yuli Setyanto]

Wow, great module. i'm looking for this. thanks for sharing it. How about your top horizontal menu ? is it also based on jquery ? i like it.
thanks

[ysco]

Seems like a very good and impressive module.
Thanks a lot for sharing this with us.

Maybe a dumb question, but do i need to copy the info from css and put it in theme css ?
Proberly a newbie question, but please explain where to put the css exactly

Edit: ok i have added your info .css in the global.css from my theme and now it displays your layout.
But the slide effect is not working for me , i am using 1.2.4.

Also yours shows 4 products and the min on the module is 5 can dat be changed to 4 ?


Any idea ?



Thanks.


ysco..

[GNeRaL]

Thanks for the module..

But, what is the Baxiou?

http://omploader.org/vMmcxNA/nnn.PNG

[nickcfc]

Thanks

Ardian

The menu I'm using is the original "prestashop" without the dynamic mode

ysco

Yes, I separated the "css" because my style sheet is very different from the original, edit your css and put it in the end.

GNeRaL

sorry but some terms I forgot to translate

baixou = lowered, promotion, specials

[ysco]

@ nickcfc

Wel i have added your lines in the glonbal.css off my template i use but i have no sliding on the page , it`s all there but nothing is happening
And to change the min to 4 where can you do that ?
And is it possible to change the widht so that it fits the other blocks ? , have try`t in the global.css lines that i have added but it seems that the gif file is not expandable.

ysco..

[nickcfc]

Ysco

You can change the number of frames to display in spy.js

$(function () {
$('ul.spy').simpleSpy();
});
(function ($) {
$.fn.simpleSpy = function (limit, interval) {
limit = limit || 4; <<<< Change HERE

the module has to have 1 more than the number you put on the display tables
example: put to display 3 frames, the parameters 4

and cfcspy.php you can change

if ($maxdisplays == 0)
$maxdisplays = 9999;
elseif ($maxdisplays < 5 AND $maxdisplays > 1)
$maxdisplays = 5; <<<< Change Here

Remember : php 1 more then js


this css is the module view and not the entire page, my version is 1.2.4

[nickcfc]

sometimes the modules that I picked up here do not work for me if I do the translation into Portuguese, I did not put the file in English languages, try this in BO

[ysco]

Thanks for your quick reply`s nickcfc.

I have already fixed the size so that it fit my block size, i have put the png in photoshop and resized the file to 225px and changed the setting in gobal.css also to widht 225px and is working this way.
But how come that the module doesn`t slide , it is only showing as a picture with products but not slide.
So please let me know how to fix the slide problem.

Greats, ysco..

[Prestafreak™]

Excellent module, thanks for sharing. Is this module made specific for left column? I have tested your module but I cannot hook it in right column. (Or maybe I didn't hook it right, I'm still checking the code) Thanks again....

[nickcfc]

how many products you have in store?

the number of products has to be greater than the number shown

example, if the "spy.js" contains 4 frames to display, the settings of module must have 4 +1.

If the number of products is equal or less to the number to display, he stands (not slide)


@Ardian

Only now I understand your question, yes it is also based on jquery

It was based on this article

- LINK -

hope will inspire

[ysco]

@ nickcfc

I have 45 different products on my shop.

This is the php file,

Quote

public function getContent()
{
$output = '

'.$this->displayName.'

';
if (Tools::isSubmit('submitspy'))
{
$maxdisplays = Tools::getValue('maxdisplay');
if ($maxdisplays == 0)
$maxdisplays = 9999;
elseif ($maxdisplays < 5 AND $maxdisplays > 1)
$maxdisplays = 4;

And this is the js file,

Quote

$(function () {
$('ul.spy').simpleSpy();
});
(function ($) {
$.fn.simpleSpy = function (limit, interval) {
limit = limit || 3;
interval = interval || 6000;
return this.each(function () {
// 1. setup
// capture a cache of all the list items
// chomp the list down to limit li elements
var $list = $(this),
items = [], // uninitialised
currentItem = limit,
total = 0, // initialise later on
height = $list.find('> li:first').height();
// capture the cache
$list.find('> li').each(function () {
items.push('

' + $(this).html() + '

');
});
total = items.length;
$list.wrap('

').parent().css({ height : height * limit });
$list.find('> li').filter(':gt(' + (limit - 1) + ')').remove();
// 2. effect
function spy() {
// insert a new item with opacity and height of zero
var $insert = $(items[currentItem]).css({
height : 0,
opacity : 0,
display : 'none'

Please tell me where i go wrong.


ysco..

• Back to top

[nickcfc]

prestafreak

It works well in the right column, just add at the end of "spy.php" before last ")" this line

function hookRightColumn($params)
{
return $this->hookLeftColumn($params);
}



before :

));
return $this->display(__FILE__, 'cfcspy.tpl');
}

}

after

));
return $this->display(__FILE__, 'cfcspy.tpl');
}
function hookRightColumn($params)
{
return $this->hookLeftColumn($params);
}
}

[nickcfc]

Ysco

Quote

‘; if (Tools::isSubmit(‘submitspy’)) { $maxdisplays = Tools::getValue(‘maxdisplay’); if ($maxdisplays == 0) $maxdisplays = 9999; elseif ($maxdisplays < 5 <<< (4)

has only a change but that will not make much difference, just the same logic.

It was to be functioning normally, can you pass the address of your store?

[ysco]

Hello nickcfc,

http://www.gadgetshop-online.nl

ysco..

[nickcfc]

Ysco

I saw your page and everything seemed ok, the only difference is that you are with "https" and not really know if it influences the load "spy.js, let's try to change the directory of it.

most of their "js" point to "https://www.gadgetshop-online.nl/modules/"

mine is so

 "[removed]</ script>" 

in cfcspy.tlp change in the line of reference.

where is "[removed] </ script>" 
to [removed]</ script> 

then confirms that this is the same directory where is the "js"

Attached File(s)

•  ysco.txt (1bytes)
  Number of downloads: 59

[jolvil]

Nice module but seems not working for me too ! look at http://www.stereosto...antic/boutique/


why not put css in css folder inside module folder

with
<link rel="stylesheet" type="text/css" href="{$module_dir}css/cfcspy.css" media="screen"> in cfcspy.tpl ?

[ysco]

Hello nickcfc,


Well if i add that line then the front page get screwed up and lots off things dissapear then.

@ jolvil

Well i am glad that i am not the only one cause i really thought what a dumbass i whas to get this not working.
Do you have the same problem that i have ?

Btw jolvil what is the module u use at the bottom of your webpage ? nice module is that.

ysco..

[jolvil]

Quote

Btw jolvil what is the module u use at the bottom of your webpage ? nice module is that.

Home Featured Carousel http://www.prestasho...viewthread/3159