Evolution #89: odifier / Supprimer ses éléments

app/Resources/translations/userui.fr.yml

@@ -52,6 +52,8 @@ element_edit:
     name:     Lien
   name:
     name:     Nom
+  submit:
+    value:    Mettre à jour
     
 tags_filter:
   help:       Pour ne pas filtrer avec des tags, supprimez les tous de la liste.

src/Muzich/CoreBundle/Controller/CoreController.php

@@ -221,9 +221,9 @@ class CoreController extends Controller
             'search_tags_id'   => $search_object->getTags(),
             'user'             => $this->getUser(),
             'add_form'         => $add_form->createView(),
-            'add_form_name'    => $add_form->getName(),
+            'add_form_name'    => 'add',
             'search_form'      => $search_form->createView(),
-            'search_form_name' => $search_form->getName(),
+            'search_form_name' => 'search',
             'elements'         => $search_object->getElements($this->getDoctrine(), $this->getUserId()),
             'more_count'       => $this->container->getParameter('search_default_count')*2
           ));
@@ -249,7 +249,7 @@ class CoreController extends Controller
             'following'     => $this->getUser()->isFollowingGroupByQuery($this->getDoctrine(), $group->getId()),
             'user'          => $this->getUser(),
             'add_form'      => (isset($add_form)) ? $add_form->createView() : null,
-            'add_form_name' => (isset($add_form)) ? $add_form->getName() : null,
+            'add_form_name' => (isset($add_form)) ? 'add' : null,
             'more_count'    => null,
             'more_route'    => 'show_group_more'
           ));

src/Muzich/CoreBundle/Controller/ElementController.php

@@ -3,15 +3,23 @@
 namespace Muzich\CoreBundle\Controller;
 
 use Muzich\CoreBundle\lib\Controller;
+use Muzich\CoreBundle\ElementFactory\ElementManager;
 
 class ElementController extends Controller
 {
   
   /**
-   * 
+   *
+   * @param type $element_id
+   * @return Muzich\CoreBundle\Entity\Element 
    */
-  public function editAction($element_id)
+  protected function checkExistingAndOwned($element_id)
   {
+    if (!$this->getRequest()->isXmlHttpRequest())
+    {
+      $this->createNotFoundException();
+    }
+    
     if (!($element = $this->getDoctrine()->getRepository('MuzichCoreBundle:Element')
       ->findOneById($element_id)))
     {
@@ -23,8 +31,18 @@ class ElementController extends Controller
       $this->createNotFoundException();
     }
     
+    return $element;
+  }
+  
+  /**
+   * 
+   */
+  public function editAction($element_id)
+  {
+    $element = $this->checkExistingAndOwned($element_id);
+    
     $element_tags = $element->getTags();
-    $element->setTags(array());
+    $element->setTags($element->getTagsIdsJson());
     $form = $this->getAddForm($element);
     
     $search_tags = array();
@@ -35,23 +53,67 @@ class ElementController extends Controller
     
     $html = $this->render('MuzichCoreBundle:Element:element.edit.html.twig', array(
       'form'        => $form->createView(),
-      'form_name'   => $form->getName(),
+      'form_name'   => 'element_'.$element->getId(),
       'element_id'  => $element->getId(),
       'search_tags' => $search_tags
     ))->getContent();
     
     return $this->jsonResponse(array(
-      'status' => 'success',
-      'html'   => $html
+      'status'    => 'success',
+      'form_name' => 'element_'.$element->getId(),
+      'tags'      => $search_tags,
+      'html'      => $html
     ));
   }
   
   /**
    *
    */
-  public function updateAction()
+  public function updateAction($element_id)
   {
-    return array();
+    $element = $this->checkExistingAndOwned($element_id);
+    // Si il y a un groupe on le retire pour le bind
+    $group = $element->getGroup();
+    $element->setGroup(null);
+    $form = $this->getAddForm($element);
+    $form->bindRequest($this->getRequest());
+    
+    $errors = array();
+    $html = '';
+    if ($form->isValid())
+    {
+      $status = 'success';
+      $em = $this->getDoctrine()->getEntityManager();
+      $factory = new ElementManager($element, $em, $this->container);
+      $factory->proceedFill($this->getUser());
+      // Si il y avais un groupe on le remet
+      $element->setGroup($group);
+      $em->persist($element);
+      $em->flush();
+      
+      // Récupération du li
+      $html = $this->render('MuzichCoreBundle:SearchElement:element.html.twig', array(
+        'element'     => $element
+      ))->getContent();
+    }
+    else
+    {
+      $status = 'error';
+      // Récupération des erreurs
+      $validator = $this->container->get('validator');
+      $errorList = $validator->validate($form);
+      
+      foreach ($errorList as $error)
+      {
+        $errors[] = $error->getMessage();
+      }
+    }
+    
+    return $this->jsonResponse(array(
+      'status'  => $status,
+      'html'    => $html,
+      'errors'  => $errors
+    ));
   }
   
 }

