﻿<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="ClientGlobalContext.js.aspx"></script>
    <script src="work365_addon_attachmentrelocator_jquery3.1.0.min.js" type="text/javascript"></script>
    <script src="work365_addon_attachmentrelocator_json2.js" type="text/javascript"></script>
    <script src="work365_addon_attachmentrelocator_jquery_ui.min.js" type="text/javascript"></script>
        <style>
            div.containercss {
                font-family: Segoe\000020UI,Tahoma,Arial;
            }

                div.containercss table {
                    border-collapse: collapse;
                    width: 100%;
                    margin: 0 0 20px 0;
                    font-size: 12px;
                }

                    div.containercss table tr td {
                        padding: 3px;
                        border: #bdbdbd 1px solid;
                    }

                    div.containercss table tr th {
                        background: #e4e4e4;
                        text-align: left;
                        border: #bdbdbd 1px solid;
                        padding: 4px;
                    }

                        div.containercss table tr td:last-child, div.containercss table tr th:last-child {
                            text-align: left;
                        }

                    div.containercss table tr:nth-child(even) td {
                        background-color: #f9f9f9;
                    }

                div.containercss h3 {
                    margin-bottom: 7px;
                }

            /*#itempreview {
                width: 100% !important;
                height: 400px;
            }*/
            .NotesContainer .content {
                display: none;
                padding: 5px;
            }
            .EmailsContainer .content {
                display: none;
                padding: 5px;
            }
            .styref
            {
                cursor:pointer;
                padding:5px;
            }
        </style>

        <script type="text/javascript">
            var recordId = window.parent.Xrm.Page.data.entity.getId();
            recordId = recordId.replace( '{', '' ).replace( '}', '' )
        $( document ).ready( function ()
        {   
            GetCurrentRecordAttachmentsNotes();
            GetCurrentRecordAttachmentsEmails();

            //ExpandCollapse Notes Div
            $( ".headerNotes" ).click( function ()
            {

                $header = $( this );
                //getting the next element
                $content = $header.next();
                //open up the content needed - toggle the slide- if visible, slide up, if not slidedown.
                $content.slideToggle( 500, function ()
                {
                    //execute this after slideToggle is done
                    //change text of header based on visibility of content div
                    $header.text( function ()
                    {
                        //change text based on condition
                       // return $content.is( ":visible" ) ? "Collapse" : "Notes Attachments";
                    } );
                } );

            } );
        

        //ExpandCollapse Email Div
        $( ".headerEmail" ).click( function ()
        {

            $header = $( this );
            //getting the next element
            $content = $header.next();
            //open up the content needed - toggle the slide- if visible, slide up, if not slidedown.
            $content.slideToggle( 500, function ()
            {
                //execute this after slideToggle is done
                //change text of header based on visibility of content div
                $header.text( function ()
                {
                    //change text based on condition
                    //return $content.is( ":visible" ) ? "Collapse" : "Emails  Attachments";
                } );
            } );

        } );
        } );

        function GetCurrentRecordAttachmentsNotes()
        {

            var container = $( '#my-container' ),                
            table = $('<table>');
            var thead = $('<thead>');
            var theadTr = $('<tr>');

            theadTr.append('<th width="30%">Subject</th>');
            theadTr.append('<th>File Name</th>');
            theadTr.append( '<th>File Type</th>' );
            theadTr.append( '<th width="10%">Created On</th>' );
            thead.append(theadTr);
            table.append(thead);
            
            var viewInBrowser = ["image/png", "text/plain", "application/pdf", "image/jpg", "image/bmp"];
            var req = new XMLHttpRequest();
            req.open( "GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/annotations?$select=annotationid,documentbody,filename,mimetype,subject,createdon&$orderby=createdon desc&$filter=_objectid_value eq " + recordId + " and  isdocument eq true and mimetype eq 'application/internet-shortcut'", true );
            req.setRequestHeader( "OData-MaxVersion", "4.0" );
            req.setRequestHeader( "OData-Version", "4.0" );
            req.setRequestHeader( "Accept", "application/json" );
            req.setRequestHeader( "Content-Type", "application/json; charset=utf-8" );
            req.onreadystatechange = function ()
            {
                if ( this.readyState === 4 ) {
                    req.onreadystatechange = null;
                    if ( this.status === 200 ) {
                        
                        var results = JSON.parse( this.response );
                        for ( var i = 0; i < results.value.length; i++ ) {
                            var annotationid = results.value[i]["annotationid"];
                            var documentbody = results.value[i]["documentbody"];
                            var filename = results.value[i]["filename"];
                            var fileObject=getFileNameandExtension( filename );
                            var mimetype = results.value[i]["mimetype"];
                            var subject = results.value[i]["subject"];
                            var createdOn = results.value[i]["createdon"];

                            if ( mimetype == "application/internet-shortcut" )
                            {
                                var tr = $( '<tr>' );
                               
                                //var url = "data:" + mimetype + ";base64," + documentbody; //used for other file format other than .url
                                var url = getUrl( documentbody );//gets azure blob url from documentbody
                                var id = "h" + i;
                                
                                tr.append( '<td>' + subject + '<input id="' + id + '" type="hidden" value="' + url + '"/></td>' );
                                var Isview = false;
                                for ( var j = 0; j < viewInBrowser.length; j++ ) {
                                    if ( viewInBrowser[j] == mimetype ) {
                                        Isview = true;
                                        break;
                                    }
                                }

                                if ( Isview ) {
                                    var alink = "<a id='" + id + "' href='#' onclick='showData(this);'> " + fileObject[0].value.toString() + " </a>";
                                    tr.append( '<td>' + alink + '</td>' );
                                }
                                else {
                                    var alink = "<a id ='" + id + "' href='#' onclick='showData(this);'>" + fileObject[0].value.toString() + " </a>";
                                    tr.append( '<td>' + alink + '</td>' );
                                }
                                tr.append( '<td>' + fileObject[1].value.toString() + '</td>' );
                                var d = new Date( createdOn );
                                tr.append( '<td>' + d.getFullYear() + "-" + ( d.getMonth() + 1 ) + "-" + d.getDate() + " " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds() + '</td>' );
                               
                                table.append( tr );
                            }
                            
                        }
                        
                    }
                    else {
                        //alert(this.statusText);
                    }
                }
            };
            container.append( table );
            req.send();
            
        }

        function GetCurrentRecordAttachmentsEmails()
        {
            var container = $( '#my-container1' ),
            table = $( '<table>' );
            var thead = $( '<thead>' );
            var theadTr = $( '<tr>' );

            theadTr.append( '<th width="15%">Sender</th>' );
            theadTr.append( '<th>Recipients</th>' );
            theadTr.append( '<th>Subject</th>' );
            theadTr.append( '<th>Direction</th>' );
            theadTr.append( '<th>File Name</th>' );
            theadTr.append( '<th>File Type</th>' );
            theadTr.append( '<th width="10%">Modified On</th>' );
            thead.append( theadTr );
            table.append( thead );

            var viewInBrowser = ["image/png", "text/plain", "application/pdf", "image/jpg", "image/bmp"];

            //getting regarding email id 
            getEmailObject( container, table );
            

        }
        function getEmailObject( container, table )
        {
            
            var req = new XMLHttpRequest();
            req.open( "GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/emails?$select=activityid,subject,sender,torecipients,directioncode,modifiedon&$orderby=modifiedon desc&$filter=_regardingobjectid_value eq " + recordId + "", true );
            req.setRequestHeader( "OData-MaxVersion", "4.0" );
            req.setRequestHeader( "OData-Version", "4.0" );
            req.setRequestHeader( "Accept", "application/json" );
            req.setRequestHeader( "Content-Type", "application/json; charset=utf-8" );
            req.setRequestHeader( "Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"" );
            req.onreadystatechange = function ()
            {
                if ( this.readyState === 4 ) {
                    req.onreadystatechange = null;
                    if ( this.status === 200 ) {
                        var results = JSON.parse( this.response );
                        for ( var i = 0; i < results.value.length; i++ ) {
                            var emailid = results.value[i]["activityid"];
                            var subject = results.value[i]["subject"];
                            var sender = results.value[i]["sender"];
                            var torecipients = results.value[i]["torecipients"];
                            var direction = results.value[i]["directioncode"] == true ? "Sent" : results.value[i]["directioncode"] == false ? "Recieved" : "";
                            var createdOn = results.value[i]["modifiedon"];
                            var dict = []; // create an empty array
                            //push data in Dictionary
                            dict.push( { key: "emailid", value: emailid } );
                            dict.push( { key: "subject", value: subject } );
                            dict.push( { key: "sender", value: sender } );
                            dict.push( { key: "torecipients", value: torecipients } );
                            dict.push( { key: "directioncode", value: direction } );
                            dict.push( { key: "createdOn", value: createdOn } );
                            
                            //generate table for each email attachments
                            generateAttachmentsTable( dict, container, table,i );

                        }
                    }
                    else {
                        //alert( this.statusText );
                    }
                }
            };
            
            req.send();
            
        }
        function generateAttachmentsTable( dict, container, table, i )
        {  
            var emailId = dict[0].value;
            var emailsubject = dict[1].value;
            var sender = dict[2].value;
            var torecipients = dict[3].value;
            var direction = dict[4].value;
            var createdOn = dict[5].value;
            var viewInBrowser = ["image/png", "text/plain", "application/pdf", "image/jpg", "image/bmp"];

            var req = new XMLHttpRequest();
            req.open( "GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/activitymimeattachments?$filter=_objectid_value eq " + emailId + " and mimetype eq 'application/internet-shortcut'", true );
            req.setRequestHeader( "OData-MaxVersion", "4.0" );
            req.setRequestHeader( "OData-Version", "4.0" );
            req.setRequestHeader( "Accept", "application/json" );
            req.setRequestHeader( "Content-Type", "application/json; charset=utf-8" );
            req.setRequestHeader( "Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"" );
            req.onreadystatechange = function ()
            {
                if ( this.readyState === 4 ) {
                    req.onreadystatechange = null;
                    if ( this.status === 200 ) {
                        var results = JSON.parse( this.response );
                        for ( var j = 0; j < results.value.length; j++ ) {
                            var activitymimeattachmentid = results.value[j]["activitymimeattachmentid"];
                            var documentbody = results.value[j]["body"];
                            var filename = results.value[j]["filename"];
                            var fileObject = getFileNameandExtension( filename );
                            var mimetype = results.value[j]["mimetype"];
                            var subject = emailsubject;

                            if ( mimetype == "application/internet-shortcut" )
                            {
                                var tr = $( '<tr>' );
                                tr.append( '<td>' + sender + '</td>' );
                                tr.append( '<td>' + torecipients + '</td>' );
                                //tr.append( '<td>' + subject + '</td>' );
                                //tr.append( '<td>' + filename + '</td>' );
                                //tr.append( '<td>' + fileObject[0].value.toString() + '</td>' );
                                
                                var url = getUrl( documentbody ); //gets azure blob url from documentbody
                                var id = i + j + Date.now().toString();
                                tr.append( '<td>' + subject + '<input id="' + id + '" type="hidden" value="' + url + '"/></td>' );
                                tr.append( '<td>' + direction + '</td>' );
                                var Isview = false;
                                for ( var k = 0; k < viewInBrowser.length; k++ ) {
                                    if ( viewInBrowser[k] == mimetype ) {
                                        Isview = true;
                                        break;
                                    }
                                }

                                if ( Isview ) {
                                    //var alink = "<a id='" + id + "' href='#' onclick='showData(this);'> View </a>";
                                    var alink = "<a id='" + id + "' href='#' onclick='showData(this);'> " + fileObject[0].value.toString() + " </a>";
                                    tr.append( '<td>' + alink + '</td>' );
                                }
                                else {
                                    //var alink = "<a id ='" + id + "' href='#' onclick='showData(this);'>Download</a>";
                                    var alink = "<a id ='" + id + "' href='#' onclick='showData(this);'>" + fileObject[0].value.toString() + "</a>";
                                    tr.append( '<td>' + alink + '</td>' );
                                }
                                tr.append( '<td>' + fileObject[1].value.toString() + '</td>' );
                                var d = new Date( createdOn );
                                tr.append( '<td>' + d.getFullYear() + "-" + ( d.getMonth() + 1 ) + "-" + d.getDate() + " " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds() + '</td>' );
                                table.append( tr );
                            }

                        }
                    }
                    else {
                        //alert( this.statusText );
                    }
                }
            };
            container.append( table );
            req.send();
        }
        function showData( ctrl )
        {
            var id = ctrl.id;
            var url = $( '#' + id ).val();
            window.open( url );
            //document.getElementById( "itempreview" ).src = url; //to shoow in iframe
        }

        function getUrl( base64 )
        {
            var binaryString = window.atob( base64 );
            binaryString=binaryString.substring( binaryString.lastIndexOf( "=" ) + 1, binaryString.length )
            return binaryString;
        }
        function getFileNameandExtension( filename )
        {
            var file = filename;
            var extension = "";
            if ( filename.lastIndexOf( ".url" ) > 1 )
            {
                extension = filename.substring( filename.indexOf( "." ) + 1, filename.lastIndexOf( "." ) );
                file = filename.substring( 0, filename.lastIndexOf( "." ) );
            }
            else if ( filename.lastIndexOf( "." ) > 1 )
            {
                extension = filename.substring( filename.indexOf( "." ) + 1, filename.length );
            }
            var dict = []; 
            dict.push( { key: "file", value: file } );
            dict.push( { key: "extension", value: extension } );
            return dict;
        }
        function RefreshTable()
        {
            //delete all controls under Div
            var containerDiv = document.getElementById( "my-container" );
            while ( containerDiv.hasChildNodes() ) {
                containerDiv.removeChild( containerDiv.lastChild );
            }
            var containerDiv1 = document.getElementById( "my-container1" );
            while ( containerDiv1.hasChildNodes() ) {
                containerDiv1.removeChild( containerDiv1.lastChild );
            }

            GetCurrentRecordAttachmentsNotes();
            GetCurrentRecordAttachmentsEmails();
        }
       
    </script>

</head>
<body>
    <div style="align-items:flex-end">
        <img src="work365_refresh.png" onclick="RefreshTable()" class="styref" style="float:right" title="Refresh" onmouseover="this.src = 'work365_grid_refresh_hover.png';" onmouseout="this.src = 'work365_refresh.png';" />
    </div>
       
    <div class="NotesContainer">
        <div class="headerNotes">
            <h3><span>Notes Attachments</span></h3>
        </div>
        <div id="my-container" class="containercss">
        </div>
    </div>
    <div class="EmailsContainer">
        <div class="headerEmail">
            <h3><span>Emails Attachments</span></h3>
        </div>
        <div id="my-container1" class="containercss">
        </div>
        </div>
        <br />
        <!--<h3> View Attachment</h3>
         <div>
             <br />
             <iframe id="itempreview" frameborder="0" scrolling="yes" style="visibility:hidden" />
         </div>-->
</body>
</html>