added view spec capture options to complete link

1 files changed, 65 insertions, 5 deletions

diff --git a/src/client/views/DocumentButtonBar.tsx b/src/client/views/DocumentButtonBar.tsx
index 9298c881c..20c35739e 100644
--- a/src/client/views/DocumentButtonBar.tsx
+++ b/src/client/views/DocumentButtonBar.tsx
@@ -28,6 +28,7 @@ import { TemplateMenu } from './TemplateMenu';
 import React = require('react');
 import { DocumentType } from '../documents/DocumentTypes';
 import { FontIconBox } from './nodes/button/FontIconBox';
+import { PinProps } from './nodes/trails';
 const higflyout = require('@hig/flyout');
 export const { anchorPoints } = higflyout;
 export const Flyout = higflyout.default;
@@ -285,6 +286,52 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
             </div>
         );
     }
+    @observable subEndLink = '';
+    @computed
+    get endLinkButton() {
+        const linkBtn = (pinDocLayout: boolean, pinDocContent: boolean, icon: IconProp) => {
+            const tooltip = `Finish Link and Save ${this.subEndLink} data`;
+            return !this.view0 ? null : (
+                <Tooltip title={<div className="dash-tooltip">{tooltip}</div>}>
+                    <div className="documentButtonBar-pinIcon">
+                        <FontAwesomeIcon
+                            className="documentdecorations-icon"
+                            style={{ width: 20 }}
+                            key={icon.toString()}
+                            size="sm"
+                            icon={icon}
+                            onPointerEnter={action(e => (this.subEndLink = (pinDocLayout ? 'Layout' : '') + (pinDocLayout && pinDocContent ? ' &' : '') + (pinDocContent ? ' Content' : '')))}
+                            onPointerLeave={action(e => (this.subEndLink = ''))}
+                            onClick={e => {
+                                const docs = this.props
+                                    .views()
+                                    .filter(v => v)
+                                    .map(dv => dv!.rootDoc);
+                                this.view0 &&
+                                    DocumentLinksButton.finishLinkClick(e.clientX, e.clientY, DocumentLinksButton.StartLink, this.view0.props.Document, true, this.view0, {
+                                        pinDocLayout,
+                                        pinDocContent,
+                                        pinData: !pinDocContent ? {} : { poslayoutview: true, dataannos: true, dataview: true },
+                                    } as PinProps);
+
+                                e.stopPropagation();
+                            }}
+                        />
+                    </div>
+                </Tooltip>
+            );
+        };
+        return !this.view0 ? null : (
+            <div className="documentButtonBar-icon documentButtonBar-pin">
+                <div className="documentButtonBar-pinTypes">
+                    {linkBtn(true, false, 'window-maximize')}
+                    {linkBtn(false, true, 'address-card')}
+                    {linkBtn(true, true, 'id-card')}
+                </div>
+                <DocumentLinksButton View={this.view0} AlwaysOn={true} InMenu={true} StartLink={false} />
+            </div>
+        );
+    }
 
     @observable subPin = '';
     @computed
@@ -497,6 +544,23 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
         this._showLinkPopup = !this._showLinkPopup;
         e.stopPropagation();
     };
+
+    @observable _captureEndLinkLayout = false;
+    @action
+    captureEndLinkLayout = (e: React.PointerEvent) => {
+        this._captureEndLinkLayout = !this._captureEndLinkLayout;
+    };
+    @observable _captureEndLinkContent = false;
+    @action
+    captureEndLinkContent = (e: React.PointerEvent) => {
+        this._captureEndLinkContent = !this._captureEndLinkContent;
+    };
+
+    @action
+    captureEndLinkState = (e: React.PointerEvent) => {
+        this._captureEndLinkContent = this._captureEndLinkLayout = !this._captureEndLinkLayout;
+    };
+
     @action
     toggleTrail = (e: React.PointerEvent) => {
         const rootView = this.props.views()[0];
@@ -539,11 +603,7 @@ export class DocumentButtonBar extends React.Component<{ views: () => (DocumentV
                     <div className="documentButtonBar-button">{this.linkButton}</div>
                 )}
 
-                {(DocumentLinksButton.StartLink || Doc.UserDoc()['documentLinksButton-fullMenu']) && DocumentLinksButton.StartLink !== doc ? (
-                    <div className="documentButtonBar-button">
-                        <DocumentLinksButton View={this.view0} AlwaysOn={true} InMenu={true} StartLink={false} />
-                    </div>
-                ) : null}
+                {DocumentLinksButton.StartLink && DocumentLinksButton.StartLink !== doc ? <div className="documentButtonBar-button">{this.endLinkButton} </div> : null}
                 {
                     Doc.noviceMode ? null : <div className="documentButtonBar-button">{this.templateButton}</div>
                     /*<div className="documentButtonBar-button"> {this.metadataButton} </div> */