Access Zoo element data anywhere in Joomla easily

Accessing zoo element data is quite difficult as Zoo stores data in JSON format. Normally you have to execute query on zoo_item table & get element column having JSON data, then decode this data & get record details based on Element Id. This is quite boring work. Lets access Zoo element data easily by calling Zoo API. You can use this code anywhere in Joomla.
You can get an element from an item & if you don't have the item, but the item id. Lets get item first using item id as follows.

$app = App::getInstance('zoo');  // Define Zoo app instance
$item = $app->table->item->get($ITEM_ID); // Zoo Record Id 
We have item now, lets get element. 
$Element_Id = "2c0332af-7c7b-4c85-82f7-4d4b7ff5b030"; // One of the text field element id
$element_value = $item->getElement($Element_Id)->getElementData()->get('value');

// $element_value contains the actual value of element id $Element_Id of item id $ITEM_ID.

I always wonder how flexible this way is as you should know the id of the element & how does zoo stores JSON data for that element.I have to write following line, to get the image path of the record.
$Img_Path = $item->getElement('1e50c141-9d05-4c8d-9c7e-2ce7d07e799f')->getElementData()->get('file');
However this method is completely useless for multiple values of each field. It gives you only first value of the element. You can refer zoo documentation of accessing zoo element here.

Importing all fields using Zoo CSV Importer

I don't know why Zoo skips radio, dropdown fields when it comes to CSV importer/Exporter.
We have used Zoo in our one of the project where we wanted to import records having almost everything from text to radio n dropdown even Related Items Pro fields as well. Lets check how to allow zoo to import Radio, Dropdown first. You should read this blog only if you want to hack some zoo files. You can't override these files.
You have to hack just two files which are as follows

Step 1 : Show all fields in dropdown of fields.
Go to Your Site/administrator/components/com_zoo/views/configuration/tmpl/importcsv.php
Add following the code jQuery snippet.

$('.type').change(function()
{
   
   var type = $(this).val();
   
   jQuery.ajax
   ({ 
   
    type : 'POST',
                url: 'index.php?option=com_import&task=get_cdts_fields&type='+type, 
                dataType : 'json',
                cache : 'false',
                success: function(data)
                {
   if(data)
   {
           $(".assign").append('<optgroup label="'+type+'" id="extra_fields">');
           for (i=0;i<data.length;i++)
           {
             var newarray = data[i].split(",");
             $(".assign").append(new Option(newarray[0], newarray[1])); 
           }
          }
          }
               
    });
   
   
});

Now paste the following function into your custom components controller as it is.

function get_cdts_fields()
{
  
 $config_type = JRequest::getVar('type');
 $file = file_get_contents(JPATH_SITE.DS.'media/zoo/applications/blog/types/'.$config_type.'.config');
 $decode = json_decode($file,true);
   
 $Pro_Fields = array();
 $i=0;
 foreach($decode['elements'] as $k=>$ele)
 {
  if($ele['type'] == "select" || $ele['type'] == "imagepro" || $ele['type'] == "relateditemspro" || $ele['type'] =="radio")
  {
   $Pro_Fields[$i] = $ele['name'].','.$k;
   $i++;
  }
 }
  
 echo json_encode($Pro_Fields); 
 jexit();

}

You can see all fields under selected type option group only if you done step first correctly.
Atlast you can see all fields as option in dropdown. So that you can map fields easily.
Step - II Tell zoo to bind all fields like radio, select etc
Open Your Site/administrator/components/com_zoo/helpers/import.php file & add following cases besides other cases in importCSV function. Make sure you have copy of original file.

case 'select':
case 'radio':
   $ele = array('option'=>array('0' => $data[$column]));
   $elements[$assignment]->bindData($ele);
 
break;


//For Image Pro you can add following case if your using imagepro field

case 'imagepro':
                 
$element_data = array();
$images = explode('|',$data[$column]); // We have used Pipe(|) to separate images from one another.
$i = 0;
foreach($images as $img)
{
 $img_ele[] = array('file'=>$img, 
      'title' => '', 
      'file2' => '',
      'spotlight_effect' => '', 
      'caption' => ''
      );
 $i++;
}
$elements[$assignment]->bindData($img_ele);
break; 

We have imported Related Pro fields as well but its completely hard-coded & client requirement dependent.

How to render zoo records easily