src/Muzich/CoreBundle/Entity/Element.php

@@ -221,6 +221,16 @@ class Element
     return $this->tags;
   }
   
+  public function getTagsIdsJson()
+  {
+    $ids = array();
+    foreach ($this->getTags() as $tag)
+    {
+      $ids[] = $tag->getId();
+    }
+    return json_encode($ids);
+  }
+  
   public function setTags($tags)
   {
     $this->tags = $tags;

src/Muzich/CoreBundle/Form/Element/ElementAddForm.php

@@ -8,13 +8,15 @@ use Symfony\Component\Form\FormBuilder;
 class ElementAddForm extends AbstractType
 {
   public function buildForm(FormBuilder $builder, array $options)
-  {
+  {    
     $builder->add('name', 'text', array(
       'required' => true,
+      'error_bubbling' => true
     ));
     
     $builder->add('url', 'text', array(
       'required' => true,
+      'error_bubbling' => true
     ));
         
     $builder->add('tags', 'hidden');    

src/Muzich/CoreBundle/Resources/views/Element/element.edit.html.twig

@@ -5,5 +5,5 @@
     'form_name'     : form_name
   } %}
 
-  <input type="submit" />
+  <input type="submit" value="{{ 'element_edit.submit.value'|trans({}, 'userui') }}" />
 </form>

src/Muzich/CoreBundle/Resources/views/Element/form.add.html.twig

@@ -16,8 +16,10 @@
   {{ form_widget(form.name) }}
 </div>
 
-  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 'form_name': form_name } %}
+  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 
+    'form_name'     : form_name
+  } %}
 
-  {{ form_row(form.tags) }}
+  {{ form_widget(form.tags, { 'attr': {'class': 'tagBox_tags_ids'} }) }}
 
 {{ form_row(form._token) }}

src/Muzich/CoreBundle/Resources/views/Element/form.edit.html.twig

@@ -14,8 +14,10 @@
   {{ form_widget(form.name) }}
 </div>
 
-  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 'form_name': form_name } %}
+  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 
+    'form_name'     : form_name
+  } %}
 
-  {{ form_row(form.tags) }}
+  {{ form_widget(form.tags, { 'attr': {'class': 'tagBox_tags_ids'} }) }}
 
 {{ form_row(form._token) }}

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

@@ -22,85 +22,7 @@
   {% endif %}
 {% endif %}" id="element_{{ element.id }}">
              
-        {% if element.getCountFavorite %}
-          <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': user.personalHash }) }}" >
-            <img src="{{ asset('bundles/muzichcore/img/favorite.png') }}" title="{{ 'element.favorite.remove'|trans({}, 'elements') }}" alt="{{ 'element.favorite.remove'|trans({}, 'elements') }}"/>
-          </a>
-        {% else %}
-          <a class="favorite_link" href="{{ path('favorite_add', { 'id': element.id, 'token': user.personalHash }) }}" >
-            <img src="{{ asset('bundles/muzichcore/img/favorite_bw.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
-          </a>
-        {% endif %}
-        
-        <span class="element_name">
-          {{ element.name }}
-        </span> 
-        
-        {% autoescape false %}
-          {% if element.group and no_group_name is not defined%}
-            {{ 'element.name.whoandgroup'|trans({
-              '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
-              '%owner_name%' : element.owner.name,
-              '%group_url%'  : path('show_group', {'slug': element.group.slug}),
-              '%group_name%' : element.group.name
-            }, 'elements') }}
-          {% else %}
-            {{ 'element.name.who'|trans({
-              '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
-              '%owner_name%' : element.owner.name
-            }, 'elements') }}
-          {% endif %}
-        {% endautoescape %}
-        
-        
-        <a title="{{ 'element.link'|trans({}, 'elements') }}" class="element_link" href="{{ element.url }}" target="_blank">
-          <img src="{{ asset('bundles/muzichcore/img/1324917097_link.png') }}" alt="link" />
-        </a>
-          
-        {% if app.user.id == element.owner.id %}
-          <a title="{{ 'element.edit.link'|trans({}, 'elements') }}" class="element_edit_link" 
-             href="{{ path('element_edit', {'element_id' : element.id})  }}" style="display: none;"
-          >
-            <img src="{{ asset('bundles/muzichcore/img/1327151338_desktop.png') }}" alt="edit" />
-          </a>
-        {% endif %}
-            
-        {% if element.embed %}
-          {% autoescape false %}
-            <div id="embed_{{ element.id }}" class="element_embed" style="display: none;">
-              {{ element.embed }}
-            </div>
-          {% endautoescape %}
-        {% endif %}
-        
-        <div>
-
-          {% if element.embed %}
-            <a href="#" class="element_open element_embed_close_link" style="display: none;">
-              {{ 'element.show.close_embed'|trans({}, 'elements') }}
-            </a>
-            <a href="#" class="element_open element_embed_open_link">
-              {{ 'element.show.open_embed'|trans({}, 'elements') }}
-            </a>
-          {% else %}
-            <a href="{{ element.url }}" class="element_open" target="_blank">
-              {{ 'element.show.open_link'|trans({}, 'elements') }}
-            </a>
-          {% endif %}
-        
-          {% if element.tags|length %}
-          <ul class="element_tags">
-            {% for tag in element.tags %} 
-              <li class="element_tag">
-                {{ tag.name }}
-              </li>
-            {% endfor %} 
-          </ul>
-          {% else %}
-          <br />
-          {% endif %}
-          
-        </div>
+        {% include "MuzichCoreBundle:SearchElement:element.html.twig" %}
 
       </li>
     {% endfor %} 

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

