Sort locations by parent - map view

Ok, so my com_cobalt/fields/geo/tmpl/markers_list/liaa.php file now looks like this:

<?php
/**
 * by MintJoomla
 * a component for Joomla! 3.x CMS ( http://www.joomla.org )
 * Author Website:  http://www.mintjoomla.com/ 
 * @copyright Copyright (C) 2007-2014 MintJoomla ( http://www.mintjoomla.com ). All rights reserved.
 * @license GNU/GPL  http://www.gnu.org/copyleft/gpl.html 
*/

defined('_JEXEC') or die('Restricted access');

$db = JFactory::getDbo();

$query = $db->getQuery(TRUE);
$query->select('value_index, field_value, record_id, field_id');
$query->from('#__js_res_record_values');
$query->where("field_id IN(39,54)");
$query->where('section_id = ' . $this->request->getInt('section_id'));

//if($this->request->getInt('markers', 0))
{
    $section        = ItemsStore::getSection($this->request->getInt('section_id'));
    $model          = JModelLegacy::getInstance('Records', 'CobaltModel');
    $model->section = $section;
    $model->total   = TRUE;

    $sql = $model->getListQuery(TRUE);
    $db->setQuery($sql);
    $ids   = $db->loadColumn();
    $ids[] = 0;
    $query->where("record_id IN (" . implode(',', $ids) . ")");
}

$db->setQuery($query);
$list = $db->loadObjectList();
$out  = array();
foreach($list as $item)
{
    if($item->field_id == 39)
    {
        $out[$item->record_id]['category'] = $item->field_value;
    }

    if($item->field_id == 54)
    {
        if($position->$item === 0)
        {
            continue;
        }

        $val = $item->value_index == 'marker' ?
            JUri::root() . 'components/com_cobalt/fields/geo/markers/' . $this->params->get('params.map_icon_src.dir', 'custom') . '/' . $item->field_value :
            (float)$item->field_value;

        $out[$item->record_id][$item->value_index] = $val;

    }

}

return $out ? $out : 1;

Field ID is from the Asset Type where 39 is the Geo ID and 54 is the child type that the map is displaying.

Making these changes breaks the children displaying on the Collection map. See here:

http://new.michiganwatertrails.org/index.php?option=com_cobalt& ;view=record&id=15:lake-michigan-water-trail-northwest&Itemid=161

Any ideas?

Becaue you misseneterd IDs in if($item->field_id == 39). It should be vice versa.

Look into console what this returns to map request.

Ok, map markers are back. I still have no idea how to display the type icons in a list and sort by type.

See Here:

http://www.michiganwatertrails.org/trail.asp?ait=cv& ;cid=126

See how clicking the type icon on the left under "Show Places on the Map", you can turn on and off that asset type on the map. This is what I am trying to achieve.

graphxks I still have no idea how to display the type icons in a list and sort by type.

By now every marker have to cave property category.

You list all assets through query or juct manually create static HTML if you know all your assets and those are not going to change. Then you add Javascript event for asset name click with will go through all markers of th map and set of them visible some not depending on assets active.

This is in general. I cannot give you working code example.

This is so frustrating as I feel it's close, but I'm not able to follow the changes you have made or the next steps and it feels like maybe Cobalt can't do what is needed. If I could code at this level myself, I would not have purchased the full Cobalt collection.

I'm not the super-genius you are Sergey :-)

Sergey OK. Here is what I added into new 8.183 field with I updated.

There is parameter Marker list processor. This is the file you select from fields/geo/tmpl/markers_list/

So create copy and select it in parameters. Now you have to change it a little and return array with marker category with you can tace vrom select field. Just adds it's value into query.

Now in tha map template in JS find line where drawMarker(ll, k, v.marker); it is 166 here. And pass there your new parameter drawMarker(ll, k, v.marker, v.category);.

Now edit function drawMarker(mPosition, record_id, icon) and change to function drawMarker(mPosition, record_id, icon, cat).

Now just ander marker defined in 188 add new line

var marker = new google<span class="variable">.maps</span><span class="variable">.Marker</span>(mOptions);
marker<span class="variable">.category</span> = cat;

This is phase 1. You added category tag to every marker. So you can search through them and change visibility property acordingly on attraction icon clicked.

Let me try another take on this and maybe someone can help.

Per our discussion, I should now have the array returning with the marker category.

What is Phase 2? How can I search through the markers and change their visiblilty based on the attraction icon clicked? And how do I display the attraction icons on the map TO click?

