You can convert a conversation in Freshchat into a Zendesk ticket by adding and enabling the following code snippet as a smart plug.


For instructions on how to add a smart plug, refer Working with Smart Plugs.


Note:

You need to replace the domain, emailAddress and apiKey values in the below code with your Zendesk credentials.


Sample code snippet:


<script>

  var accountDetails = {
    //The only variables to be changed are below.
    //Freshdesk Domain. Always the original domain here, please do not enter the CNAME.
    domain: 'domain.zendesk.com',
    emailAddress: 'admin@company.com',
    //Admin User API key.
    apiKey: 'Admin-API-Key'
  };

  var fcResolveCreateTicket = (function($, window, name, email) {
    if (window.FRESHCHAT_CREATE_TICKET_WIDGET) {
        window.FRESHCHAT_CREATE_TICKET_WIDGET.setItUp(name, email); // pass conversation / user info here
        return window.FRESHCHAT_CREATE_TICKET_WIDGET;
    }
    var resolveButton = window.FRESHCHAT_CREATE_TICKET_WIDGET = {

      reopenTimeStamp: '',

      createdTimeStamp: '',

      name: '',

      email: '',

      fcEvent: window.fcAgent.events,

      conversationId: window.location.href.split('/conversation/')[1],

      reqHeader: {
        "Authorization": "Basic " + btoa(accountDetails.emailAddress + "/token:" + accountDetails.apiKey),
        "Content-Type" : "application/json"
      },

      setItUp: function(name, email) {
          var _self = this;
          this.name = name;
          this.email = email;
      },

      initialize: function() {
        var _self = this;
        console.log('Init');
        this.fcEvent.unsubscribe("resolved_message",_self.resolveMessage);
        this.fcEvent.subscribe("resolved_message",_self.resolveMessage,this);
      },

      resolveMessage: function(data) {
        console.log('Clicked Resolve');
        this.assignedagentEmail = data.agent != undefined ? data.agent.email : null;
        this.assignedgroupName = data.group != undefined ? data.group.name : null;
        this.getConversationInfo();
      },

      getConversationInfo: function() {
        var _self = this;
        jQuery.ajax(
          {
            url: 'https://web.freshchat.com/app/conversation/message?rand='+jQuery.now()+'&convid='+window.location.href.split('/conversation/')[1]+'&excludeCampaign=true',
            type: 'GET',
            contentType: 'application/json',
            success:function(data) {
            _self.getRequiredData(data.conversation);

          }
          })
      },

      getRequiredData: function(data) {
        var _self = this,
            index = [],
            reopened = false;

        jQuery.each(data.messages,function(key,value) {
          if (data.messages[key].messageType == '2003') {
            reopened = true;
            index.push(key);
          }
        });

        if (reopened != true) {
          _self.createdTimeStamp = moment(data.messages[data.messages.length-1].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
          console.log('Created Time = '+_self.createdTimeStamp);
          _self.renderTicketData(data.messages,false);
        }
        else {
          var conversation = data.messages,
              ticketData = '';
          if (data.messages[index[0]].messageFragments[0].content == 'Conversation reopened due to new incoming message') {
            console.log('auto reopen');
            _self.reopenTimeStamp = moment(data.messages[index[0]].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
            ticketData = conversation.slice(0,index[0]+2);
          }
          else {
            console.log('manual reopen');
            _self.reopenTimeStamp = moment(data.messages[index[0]].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
            ticketData = conversation.slice(0,index[0]);
          }
          console.log('Reopened Time = '+_self.reopenTimeStamp);
          _self.renderTicketData(ticketData,true);
        }
      },

      renderTicketData: function(data,reopenFlag) {
        var messageContentArray = [],
            userMessages = [],
            _self = this;
        jQuery.each(data,function(i,ele) {
          if (data[i].messageType == 1) {
            console.log('userMessages');
            messageContentArray.push(data[i]);
          }
          else {
            console.log('ignore');
          }
        });

        jQuery.each(messageContentArray, function(i,ele) {
          if (messageContentArray[i].messageFragments.length < 1) {
            console.log(messageContentArray[i].messageFragments[0].content);
            userMessages.push(messageContentArray[i].messageUserName+'|'+messageContentArray[i].messageFragments[0].content);
          }
        else {
          jQuery.each(messageContentArray[i].messageFragments, function(j,ele) {
            console.log(messageContentArray[i].messageFragments[j].content);
            userMessages.push(messageContentArray[i].messageUserName+'|'+messageContentArray[i].messageFragments[j].content);
          });
          }
        });

        var startTime = (reopenFlag == true) ? _self.reopenTimeStamp : _self.createdTimeStamp;

        var endTime = moment(data[0].createdMillis).format('DD-MM-YYYY hh:mm:ss A');

        var original = userMessages.reverse();

        var html = '<div class="HotlinetimeStamp" style="padding-bottom: 10px; font-weight: 500; color: #000000;">Initialized at '+startTime+'</div>';
        jQuery.each(original,function(i,ele) {
          html+= '<div class="userName" style="display: inline-block; width: 150px; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"><strong>'+original[i].split('|')[0]+'</strong> : </div><div class="userContent" style="display: inline-block; word-break: break-word; padding-left: 5px; vertical-align: top;">'+original[i].split('|')[1]+'</div><br/>';
        });
        html+= '<div class="HotlinetimeStamp" style="padding-top: 10px; font-weight: 500; color: #000000;">Resolved at '+endTime+'</div><br/><a href="'+window.location.href+'" target="_blank">'+window.location.href+'</a>';
        _self.setTicketData(startTime,html);
      },

      setTicketData: function(startTime,html) {
        var _self = this;
        var cleanEmail = _self.email;
        var ticketEmail = cleanEmail.length > 3 ? cleanEmail : _self.name.replace(' ','-')+'@app.freshchat.com';
        var ticket = {
          "ticket": {
            "subject": "Conversation with "+_self.name,
            "comment":   { "html_body": html },
            "requester": { "name": _self.name, "email": ticketEmail }
          }
        };
        console.log(ticket);
        this.newTicketCreate(ticket);
      },

      newTicketCreate: function(ticketData) {
        var _self = this;
        jQuery.ajax({
        method: "POST",
        url: "/app/extension_proxy",
        processData: false,
        data: JSON.stringify({
          url: 'https://'+accountDetails.domain+'/api/v2/tickets.json',
          method : "POST",
          dataType: "json",
          headers: this.reqHeader,
          formParameters: {},
          rawBody: JSON.stringify(ticketData)
        }),
        success: function(data) {
          var returnTicketId = data.ticket.id;
          console.log('success');
          _self.successMessage(returnTicketId);
        },
        error : function(data){
          console.log('error');
        }
      });
    },

      successMessage: function(ticket) {
        console.log(ticket);
        var responseTicketID = ticket;
            TicketURL = "https://"+accountDetails.domain+"/agent/tickets/"+responseTicketID;
        this.fcEvent.publish('send_private_message', { message: 'Ticket #'+responseTicketID+' Created, Please go <a href="'+TicketURL+'" target="_blank">here</a> to view the ticket.' });
      }
    };
    resolveButton.initialize();
    setTimeout(function() {
        resolveButton.setItUp(name, email);
    }, 100);
    return resolveButton;
    })(jQuery, window, "{{user.name}}", "{{user.email}}");