@@ -0,0 +1,83 @@
+{% if element.getCountFavorite %}
+  <a class="favorite_link" href="{{ path('favorite_remove', { 'id': element.id, 'token': app.user.personalHash }) }}" >
+    <img src="{{ asset('bundles/muzichcore/img/favorite.png') }}" title="{{ 'element.favorite.remove'|trans({}, 'elements') }}" alt="{{ 'element.favorite.remove'|trans({}, 'elements') }}"/>
+  </a>
+{% else %}
+  <a class="favorite_link" href="{{ path('favorite_add', { 'id': element.id, 'token': app.user.personalHash }) }}" >
+    <img src="{{ asset('bundles/muzichcore/img/favorite_bw.png') }}" title="{{ 'element.favorite.add'|trans({}, 'elements') }}" alt="{{ 'element.favorite.add'|trans({}, 'elements') }}" />
+  </a>
+{% endif %}
+
+<span class="element_name">
+  {{ element.name }}
+</span> 
+
+{% autoescape false %}
+  {% if element.group and no_group_name is not defined%}
+    {{ 'element.name.whoandgroup'|trans({
+      '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
+      '%owner_name%' : element.owner.name,
+      '%group_url%'  : path('show_group', {'slug': element.group.slug}),
+      '%group_name%' : element.group.name
+    }, 'elements') }}
+  {% else %}
+    {{ 'element.name.who'|trans({
+      '%owner_url%'  : path('show_user', {'slug': element.owner.slug}),
+      '%owner_name%' : element.owner.name
+    }, 'elements') }}
+  {% endif %}
+{% endautoescape %}
+
+
+<a title="{{ 'element.link'|trans({}, 'elements') }}" class="element_link" href="{{ element.url }}" target="_blank">
+  <img src="{{ asset('bundles/muzichcore/img/1324917097_link.png') }}" alt="link" />
+</a>
+
+{% if app.user.id == element.owner.id %}
+  <a title="{{ 'element.edit.link'|trans({}, 'elements') }}" class="element_edit_link" 
+     href="{{ path('element_edit', {'element_id' : element.id})  }}" style="display: none;"
+  >
+    <img src="{{ asset('bundles/muzichcore/img/1327151338_desktop.png') }}" alt="edit" />
+  </a>
+{% endif %}
+
+<div class="loader">
+  <img class="element_loader" style="display: none;" src="{{ asset('/bundles/muzichcore/img/ajax-loader.gif') }}" alt="loading"/>
+</div>
+  
+{% if element.embed %}
+  {% autoescape false %}
+    <div id="embed_{{ element.id }}" class="element_embed" style="display: none;">
+      {{ element.embed }}
+    </div>
+  {% endautoescape %}
+{% endif %}
+
+<div>
+
+  {% if element.embed %}
+    <a href="#" class="element_open element_embed_close_link" style="display: none;">
+      {{ 'element.show.close_embed'|trans({}, 'elements') }}
+    </a>
+    <a href="#" class="element_open element_embed_open_link">
+      {{ 'element.show.open_embed'|trans({}, 'elements') }}
+    </a>
+  {% else %}
+    <a href="{{ element.url }}" class="element_open" target="_blank">
+      {{ 'element.show.open_link'|trans({}, 'elements') }}
+    </a>
+  {% endif %}
+
+  {% if element.tags|length %}
+  <ul class="element_tags">
+    {% for tag in element.tags %} 
+      <li class="element_tag">
+        {{ tag.name }}
+      </li>
+    {% endfor %} 
+  </ul>
+  {% else %}
+  <br />
+  {% endif %}
+
+</div>

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

@@ -7,7 +7,9 @@
     {{ form_widget(search_form.network) }}
   </div>
   
-  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 'form_name': form_name } %}
+  {% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 
+    'form_name'     : form_name
+  } %}
   
-  {{ form_row(search_form.tags) }}
+  {{ form_widget(search_form.tags, { 'attr': {'class': 'tagBox_tags_ids'} }) }}
   {{ form_row(search_form._token) }}

src/Muzich/CoreBundle/Resources/views/Tag/tagFavoritesForm.html.twig

@@ -7,7 +7,7 @@
     'search_tags' : favorite_tags_id
   } %}
   
