|
#1
10-31-2008, 09:55 PM
|
|||
|
|||
Tutorial about my hp 1.0 mods
Dear Friends:
This is a tutorial on how to implement the mods I made in my site (www.vivaemfloripa.com.br). I have posted these mods before, but now I intend to make this as a tutorial for everybody about what i have done and how it works. If you click on any of my properties, you'll have a page with the infos being showed in a tabbed form. Let's see how to implement the tabbed stuff first: 1 - for the tabs to work, you must first include in your code this: Code:
<?php
JHTML::stylesheet('tabs.css','components/com_hotproperty/views/property/tmpl/');
jimport('joomla.html.pane');
$pane = &JPane::getInstance('tabs');
The other 2 lines are for start tab's instance. The code for the tabs.css is: Code:
/* tabs */
dl.tabs
{
float: left;
margin-top: 10px;
margin-right: 0;
margin-bottom: -1px;
margin-left: 0;
z-index: 50;
}
dl.tabs dt
{
float: left;
padding-top: 4px;
padding-right: 10px;
padding-bottom: 4px;
padding-left: 10px;
border-left-color: #ccc;
border-left-width: 1px;
border-left-style: solid;
border-right-color: #ccc;
border-right-width: 1px;
border-right-style: solid;
border-top-color: #ccc;
border-top-width: 1px;
border-top-style: solid;
margin-left: 3px;
background-color: #f0f0f0;
color: #666;
}
dl.tabs dt.open
{
background-color: #F9F9F9;
border-bottom-color: #F9F9F9;
border-bottom-width: 1px;
border-bottom-style: solid;
z-index: 100;
color: #000;
}
div.current
{
clear: both;
border-color: #ccc;
border-width: 1px;
border-style: solid;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
div.current dd
{
padding: 0;
margin: 0;
}
Code:
echo $pane->startPane('test-tabs');
echo $pane->startPanel( 'Fotos', 'panel1' );
Code:
echo $pane->endPanel(); To end all tabs, use: Code:
echo $pane->endPanel(); echo $pane->endPane(); This slideshow uses a xml file wich defines the pictures names and locations. To define this xml file, I create a folder named xml and use the property's id as the name of the xml file for the property. If the property's xml file doesn't exist in the xml folder, then it's created dinamically. Put the file imagerotator.swf, you downloaded from the site above, in: /includes/js/imagerotator.swf In the place you want to implement the slideshow, put this code: Code:
<div id="hp_view_standard_photo_con1">
<div id="hp_view_standard_photo_con2" class="text-align: center">
<div id="hp_view_standard_photo_con3" class="text-align: center">
<?php
$filename = './xml/'.$this->p->id.'.xml';
if ( !file_exists($filename))
{
$somecontent='<?xml version="1.0" encoding="ISO-8859-1" ?>'."\n";
$somecontent=$somecontent.'<playlist version="1" xmlns="http://xspf.org/ns/0/">'."\n";
$somecontent=$somecontent."\t".'<trackList>'."\n\n";
if (!empty($this->images))
{
foreach($this->images AS $image)
{
$somecontent=$somecontent."\t\t".'<track>'."\n";
$somecontent=$somecontent."\t\t\t<title>".$image->title."</title>\n";
$somecontent=$somecontent."\t\t\t".'<creator>Sérgio de Aguiar</creator>'."\n";
$somecontent=$somecontent."\t\t\t<location>".JURI::root().$hp_imgdir_standard.DS.(($image->standard <> '') ? $image->standard : $hp_img_noimage_thumb).'</location>'."\n";
$somecontent=$somecontent."\t\t".'</track>'."\n\n";
}
$somecontent=$somecontent."\t".'</trackList>'."\n";
$somecontent=$somecontent.'</playlist>';
touch($filename) or die("Unable to create: " . $filename);
$handle = fopen($filename, 'a') or die("Could not open file: " . $filename . "\n");
fwrite($handle, $somecontent) or die("Could not write to file: " . $filename . "\n");
fclose($handle);
}
}
?>
<div id="flashcontainer"></div>
<embed
src="/includes/js/imagerotator.swf"
width="400"
height="300"
allowscriptaccess="always"
flashvars="file=<?php echo($filename); ?>&transition=blocks&shuffle=false&repeat=true&transition=random" />
</div>
</div>
</div>
Now, that we have the slideshow working, let's see how to put some movies in the property. First, download the jw flv media player from the same producer as above, at http://www.jeroenwijering.com/?item=JW_FLV_Media_Player. After that, put te files player.swf and swfobject.js, in the folder /includes/js/ You also must put the skins files (downloaded from the site above), in the folder /includes/js/skins/ Obs: The movies must be in flv (flash) format. There are several good free converters softwares in internet, so you can convert from mpeg or avi to flv. For this code to work, you need to make a xml file that will be located in the folder /movies/ and, again, the name of it will be the property's id + .xml. These xml files must be created by you (sorry, no automatic code in this case). The xml file format is: Code:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<playlist version="1" xmlns="http://xspf.org/ns/0/">
<info>http://www.vivaemfloripa.com.br/</info>
<trackList>
<track>
<creator>Sergio Aguiar Corretor de Imoveis</creator>
<title>Prédio Açores</title>
<annotation>Uma pousada. Tanto para a alta como para a baixa temporadas.</annotation>
<location>/movies/13.flv</location>
<image>/includes/js/picfln.jpg</image>
</track>
</trackList>
</playlist>
Then, put this code where you want to show the movies: Code:
<center>
<div>
<script type='text/javascript' src='/includes/js/swfobject.js'></script>
<div id='preview'>This div will be replaced</div>
<script type='text/javascript'>
var s1 = new SWFObject('/includes/js/player.swf','ply','380','417','9','#ffffff');
s1.addParam('allowfullscreen','false');
s1.addParam('allowscriptaccess','always');
s1.addParam('autoscroll','false');
s1.addParam('wmode','opaque');
s1.addParam('flashvars','file=<?php echo("/movies/".$this->p->id);?>.xml&playlist=bottom&frontcolor=cccccc&lightcolor=20ac00&skin=/includes/js/skins/stylish.swf&backcolor=111111&playlistsize=100');
s1.write('preview');
</script>
</div>
</center>
First, you need to register at google maps to have a key for your site. This is done at: http://code.google.com/apis/maps/signup.html Having the api key, lets see how to implement the code. First, you have to define 2 new extra fields in hp this way: Code:
Caption Field Name Type Latitude lat One Line Textbox Longitude lon One Line Textbox To discover the property's coordinates, use a map like the one I have at www.vivaemfloripa.com.br/map/ In the status bar below the map, there are 2 fields. The first shows the coordinates in format DD:MM:SS.S dinamically. The second will show the coordinates in format DD.MMMMMMMM (used by google maps) when you click the left button of your mouse, so you can copy/paste the coordinates (eventually, I'll put the code for this map here, at this forum). Now, just put the code below where you want to show the map for your property. Note that, if the coordinates are not defined (are empty), the map is not shown. Code:
$address = '';
if ((trim($this->p->lat)!="") && (trim($this->p->lon)!=""))
{
$address = $this->p->lat.",".$this->p->lon;
?>
<div>
<div id="gmap" style="width:480px; height:360px; margin-left: auto; margin-right: auto;">Loading Map...</div>
<script type= "text/javascript"
src="http://maps.google.com/maps?file=api&v=2.x&key=GOOGLEAPIKEY">
</script>
<script type= "text/javascript">
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_SATELLITE_MAP);
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Sorry! Locatio Error!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
</script>
</div>
REMEMBER: backup your original file Allways!!!! My final code for the file /components/com_hotproperty/views/property/tmpl/default.php is: Code:
<?php
defined('_JEXEC') or die('Restricted access');
global $hp_imgdir_thumb, $hp_imgdir_standard, $hp_currency, $hp_imgsize_thumb, $hp_img_noimage_thumb, $hp_imgdir_agent, $hp_show_agentdetails, $hp_show_enquiryform, $hp_thousand_sep, $hp_dec_point, $hp_link_open_newwin, $hp_show_moreinfo, $hp_use_companyagent, $hp_dec_string, $hp_thousand_string;
global $hp_show_pdficon, $hp_show_printicon, $hp_show_emailicon;
global $Itemid;
?>
<div id="con_hp1">
<div id="heading_Prop">
<a href="<?php echo JRoute::_('index.php?option=com_hotproperty'); ?>"><?php echo JText::_('Pathway Main') . ' ' . JText::_('>') . ' '; ?></a> <a href="<?php echo JRoute::_('index.php?option=com_hotproperty&view=type&id=' . $this->p->typeid); ?>"><?php echo $this->p->type . ' ' . JText::_('>') . ' '; ?> </a> <?php
# Show edit icon for authorized agent
if ($this->p->user == $this->user->id && $this->p->user > 0 && $this->user->id > 0)
{ ?>
<a href="<?php echo JRoute::_('index.php?option=com_hotproperty&view=property&task=edit&id=' . $this->p->id); ?>" title="<?php echo JText::_('Edit'); ?>" class="actionlink"><?php echo JText::_('Edit'); ?></a><?php
}
echo $this->p->name." > ID: ".$this->p->id;
?>
</div>
<div id="hp_icons"><?php
if($this->print)
{
?><a href="#" onclick="javascript:window.print(); return false" title="<?php echo JText::_( 'Print' );?>"><img src="<?php echo JURI::root();?>/images/M_images/printButton.png" border="0" alt="<?php echo JText::_( 'Print' );?>" /></a><?php
}
else
{
if ($hp_show_pdficon && !$this->pop)
{
/*
?><a href="javascript:void window.open('<?php echo JURI::root(); ?>/components/com_hotproperty/pdf.php?id=<?php echo $this->p->id; ?>', 'win2', 'status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no');" title="<?php echo JText::_( 'PDF' );?>"><img src="<?php echo JURI::root();?>/images/M_images/pdf_button.png" border="0" alt="<?php echo JText::_( 'PDF' );?>" /></a><?php
*/
?><a href="javascript:void window.open('<?php echo $this->linkPdf; ?>', 'win2', 'status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no');" title="<?php echo JText::_( 'PDF' );?>"><img src="<?php echo JURI::root();?>/images/M_images/pdf_button.png" border="0" alt="<?php echo JText::_( 'PDF' );?>" /></a><?php
}
if ($hp_show_printicon)
{
?><a href="javascript:void window.open('<?php echo JURI::root(); ?>/index2.php?option=com_hotproperty&view=property&id=<?php echo $this->p->id; ?>&print=1&tmpl=1', 'win2', 'status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no');" title="<?php echo JText::_( 'Print' );?>"><img src="<?php echo JURI::root();?>/images/M_images/printButton.png" border="0" alt="<?php echo JText::_( 'Print' );?>" /></a><?php
}
if ($hp_show_emailicon && !$this->pop)
{
?><a href="javascript:void window.open('<?php echo $this->linkEmail; ?>', 'win2', 'width=400,height=300,menubar=yes,resizable=yes');" title="<?php echo JText::_( 'E-mail' );?>"><img src="<?php echo JURI::root();?>/images/M_images/emailButton.png" border='0' alt="<?php echo JText::_( 'E-mail' ); ?>" /></a><?php
}
}
?>
</div>
<?php
JHTML::stylesheet('tabs.css','components/com_hotproperty/views/property/tmpl/');
jimport('joomla.html.pane');
$pane = &JPane::getInstance('tabs');
echo $pane->startPane('test-tabs');
echo $pane->startPanel( 'Fotos', 'panel1' );
?>
<div id="hp_view_standard_photo_con1">
<div id="hp_view_standard_photo_con2" class="text-align: center">
<div id="hp_view_standard_photo_con3" class="text-align: center">
<?php
$filename = './xml/'.$this->p->id.'.xml';
if ( !file_exists($filename))
{
$somecontent='<?xml version="1.0" encoding="ISO-8859-1" ?>'."\n";
$somecontent=$somecontent.'<playlist version="1" xmlns="http://xspf.org/ns/0/">'."\n";
$somecontent=$somecontent."\t".'<trackList>'."\n\n";
if (!empty($this->images))
{
foreach($this->images AS $image)
{
$somecontent=$somecontent."\t\t".'<track>'."\n";
$somecontent=$somecontent."\t\t\t<title>".$image->title."</title>\n";
$somecontent=$somecontent."\t\t\t".'<creator>Sérgio de Aguiar</creator>'."\n";
$somecontent=$somecontent."\t\t\t<location>".JURI::root().$hp_imgdir_standard.DS.(($image->standard <> '') ? $image->standard : $hp_img_noimage_thumb).'</location>'."\n";
$somecontent=$somecontent."\t\t".'</track>'."\n\n";
}
$somecontent=$somecontent."\t".'</trackList>'."\n";
$somecontent=$somecontent.'</playlist>';
touch($filename) or die("Unable to create: " . $filename);
$handle = fopen($filename, 'a') or die("Could not open file: " . $filename . "\n");
fwrite($handle, $somecontent) or die("Could not write to file: " . $filename . "\n");
fclose($handle);
}
}
?>
<div id="flashcontainer"></div>
<embed
src="/includes/js/imagerotator.swf"
width="400"
height="300"
allowscriptaccess="always"
flashvars="file=<?php echo($filename); ?>&transition=blocks&shuffle=false&repeat=true&transition=random" />
</div>
</div>
</div>
<?php
echo $pane->endPanel();
echo $pane->startPanel( 'Detalhes do Imóvel', 'panel2' );
?>
<div class="hp_view_details">
<?php
foreach($this->p as $key => $value)
{
// if ( array_key_exists($key,$this->fields) && ($key <> 'name' && $key <> 'suburb' && $key <> 'state' && $key <> 'postcode' && $key <> 'country' && $this->fields[$key]->iscore == 1) ){
if ( array_key_exists($key,$this->fields) && !in_array($key,array('name','suburb','state','postcode','country')) )
{
if ($key=="address")
{
if (!$this->fields['address']->hideCaption)
{ ?>
<span class="hp_caption"><?php echo $this->fields['address']->caption; ?></span>:<br />
<?php
} ?>
<div id="hp_view_addr">
<?php
if (trim($this->p->address)!="")
{
echo $this->p->address . '<br />';
}
if ((trim($this->p->suburb)!='') && (trim($this->p->state)!='') && (trim($this->p->postcode)!=''))
{
echo $this->p->suburb . ', ' . $this->p->state . ', ' . $this->p->postcode . '<br />';
}
elseif ((trim($this->p->suburb)!='') && (trim($this->p->state)!=''))
{
echo $this->p->suburb . ', ' . $this->p->state . '<br />';
}
elseif ((trim($this->p->suburb)!='') && (trim($this->p->postcode)!=''))
{
echo $this->p->suburb . ', ' . $this->p->postcode . '<br />';
}
elseif ((trim($this->p->state)!='') && (trim($this->p->postcode)!=''))
{
echo $this->p->state . ', ' . $this->p->postcode . '<br />';
}
elseif ((trim($this->p->state)!=''))
{
echo $this->p->state . '<br />';
}
elseif ((trim($this->p->suburb)!=''))
{
echo $this->p->suburb . '<br />';
}
elseif ((trim($this->p->postcode)!=''))
{
echo $this->p->postcode . '<br />';
}
if (trim($this->p->country)!='')
{
echo $this->p->country . '<br />';
}
?>
</div>
<?php
} // End if (address)
if ($key=="price")
{
if (isset($this->fields['price']))
{
if (!$this->fields['price']->hideCaption) { ?><span class="hp_caption"><?php echo $this->fields[$key]->caption; ?>: </span> <?php }
echo "<span class=\"hp_price\">".$this->fields["price"]->prefix_text.$hp_currency." ".number_format($this->p->price, $hp_dec_point, $hp_dec_string, ($hp_thousand_sep) ? $hp_thousand_string:'').$this->fields["price"]->append_text. "</span><br /> ";
}
} // End if (price)
elseif ($key=="type")
{
if (isset($this->fields['type']))
{
if (!$this->fields['type']->hideCaption)
{
?><span class="hp_caption"><?php echo $this->fields[$key]->caption; ?>: </span><?php
}
echo $this->p->type." <br /> ";
}
} // End if (type)
elseif ($key=="intro_text")
{
if ($this->p->intro_text)
{
if (!$this->fields['intro_text']->hideCaption) { ?><span class="hp_caption"><?php echo $this->fields[$key]->caption; ?>: </span><?php } ?>
<p id="hp_view_intro_text"><?php echo $this->p->intro_text; ?></p>
<?php
}
} // End if (intro_text)
elseif ($key=="full_text")
{
if ($this->p->full_text)
{
if (!$this->fields['full_text']->hideCaption)
{ ?>
<span class="hp_caption"><?php echo $this->fields[$key]->caption; ?>: </span><?php
} ?>
<p id="hp_view_full_text"><?php echo $this->p->full_text; ?></p>
<?php
}
} // End if (full_text)
elseif ($key == "featured")
{
if (!$this->fields[$key]->hideCaption)
{
echo '<span class="hp_caption">'.$this->fields[$key]->caption."</span>: ";
}
echo $this->fields[$key]->prefix_text . ( ($value == '1') ? JText::_( 'Yes' ) : JText::_( 'No' ) ) . $this->fields[$key]->append_text . "<br />";
} // End if (featured)
elseif ($key <> 'address' && $value != '')
{
if (!$this->fields[$key]->hideCaption)
{ ?>
<span class="hp_caption"><?php echo $this->fields[$key]->caption; ?>: </span><?php
}
if ($this->fields[$key]->field_type == "checkbox" || $this->fields[$key]->field_type == "selectmultiple")
{
# Generate list
$olist = explode("|",$value);
echo "<ul class=\"olist\">\n";
foreach ($olist AS $ol) {
echo "<li>".$ol."</li>\n";
}
echo "</ul>\n";
}
elseif($this->fields[$key]->field_type == "link")
{
// Evaluate mambot style data
$value = str_replace( '{property_id}', $this->p->id, $value );
$value = str_replace( '{type_id}', $this->p->typeid, $value );
$value = str_replace( '{agent_id}', $this->p->agentid, $value );
$value = str_replace( '{company_id}', $this->p->companyid, $value );
$value = str_replace( '{Itemid}', $Itemid, $value );
echo $this->fields[$key]->prefix_text;
$link = explode("|",$value);
if (count($link) == 1 && ( substr(trim($link[0]),0,4) == "http" || substr(trim($link[0]),0,5) == "index" ) )
{
?><a <?php echo ($hp_link_open_newwin) ? 'target="_blank" ': ''; ?>href="<?php echo $link[0]; ?>"><?php echo $link[0]; ?></a><?php
}
elseif (count($link) > 1 && ( substr(trim($link[1]),0,4) == "http" || substr(trim($link[1]),0,5) == "index" ) )
{
?><a <?php echo ($hp_link_open_newwin) ? 'target="_blank" ': ''; ?>href="<?php echo $link[1]; ?>"><?php echo $link[0]; ?></a><?php
}
else
{
echo $value;
}
echo $this->fields[$key]->append_text."<br />";
}
else
{
echo $this->fields[$key]->prefix_text.$value.$this->fields[$key]->append_text."<br />";
}
}
} // End if
} // End foreach
?>
<br class="clearboth" />
</div>
<?php
echo $pane->endPanel();
?>
<?php
if (file_exists("./movies/".$this->p->id.".xml"))
{ ?>
<?php
echo $pane->startPanel( 'Video', 'panel3' );
?>
<center>
<div>
<script type='text/javascript' src='/includes/js/swfobject.js'></script>
<div id='preview'>This div will be replaced</div>
<script type='text/javascript'>
var s1 = new SWFObject('/includes/js/player.swf','ply','380','417','9','#ffffff');
s1.addParam('allowfullscreen','false');
s1.addParam('allowscriptaccess','always');
s1.addParam('autoscroll','false');
s1.addParam('wmode','opaque');
s1.addParam('flashvars','file=<?php echo("/movies/".$this->p->id);?>.xml&playlist=bottom&frontcolor=cccccc&lightcolor=20ac00&skin=/includes/js/skins/stylish.swf&backcolor=111111&playlistsize=100');
s1.write('preview');
</script>
</div>
</center>
<?php
echo $pane->endPanel();
} ?>
<?php
echo $pane->startPanel( 'Corretor', 'panel4' );
?>
<?php if ($hp_show_agentdetails && $hp_use_companyagent)
{ ?>
<div id="hp_view_agent_title"><?php echo JText::_('Agent Title'); ?></div>
<div id="hp_view_agent_con">
<?php
echo $this->loadTemplate('agent');
?>
</div>
<?php
} ?>
<?php
echo $pane->endPanel();
echo $pane->startPanel( 'Contato', 'panel5' );
?>
<?php if ($hp_show_enquiryform && !$this->print)
{ ?>
<br class="clearboth" />
<div id="hp_view_agent_contact"><?php echo JText::_('Send enquiry / Make an appointment'); ?></div>
<div id="hp_emailform_con">
<?php echo $this->loadTemplate('contact'); ?>
</div>
<?php
}
if ($this->pop)
{
?>
<center><a href='javascript:window.close();'><span class="small"><?php echo JText::_('Close');?></span></a></center>
<?php
} ?>
<?php
echo $pane->endPanel();
echo $pane->endPane();
?>
<?php
$address = '';
if ((trim($this->p->lat)!="") && (trim($this->p->lon)!=""))
{
$address = $this->p->lat.",".$this->p->lon;
?>
<div>
<br>
<b>Localização do imóvel:</b>
<br>
<div id="gmap" style="width:480px; height:360px; margin-left: auto; margin-right: auto;">Carregando Mapa...</div>
<script type= "text/javascript"
src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAlFVvwx3CoF5SNVcDkK_d_BRs9X2nbm7VOoWSAyihS9Fb5lEgdxT6t9Q4T3Zt3EtIFZIMmUpovnngBw">
</script>
<script type= "text/javascript">
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_SATELLITE_MAP);
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Desculpe! Erro de localização!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
</script>
</div>
<?php
}
?>
</div>
Cheers to all. Sergio |
|
#2
11-06-2008, 10:46 PM
|
|||
|
|||
|
IE7 and IE6 error
I implemented the tabs in Hot Property as instructed in the tutorial. One of the tabs has the Jeroen Wijering FLV Mediaplayer, in FF it appears/plays well but in IE6/7 I got the error alert that the page cannot be loaded...etc.
Do I put the player in the same property (also in the default.php) but not inside the tabs: it works fine. Anyone any idea? Thanks. |
|
#3
11-06-2008, 11:13 PM
|
|||
|
|||
|
Quote:
Try to embed the player and not use javascript: Code:
<embed
src="/includes/js/player.swf"
width="380"
height="417"
allowfullscreen="false"
flashvars="file=<?php if(file_exists('./movies/'.$this->p->id.'.xml')){echo('/movies/'.$this->p->id).'.xml';}else{echo('/movies/nomovie.flv');}?>&playlist=bottom&playlistsize=100"
/>
Code:
<embed src="/includes/js/imagerotator.swf" width="400" height="300" allowfullscreen="false" flashvars="file=<?php echo($filename); ?>&autostart=true&transition=random&screencolor=FFFFFF" /> At Jeroen Wijering FLV Mediaplayer's page, there are several examples of use and they explain all variables used. Hope this helps. Sergio |
|
#4
11-07-2008, 12:10 AM
|
|||
|
|||
|
Problem solved!
Hi Sergio,
Thanks a lot for the quick solution. The embedding did it! Though I had to change the path into document relative like this: <embedAlso I mean the path of: includes and movies: /includes/js/palyer.swf -> ./includes/js/palyer.swf and the same for /movies/ -> ./movies/ Only then it works for my site. Greetings, Rein |
|
#5
11-07-2008, 06:52 PM
|
|||
|
|||
|
Another question
I have just another problem for IE6 concerning the Google Map.
It works fine in Firefox and IE7, but not in IE6. The same here as with the VLF mediaplayer: using the tabs and putting the code inside a tab -> results in not loading the map in the property page. Putting the code outside the tabs, but still in the default.php -> it works and the correct functionality of the map is showing. The same problem with Javascript here? Should it been done with EMBED? And what would be the code then? Thanks a lot. Greetings Rein |
|
#6
11-07-2008, 09:01 PM
|
|||
|
|||
|
Quote:
Try to embed this also. For the google maps, I had a problem with it regarding IE (in my case I just tested with IE 7). The map was loading but missing some or most of it. This is a bug of IE. To solve this problem (the missing parts of map in IE), after several searches in google maps forum, I got it working adding this code: Before the code (to wait IE to load the page, before loading the map) Code:
window.onload Code:
map.checkResize(); Code:
<script type= "text/javascript">
window.onload=function()
{
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_NORMAL_MAP);
map.addControl(new GOverviewMapControl(new GSize(100,250)));
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
map.checkResize();
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Desculpe! Erro de localização!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
}
</script>
Please, let me know if it worked. Sergio |
|
#7
11-08-2008, 04:51 AM
|
|||
|
|||
|
For IE6: yes, but misformed map
Hi Sergio,
Thanks again for your help. Well... it worked and.. it didn't  What worked: the Google map now appears in IE6 (and IE7 and Firefox) and even within the tabs, so that's OK What goes wrong? Within the tabs: In IE6/7 and in FF: The maps of Google are not positioned right, not centered in the frame (480x360px) but positioned to the left side of the frame and I don't even succeed in dragging it (with the crosshair) to the centre. A little bit: OK, but dragging it where it should be: it jumps back to the left. Renewing (F5) doesn't affect anything. Outside the tabs: 100% OK. So.. I am sorry, but it didn't turned out well completely. Greetings, Rein Last edited by r.herder; 11-08-2008 at 04:57 AM. |
|
#9
11-08-2008, 05:18 AM
|
|||
|
|||
|
Quote:
This is the new code, included copy/paste of the above javascript (also with your lat/lon and my own Google Maps key) into my code: ============= Code:
<?php $address = '';
if ((trim($this->p->lat) != "") && (trim($this->p->lon) != "")) {
$address = $this->p->lat . "," . $this->p->lon;
} ?>
<div>
<div id="gmap" style="width:480px; height:360px; margin-left: auto; margin-right: auto;">Laden van de map...</div>
<script type= "text/javascript"
src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAApKeHQsON_bscIBA0E8UoLRSrZbErunprhBgaRXGIwkgiIZgixBSXWvwtRuDKSu46tREqjluK-shwig">
</script>
<script type= "text/javascript">
window.onload=function()
{
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_NORMAL_MAP);
map.addControl(new GOverviewMapControl(new GSize(100,250)));
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
map.checkResize();
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Desculpe! Erro de localização!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
}
</script>
</div>
Greetings, Rein |
|
#10
11-08-2008, 07:13 AM
|
|||
|
|||
|
My friend:
This behaviour seems to be caused by some incompatibility of google maps when it's below others elements. Let's try to remove the enclosing divs (the <div> at the start of the code and the </div> at the end. Also remove the margin-left: auto; margin-right: auto; from the map's div. So, the code will be: Code:
<?php $address = '';
if ((trim($this->p->lat) != "") && (trim($this->p->lon) != "")) {
$address = $this->p->lat . "," . $this->p->lon;
} ?>
<div id="gmap" style="width:480px; height:360px;">Laden van de map...</div>
<script type= "text/javascript"
src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAApKeHQsON_bscIBA0E8UoLRSrZbErunprhBgaRXGIwkgiIZgixBSXWvwtRuDKSu46tREqjluK-shwig">
</script>
<script type= "text/javascript">
window.onload=function()
{
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_NORMAL_MAP);
map.addControl(new GOverviewMapControl(new GSize(100,250)));
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
map.checkResize();
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Desculpe! Erro de localização!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
}
</script>
If this don't work I'm afraid that you'll have to use it out of the tabs. Sergio |
|
#11
11-09-2008, 12:55 AM
|
|||
|
|||
|
Thank you very much, Sergio!
I have implepented Gmaps as you described and it works well! You can see it right here: http://www.est8.ru/component/hotprop...=property&id=6 The only thing, I can not understand is how can I ceep the "lat" & "lon" fields hidden in frontend and working Gmaps at the same time!) I mean, that if I hide this fields an error occured:"Desculpe! Erro de localização!" - actually I don't know what it means  , but I believe that it's something about lat and lon variebles, that are used in $address and not found by the script. I see, that on your site there are none of this, but script works fine, so what should I do?) How can I get rid of Latitude and Longtitude on my property page without having a non working gmap? Best reguards! |
|
#12
11-09-2008, 02:02 AM
|
|||
|
|||
|
Quote:
The error "Desculpe! Erro de localização!" means "Sorry! Location Error!". This happens because the hp's hidden fields can't be accessed in font end. What I have done, in my new implementation at my site, is to manipulate all fields and show only those I want to show in front end. For that, I have to modify the template code, located at /components/com_hotproperty/views/property/tmpl/default.php As an example, to show the suburb: Code:
<tr> <td valign="top" class="smaller"><b>Bairro:</b></td> <td class="smaller"><?php echo $this->p->suburb ?></td> </tr> PS: In the file above, at line 169 (in my listig) where there is the code: Code:
elseif ($key <> 'address' && $value != '') {
Code:
elseif ($key <> 'address' && $key <> 'lat' && $key <> 'lon' && $value != '') {
If you want to test this, backup your file before. Sergio Last edited by ssaguiar; 11-09-2008 at 02:13 AM. |
|
#13
11-09-2008, 04:24 AM
|
|||
|
|||
|
Quote:
I tried it several times yesterday and today with several different div code. But unfortunately I can't get it alright. So it seems that the only thing to do is: putting it after the last tab. O.. when putting it in the very first tab: it works 100% OK. But that's no real option, because that's the tab where the estate photo's (flashshow or whatever) belongs. Anyway.. you have done all to help.. great!! Thank you so much. Greetings, Rein |
|
#14
11-09-2008, 04:40 AM
|
|||
|
|||
|
Quote:
========= Hi Sergio, I just tested this code (see above) and it worked fine. The lat/lon fields are gone in the property description. Yet the Gmaps is 100% OK. I also keep using this now, for I disliked the fields too. So.. thanks again. Bye for now, Rein |
|
#15
11-11-2008, 12:46 AM
|
|||
|
|||
|
Hi,
Just a quick question. Is the address shown on gmaps is dynamic like when you create a property with address, does it show the address on gmap or it just takes the default address (which is mentioned in default.php with latitude etc) and show s the default address all the time? |
|
#16
11-11-2008, 03:13 AM
|
|||
|
|||
|
The adress in the default.php is the default adress and will be shown on the gmap whenever the script could not find an adress inputted in the property fields. The adress is best shown when you make a latitude and longitude field as described in the tutorial HP 1.0. Of course you have to fill the lon/lat fields with a value: something as latitude: 53.168212 and longitude 5.971885.
But do read the tutorial! Gr.Rein |
|
#17
11-11-2008, 03:32 AM
|
|||
|
|||
|
Quote:
If there is an error when trying to geolocate using these fields, it will use the default latitude and longitude in the javascript code (use your location's default latitude/longitude). I don't use the address to find the location because it will work most of the times but not all the times (sometimes I got a location in USA for a property that was here, in my city). This is why I created the extra fields and use them. To find the location's coordinates, you can use a gps, but it's easier to use a google maps to do this. I implemented one of these that I use to find the latitude/longitude. You can find it at: www.vivaemfloripa.com.br/map To use it: When moving the cursor, you'll see that, in the bottom fields, there is one that shows the latitude/longitude in DD:MM:SSS format. When you are oer the local you need to have the latitude/longitude in google maps format, just press the left button of you mouse and the coordinates will be shown in the bottom second field and will remain there untill you press the mouse button again. With this, you can copy/paste the coordinates. If the administrators of the forum allow me, i can post the code for this utility page here, so everybody can have it free. Sergio |
|
#18
11-12-2008, 10:23 AM
|
|||
|
|||
|
Quote:
that is a very neat implementation of the hack! I still have problem with the imagerotater gallery of the hack. mind sharing part of the code you have? |
|
#19
11-12-2008, 10:28 AM
|
|||
|
|||
|
ssaguair,
I like the tabless look on your site http://www.vivaemfloripa.com.br/inde...property&id=14 Do you use table for it? also, how did you make the front page like this? http://www.vivaemfloripa.com.br/ with the listings and property type index. I can only see those in my page /component/hotproperty/ Last edited by kho; 11-12-2008 at 02:45 PM. |
|
#20
11-12-2008, 03:44 PM
|
|||
|
|||
|
Quote:
Yes, I use a table-based layout. I have done an extensive modification of the hp's original layout. I have also put the advanced search form in front page. The rss feed (in my ront page) send the property details and also a picture of each of them (thumbnail) - to test it, go to my personal site (www.ssaguiar.com) and click in the menu 'Imoveis'. It will present another page that is made dynamically, reading the feed from vivaemfloripa.com.br. The contact form have more fields (one that let you send a copy of the e-mail to a friend) and the e-mail is sent formated in html with a thumbnail of the property. If you want, you can test it. Just use the form to send an e-mail to me from any property (don't worry I will not use your e-mail to spam). I also modified the front page's listing format. Sergio |
|
#21
11-27-2008, 07:46 AM
|
|||
|
|||
|
one question.
how come your google map looks different from what I have. you have this mini navigator on your google map. how do i enable that one? -------- another question. how to hide the Longitude and Latitude coordinate to be shown when the listing is viewed? Last edited by kho; 11-27-2008 at 08:30 AM. |
|
#22
11-27-2008, 08:12 AM
|
|||
|
|||
|
Quote:
Actually, I just use the latitude/longitude fields. The new code is: Code:
<?php
$address = '';
if ((trim($this->p->lat)!="") && (trim($this->p->lon)!=""))
{
$address = $this->p->lat.",".$this->p->lon;
?>
<div id="gmap" style="width:764px; height:300px; margin-left: auto; margin-right: auto;">Carregando Mapa...</div>
<script type= "text/javascript"
src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAlFVvwx3CoF5SNVcDkK_d_BRs9X2nbm7VOoWSAyihS9Fb5lEgdxT6t9Q4T3Zt3EtIFZIMmUpovnngBw">
</script>
<script type= "text/javascript">
window.onload=function()
{
_mPreferMetric=true;
var map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(-27.598368868573615,-48.56523513793945);
map.setCenter(start, 10);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());
map.addMapType(G_PHYSICAL_MAP);
map.setMapType(G_NORMAL_MAP);
map.addControl(new GOverviewMapControl(new GSize(100,250)));
var geocoder = new GClientGeocoder();
geocoder.getLocations("<?php echo $address; ?>", addToMap);
map.checkResize();
function addToMap(response)
{
map.clearOverlays();
if (!response || response.Status.code != 200)
{
alert("Desculpe! Erro de localização!: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 14);
marker = new GMarker(point);
map.addOverlay(marker);
}
}
}
</script>
<?php
}
?>
Code:
map.addControl(new GOverviewMapControl(new GSize(100,250))); And, to show the satellite view as default: Code:
map.setMapType(G_SATELLITE_MAP); Normal map: G_NORMAL_MAP Stellite view: G_SATELLITE_MAP Hybrid map (both the aboves - satellite with main streets names): G_HYBRID_MAP My best regards. Sergio |
|
#25
11-28-2008, 08:26 AM
|
|||
|
|||
|
Quote:
Eu não sei se vai ser possível pois não tenho este módulo (ou extensão, não sei). Se eu conseguir um destes, vou fazer um teste. Acho que não vai ter problemas, apenas devemos ver se a lista das imagens pode ser gerada dinamicamente. Sérgio Dear friend: I don't know if we can implement the gallery im my mods using the yoogallery module (or extension, I don't know). If I can get one of these, i can test it. I think that there will be no problem, we only need to know if the images list can be generated dynamically. Sergio |
|
#28
12-02-2008, 08:02 PM
|
|||
|
|||
|
sergio, my google maps is different when viewed in IE and Firefox.
the looks in firefox is the correct one. in IE, it doesn't go to the coordinate given. but it did show part of the map. how do i fix it? here is my code site link Code:
/*Finally, let's show the location in a map, using the google maps*/
echo $pane->startPanel( 'Location Map', 'panel5' );
?>
<div>
<div width="500" class="background-color: transparent;">
<div id="gmap" style="width:500; height:360px;">Loading Map...</div>
<?php
$address = '';
$address1 = '';
/*
Let's see if the latitude and longitude contains data (It's the best way to
geocode - address sometimes doesn't work and even get you to the wrong place).
*/
if (trim($this->p->lat)!="")
{
if (trim($this->p->lon)!="")
{
$address = $address1.$this->p->lat.",".$this->p->lon;
}
}
else
{
/*
If we don't put data in latitude/longitude, let's try to geocode using
address fields (there is, in my case, an extra field called endereco - you
can discard it and remove next line, if you want. It exists but I am not
using it at present moment).
*/
if (trim($this->p->endereco)!="") $address1 = $address1.$this->p->endereco;
if (trim($this->p->suburb)!="") $address1 = $address1." ".$this->p->suburb;
if (trim($this->p->address)!="") $address1 = $address1." ".$this->p->address ;
//if (trim($this->p->postcode)!="") $address1 = $address1." ".$this->p->postcode;
if (trim($this->p->state)!="") $address1 = $address1." ".$this->p->state;
if (trim($this->p->country)!="") $address1 = $address1." ".$this->p->country;
$address = $address1;
}
/*
Now, let's create the map. First thing, the api's key for your site. Change to match your
site's key.
*/
?>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAbksnFMtABufQfNhqPXixthRaeR2CFVKRQYffTNBMmQSiEopo0xSlynS1ykqpTCMx4Oxd8WZikGI4GQ"
type="text/javascript"></script>
<script type="text/javascript">
//alert ("<?php echo $address; ?>");
_mPreferMetric=true;
map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(1.558073,110.351543);
map.setCenter(start, 16);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addMapType(G_PHYSICAL_MAP);
map.enableGoogleBar();
var marker = new GMarker(start);
var geocoder = new GClientGeocoder();
//alert("<?php echo $address ?>");
geocoder.getLocations("<?php echo $address; ?>", addToMap);
<?php
/*
Now, the fun stuff.
I have, for every property, a movie file, in flash format (.flv).
If the file don't have a corresponding movie file, then I have a file called 'nomovie.flv' to show instead.
The files are located at /movies/
Each file has the name composed as the property id's + '.flv'
*/
?>
function addToMap(response)
{
map.clearOverlays();
//alert('<?php echo("/movies/".$prop[0]->id.".flv");?>');
if (!response || response.Status.code != 200)
{
alert("Address Not Found: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
/*
Test to see if the country code is correct, otherwise show a fixed point.
This is used only when the geocoding is made using address because sometimes
it will return a mark even outside your country (in my case, sometimes it
returned a mark in USA!
*/
if (place.AddressDetails.Country.CountryNameCode == "MY")/*Change to match your country code.*/
{
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 16);
marker = new GMarker(point);
marker.bindInfoWindow('<object width="200" height="180"><embed src="/includes/js/mediaplayer.swf" width="200" height="180" allowscriptaccess="always" allowfullscreen="false" flashvars="file=<?php if (file_exists("movies/".$this->p->id.".flv")){echo("/movies/".$this->p->id);}else{echo ("/movies/nomovie");}?>.flv&autostart=false&searchbar=false" /></object>');
map.addOverlay(marker);
}
else
{
var start = new GLatLng(1.528782,110.357666);/*Change to show your fixed point.*/
map.setCenter(start, 16);
}
}
}
</script>
</div>
</div>
Last edited by kho; 12-02-2008 at 08:23 PM. |
|
#29
12-02-2008, 10:02 PM
|
|||
|
|||
|
My friend:
This is due to a bug inIE. Try this, put your map code between: Code:
window.onload=function()
{
}
Code:
window.onload=function()
{
//alert ("<?php echo $address; ?>");
_mPreferMetric=true;
map = new GMap2(document.getElementById("gmap"), {draggableCursor:"crosshair"});
var start = new GLatLng(1.558073,110.351543);
map.setCenter(start, 16);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addMapType(G_PHYSICAL_MAP);
map.enableGoogleBar();
var marker = new GMarker(start);
var geocoder = new GClientGeocoder();
//alert("<?php echo $address ?>");
geocoder.getLocations("<?php echo $address; ?>", addToMap);
<?php
/*
Now, the fun stuff.
I have, for every property, a movie file, in flash format (.flv).
If the file don't have a corresponding movie file, then I have a file called 'nomovie.flv' to show instead.
The files are located at /movies/
Each file has the name composed as the property id's + '.flv'
*/
?>
function addToMap(response)
{
map.clearOverlays();
//alert('<?php echo("/movies/".$prop[0]->id.".flv");?>');
if (!response || response.Status.code != 200)
{
alert("Address Not Found: <?php echo $address ?>");
}
else
{
place = response.Placemark[0];
/*
Test to see if the country code is correct, otherwise show a fixed point.
This is used only when the geocoding is made using address because sometimes
it will return a mark even outside your country (in my case, sometimes it
returned a mark in USA!
*/
if (place.AddressDetails.Country.CountryNameCode == "MY")/*Change to match your country code.*/
{
point = new GLatLng(place.Point.coordinates[1],place.Point.coordinates[0]);
map.setCenter(point, 16);
marker = new GMarker(point);
marker.bindInfoWindow('<object width="200" height="180"><embed src="/includes/js/mediaplayer.swf" width="200" height="180" allowscriptaccess="always" allowfullscreen="false" flashvars="file=<?php if (file_exists("movies/".$this->p->id.".flv")){echo("/movies/".$this->p->id);}else{echo ("/movies/nomovie");}?>.flv&autostart=false&searchbar=false" /></object>');
map.addOverlay(marker);
}
else
{
var start = new GLatLng(1.528782,110.357666);/*Change to show your fixed point.*/
map.setCenter(start, 16);
}
}
}
}
I had this same problem and I gave up. Now I use the map separated (not in tabs) - in reality I don't use tabs anymore, but not because of this - I just changed the look of property page. Let mek now if it works for you. Sergio |
| Thread Tools | Search this Thread |
| Display Modes | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| New Payment How to Tutorial for Mtree 2.0+ | tradewise | 3rd party addons & Custom Jobs | 23 | 05-30-2010 12:11 PM |
Linear Mode
