<script>
    $('.module-actions').html('<input placeholder="tag" style="color: black; font-size: 9pt;float: left; width: 100px; margin-right: 5px;" type="text" id="tagInput"><button id="addTag" style="color: black; float: left;">Add tag</button><a class="show-more square-button tooltip-theme-arrows tooltip-target tooltip-element-attached-bottom tooltip-element-attached-right tooltip-target-attached-top tooltip-target-attached-right" data-tooltip="More" data-tooltip-position="top right">More</a><a class="pin-view square-button tooltip-theme-arrows tooltip-target tooltip-element-attached-bottom tooltip-element-attached-right tooltip-target-attached-top tooltip-target-attached-right" href="#" data-tooltip="Pin Module to Grid" data-tooltip-position="top right">Pin</a><a class="remove square-button tooltip-theme-arrows tooltip-target tooltip-element-attached-bottom tooltip-element-attached-right tooltip-target-attached-top tooltip-target-attached-right" href="#" data-tooltip="Close" data-tooltip-position="top right">Close</a>');


</script>

<div class="chat-time">
    <time class="time-standard">{{timestamp ingestionDate "hh:mm:ss a"}}</time>
    <time class="time-twentyfour">{{timestamp ingestionDate "HH:mm:ss"}}</time>
    {{#if showReadReceipt}}
        {{parseReadReceipts this}}
    {{/if}}

</div>
<input type="checkbox" name="assignCheckbox" class="assignCheckbox" value="tag" style="display: inline !important; float:left;">
<!--<div class="tagg tag" id="testTag">testTag</div>-->
{{#if showName}}
{{#if showPresence}}
     {{#unless oneToOneUserId}}
        <!--add an &nbsp; so that if user copy the whole message, there will be a space between timestamp and username-->
        <span class="has-presence presence-indicator presence-unknown" data-userid="{{from.id}}">&nbsp;</span>
     {{/unless}}
{{/if}}
{{/if}}
<div {{#unless oneToOneUserId}} class="chat-not-time" {{else}} class="chat-not-time no-presence" {{/unless}}>
    <p>
        {{#if isChime}}
            <p class="chat-text"><span class="msg-entity person has-hover-profile" data-userid="{{from.id}}" data-usertype="{{from.userType}}">{{from.prettyName}}</span> sent a chime.</p>
        {{else}}
            {{#if showName}}
            <span class="chat-username has-hover-profile" data-userid="{{from.id}}">
                <span class="display-id hidden">{{from.screenName}}</span>
                {{#if isSender}}
                    <span class="display-name sender-name">You</span>
                {{else}}
                    <span class="display-name colorable aliasable" data-userid="{{from.id}}">{{from.prettyName}}</span>
                {{/if}}
            </span>:
            {{/if}}
            <span class="chat-text">{{parseMessageText text entities media}}</span>
            {{#if attachments}}
                {{#each attachments}}
                <span class="file-download">
                    <a href="{{../apiUrl}}/attachment/download?fileid={{fileId}}&messageid={{urlEncoded ../messageId}}" class="attachment{{ifPreviewContent name}}" download="{{name}}">{{name}} ({{friendlyFileSize sizeInBytes}})</a>
                </span>
                {{/each}}
            {{/if}}
        {{/if}}
    </p>

</div>

<script>

//sessionStorage.setItem('test', ['df', 123]);
//alert(typeof sessionStorage.test);

//$('.assignCheckbox').attr('id', $("button").closest("div").attr("id"););

    $('.tagg').click(function(){
        //alert('test');
        var mesId = $(this).parent().attr('data-message-id');
        alert(mesId);
        //$(this).text('hiKen');
        //tagArray.append({messageId: mesId, tagName: 'hiKen'});
        //console.log(tagArray);
        //alert(tagArray);
    });


    $('#addTag').on('click', function(){
        if($('#tagInput').val() == null || $('#tagInput').val() == "")
        {
            alert("Please input a tag value.");
        }
        else
        {
            $('input[name=assignCheckbox]:checked').each(function(){
                alert($(this).val());
                //alert($(this).find('.chat-not-time').children().find('.chat-text').val());
            });
            //alert($("input[name=assignCheckbox]:checked").val());
        }
    });
</script>