-  {{ form_row(form.tags) }}
+  {{ form_widget(form.tags, { 'attr': {'class': 'tagBox_tags_ids'} }) }}
 
   {{ form_row(form._token) }}
 

src/Muzich/CoreBundle/Resources/views/Tag/tagsPrompt.html.twig

@@ -11,8 +11,9 @@
     {% endif %}
   {% endif %}
   
-   <input class="tags_prompt_list" id="tags_prompt_list_{{ form_name }}" name="tags" value=""> 
+   <input class="tags_prompt_list" name="tags" value=""> 
    <input id="tags_selected_tag_{{ form_name }}" type="hidden" value="" />
+   <input class="tag_text_help" type="hidden" value="{{ 'tags.inputtext.help'|trans({}, 'userui') }}"/>
    <div id="search_tag_{{ form_name }}" class="search_tag_list" style="display: none;">
      <span class="info"></span>
      <div class="tag_loader_div">
@@ -32,246 +33,14 @@
     {% endfor %}
   {% endif %}
   
-  tag_text_help = "{{ 'tags.inputtext.help'|trans({}, 'userui') }}";
   var options = new Array();
   options.form_name  = "{{ form_name }}";
   options.tag_init   = taginit;
   
-  ajax_query_timestamp = null;
-  
-  $("#tags_prompt_list_{{ form_name }}").tagBox(options);
+  // tags_prompt_list_
+  $("div#tags_prompt_{{ form_name }} input.tags_prompt_list").tagBox(options);
   
   // On détruit la variable taginit
   delete taginit;
