(function (paw, utils, Input) {
    function TaskChatCommentComponent($elt, popup) {
        this.settings;
        this.localization;
        this.taskData;
        this.data;

        this.$elt = $elt;
        this.popup = popup;

        this.commentInput = null;
        this.commentModel = {
            comment: ''
        };

        this.$lastComment = null;
        this.lastComment = null;
    }

    TaskChatCommentComponent.prototype.markupDef = function(){
        var markup = [];
        markup.push('<div class="task-chat-comment-content paw-area-v paw-holder">');
        markup.push('   <div class="paw-col-d">');
        markup.push('      <div>');
        markup.push('         <div class="task-chat-comment-title task-chat-comment-title-header">');
        markup.push('            <span>' + this.localization.verifierComment + '</span>');
        markup.push('         </div>');
        markup.push('         <textarea id="task-chat-comment-last-entry" class="paw-textarea form-control" disabled></textarea>');
        markup.push('      </div>');
        markup.push('      <div class="p-t-4x">');
        markup.push('         <div class="task-chat-comment-title">');
        markup.push('            <span>' + this.localization.respondToVerifier + '</span>');
        markup.push('         </div>');
        markup.push('         <textarea id="task-chat-comment-new-entry" class="paw-textarea form-control" placeholder="' + 
            this.settings.commentPlaceholder + '"' + 
            (this.taskData.isCompleted? ' disabled': '') + 
            '></textarea>');
        markup.push('      </div>');
        markup.push('   </div>');
        
        if(!this.taskData.isCompleted){
            markup.push('   <div class="paw-col paw-area-h p-t-4x">');
            markup.push('      <div class="paw-col-d"></div>');
            markup.push('      <div class="paw-col">');
            markup.push('         <button id="task-chat-comment-cancel" class="btn btn-primary btn-outline paw-noborder">');
            markup.push('            <i class="fa fa-times"></i>');
            markup.push('            <span>' + this.localization.cancel + '</span>');
            markup.push('         </button>');
            markup.push('         <button  id="task-chat-comment-respond" class="btn btn-primary">');
            markup.push('            <span class="fa fa-check"></span>');
            markup.push('            <span>' + this.localization.respond + '</span>');
            markup.push('         </button>');
            markup.push('      </div>');
            markup.push('   </div>');
            markup.push('</div>');
        }
        else{
            markup.push('   <div class="p-t-3x"></div>');
        }

        return markup;
    };

    TaskChatCommentComponent.prototype.init = function(){
        var self = this;
        this.$lastComment = this.$elt.find('#task-chat-comment-last-entry');

        var comment = this.settings.getCommentValue();
        if(this.settings.commentPlaceholder !== comment){
            this.commentModel.comment = comment;   
        }
        
        this.commentInput = new Input(
            this.$elt.find('#task-chat-comment-new-entry'),
            'comment',
            this.commentModel
        );

        this.$elt.find('#task-chat-comment-cancel').on('click', function(){
            self.settings.onCancel(self.commentModel);
        });
        this.$elt.find('#task-chat-comment-respond').on('click', function(){
            self.settings.onRespond(self.commentModel);
        });

        if(!utils.value.isSet(this.popup.cachedLastComment)){
            utils.async.post(this.settings.taskChatLogLastEntryUrl, {
                WFInstanceId: this.taskData.wfInstanceId,
                TaskQid: this.taskData.taskQid,
                DocumentQid: 0,
                TaskType: this.taskData.taskType
            }).then(function(dto){
                if(!utils.value.isSet(dto)){
                    return;
                }
                self.lastComment = dto;
                self.$lastComment.val(self.lastComment.AcMessage);
                self.popup.cachedLastComment = self.lastComment.AcMessage;
            });
        }
        else{
            this.$lastComment.val(this.popup.cachedLastComment);
        }
    };

    TaskChatCommentComponent.prototype.destroy = function(){
        this.$elt.find('#task-chat-comment-cancel').off('click');
        this.$elt.find('#task-chat-comment-respond').off('click');
    };

    paw.com.taskChatComment.TaskChatCommentComponent = TaskChatCommentComponent;
})(paw, paw.utils, paw.com.Input)