1 files changed, 19 insertions, 0 deletions
diff --git a/src/client/views/PropertiesButtons.tsx b/src/client/views/PropertiesButtons.tsx
index f9dab9f82..dd6448654 100644
--- a/src/client/views/PropertiesButtons.tsx
+++ b/src/client/views/PropertiesButtons.tsx
@@ -18,6 +18,10 @@ import React = require("react");
 import { Colors } from "./global/globalEnums";
 import { CollectionFreeFormView } from "./collections/collectionFreeForm";
 import { DocumentManager } from "../util/DocumentManager";
+import { pasteImageBitmap } from "./nodes/WebBoxRenderer";
+import { VideoBox } from "./nodes/VideoBox";
+import { Id } from "../../fields/FieldSymbols";
+import { ImageField } from "../../fields/URLField";
 const higflyout = require("@hig/flyout");
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
@@ -92,6 +96,20 @@ export class PropertiesButtons extends React.Component<{}, {}> {
     @computed get groupButton() {
         return this.propertyToggleBtn("Group", "isGroup", on => `Display collection as a Group`, on => "object-group", (dv, doc) => { doc.isGroup = !doc.isGroup; doc.forceActive = doc.isGroup; });
     }
+    @computed get freezeThumb() {
+        return this.propertyToggleBtn("Freeze\Thumb", "_thumb-frozen", on => `${on ? "Freeze" : "Unfreeze"} thumbnail`, on => "arrows-alt-h", (dv, doc) => {
+            if (doc["thumb-frozen"]) doc["thumb-frozen"] = undefined;
+            else {
+                document.body.focus(); // so that we can access the clipboard without an error
+                setTimeout(() =>
+                    pasteImageBitmap((data: any, error: any) => {
+                        error && console.log(error);
+                        data && VideoBox.convertDataUri(data, doc[Id] + "-thumb-frozen", true).then(
+                            returnedfilename => doc["thumb-frozen"] = new ImageField(returnedfilename));
+                    }));
+            }
+        });
+    }
     @computed get snapButton() {
         return this.propertyToggleBtn("Snap\xA0Lines", "showSnapLines", on => `Display snapping lines when objects are dragged`, on => "border-all", undefined, true);
     }
@@ -222,6 +240,7 @@ export class PropertiesButtons extends React.Component<{}, {}> {
                 {toggle(this.dictationButton, { display: isNovice ? "none" : "" })}
                 {toggle(this.onClickButton)}
                 {toggle(this.fitWidthButton)}
+                {toggle(this.freezeThumb)}
                 {toggle(this.fitContentButton, { display: !isFreeForm && !isMap ? "none" : "" })}
                 {toggle(this.autoHeightButton, { display: !isText && !isStacking && !isTree ? "none" : "" })}
                 {toggle(this.maskButton, { display: !isInk ? "none" : "" })}