-  
-  // I've hacked the jQuery UI autocomplete render function
-  // to highlight part of the matched string
-  $.ui.autocomplete.prototype._renderItem = function( ul, item) {
-      var sstr = $.trim(this.term);
-      var re = new RegExp(sstr, "i") ;
-      var t = item.label.replace(re,"<strong>" + sstr + "</strong>");
-      return $( "<li></li>" )
-          .data( "item.autocomplete", item )
-          .append( "<a>" + t + "</a>" )
-          .appendTo( ul );
-  };
-  
-  ////////////////////////
-    
-  // Les deux clicks ci-dessous permettent de faire disparaitre
-  // la div de tags lorsque l'on clique ailleurs
-  $('html').click(function() {
-    if ($("#search_tag_{{ form_name }}").is(':visible'))
-    {
-      $("#search_tag_{{ form_name }}").hide();
-    }
-  });
-  
-  $("#search_tag_{{ form_name }}").click(function(event){
-    event.stopPropagation();
-  });
-  
-  function autocomplete_tag(input, form_name)
-  {
-    // Il doit y avoir au moin un caractère
-    if (input.val().length > 0) 
-    {
-
-      // on met en variable l'input
-      inputTag = input;
-
-      // On récupére la div de tags
-      divtags = $("#search_tag_"+form_name);
-
-      // Si la fenêtre de tags est caché
-      if (!divtags.is(':visible'))
-      {
-        // On la replace
-        position = input.position();
-        divtags.css('left', Math.round(position.left) + 5);
-        divtags.css('top', Math.round(position.top) + 28);
-        // Et on l'affiche
-        divtags.show();
-      }
-      // On affiche le loader
-      $('#tag_loader_'+form_name).show();
-      // On cache la liste de tags
-      search_tag_list = divtags.find('ul.search_tag_list');
-      // On supprime les anciens li
-      search_tag_list.find('li').remove();
-      search_tag_list.hide();
-      // Et on affiche une info
-      span_info = divtags.find('span.info');
-      span_info.show();
-      span_info.text("Recherche des tags correspondants à \""+input.val()+"\" ...");
-
-      // C'est en fonction du nb de resultats qu'il sera affiché
-      divtags.find('a.more').hide();
-
-      // On récupère le timestamp pour reconnaitre la dernière requête effectué
-      ajax_query_timestamp = new Date().getTime();
-
-      // Récupération des tags correspondants
-      $.getJSON('/app_dev.php/fr/search/tag/'+input.val()+'/'+ajax_query_timestamp, function(data) {
-        // Ce contrôle permet de ne pas continuer si une requete
-        // ajax a été faite depuis.
-        if (data.timestamp == ajax_query_timestamp)
-        {
-          status = data.status;
-          tags   = data.data;
-
-          // Si on spécifie une erreur
-          if (status == 'error')
-          {
-            // On l'affiche a l'utilisateur
-            span_info.text(data.error);
-          }
-          // Si c'est un succés
-          else if (status == 'success')
-          {
-            if (tags.length > 0)
-            {
-              more = false;
-              // Pour chaque tags retournés
-              for (i in tags)
-              {
-                var tag_name = tags[i]['name'];
-                var tag_id = tags[i]['id'];
-                // On construit un li
-                var sstr = $.trim(input.val());
-                var re = new RegExp(sstr, "i") ;
-                var t_string = tag_name.replace(re,"<strong>" + sstr + "</strong>");
-                
-                li_tag = 
-                  $('<li>').append(
-                    $('<a>').attr('href','#'+tag_id+'#'+tag_name)
-                    // qui réagit quand on clique dessus
-                    .click(function(e){
-                      // On récupère le nom du tag
-                      name = $(this).attr('href').substr(1,$(this).attr('href').length);
-                      name = name.substr(strpos(name, '#')+1, name.length);
-                                            
-                      id = $(this).attr('href').substr(1,$(this).attr('href').length);
-                      id = str_replace(name, '', id);
-                      id = str_replace('#', '', id);
-                                            
-                      $('input#tags_selected_tag_'+form_name).val(id);
-                      inputTag.val(name);
-                      // Et on execute l'évènement selectTag de l'input
-                      inputTag.trigger("selectTag");
-                      // On cache la liste puisque le choix vient d'être fait
-                      divtags.hide();
-                      inputTag.val(tag_text_help); 
-                      return false;
-                    })
-                    .append(t_string)
-                );
-
-                // Si on depasse les 30 tags
-                if (i > 30)
-                {
-                  more = true;
-                  // On le cache
-                  li_tag.hide();
-                }
-
-                // On ajout ce li a la liste
-                search_tag_list.append(li_tag);
-              } 
-
-              if (more)
-              {
-                divtags.find('a.more').show();
-              }
-
-              // On cache l'info
-              span_info.hide();
-              // Et on affiche la liste
-              search_tag_list.show();
-            }
-            else
-            {
-              span_info.text("Aucun tag de trouvé pour \""+inputTag.val()+"\"");
-            }
-            
-          }
-
-          // On cache le loader
-          $('#tag_loader_'+form_name).hide();
-        }
-      });
-      
-    }
-  }
-  
-  
-
-  last_keypress = 0;
-  
-  function check_timelaps_and_search(input, form_name, time_id, timed, info)
-  {
-    if (!timed)
-    {
-      // C'est une nouvelle touche (pas redirigé) on lui donne un id
-      // et on met a jour l'id de la dernière pressé
-      last_keypress = new Date().getTime(); 
-      var this_time_id = last_keypress;
-    }
-    else
-    {
-      // Si elle a été redirigé, on met son id dans cette variable
-      var this_time_id = time_id;
-    }
-    
-    // C'est une touche redirigé dans le temps qui a été suivit d'une autre touche
-    if (time_id != last_keypress && timed)
-    {
-      // elle disparait
-    }
-    else
-    {
-      //
-      if ((new Date().getTime() - last_keypress) < 600 || timed == false)
-      {
-        // Si elle vient d'être tapé (timed == false) elle doit attendre (au cas ou une autre touche soit tapé)
-        // Si c'est une redirigé qui n'a pas été remplacé par une nouvelle lettre
-        // elle doit attendre au cas ou soit pressé.
-        setTimeout(function(){check_timelaps_and_search(input, form_name, this_time_id, true, info)}, 700);
-      }
-      else
-      {
-        // il n'y a plus a attendre, on envoie la demande de tag.
-        autocomplete_tag(input, '{{ form_name }}');
-      }
-    }
-  }
-
-  // Autocompletion de tags
-  $("#tags_prompt_{{ form_name }} ul.tagbox li.input input").keypress(function(e){
-    
-    var code = (e.keyCode ? e.keyCode : e.which);
-
-    if ((e.which !== 0 && e.charCode !== 0) || (code == 8 || code == 46))
-    {
-      check_timelaps_and_search($(this), '{{ form_name }}', new Date().getTime(), false, $(this).val());
-    }
-     
-  });
-  
-  // Un click sur ce lien affiche tout les tags cachés de la liste
-  $('div.search_tag_list a.more').click(function(){
-    jQuery.each( $(this).parent('div').find('ul.search_tag_list li') , function(){
-      $(this).show();
-    });
-    return false;
-  });
-  
-  /////////////////////////////////
-  
-
-  
-  $('#tags_prompt_{{ form_name }} input[type="text"]').val(tag_text_help);
-  $('#tags_prompt_{{ form_name }} input[type="text"]').formDefaults();
-  
     
 </script>

src/Muzich/GroupBundle/Controller/DefaultController.php

@@ -137,7 +137,7 @@ class DefaultController extends Controller
     return array(
       'group'     => $group,
       'form'      => $form->createView()  ,
-      'form_name' => $form->getName()      
+      'form_name' => 'group'      
     );
   }
   

src/Muzich/GroupBundle/Resources/views/Form/form.html.twig

@@ -22,8 +22,10 @@
   {{ form_widget(form.open) }}
 </div>
 
-{% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 'form_name': form_name } %}
+{% include "MuzichCoreBundle:Tag:tagsPrompt.html.twig" with { 
+  'form_name'     : form_name
+} %}
 