Zoo - one of the most popular Joomla extension has a view which shows just a single record, that is of course full view. Zoo doesn't have a view which shows a list of records of particular submission type. So what if you want to show a list of zoo items of particular type in your extension.
You must be thinking what's the big deal, based on submission id just fetch the records & show it how you want. Wait a minute. Its not as easy as you think as Zoo uses JSON method to store record's which is quite difficult to render zoo elements. So its quite complicated to get zoo items details from database by executing queries.
Even if you manage it won't be robust cause to get related records from table you have to deal with hard coded 36 key string, which zoo uses as field identifier. So lets get away from this hassle.
Here is the snippet to render the details of zoo records quite easily.

$zapp = App::getInstance('zoo');
$items = $app->table->item->all(array('conditions' => 'id = '.$Zoo_Item_id));
//$Zoo_Item_id must be zoo item id of which you want to render details

foreach($items as $item)
{       
   foreach ($item->getElements() as $id => $element)
   {
      echo $element->render();
    
   }
}

Here you can see how we are showing Zoo related records in table. We have added link for full view of respective Zoo Item as well.

How to construct link to edit single zoo record

I'm writing this post because its quite tricky to create a link which edits a zoo record based on zoo item id unless you know how exactly zoo construct hashes.
When we asked on zoo forum they didn't reply with the following solution. I must admit that zoo component is excellent but their support is very poor & you know zoo support is paid! Okay leave it & lets move to the link.
Stop thinking that I'll pass zoo id to the zoo's my submission menu link to create edit record link. What?? have you tried it?? Does it says Hashes did not match. Alright Don't worry you are the right place.
Its very easy, you just need to pass submission type of zoo item & zoo item id itself to the getSubmissionHash API which returns you respective hash for the item.

$zapp = App::getInstance('zoo');
$items = $zapp->table->item->all(array('conditions' => 'id =$zoo_item_id)); 
//$zoo_item_id must be zoo record id which you want to edit.
$type = $items[$item->id]->type;
// get submission type of item
$hashRelated = $zapp->submission->getSubmissionHash(1,$type, $item->id); 
 // Here is the exact hash for the record

$href = JRoute::_(JURI::Base()."index.php?option=com_zoo&view=submission&layout=submission&submission_id=1&type_id=$type&item_id=$item->id&submission_hash=$hashRelated"); // Construct link as zoo 

    
echo '<a href=".$href.">Edit Record</a>'; 

Facebook Comments For Blogspot

My colleague had written some code so that his blog visitors can add comments on his blog post using Facebook account. He told me the procedure but it was not handy cause at the end of every blog post need to paste some code. Y'day at noon i just got bored from daily work & thought of fb commenting came in my mind & searched for something which allows to comment on blog post using Facebook easily. Many times i messed cause nothing was straight forward. Finally i gone through many blogs & done it.
I'm writing this blog post in a simple & easiest way so that bloggers will get it. I have explained in simple words for non developers cause real bloggers are non-developers, i don't mind if developers also check & implement.
Relax guys..! its an easy..! not a big deal. Please go through the following 3 straight forward steps if you want to allow your blog visitors to comment using Facebook account. After all its good idea to let your blog visitors comment using facebook cause now a days every one using fb daily & therefore your blog will get popular on facebook.
1) Do you know how to create facebook app..?
You know then just create a new app & skip this stage. open this link. Click on Create New App button, a popup will appear. Write app name like amol's blog & continue. Enter correct captach, a form will appear. Add blogspot.com infront of 'Add Domains' textbox. Click on 'Website with Facebook Login', Enter your blogs link in 'Site URL' textbox & save changes.
Copy App ID like this 330763300338577.
2) Add meta Tag Click on templates
Click on templates -> Edit HTML. Add following <meta content='YOUR_FACEBOOK_APPLICATION_ID' property='fb:app_id'/>. Replace YOUR_FACEBOOK_APPLICATION_ID with your App id. E.g <meta content='241008529352104' property='fb:app_id'/> Check this image.

3) Add Facebook Comment
Click on templates -> Edit HTML. Find this code <div class='post-footer-line post-footer-line-3'> in template. (Use the keyboard shortcut Ctrl + F). What you didn't find above code. Okay check Expand Widget Templates & again find it. This time you will get it easily. Paste the following code exactly below the above line.

<b:if cond='data:blog.pageType == "item"'>
<div id="fb-root"></div>
<script>
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
<fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/> </b:if>

You can change width & colorscheme for facebook comment box.