<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="mobile-web-app-capable" content="yes" />
    <link rel="icon" href="./favicon.ico" type="image/x-icon" />
    <title>Office Document Editor</title>

    <style>
        html {
            height: 100%;
            width: 100%;
        }

        body {
            background: #fff;
            color: #333;
            font-family: Arial, Tahoma,sans-serif;
            font-size: 12px;
            font-weight: normal;
            height: 100%;
            margin: 0;
            overflow-y: hidden;
            padding: 0;
            text-decoration: none;
        }

        form {
            height: 100%;
        }

        div {
            margin: 0;
            padding: 0;
        }
    </style>

    <script type="text/javascript" src="{{DOC_SERV_API_URL}}"></script>

    <script type="text/javascript">

//        window.history.replaceState({}, null, './?editor');

        var docEditor;

        var innerAlert = function (message) {
            if (console && console.log)
                console.log(message);
        };

        var onAppReady = function () {
            innerAlert("Document editor ready");
            // console.log(document.getElementByName('frameEditor').contentWindow.document.getElementById('id_target_cursor'));

            // document.getElementByName('frameEditor').contentWindow.document.getElementById('id_target_cursor').style.display = 'none';
        };

        var onDocumentStateChange = function (event) {
            var title = document.title.replace(/\*$/g, "");
            document.title = title + (event.data ? "*" : "");
        };

        var onRequestEditRights = function () {
            location.href = location.href.replace(RegExp("action=view\&?", "i"), "");
        };

        var onError = function (event) {
            if (event)
                innerAlert(event.data);
        };

        var onOutdatedVersion = function (event) {
            location.reload(true);
        };

        var replaceActionLink = function(href, linkParam) {
            var link;
            var actionIndex = href.indexOf("&actionLink=");
            if (actionIndex != -1) {
                var endIndex = href.indexOf("&", actionIndex + "&actionLink=".length);
                if (endIndex != -1) {
                    link = href.substring(0, actionIndex) + href.substring(endIndex) + "&actionLink=" + encodeURIComponent(linkParam);
                } else {
                    link = href.substring(0, actionIndex) + "&actionLink=" + encodeURIComponent(linkParam);
                }
            } else {
                link = href + "&actionLink=" + encodeURIComponent(linkParam);
            }
            return link;
        }

        var onMakeActionLink = function (event) {
            var actionData = event.data;
            var linkParam = JSON.stringify(actionData);
            docEditor.setActionLink(replaceActionLink(location.href, linkParam));
        };

        var onDownloadAs = function (event) {
            console.log("ONLYOFFICE Document Editor create file: " + event.data);
        };

        var connectEditor = function () {

            var config = {{CONFIG}};
            var history = {{HISTORY}};
            var historyData = {{HISTORY_DATA}};

            config.width = "100%";
            config.height = "100%";

            config.events = {
                'onAppReady': onAppReady,
                'onDocumentStateChange': onDocumentStateChange,
                'onRequestEditRights': onRequestEditRights,
                'onError': onError,
                'onOutdatedVersion': onOutdatedVersion,
                'onMakeActionLink': onMakeActionLink,
                "onDownloadAs": onDownloadAs
            };

//            console.log(config.document.url);

            if (history !== false && historyData !== false)
            {
                config.events['onRequestHistory'] = function () {
                    docEditor.refreshHistory(history);
                };
                config.events['onRequestHistoryData'] = function (event) {
//                    console.log(event.data, historyData[event.data]);
                    docEditor.setHistoryData(historyData[event.data]);
                };
                config.events['onRequestHistoryClose'] = function () {
                    document.location.reload();
                };
                // config.events['onRequestRestore'] = function (event) {
                //     var version = event.data.version;
                //     console.log('event:', event);
                //     history.currentVersion++;

                //     for (var i = 0; i < history.history.length; i++) {
                //         if (history.history[i].version === version) {
                //             var newHistory = JSON.parse(JSON.stringify(history.history[i]));
                //             newHistory.version = history.currentVersion;
                //             history.history.push(newHistory);

                //             break;
                //         }
                //     }
                //     console.log('history: ', history);

                //     var newHistoryData = JSON.parse(JSON.stringify(historyData[version]));
                //     newHistoryData.version = history.currentVersion;
                //     console.log('newHistoryData: ', newHistoryData);
                //     historyData.push(newHistoryData);
                //     historyData[history.currentVersion] = newHistoryData;
                //     console.log('historyData: ', historyData);

                //     docEditor.refreshHistory(history);
                // };
            }
            docEditor = new DocsAPI.DocEditor("iframeEditor", config);
        };

        if (window.addEventListener) {
            window.addEventListener("load", connectEditor);
        } else if (window.attachEvent) {
            window.attachEvent("load", connectEditor);
        }

    </script>
</head>
<body>
    <form id="form1">
        <div id="iframeEditor">
        </div>
    </form>
</body>
</html>