-{{ form_row(form.tags) }}
+{{ fform_widget(form.tags, { 'attr': {'class': 'tagBox_tags_ids'} }) }}
 
 {{ form_rest(form) }}

src/Muzich/HomeBundle/Controller/HomeController.php

@@ -32,9 +32,9 @@ class HomeController extends Controller
       'search_tags_id'   => $search_object->getTags(),
       'user'             => $this->getUser(),
       'add_form'         => $add_form->createView(),
-      'add_form_name'    => $add_form->getName(),
+      'add_form_name'    => 'add',
       'search_form'      => $search_form->createView(),
-      'search_form_name' => $search_form->getName(),
+      'search_form_name' => 'search',
       'elements'         => $search_object->getElements($this->getDoctrine(), $this->getUserId()),
       'more_count'       => ($count)?$count+$this->container->getParameter('search_default_count'):$this->container->getParameter('search_default_count')*2
     );

src/Muzich/HomeBundle/Controller/ShowController.php

@@ -63,7 +63,7 @@ class ShowController extends Controller
       'following'     => $this->getUser()->isFollowingGroupByQuery($this->getDoctrine(), $group->getId()),
       'user'          => $this->getUser(),
       'add_form'      => (isset($add_form)) ? $add_form->createView() : null,
-      'add_form_name' => (isset($add_form)) ? $add_form->getName() : null,
+      'add_form_name' => (isset($add_form)) ? 'add' : null,
       'more_count'    => ($count)?$count+$this->container->getParameter('search_default_count'):$this->container->getParameter('search_default_count')*2,
       'more_route'    => 'show_group_more'
     );

web/bundles/muzichcore/css/main.css

@@ -503,12 +503,12 @@ ul.tagbox input[type="text"]:FOCUS
   );
 }
 
-div.tag_loader_div
+div.tag_loader_div, div.loader
 {
   text-align: center;
 }
 
-.tag_loader
+.tag_loader, element_loader
 {
   margin-left: auto;
   marin-right: auto;

web/bundles/muzichcore/js/muzich.js

@@ -227,16 +227,6 @@ $(document).ready(function(){
       }
     }
   );
-
- // Ouverture du formulaire de modification
- $('a.element_edit_link').live('click', function(){
-   link = $(this);
-   $.getJSON($(this).attr('href'), function(response) {
-     li = link.parent('li.element');
-     li.html(response.html);
-   });
-   return false;
- });
    
    // Plus d'éléments
    last_id = null;
