guacamole-user mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Amarjeet Singh <amarjee...@gmail.com>
Subject Re: Clipboard support using guacamole-common-js API
Date Tue, 05 Sep 2017 12:51:22 GMT
Hi Dave,

Please dig into *getLocalClipboard()* function in guacamole-common-js API,
once data is copied to *clipboardContent *it broadcast to *guacClipboard *i.e.
Guacamole menu.

*windows.clipboard* events only work in IE not in any other browsers.

In Google Chrome we can use paste event to get clipboard access.


document.addEventListener('copy', function (ev) {
> var selection = window.getSelection().toString();
>     // Transform the selection in any way we want.
>     // In this example we will escape HTML code.
>
>     // Place the transformed text in the clipboard.
>     ev.clipboardData.setData('text/plain', selection);
>     //ev.clipboardData.setData('text/plain', 'some text here, ' + new
> Date);
>     ev.preventDefault();
>     alert('Text copied to system clipboard');
> });
> document.addEventListener('paste', function (e) {
>     e.preventDefault();
>     // IE
>     if (window.clipboardData) {
>         data = window.clipboardData.getData('Text');
>     // Standard-compliant browsers
>     } else {
>         data = e.clipboardData.getData('text/plain');
>     }
> var focused = document.activeElement;
>     focused.value = data;
> });



I am not sure how to implement it in Chrome and Firefox but the following
code works in all the browsers without any API or extension. Please dig
into that.

