Jquery and SWF
Jquery and SWF
Greeting,
I have been searching for a answer to a problem I have run across with a small project. This looked like a helpful community, so I hope someone is able to give me some guidance. I will try to explain it as best as I can, and include most of the code on the page.
The site goes to a county-list case in a switch. On the county list I have a swf that includes a id for all the counties (see flash code below). I also call all the counties with php as a list also. When clicked I would like the counties in the map to switch over to the county case like the counties in the list. (I have a html and php version that the county swf map works in and have included the bit of code that makes it work in that version).
So I am not sure what I should do to make the map code work in the Jquery code. I would think that I need to create a tag that will relate to the SWF and have it work in the Jquery click(); function?
Any help would be appreciated. If you need more information let me know, or if you would prefer to have a link I can PM you the test url.
Here is a snippet from the swf/flash code that each county has.
-
// Action script...
// [onClipEvent of sprite 2 in frame 1]
on (press)
{
_root.clickCounty(this);
}
// [onClipEvent of sprite 2 in frame 1]
onClipEvent (load)
{
this.cid = 1206;
this.status = _root["c" + this.cid];
if (this.status)
{
var col = new Color(this);
col.setRGB(this.status);
} // end if
}
Also the main call in the swf.
-
// [Action in Frame 1]
function clickCounty(county)
{
if (_root.call)
{
getURL("javascript: " + _root.call + "(" + county.cid + ")", "");
} // end if
} // End of the function
The JS that I have at the moment.
-
$(document).ready(function(){
checkURL();
//References
var sections = $("a");
var loading = $("#loading");
var content = $("#content");
$('a')
.livequery('click', function(event) {
checkURL(this.hash);
//show the loading bar
showLoading();
//load selected section
switch(this.id){
case "splash2":
content.ajaxStart(function(){
content.slideUp();
});
content.load("switch.php #section_splash2", hideLoading);
content.ajaxStop(function(){
content.slideDown();
});
break;
case "species":
content.ajaxStart(function(){
content.slideUp();
});
content.load("switch.php #section_species", hideLoading);
content.ajaxStop(function(){
content.slideDown();
});
break;
case "county":
content.ajaxStart(function(){
content.slideUp();
});
content.load("switch.php #section_county", hideLoading);
content.ajaxStop(function(){
content.slideDown();
});
break;
case "countylist":
content.ajaxStart(function(){
content.slideUp();
});
content.load("switch.php?cid=" + this.title + ' ' + "#section_countylist" , hideLoading);
content.ajaxStop(function(){
content.slideDown();
});
break;
case "single":
content.ajaxStart(function(){
content.slideUp();
});
content.load("switch.php?sid=" + this.title + ' ' + "#section_single", hideLoading);
content.ajaxStop(function(){
content.slideDown();
});
break;
default:
//hide loading bar if there is no selected section
hideLoading();
break;
}
});
//show loading bar
function showLoading(){
loading
.css({visibility:"visible"})
.css({opacity:"1"})
.css({display:"block"})
;
}
//hide loading bar
function hideLoading(){
loading.fadeTo(1000, 0)
;
};
setInterval("checkURL()",250);
});
var lasturl=""; //here we store the current URL hash
function checkURL(hash)
{
if(!hash) hash=window.location.hash; //if no parameter is provided, use the hash value from the current address
if(hash != lasturl) // if the hash value has changed
{
lasturl=hash; //update the current hash
loadPage(hash); // and load the new page
}
}
function loadPage(url) //the function that loads pages via AJAX
{
url=url.replace('#',''); //strip the #page part of the hash and leave only the page number
$.ajax({ //create an ajax request to load_page.php
type: "POST",
url: "switch.php",
data: 'page='+url, //with the page number as a parameter
dataType: "html", //expect html to be returned
success: function(msg){
if(parseInt(msg)!=0) //if no errors
{
$('#section_recent').html(msg); //load the returned html into pageContet
}
}
});
}
County-List case code in php file
-
<div id="map">
<?php
$t_id = floor($_GET['taxon']);
$vars = array();
$counties = $app->query("SELECT c_id
FROM county GROUP BY c_id");
while($county = $counties->fetch_assoc()) {
$color = (76 << 16) + (76 << 8) + 76;
$vars[] = 'c' . $county['c_id'] . '=' . $color;
}
$flashvars = implode('&', $vars);
$flashvars .= '&call=show_details';
?>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="500" height="300">
<param name="movie" value="pennsylvania.swf">
<param name="wmode" value="opaque"/>
<param name="quality" value="high">
<param name="flashvars" value="<?=$flashvars?>">
<embed src="pennsylvania.swf" flashvars="<?=$flashvars?>" quality="high" width="500" height="300" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">
</embed></object>
</div>
<div id="list">
<div class="title">Counties</div>
<?php
$results = $app->query("SELECT c_name,c_id FROM county ORDER BY c_name ASC");
while($row = $results->fetch_assoc()) {
$c_id = $row['c_id'];
echo "<a id=\"countylist\" title=\"$c_id\">{$row['c_name']}</a>\n";
}
?>
</div>
</div>
Before I started the Jquery version I had a regular php version that switched the cases. This code worked to create the links in the swf, but just throwing this in for reference.
Regular call for SWF in html and php site version.
-
<script type="text/javascript">
function show_details(cid) {
this.location.href = '?go=county-list&cid=' + cid;
}
</script>
[/quote]