I think we are really close and if I can get this to work I will stop annoying you :-)

You are not annoying me at all.

I would do this this way. In the very begining of the JS cove I would create markers array variable.

var markersdb = [];

Now when I create marker I push it into array.

var marker = new google.maps.Marker(mOptions);
marker.category = cat;
markersdb.push(marker);

Now in the list of assets when you click let's say you have

<a href="javascript:MapToogleMarkers('asset_id')">Asset Name</a>

Where asset_id is the same as marker.category = cat;.

The only thing left is to add function to JS script part

window.MapToogleMarkers = function(category) {
    $.each(markerdb, function(key, marker){
        if(marker.category == category) {
            marker.setVisible(!marker.getVisible());
        }
    })
}

On each click we inverce visibility of the markers of this asset. Because by our category property we now can identify it. That was the whole purpose we create custom processing file so you could add new properties to markers from other field values.

Something like this. This may not completely work but this should be ennoough to understand mayn idea how this things are usualy done.

Regarding KLM and Trail Collection. If it is another field value when you process markers you can add values of this fields as you added category value and when you list markers you can see if there is KLM or trials you simple add them to map.

Awesome, Thanks so much for your help Sergey. I really appreciate it.

Sergey would do this this way. In the very begining of the JS cove I would create markers array variable.

You are referring to the code in the components/com_cobalt/fields/geo/tmpl/markers_list/ php file?

Sergey

The only thing left is to add function to JS script part

This would be in the Category display template?

I really don't suck this bad at JS, but your code is quite distributed with all the template files and it has me a bit confused. :-)

graphxks

Sergey would do this this way. In the very begining of the JS cove I would create markers array variable.

You are referring to the code in the components/com_cobalt/fields/geo/tmpl/markers_list/ php file?

Yes

Sergey

The only thing left is to add function to JS script part

This would be in the Category display template?

I really don't suck this bad at JS, but your code is quite distributed with all the template files and it has me a bit confused. :-)

Also goes in default_list_map.php in the section of <script>. You add that function there. Because it should ne in the same scope wheer you define markersdb array;

Ok, so now in default_list_liaa_map.php I have the following:

    function drawMarker(mPosition, record_id, icon, cat) {
                var markersdb = [];
        var msize = new google.maps.Size(<?php echo $w; ?>, <?php echo $h; ?>);
        var mpoint = new google.maps.Point(<?php echo round($w / 2);?>, <?php echo $h;?>);
        var markerIcon = new google.maps.MarkerImage(icon, msize, new google.maps.Point(0, 0), mpoint);
        var mOptions = {
            'map': map, 'position': mPosition, icon: markerIcon,
            <?php if($params->get('tmpl_params.map_anim', 1)) "'animation' : google.maps.Animation.DROP," ?>
        };

//  Push marker into array and toggle Map Markers - 7/22/2014

    var marker = new google.maps.Marker(mOptions);
    marker.category = cat;
    markersdb.push(marker);

    window.MapToogleMarkers = function(category) {
        $.each(markersdb, function(key, marker){
            if(marker.category == cat) {
                marker.setVisible(!marker.getVisible());
            }
        })
    }

        google.maps.event.addListener(marker, 'click', function() {

and in the collection.php I have:

      <a href="javascript:MapToogleMarkers('26')">Access to River, Lake or Stream</a></br>
      <a href="javascript:MapToogleMarkers('23')">Beach</a>

and when I run it one of the markers turns on and off with either of the above links pressed, but it's a different one (Hiking Trail)!

window.MapToogleMarkers should be outside of drawMarker.

Did you see console what is category of your markers? Correct result?

Moving the window.MapToogleMarkers function to the bottom of the script area results in:

ReferenceError: markersdb is not defined

if(marker.category == cat) {

1. You should not defin markersdb inside drawMarker() because you simply override main variable defined with empty array.
2. Function window.MapToogleMarkers should be outside of drowMarker but inside main (function($){...}(jQuery)) pattern.

I changed it all. Now code looks ok. But if you look into console you can see that marker category is 15 for every marker.

But un you code IDs are different

And I do not have access to backend to check configuration.

Ok, here are mistakes you made.

1. ID of attraction field is 55 not 54 in com_cobalt/fields/geo/tmpl/markers_list/liaa.php.
2. Second the value of attraction field is a text for you have to <a href="javascript:MapToogleMarkers('Park')">Park</a>

Now basic concept works. You can add some code to mark that markers are checked on not and other.