code_block module Advanced usage

gypsypix
gypsypix's picture

Joined: 2010-03-14
Posts: 16
Posted: Sat, 2014-01-25 19:40

I would like to use the code_block module with JavaScript but I'm not sure I understand the Advanced usage instructions. I've edited the modules/code_block/views/code_block#.html.php by adding this simple image slideshow...

-------------------------------------------------------------------
<?php defined("SYSPATH") or die("No direct script access.") ?>
<?= module::get_var("code_block", "code"); ?>
<center>
<script language="JavaScript">
var i = 0;
var path = new Array();

// LIST OF IMAGES
path[0] = "foodpic01.jpg";
path[1] = "foodpic02.jpg";
path[2] = "foodpic03.jpg";
path[3] = "foodpic04.jpg";
path[4] = "foodpic05.jpg";
path[5] = "foodpic06.jpg";

function swapImage()
{
document.slide.src = path[i];
if(i < path.length - 1) i++; else i = 0;
setTimeout("swapImage()",8000);
}
window.onload=swapImage;
</script>
<img height="125" name="slide" src="foodpic01.jpg" width="185" />
</center>
---------------------------------------------------------------------
I'm not sure if this is the correct placement and I also don't know what code to put in the code block administration page.
Could you please advise. I would be very grateful. This would be the last piece of the puzzle to a terrific web site I want to publish thanks to you guys.
Thanks,
Kevin
 
floridave
floridave's picture

Joined: 2003-12-22
Posts: 27300
Posted: Sat, 2014-01-25 20:35

It should work as long as the image paths are correct from the page you are viewing.
you could leave the code setting blank or remove this line:
<?= module::get_var("code_block", "code"); ?>

URL?

Dave
_____________________________________________
Blog & G2 || floridave - Gallery Team
 
punctuation

Joined: 2012-12-11
Posts: 37
Posted: Sun, 2014-01-26 06:05

I got it to work with this:

<?php defined("SYSPATH") or die("No direct script access.") ?>
<html>
<head>
<script type="text/javascript">
var i = 0;
var path = new Array();

// LIST OF IMAGES
path[0] = "foodpic01.jpg";
path[1] = "foodpic02.jpg";
path[2] = "foodpic03.jpg";
path[3] = "foodpic04.jpg";
path[4] = "foodpic05.jpg";
path[5] = "foodpic06.jpg";

function swapImage()
{
document.getElementById('inner').src = path[i];
if(i < path.length - 1) i++; else i = 0;
setTimeout("swapImage()",8000);
}
window.onload=swapImage;
</script>
</head>
<body>

<img height="125" id="inner" src="foodpic01.jpg" width="185" />

</body>
</html>

____________________________
Gallery 3.0.8 | Clean Canvas theme