Evolution #90: Ajaxsification des actions

app/Resources/translations/elements.fr.yml

   name:
     who:                (envoyé par <a href="%owner_url%">%owner_name%</a>)
     whoandgroup:        (envoyé par <a href="%owner_url%">%owner_name%</a> dans le groupe <a href="%group_url%">%group_name%</a>)
-  link:                 Ouvrir la page d'origine
+  link:                 Ouvrir la page d'origine
+  
+elements:
+  ajax:
+    more:
+      noelements:       Pas d'autres éléments

src/Muzich/CoreBundle/Controller/SearchController.php

 class SearchController extends Controller
 {
   
+  protected function searchElementsMore($elements, $invertcolors)
+  {
+    
+    $end = (($count = count($elements)) < $this->container->getParameter('search_ajax_more'));
+    $html = '';
+    $message = '';
+    if ($count)
+    {
+      $html = $this->render('MuzichCoreBundle:SearchElement:default.html.twig', array(
+        'user'        => $this->getUser(),
+        'elements'    => $elements,
+        'invertcolor' => $invertcolors
+      ))->getContent();
+    }
+    
+    if (!$count || $end)
+    {
+      $message = $this->trans('elements.ajax.more.noelements', array(), 'elements');
+    }
+    
+    return $this->jsonResponse(array(
+      'count'   => $count,
+      'message' => $message,
+      'html'    => $html,
+      'end'     => $end
+    ));
+  }
+  
   /**
    * Procédure de recherche, qui met a jour l'objet de recherche (ainsi
    * que les paramétres en session). 
    * 
    */
-  public function searchElementsAction()
+  public function searchElementsAction($id_limit = null, $invertcolors = false)
   {
     $request = $this->getRequest();
     $search_object = $this->getElementSearcher();
     if ($this->getRequest()->isXmlHttpRequest())
     {
       // template qui apelle doSearchElementsAction 
+      $search = $this->getElementSearcher();
+      $search->update(array(
+        'count'    => $this->container->getParameter('search_ajax_more'),
+        'id_limit' => $id_limit
+      ));
+      $elements = $search->getElements($this->getDoctrine(), $this->getUserId());
+      
+      return $this->searchElementsMore($elements, $invertcolors);
     }
     else
     {
     }
   }
   
+  public function searchElementsShowAction($type, $object_id, $id_limit, $invertcolors)
+  {
+    if ($this->getRequest()->isXmlHttpRequest())
+    {
+      $object = null;
+      $param_id =  '';
+      if ($type == 'user')
+      {
+        $object = $this->getDoctrine()
+          ->getRepository('MuzichCoreBundle:User')
+          ->findOneBy(array('id' => $object_id))
+        ;
+        $param_id = 'user_id';
+      }
+      elseif ($type == 'group')
+      {
+        $object = $this->getDoctrine()
+          ->getRepository('MuzichCoreBundle:Group')
+          ->findOneById($object_id)
+        ;
+        $param_id = 'group_id';
+      }
+
+      if (!$object)
+      { 
+        throw new \Exception('Object Unknow');
+      }
+
+      $search = $this->createSearchObject(array(
+        $param_id  => $object->getId(),
+        'count'    => $this->container->getParameter('search_ajax_more'),
+        'id_limit' => $id_limit
+      ));
+
+      $elements = $search->getElements($this->getDoctrine(), $this->getUserId());
+      
+      return $this->searchElementsMore($elements, $invertcolors);
+    }
+    
+    throw new \Exception('XmlHttpRequest only for this action');
+  }
+  
   /**
    *
    * @param string $string_search 

src/Muzich/CoreBundle/DataFixtures/ORM/LoadElementData.php

     $this->entity_manager->persist($element);
   }
   
+  protected function dateD($ecal)
+  {
+    return date('Y-m-d H:i:s', time() - 60 * 60 *24 * $ecal);
+  }
+  
   public function load($entity_manager)
   {
     $this->entity_manager = $entity_manager;
     $this->createElement('youtube_heretik_1', 'Heretik System Popof - Resistance', 
       'http://www.youtube.com/watch?v=tq4DjQK7nsM',
       $this->getArrayOfTag(array('hardtek')),
-    'youtube.com', $bux, null, '2011-12-10 17:35:07');
+    'youtube.com', $bux, null, $this->dateD(200));
     
     $this->createElement('youtube_dtc_passdrop', 'dtc che passdrop', 
       'http://www.youtube.com/watch?v=2A4buFCp7qM', 
       $this->getArrayOfTag(array('hardtek')),
-    'youtube.com', $bux, null, '2011-12-10 18:35:07');
+    'youtube.com', $bux, null, $this->dateD(199));
     
     $this->createElement('youtube_antroppod_1', 'Antropod - Polakatek', 
       'http://www.youtube.com/watch?v=VvpF3lCh1hk&NR=1', 
       $this->getArrayOfTag(array('hardtek')),
-    'youtube.com', $bux, null, '2011-12-10 19:45:07');
+    'youtube.com', $bux, null, $this->dateD(198));
     
     $this->createElement('youtube_koinkoin_1', 'koinkOin - H5N1', 
       'http://www.son2teuf.org/Voir-details/Sons/Lives/Hardtek-_-Tribe/koinkOin-_-H5N1', 
       $this->getArrayOfTag(array('hardtek', 'electro')),
-    'son2teuf.org', $bux, null, '2011-12-10 21:35:07');
+    'son2teuf.org', $bux, null, $this->dateD(197));
     
     
     $this->createElement('youtube_djfab_1', 'DJ FAB', 
       'http://www.jamendo.com/fr/album/42567', 
       $this->getArrayOfTag(array('hardtek')),
-    'jamendo.com', $jean, null, '2011-11-11 17:35:07');
+    'jamendo.com', $jean, null, $this->dateD(196));
     
     $this->createElement('youtube_djantoine_1', 'dj antoine', 
       'http://www.jamendo.com/fr/album/75206', 
       $this->getArrayOfTag(array('hardtek', 'tribe')),
-    'jamendo.com', $jean, null, '2011-11-11 19:35:07');
+    'jamendo.com', $jean, null, $this->dateD(195));
     
     $this->createElement('youtube_acroyek_1', 'Acrotek Hardtek G01', 
       'http://www.jamendo.com/fr/album/3409', 
       $this->getArrayOfTag(array('hardtek')),
-    'jamendo.com', $jean, null, '2011-12-11 14:35:07');
+    'jamendo.com', $jean, null, $this->dateD(194));
     
     
     $this->createElement('jamendo_caio_1', 'All Is Full Of Pain', 
       'http://soundcloud.com/keytek/all-is-full-of-pain', 
       $this->getArrayOfTag(array('tribe', 'hardtek')),
-    'soundcloud.com', $paul, null, '2011-12-02 01:35:07');
+    'soundcloud.com', $paul, null, $this->dateD(193));
     
     $this->createElement('jamendo_reverb_1', 'RE-FUCK (ReVeRB_FBC) mix.', 
       'http://soundcloud.com/reverb-2/re-fuck-reverb_fbc-mix', 
       $this->getArrayOfTag(array('tribe')),
-    'soundcloud.com', $paul, null, '2011-12-04 14:35:07');
+    'soundcloud.com', $paul, null, $this->dateD(192));
     
     $this->createElement('jamendo_cardio_1', 'CardioT3K - Juggernaut Trap', 
       'http://soundcloud.com/cardiot3k/cardiot3k-juggernaut-trap', 
       $this->getArrayOfTag(array('tribe')),
-    'soundcloud.com', $paul, null, '2011-12-12 13:35:07');
+    'soundcloud.com', $paul, null, $this->dateD(191));
     
     $this->createElement('dudeldrum', 'DUDELDRUM', 
       'http://www.jamendo.com/fr/album/89109', 
       $this->getArrayOfTag(array('medieval')),
       'jamendo.com', $joelle,
       $this->entity_manager->merge($this->getReference('group_dudeldrum'))
-      , '2011-12-16 18:11:07'
+      , $this->dateD(190)
     );
     
     $this->createElement('infected_psycho', 'Infected Mushroom - Psycho', 
       $this->getArrayOfTag(array('psytrance')),
       'youtube.com', $paul,
       $this->entity_manager->merge($this->getReference('group_fan_de_psytrance'))
-      , '2011-12-10 16:11:17'
+      , $this->dateD(189)
     );
     
     $this->createElement('infected_muse', 'Infected mushroom - Muse Breaks', 
       $this->getArrayOfTag(array('psytrance')),
       'youtube.com', $bob,
       $this->entity_manager->merge($this->getReference('group_fan_de_psytrance'))
-      , '2011-12-08 17:35:07'
+      , $this->dateD(188)
     );
     
     $this->createElement('joelle_1', 'Cents Pas - Joëlle', 
       'http://www.youtube.com/watch?v=bIAFB4vRdGw', 
       $this->getArrayOfTag(array('chanteuse')),
-      'youtube.com', $joelle, null, '2011-12-08 14:21:07'
+      'youtube.com', $joelle, null, $this->dateD(187)
     );
     
     $this->createElement('joelle_2', 'Cents Pas - Joëlle (bis)', 
       $this->getArrayOfTag(array('chanteuse')),
       'youtube.com', $joelle,
       $this->entity_manager->merge($this->getReference('group_joelle'))
-      , '2011-12-07 14:12:07'
+      , $this->dateD(186)
     );
     
     $this->createElement('ukf_1', 'UKF Dubstep Mix - August ', 
       'http://www.youtube.com/watch?v=SFu2DfPDGeU', 
       $this->getArrayOfTag(array('dubstep')),
-      'youtube.com', $joelle, null, '2011-12-10 00:35:07'
+      'youtube.com', $joelle, null, $this->dateD(185)
     );
     
     $this->createElement('beatbox_1', 'Dubstep Beatbox', 
       'http://www.dailymotion.com/video/xm5omz_dubstep-beatbox_creation', 
       $this->getArrayOfTag(array('dubstep', 'beatbox')),
-      'dailymotion.com', $joelle, null, '2011-12-10 11:11:11'
+      'dailymotion.com', $joelle, null, $this->dateD(184)
     );
     
     $this->createElement('soulfly_1', 'SOULFLY - Prophecy', 
       'http://www.youtube.com/watch?v=zCc_jLctZkA', 
       $this->getArrayOfTag(array('metal')),
-      'youtube.com', $bux, null, '2011-12-12 17:39:07'
+      'youtube.com', $bux, null, $this->dateD(183)
     );
     
     $this->createElement('azyd_azylum_1', 'AZYD AZYLUM Live au Café Provisoire', 
       'http://www.youtube.com/watch?v=8AXhRXAt2E4', 
       $this->getArrayOfTag(array('metal')),
-      'youtube.com', $bux, null, '2011-11-11 11:11:11'
+      'youtube.com', $bux, null, $this->dateD(182)
     );
     
     $this->createElement('babylon_pression_1', 'Babylon Pression - Des Tasers et des Pauvres', 
       'http://www.youtube.com/watch?v=XWkbaHxRvds&feature=related', 
       $this->getArrayOfTag(array('metal', 'hardcore')),
-      'youtube.com', $bux, null, '2011-12-14 18:35:07'
+      'youtube.com', $bux, null, $this->dateD(181)
     );
     
     $this->createElement('ed_cox_1', 'Ed Cox - La fanfare des teuffeurs (Hardcordian)', 
       'http://www.youtube.com/watch?v=Lk1gnh-JCDs&feature=related', 
       $this->getArrayOfTag(array('electro')),
-      'youtube.com', $bux, null, '2011-12-15 21:35:07'
+      'youtube.com', $bux, null, $this->dateD(180)
     );
     
 

src/Muzich/CoreBundle/Repository/ElementRepository.php

       . " LEFT JOIN g_.followers gf_"
       ;
       $where_network = ($is_where) ? ' AND' : ' WHERE';
+      $is_where = true;
       // Le filtre applique: Soit le proprio fait partis des followeds de l'utilisateur
       // soit l'element est ajouté dans un groupe que l'utilisateur follow.
       $where_network .= ' (f_.follower = :userid OR gf_.follower = :useridg)';
     if (($search_user_id = $searcher->getUserId()) && !$searcher->isFavorite())
     {
       $where_user = ($is_where) ? ' AND' : ' WHERE';
+      $is_where = true;
       $where_user .= ' e_.owner = :suid';
       $params_ids['suid'] = $search_user_id;
     }
     if (($search_group_id = $searcher->getGroupId()) && !$searcher->isFavorite())
     {
       $where_group = ($is_where) ? ' AND' : ' WHERE';
+      $is_where = true;
       $where_group .= ' e_.group = :sgid';
       $params_ids['sgid'] = $search_group_id;
     }
     if ($searcher->isFavorite())
     {
       $where_favorite = ($is_where) ? ' AND' : ' WHERE';
+      $is_where = true;
       if (($favorite_user_id = $searcher->getUserId()) && !$searcher->getGroupId())
       {
         // Pas de LEFT JOIN car on ne veut que les elements mis en favoris
       }
     }
     
+    // Si id_limit est précisé c'est que l'on demande "la suite"
+    $where_id_limit = '';
+    if (($id_limit = $searcher->getIdLimit()))
+    {
+      $where_favorite = ($is_where) ? ' AND' : ' WHERE';
+      $is_where = true;
+      $where_favorite .= " e_.id < :id_limit";
+      $params_ids['id_limit'] = $id_limit;
+    }
+    
     // Requête qui selectionnera les ids en fonction des critéres
     $r_ids = $this->getEntityManager()
       ->createQuery(
         $where_user
         $where_group
         $where_favorite
+        $where_id_limit
         GROUP BY e_.id
         ORDER BY e_.created DESC, e_.id DESC")
      ->setParameters($params_ids)

src/Muzich/CoreBundle/Resources/config/routing.yml

 search_elements:
   pattern:  /search-elements
   defaults: { _controller: MuzichCoreBundle:Search:searchElements }
+  
+search_elements_more:
+  pattern:  /search-elements/{id_limit}/{invertcolors}
+  defaults: { _controller: MuzichCoreBundle:Search:searchElements }
+   
+#search_elements_show_more_empty:
+#  pattern:  /search-elements/show/{type}/{object_id}
+#  defaults: 
+#    - _controller: MuzichCoreBundle:Search:searchElementsShow
+#    - type:        group|user
+#    - object_id:   int+
+#    
+#search_elements_show_more:
+#  pattern:  /search-elements/show/{type}/{object_id}/{id_limit}/{invertcolors}
+#  defaults: 
+#    - _controller: MuzichCoreBundle:Search:searchElementsShow
+#    - type:        group|user
+#    - object_id:   int+
+   
+search_elements_show_more_empty:
+  pattern:  /search-elements/show/{type}/{object_id}
+  defaults: { _controller: MuzichCoreBundle:Search:searchElementsShow }
+    
+search_elements_show_more:
+  pattern:  /search-elements/show/{type}/{object_id}/{id_limit}/{invertcolors}
+  defaults: { _controller: MuzichCoreBundle:Search:searchElementsShow }
    
 follow:
   pattern:  /follow/{type}/{id}/{token}

src/Muzich/CoreBundle/Resources/views/SearchElement/default.html.twig

 
 {% if elements|length %}
-  <ul class="elements">
+  {% if not app.request.isXmlHttpRequest %}<ul class="elements">{% endif %}
     {% for element in elements %} 
-      <li class="element {% if loop.index0 is even %}even{% else %}odd{% endif %}" id="element_{{ element.id }}">
+      <li class="element 
+
+{% if loop.index0 is even %}
+  {% if invertcolor is not defined %}
+    even
+  {% elseif invertcolor %}
+    odd
+  {% else %}
+    even
+  {% endif %}
+{% else %}
+  {% if invertcolor is not defined %}
+    odd
+  {% elseif invertcolor %}
+    even
+  {% else %}
+    odd
+  {% endif %}
+{% endif %}" id="element_{{ element.id }}">
              
         {% if element.getCountFavorite %}
           <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': user.personalHash }) }}" >
 
       </li>
     {% endfor %} 
-  </ul>
+  {% if not app.request.isXmlHttpRequest %}</ul>{% endif %}
 
 {% else %}
 

src/Muzich/CoreBundle/Searcher/ElementSearcher.php

     return $this->user_id;
   }
   
+  public function getIdLimit()
+  {
+    return $this->id_limit;
+  }
+  
   public function getGroupId()
   {
     return $this->group_id;

src/Muzich/HomeBundle/Resources/config/routing.yml

 show_group_more:
   pattern: /group/{slug}/more/{count}
   defaults: { _controller: MuzichHomeBundle:Show:showGroup, count: null }
+
+  

src/Muzich/HomeBundle/Resources/views/Home/index.html.twig

   {% if more_count is defined %} 
   {% if elements|length %}
      <span class="elements_more">
-       <a href="{{ path('home_more', {'count': more_count}) }}" >
+       <a href="{{ path('search_elements') }}" class="elements_more">
          {{ 'more'|trans({}, 'userui') }}
        </a>
      </span>
+     <img class="elements_more_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading" />
   {% endif %}
   {% endif %}
   

src/Muzich/HomeBundle/Resources/views/Show/showGroup.html.twig

   {% if more_count is defined %} 
   {% if elements|length %}
    <span class="elements_more">
-     <a href="{{ path('show_group_more', {'count': more_count, 'slug': group.slug}) }}" >
+     <a href="{{ path('search_elements_show_more_empty', {
+       'type'     : 'group', 
+       'object_id': group.id
+     }) }}" class="elements_more" >
        {{ 'more'|trans({}, 'userui') }}
      </a>
    </span>
+   <img class="elements_more_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading" />
   {% endif %}
   {% endif %}
   

src/Muzich/HomeBundle/Resources/views/Show/showUser.html.twig

   {% if more_count is defined %} 
   {% if elements|length %}
    <span class="elements_more">
-     <a href="{{ path('show_user_more', {'count': more_count, 'slug': viewed_user.slug}) }}" >
+     <a href="{{ path('search_elements_show_more_empty', {
+       'type'     : 'user', 
+       'object_id': viewed_user.id
+     }) }}" class="elements_more" >
        {{ 'more'|trans({}, 'userui') }}
      </a>
    </span>
+   <img class="elements_more_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading" />
   {% endif %}
   {% endif %}
   

web/bundles/muzichcore/js/muzich.js

     };
 }
 
+function str_replace (search, replace, subject, count) {
+    // Replaces all occurrences of search in haystack with replace  
+    // 
+    // version: 1109.2015
+    // discuss at: http://phpjs.org/functions/str_replace    // +   original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
+    // +   improved by: Gabriel Paderni
+    // +   improved by: Philip Peterson
+    // +   improved by: Simon Willison (http://simonwillison.net)
+    // +    revised by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)    // +   bugfixed by: Anton Ongson
+    // +      input by: Onno Marsman
+    // +   improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
+    // +    tweaked by: Onno Marsman
+    // +      input by: Brett Zamir (http://brett-zamir.me)    // +   bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
+    // +   input by: Oleg Eremeev
+    // +   improved by: Brett Zamir (http://brett-zamir.me)
+    // +   bugfixed by: Oleg Eremeev
+    // %          note 1: The count parameter must be passed as a string in order    // %          note 1:  to find a global variable in which the result will be given
+    // *     example 1: str_replace(' ', '.', 'Kevin van Zonneveld');
+    // *     returns 1: 'Kevin.van.Zonneveld'
+    // *     example 2: str_replace(['{name}', 'l'], ['hello', 'm'], '{name}, lars');
+    // *     returns 2: 'hemmo, mars'    var i = 0,
+        j = 0,
+        temp = '',
+        repl = '',
+        sl = 0,        fl = 0,
+        f = [].concat(search),
+        r = [].concat(replace),
+        s = subject,
+        ra = Object.prototype.toString.call(r) === '[object Array]',        sa = Object.prototype.toString.call(s) === '[object Array]';
+    s = [].concat(s);
+    if (count) {
+        this.window[count] = 0;
+    } 
+    for (i = 0, sl = s.length; i < sl; i++) {
+        if (s[i] === '') {
+            continue;
+        }for (j = 0, fl = f.length; j < fl; j++) {
+            temp = s[i] + '';
+            repl = ra ? (r[j] !== undefined ? r[j] : '') : r[0];
+            s[i] = (temp).split(f[j]).join(repl);
+            if (count && s[i] !== temp) {this.window[count] += (temp.length - s[i].length) / f[j].length;
+            }
+        }
+    }
+    return sa ? s : s[0];
+}
+
 $(document).ready(function(){
   
-   // Affichage un/des embed
-   $('a.element_embed_open_link').click(function(){
-     $(this).parent().parent('li.element').find('a.element_embed_open_link').hide();
-     $(this).parent().parent('li.element').find('a.element_embed_close_link').show();
-     $(this).parent().parent('li.element').find('div.element_embed').show();
-     return false;
-   });
-
-   // Fermeture du embed si demandé
-   $('a.element_embed_close_link').click(function(){
-     $(this).parent().parent('li.element').find('a.element_embed_open_link').show();
-     $(this).parent().parent('li.element').find('a.element_embed_close_link').hide();
-     $(this).parent().parent('li.element').find('div.element_embed').hide();
-     return false;
-   });
+  // Bouton de personalisation du filtre
+  // pour le moment ce ne sotn que des redirection vers des actions
+  $('.tags_prompt input.clear, .filter_clear_url').click(function(){
+    $(location).attr('href', $('input.filter_clear_url').val());
+  });
+  $('.tags_prompt input.mytags').click(function(){
+    $(location).attr('href', $('input.filter_mytags_url').val());
+  });
+  
+  // On met les listeners lié aux éléments de façon a pouvoir écouter
+  // les événenements des éléments chargés en ajax en appelelant
+  // cette fonction après un ptit coup d'ajax
+  function init_elements()
+  {
+  
+    // Affichage un/des embed
+    $('a.element_embed_open_link').click(function(){
+       $(this).parent().parent('li.element').find('a.element_embed_open_link').hide();
+       $(this).parent().parent('li.element').find('a.element_embed_close_link').show();
+       $(this).parent().parent('li.element').find('div.element_embed').show();
+       return false;
+    });
+
+    // Fermeture du embed si demandé
+    $('a.element_embed_close_link').click(function(){
+       $(this).parent().parent('li.element').find('a.element_embed_open_link').show();
+       $(this).parent().parent('li.element').find('a.element_embed_close_link').hide();
+       $(this).parent().parent('li.element').find('div.element_embed').hide();
+       return false;
+    });
+
+    // Mise en favoris
+    $('a.favorite_link').click(function(){
+       link = $(this);
+       $.getJSON($(this).attr('href'), function(response) {
+         img = link.find('img');
+         link.attr('href', response.link_new_url);
+         img.attr('src', response.img_new_src);
+         img.attr('title', response.img_new_title);
+       });
+       return false;
+    });
    
-   // Bouton de personalisation du filtre
-   // pour le moment ce ne sotn que des redirection vers des actions
-   $('.tags_prompt input.clear, .filter_clear_url').click(function(){
-     $(location).attr('href', $('input.filter_clear_url').val());
-   });
-   $('.tags_prompt input.mytags').click(function(){
-     $(location).attr('href', $('input.filter_mytags_url').val());
-   });
+  }
+  
+  init_elements();
    
-   // Mise en favoris
-   $('a.favorite_link').click(function(){
+   // Plus d'éléments
+   last_id = null;
+   $('a.elements_more').click(function(){
      link = $(this);
-     $.getJSON($(this).attr('href'), function(response) {
-       img = link.find('img');
-       link.attr('href', response.link_new_url);
-       img.attr('src', response.img_new_src);
-       img.attr('title', response.img_new_title);
+     last_element = $('ul.elements li.element:last-child');
+     id_last = str_replace('element_', '', last_element.attr('id'));
+     invertcolor = 0;
+     if (last_element.hasClass('even'))
+     {
+       invertcolor = 1;
+     }
+     $('img.elements_more_loader').show();
+     $.getJSON(link.attr('href')+'/'+id_last+'/'+invertcolor, function(response) {
+       if (response.count)
+       {
+         $('ul.elements').append(response.html);
+         $('img.elements_more_loader').hide();
+         init_elements();
+       }
+       
+       if (response.end || response.count < 1)
+       {
+         $('img.elements_more_loader').hide();
+         $('ul.elements').after('<div class="no_elements"><p class="no-elements">'+
+           response.message+'</p></div>');
+         link.hide();
+       }
      });
      return false;
    });