@@ -271,13 +261,13 @@ $(document).ready(function(){
   tag_box_input_value = $('ul.tagbox input[type="text"]').val();
    
   // Filtre et affichage éléments ajax
-  $('form[name="element_search_form"] input[type="submit"]').click(function(){
+  $('form[name="search"] input[type="submit"]').click(function(){
     $('ul.elements').html('');
     $('div.no_elements').hide();
     $('img.elements_more_loader').show();
   });
   
-  $('form[name="element_search_form"]').ajaxForm(function(response) { 
+  $('form[name="search"]').ajaxForm(function(response) { 
     
     $('ul.elements').html(response.html);
     
@@ -300,7 +290,280 @@ $(document).ready(function(){
      $('ul.tagbox input[type="text"]').val(tag_box_input_value);
     
   }); 
+  
+  
+
+ // Ouverture du formulaire de modification
+  $('a.element_edit_link').live('click', function(){
+    
+    link = $(this);
+    li = link.parent('li.element');
+    div_loader = li.find('div.loader');
+    li.html(div_loader);
+    li.find('img.element_loader').show();
+    
+    $.getJSON($(this).attr('href'), function(response) {
+      
+      // On prépare le tagBox
+      li.html(response.html);
+     
+      var options = new Array();
+      options.form_name  = response.form_name;
+      options.tag_init   = response.tags;
+
+      ajax_query_timestamp = null;
+      
+      $("#tags_prompt_list_"+response.form_name).tagBox(options);
+      
+      // On rend ce formulaire ajaxFormable
+      $('form[name="'+response.form_name+'"] input[type="submit"]').live('click', function(){
+        li.prepend(div_loader);
+        li.find('img.element_loader').show();
+      });
+      $('form[name="'+response.form_name+'"]').ajaxForm(function(response){
+        
+        if (response.status == 'success')
+        {
+          li.html(response.html);
+        }
+        else if (response.status == 'error')
+        {
+          li.find('img.element_loader').hide();
+          li.find('ul.error_list').remove();
+          ul_errors = $('<ul>').addClass('error_list');
+          
+          for (i in response.errors)
+          {
+            ul_errors.append($('<li>').append(response.errors[i]));
+          }
+          
+          li.prepend(ul_errors);
+        }
+      });
+      
+    });
+    return false;
+  });
+ 
+  ////////////////// TAG PROMPT ///////////////
+ 
+  ajax_query_timestamp = null;
+  tag_text_help = $('input.tag_text_help').val();
+ 
+  // Les deux clicks ci-dessous permettent de faire disparaitre
+  // la div de tags lorsque l'on clique ailleurs
+  $('html').click(function() {
+    if ($("div.search_tag_list").is(':visible'))
+    {
+      $("div.search_tag_list").hide();
+    }
+  });
+
+  $("div.search_tag_list").live('click', function(event){
+    event.stopPropagation();
+  });
+
+  function autocomplete_tag(input, form_name)
+  {
+    // Il doit y avoir au moin un caractère
+    if (input.val().length > 0) 
+    {
+
+      // on met en variable l'input
+      inputTag = input;
+      
+      // On récupére la div de tags
+      divtags = $("#search_tag_"+form_name);
+
+      // Si la fenêtre de tags est caché
+      if (!divtags.is(':visible'))
+      {
+        // On la replace
+        position = input.position();
+        divtags.css('left', Math.round(position.left) + 5);
+        divtags.css('top', Math.round(position.top) + 28);
+        // Et on l'affiche
+        divtags.show();
+      }
+      // On affiche le loader
+      $('#tag_loader_'+form_name).show();
+      // On cache la liste de tags
+      search_tag_list = divtags.find('ul.search_tag_list');
+      // On supprime les anciens li
+      search_tag_list.find('li').remove();
+      search_tag_list.hide();
+      // Et on affiche une info
+      span_info = divtags.find('span.info');
+      span_info.show();
+      span_info.text("Recherche des tags correspondants à \""+input.val()+"\" ...");
+
+      // C'est en fonction du nb de resultats qu'il sera affiché
+      divtags.find('a.more').hide();
+
+      // On récupère le timestamp pour reconnaitre la dernière requête effectué
+      ajax_query_timestamp = new Date().getTime();
+
+      // Récupération des tags correspondants
+      $.getJSON('/app_dev.php/fr/search/tag/'+input.val()+'/'+ajax_query_timestamp, function(data) {
+        // Ce contrôle permet de ne pas continuer si une requete
+        // ajax a été faite depuis.
+        if (data.timestamp == ajax_query_timestamp)
+        {
+          status = data.status;
+          tags   = data.data;
+
+          // Si on spécifie une erreur
+          if (status == 'error')
+          {
+            // On l'affiche a l'utilisateur
+            span_info.text(data.error);
+          }
+          // Si c'est un succés
+          else if (status == 'success')
+          {
+            if (tags.length > 0)
+            {
+              more = false;
+              // Pour chaque tags retournés
+              for (i in tags)
+              {
+                var tag_name = tags[i]['name'];
+                var tag_id = tags[i]['id'];
+                // On construit un li
+                var sstr = $.trim(input.val());
+                var re = new RegExp(sstr, "i") ;
+                var t_string = tag_name.replace(re,"<strong>" + sstr + "</strong>");
+                
+                li_tag = 
+                  $('<li>').append(
+                    $('<a>').attr('href','#'+tag_id+'#'+tag_name)
+                    // qui réagit quand on clique dessus
+                    .click(function(e){
+                      // On récupère le nom du tag
+                      name = $(this).attr('href').substr(1,$(this).attr('href').length);
+                      name = name.substr(strpos(name, '#')+1, name.length);
+                                            
+                      id = $(this).attr('href').substr(1,$(this).attr('href').length);
+                      id = str_replace(name, '', id);
+                      id = str_replace('#', '', id);
+                                            
+                      $('input#tags_selected_tag_'+form_name).val(id);
+                      inputTag.val(name);
+                      // Et on execute l'évènement selectTag de l'input
+                      inputTag.trigger("selectTag");
+                      // On cache la liste puisque le choix vient d'être fait
+                      divtags.hide();
+                      inputTag.val(tag_text_help); 
+                      return false;
+                    })
+                    .append(t_string)
+                );
+
+                // Si on depasse les 30 tags
+                if (i > 30)
+                {
+                  more = true;
+                  // On le cache
+                  li_tag.hide();
+                }
+
+                // On ajout ce li a la liste
+                search_tag_list.append(li_tag);
+              } 
+
+              if (more)
+              {
+                divtags.find('a.more').show();
+              }
+
+              // On cache l'info
+              span_info.hide();
+              // Et on affiche la liste
+              search_tag_list.show();
+            }
+            else
+            {
+              span_info.text("Aucun tag de trouvé pour \""+inputTag.val()+"\"");
+            }
+            
+          }
+
+          // On cache le loader
+          $('#tag_loader_'+form_name).hide();
+        }
+      });
+      
+    }
+  }
+ 
+ 
+  last_keypress = 0;
+  
+  function check_timelaps_and_search(input, form_name, time_id, timed, info)
+  {
+    if (!timed)
+    {
+      // C'est une nouvelle touche (pas redirigé) on lui donne un id
+      // et on met a jour l'id de la dernière pressé
+      last_keypress = new Date().getTime(); 
+      var this_time_id = last_keypress;
+    }
+    else
+    {
+      // Si elle a été redirigé, on met son id dans cette variable
+      var this_time_id = time_id;
+    }
+    
+    // C'est une touche redirigé dans le temps qui a été suivit d'une autre touche
+    if (time_id != last_keypress && timed)
+    {
+      // elle disparait
+    }
+    else
+    {
+      //
+      if ((new Date().getTime() - last_keypress) < 600 || timed == false)
+      {
+        // Si elle vient d'être tapé (timed == false) elle doit attendre (au cas ou une autre touche soit tapé)
+        // Si c'est une redirigé qui n'a pas été remplacé par une nouvelle lettre
+        // elle doit attendre au cas ou soit pressé.
+        setTimeout(function(){check_timelaps_and_search(input, form_name, this_time_id, true, info)}, 700);
+      }
+      else
+      {
+        // il n'y a plus a attendre, on envoie la demande de tag.
+        autocomplete_tag(input, form_name);
+      }
+    }
+  }
+  
+  // Autocompletion de tags
+  $("div.tags_prompt ul.tagbox li.input input").live('keypress', function(e){
+    
+    var form_name = $(this).parent('li').parent('ul.tagbox')
+      .parent('div.tags_prompt').parent('form').attr('name')
+    ;
+    var code = (e.keyCode ? e.keyCode : e.which);
+
+    if ((e.which !== 0 && e.charCode !== 0) || (code == 8 || code == 46))
+    {
+      check_timelaps_and_search($(this), form_name, new Date().getTime(), false, $(this).val());
+    }
+     
+  });
+  
+  // Un click sur ce lien affiche tout les tags cachés de la liste
+  $('div.search_tag_list a.more').live('click', function(){
+    jQuery.each( $(this).parent('div').find('ul.search_tag_list li') , function(){
+      $(this).show();
+    });
+    return false;
+  });
+  
+  $('ul.tagbox li.input input[type="text"]').val(tag_text_help);
+  $('ul.tagbox li.input input[type="text"]').formDefaults();
+ 
+  ////////////////// FIN TAG PROMPT ///////////////
+
    
  });
- 
- 

web/js/tags/jquery.tagBox.js

@@ -64,21 +64,6 @@
           input = $(this);
           inputId = $('input#tags_selected_tag_'+options.form_name);
           
-          // Ici il faut faire un ajax q pour connaitre l'id, on a que le string
-          // ajax loader gif
-          //$('#tag_loader_'+options.form_name).css('display', 'block');
-          // On bloque le submit le temps de la validation du tag
-          //$('form[name="'+options.form_name+'"] input[type="submit"]').attr('disabled', 'disabled');
-//          $.getJSON('/app_dev.php/fr/search/tagid/'+$(this).val(), function(data) {
-//            if (isInteger(data))
-//            {
-//              self.addTag(input.val(), data, options.form_name, false);
-//              input.val("");
-//              $('#tag_loader_'+options.form_name).css('display', 'none');
-//              $('form[name="'+options.form_name+'"] input[type="submit"]').removeAttr('disabled');
-//            }
-//          });
-
           self.addTag(input.val(), inputId.val(), options.form_name, false);
         });
         
@@ -97,13 +82,7 @@
         self.tagbox.append(self.inputHolder);
         self.inputHolder.append(self.tagInput);
         self.tagInput.autoGrowInput();
-        
-        // On désactive l'ajout de tags basé sur le contenu du input
-        // ona notre propre système (taginit)
-        //for(tag in tags) {
-        //    self.addTag(tags[tag], findKeyWithValue(values, tags[tag]), options.form_name, true);
-        //}
-        
+                
         if (options.tag_init.length)
         {
           for(i in options.tag_init) {
@@ -140,7 +119,7 @@
             // si on force, on ne touche pas l'inpu (il contient déjà ces valeurs)
             if (!force)
             {
-              var input_tags = $('input#'+form_name+'_tags');
+              var input_tags = $('form[name="'+form_name+'"] input.tagBox_tags_ids');
               if (input_tags.length)
               {
                 // array des ids de tags
@@ -148,7 +127,7 @@
                 if (!inArray(input_values, id))
                 {
                   input_values[input_values.length] = parseInt(id);
-                  $('input#'+form_name+'_tags').val(array2json(input_values));
+                  input_tags.val(array2json(input_values));
                 }
               }
             }
@@ -166,7 +145,7 @@
             this.tags.splice(index, 1);
             this.updateInput();
             
-            input_tags = $('input#'+form_name+'_tags');
+            input_tags = $('form[name="'+form_name+'"] input.tagBox_tags_ids');
             if (input_tags.length)
             {
               // array des ids de tags
@@ -178,7 +157,7 @@
                   delete input_values[i];
                 }
               }
-              $('input#'+form_name+'_tags').val(array2json(input_values));
+              input_tags.val(array2json(input_values));
             }
             
             // Suppression tu tableau js