Dialog & select2 improvements
[civicrm-core.git] / templates / CRM / Admin / Page / Tag.tpl
index d721f127cbe9c518af350bef3b708678e8ed971b..f2ea634f9c43ced8f0672e2dfb57feba1c466291 100644 (file)
@@ -1,8 +1,8 @@
 {*
  +--------------------------------------------------------------------+
- | CiviCRM version 4.4                                                |
+ | CiviCRM version 4.5                                                |
  +--------------------------------------------------------------------+
- | Copyright CiviCRM LLC (c) 2004-2013                                |
+ | Copyright CiviCRM LLC (c) 2004-2014                                |
  +--------------------------------------------------------------------+
  | This file is a part of CiviCRM.                                    |
  |                                                                    |
         </div>
     {/if}
 
-<div id="mergeTagDialog">
-    {ts}Begin typing name of tag to merge into.{/ts}<br/>
-    <input type="text" id="tag_name"/>
-    <input type="hidden" id="tag_name_id" value="">
-    <div id="used_for_warning" class="status message"></div>
-</div>
-
 </div>
 
 {literal}
 <script type="text/javascript">
-cj("#mergeTagDialog").hide( );
-cj( function() {
-    cj('.merge_tag').click(function(){
-        var row_id = cj(this).closest('tr').attr('id');
-        var tagId = row_id.split('-');
-        mergeTag(tagId[1]);
-    });
-});
-
-function mergeTag( fromId ) {
-    var fromTag = cj('#tag-' + fromId).children('td.crm-tag-name').text();
-    cj('#used_for_warning').html('');
-
-    cj("#mergeTagDialog").show( );
-  cj("#mergeTagDialog").dialog({
-    title: "Merge tag '" + fromTag + "' into:",
-    modal: true,
-    bgiframe: true,
-    close: function(event, ui) { cj("#tag_name").unautocomplete( ); },
-    overlay: {
-      opacity: 0.5,
-      background: "black"
-    },
-
-    open:function() {
-      cj("#tag_name").val( "" );
-      cj("#tag_name_id").val( null );
-
-      var tagUrl = {/literal}"{crmURL p='civicrm/ajax/mergeTagList' h=0 q='fromId='}"{literal} + fromId;
-
-      cj("#tag_name").autocomplete( tagUrl, {
-        width: 260,
-        selectFirst: false,
-        matchContains: true
-      });
-
-      cj("#tag_name").focus();
-      cj("#tag_name").result(function(event, data, formatted) {
-        cj("input[id=tag_name_id]").val(data[1]);
-                                if ( data[2] == 1 ) {
-                                    cj('#used_for_warning').html("Warning: '" + fromTag + "' has different used-for options than the selected tag, which would be merged into the selected tag. Click Ok to proceed.");
-                                } else {
-                                    cj('#used_for_warning').html('');
-                                }
-      });
-    },
+CRM.$(function($) {
+  var tag;
+  $('.merge_tag').click(function(e) {
+    tag = $(this).crmEditableEntity();
+    mergeTagDialog();
+    e.preventDefault();
+  });
 
-    buttons: {
-      "Ok": function() {
-        if ( ! cj("#tag_name").val( ) ) {
-          alert('{/literal}{ts escape="js"}Select valid tag from the list{/ts}{literal}.');
-          return false;
-        }
-        var toId = cj("#tag_name_id").val( );
-        if ( ! toId ) {
-          alert('{/literal}{ts escape="js"}Select valid tag from the list{/ts}{literal}.');
+  function mergeTagDialog() {
+    var tagUrl = {/literal}"{crmURL p='civicrm/ajax/mergeTagList' h=0}"{literal};
+    var title = {/literal}'{ts escape="js" 1="%1"}Merge tag %1 into:{/ts}'{literal};
+    CRM.confirm({
+      title: ts(title, {1: tag.name}),
+      message: '<input name="select_merge_tag" class="big" />',
+      open: function() {
+        var dialog = this;
+        $('input[name=select_merge_tag]', dialog)
+          .crmSelect2({
+            placeholder: {/literal}'{ts escape="js"}- select tag -{/ts}'{literal},
+            minimumInputLength: 1,
+            ajax: {
+              url: tagUrl,
+              data: function(term) {
+                return {term: term, fromId: tag.id};
+              },
+              results: function(response) {
+                return {results: response};
+              }
+            }
+          })
+          .change(function() {
+            $('.messages', dialog).remove();
+            if ($(this).val() && $(this).select2('data').warning) {
+              $(dialog).append('<div class="messages status">{/literal}{ts escape='js'}Note: the selected tag is used by additional entities.{/ts}{literal}</div>');
+            }
+          });
+      }
+    })
+      .on('dialogclose', function() {
+        $('input[name=select_merge_tag]', this).select2('destroy');
+      })
+      .on('crmConfirm:yes', function() {
+        var toId = $("input[name=select_merge_tag]", this).val();
+        if (!toId) {
+          $("input[name=select_merge_tag]", this).crmError(ts('Select a tag'));
           return false;
         }
-
-                /* send synchronous request so that disabling any actions for slow servers*/
+        /* send synchronous request so that disabling any actions for slow servers*/
         var postUrl = {/literal}"{crmURL p='civicrm/ajax/mergeTags' h=0 }"{literal};
-        var data    = {fromId: fromId, toId: toId, key:{/literal}"{crmKey name='civicrm/ajax/mergeTags'}"{literal}};
-                cj.ajax({ type     : "POST",
-            url      : postUrl,
-            data     : data,
-            dataType : "json",
-            success  : function( values ) {
-                        if ( values.status == true ) {
-                            cj('#tag-' + toId).children('td.crm-tag-used_for').text(values.tagB_used_for);
-                            var msg = "'" + values.tagA + "' has been merged with '" + values.tagB + "'. All records previously tagged with '" + values.tagA + "' are now tagged with '" + values.tagB + "'.";
-                            cj('#tag-' + fromId).html('<td colspan="8"><div class="status message"><div class="icon inform-icon"></div>' + msg + '</div></td>');
-                        }
-                      }
-                });
-
-                cj(this).dialog("close");
-        cj(this).dialog("destroy");
-       },
-
-      "Cancel": function() {
-        cj(this).dialog("close");
-        cj(this).dialog("destroy");
-      }
+        var data = {fromId: tag.id, toId: toId, key:{/literal}"{crmKey name='civicrm/ajax/mergeTags'}"{literal}};
+        cj.ajax({
+          type: "POST",
+          url: postUrl,
+          data: data,
+          dataType: "json",
+          success: function(values) {
+            if ( values.status == true ) {
+              $('#tag-' + toId).children('td.crm-tag-used_for').text(values.tagB_used_for);
+              $('#tag-' + tag.id).html('<td colspan="8"><div class="status message"><div class="icon inform-icon"></div>' + values.message + '</div></td>');
+            }
           }
-  });
-}
+        });
+      });
+  }
+});
 </script>
 {/literal}