var q = new function() {
            function a(a, b) {
                var c = q.parseClipData(b);
                if (!(n.copyTextOnly && "text/plain" != c.type ||
q.processFileGroup(c)))
                    if (t.isEdge && "text/plain" != c.type) k.resetCSS(),
k.setValue(c.value), k.select(),
                        setTimeout(function() {
                            k.setValue("");
                            Q && Q.setValue("");
                            k.restoreCSS();
                            q.processImgCopy(c.value)
                        }, 555);
                    else {
                        a.clipboardData.setData(c.type, c.value);
                        if ("text/plain" != c.type) {
                            var d = hi5.browser.html2text(c.value);
                            d && a.clipboardData.setData("text/plain", d);
                            q.processImgCopy(c.value)
                        }
                        a.preventDefault()
                    }
            }

            function b() {
                q && (q.copyContent &&
(q.copyToClipboard(q.copyContent.type, q.copyContent.value), q.copyContent
= null), q.waitingCopyContent = !1)
            }
            var d = 0;
            this.hasCopyCmd = document.queryCommandSupported("copy");
            this.hasPasteCmd =
                document.queryCommandSupported("paste");
            this.pasteEventFired = !1;
            this.release = function() {
                q.clipData = null
            };
            this.clipData = null;
            this.paste = function(a, b) {
                var c = new E,
                    d = 0,
                    f = null,
                    e = window.clipboardData || b.clipboardData,
                    g = window.clipboardData ? e.getData("Text") :
e.getData("text/plain"),
                    h = "",
                    k = "",
                    h = 0;
                e.types && (k = e.getData("text/html"));
                k && !g && (g = hi5.browser.html2text(k));
                g && c.setData("text/plain", g);
                if (n.pasteTextOnly) b.preventDefault(), a(c);
                else {
                    var l = e.items;
                    if (l)
                        for (d = 0, h = l.length; d < h; d++) {
                            if ("image/png" ==
                                l[d].type) {
                                f = l[d].getAsFile();
                                break
                            }
                        } else if (e.files)
                            for (l = e.files, d = 0, h = l.length; d < h;
d++)
                                if (-1 != l[d].type.indexOf("image/png")) {
                                    f = l[d];
                                    break
                                }
                    if (f) d = new FileReader, b.preventDefault(),
d.onloadend = function(b) {
                        b.target.readyState == FileReader.DONE && (b =
hi5.Base64.enc(new Uint8Array(b.target.result)), c.setData("image/png", b),
a(c))
                    }, d.readAsArrayBuffer(f);
                    else if (g) {
                        if (e.types) {
                            f = e.types.indexOf ? -1 !=
e.types.indexOf("text/rtf") : e.types.contains("text/rtf");
                            if (h = e.getData("text/rtf")) 0 ==
h.charCodeAt(h.length -
                                1) && (h = h.substring(0, h.length - 1)),
c.setData("text/richtext", h);
                            k && (d = k.lastIndexOf("</html>"), d + 7 <
k.length && (k = k.substring(0, d + 7)), c.setData("text/html", k));
                            if (!hi5.browser.isEdge && (!f || h || k)) {
                                b.preventDefault();
                                a(c);
                                return
                            }
                        }
                        if ("TEXTAREA" == b.target.nodeName &&
document.queryCommandSupported("paste")) b.preventDefault(), c =
q.getClipContent(c), a(c);
                        else {
                            H && (H.disableTextInput = !0);
                            Q && (Q.disableTextInput = !0);
                            b.target.innerHTML = "";
                            var t = b.target.style.opacity;
                            b.target.style.opacity = 0;
                            setTimeout(function() {
                                var d =
                                    b.target.innerHTML;
                                d && d != g && (c.setData("text/html",
"<body>" + d + "</body>"), H ? H.init() : b.target.innerHTML = "");
                                a(c);
                                b.target.style.opacity = t;
                                H && (H.disableTextInput = !1);
                                Q && (Q.disableTextInput = !1)
                            }, 300)
                        }
                    } else b.preventDefault(), a(c)
                }
            };
            this.onCopy = function(c) {
                if (c.target == k.element) {
                    M && X || cancelDefault(c);
                    if (!za) {
                        l(!0, 29);
                        var b = "copy" == c.type ? 67 : 88,
                            e = "copy" == c.type ? 46 : 45;
                        ca(!0, b, e);
                        ca(!1, b, e);
                        l(!1, 29)
                    }
                    if (Jb && (b = Date.now(), e = b - d, d = b, 500 < e))
return;
                    X && !qb && (gb = r.getClipData(c.type), a(c, gb),
q.clipData = null,
                        Y = !0, svGlobal.logger.info("clip synced: true"))
                }
            };
            this.onPaste = function(a) {
                if (a.target == k.element) {
                    Pa && Pa.cancelCtrlV();
                    if (!M || !X) return cancelDefault(a);
                    if (!g.alwaysPaste && Y) {
                        var c = !0;
                        g.onclipdata && (c = !g.onclipdata(q.clipData, !0));
                        c && setTimeout(Ra, 500);
                        svGlobal.logger.info("Ctrl+V only");
                        return cancelDefault(a)
                    }
                    Y = !0;
                    q.paste(Yb, a);
                    return !0
                }
            };
            this.parseClipData = function(a) {
                var c = a.indexOf(";"),
                    b = a.substring(0, c);
                a = a.substring(c + 1);
                return {
                    type: b,
                    value: a
                }
            };
            this.getClipContent = function(a) {
                if (!document.queryCommandSupported("paste")) return a;
                var c = Ya(n.pasteTextOnly ? "textarea" : "div");
                c.focus();
                try {
                    if (document.queryCommandEnabled("paste") &&
document.execCommand("paste")) return a || (a = new E), n.pasteTextOnly ||
a.setData("text/html", "<body>" + c.innerHTML + "</body>"), -1 ==
a.types.indexOf("text/plain") && a.setData("text/plain", n.pasteTextOnly ?
c.value : c.innerText || c.innerHTML.replace(/<br>/gi,
"\n").replace(/&nbsp;/gi, " ").replace(/&amp;/gi, "&").replace(/&quot;/gi,
'"').replace(/&lt;/gi, "<").replace(/&gt;/gi, ">")), a
                } finally {
                    g.focused = !0, c.parentNode.removeChild(c),
                        k && k.focus()
                }
                return a
            };
            this.accessClip = function(a) {
                document.queryCommandSupported("paste") || a(null);
                var c = Ya(n.pasteTextOnly ? "textarea" : "div");
                c.focus();
                c.addEventListener("paste", function(b) {
                    b.stopPropagation();
                    q.pasteEventFired = !0;
                    q.paste(function(b) {
                        g.focused = !0;
                        c.parentNode && c.parentNode.removeChild(c);
                        k && k.focus();
                        a(b)
                    }, b)
                }, !1);
                q.pasteEventFired = !1;
                document.queryCommandEnabled("paste") &&
document.execCommand("paste") && q.pasteEventFired || setTimeout(function()
{
                    Y = !0;
                    q.pasteEventFired || a(null);
                    g.focused = !0;
                    c.parentNode && c.parentNode.removeChild(c);
                    k && k.focus()
                }, 55)
            };
            this.getContent = function() {
                var a = q.getClipContent();
                k && k.element.removeEventListener("click", q.getContent,
!1);
                return a && !a.equals(q.clipData) ? (q.clipData = a,
r.send("880text/plain,text/html\t0"), !0) : !1
            };
            this.startPasteCmd = function() {
                k && document.queryCommandSupported("paste") &&
k.element.addEventListener("click", q.getContent)
            };
            this.waitingCopyContent = !1;
            this.copyContent = null;
            this.waitForCopyContent = function() {
                q.waitingCopyContent = !0;
                setTimeout(b,
                    700)
            };
            this.prePaste = function() {
                Y || !document.queryCommandEnabled("paste") &&
!window.clipboardData || q.accessClip(function(a) {
                    if (a) {
                        var c = 0 === a.types.length ||
a.equals(q.clipData),
                            b = c ? "" : a.types.join(",");
                        c || (-1 != b.indexOf("text/html") && -1 ==
b.indexOf("text/richtext") && (b += ",text/richtext"), c = (c =
a.getData("text/plain")) ? c.hashCode() : 0, r.send("880" + b + "\t" + c),
q.clipData = a, Y = !0)
                    }
                })
            };
            this.copyToClipboard = function(a, b) {
                var c = "text/plain" == a ? "textarea" : "div",
                    d = Ya(c, !1),
                    f = !1,
                    e = 0 < b.indexOf("data-sv-img");
                if ("div" ==
                    c)
                    if (d.innerHTML = b, d.focus(), e &&
document.body.createControlRange) {
                        var h = document.body.createControlRange();
                        h.add(d.childNodes[0]);
                        e = !1
                    } else t.selectEditable(d);
                else d.value = b, d.focus(), d.select();
                try {
                    f = h ? h.execCommand("Copy") :
document.execCommand("copy", !1, null)
                } catch (y) {} finally {
                    g.focused = !0, d.parentNode.removeChild(d), k &&
k.focus()
                }
                Y = !0;
                if (!f && g.beforeCopyDialog && g.beforeCopyDialog(b,
__svi18n.info.imgCopyDownload, a)) return !0;
                c = e && q.processImgCopy(b);
                f || c || g.showMessage({
                    title: __svi18n.info.userCopy,
                    msg: b,
                    timeout: 9999,
                    select: !0,
                    format: a
                });
                return f
            };
            this.processFileGroup = function(a) {
                if ("application/x-filegroup" == a.type) {
                    a = a.value.split("\r\n");
                    var b = "",
                        c = 0;
                    a.forEach(function(a) {
                        a = a.split("\t");
                        1 < a.length && (b && (b += ","), b += a[0], c
+=
parseInt(a[1], 10))
                    });
                    28 < b.length && (b = b.substring(0, 28) + "...");
                    b = b + "<br>Total: " + hi5.tool.bytesToSize(c) + "
Qty:" + a.length;
                    g.showMessage({
                        title: __svi18n.info.download,
                        msg: b,
                        timeout: 9E3,
                        cbYes: function() {
                            this.destroy();
                            I.download()
                        },
                        cbNo: function() {
                            this.destroy()
                        }
                    });
                    return !0
                }
                return !1
            };
            this.processImgCopy = function(a) {
                return 0 < a.indexOf("data-sv-img") ? (g.showMessage({
                    title: __svi18n.info.imgCopyDownload,
                    msg: a,
                    timeout: 9999
                }), !0) : !1
            }
        },

Please do let me know if it helps. For discussion  or any queries please
let me know. I am also working it to work on all the browsers.

Regards,
Amarjeet Singh

On Sun, Sep 3, 2017 at 10:05 AM, davids4us <davids4us@gmail.com> wrote:

> Hi,
>
> First of all, I want to say Guacamole is great and I appropriate the work
> and efforts you invest in it.
>
> I am implementing a Guacamole client using guacamole-common-js API, and I
> would like to add clipboard support. I understood from the official
> documentation that clipboard is currently supported only by the web
> application and not by the API.
>
> Can you please guide me how to implement it myself?
> If you can point me to some code that does it already it would be great.
>
> Thanks,
> Dave
>
>
>
>
> --
> Sent from: http://apache-guacamole-incubating-users.2363388.n4.nabble.com/
>

Mime
View raw message