#246 updated for 2.2.6

senzing-garage · Nov 23, 2021 · 48fe787 · 48fe787
1 parent 6e5be3e
commit 48fe787
Show file tree

Hide file tree

Showing 6 changed files with 642 additions and 6 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,6 +6,34 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 [markdownlint](https://dlaa.me/markdownlint/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [2.2.6] - 2021-11-23
+### Added
+- `SzEntityDetailGraphComponent`
+   - `showZoomControl` input setter for whether or not to show zoom controls.
+   - `showZoomControl` getter for whether or not zoom controls are shown.
+   - `zoomControlPosition` input setter for where the zoom control shows up on the embedded graph.
+   - `zoomControlPosition` getter for where the zoom control shows up on the embedded graph.
+   - `graphZoom` input setter for the current zoom level of the graph.
+   - `graphZoom` getter for the current zoom level of the graph.
+   - `onGraphZoom()` handler for proxying zoom state of graph component to local scope.
+   - `zoomIn()` zooms the graph in.
+   - `zoomOut()` zooms the graph out.
+- `SzStandaloneGraphComponent`
+   - `showZoomControl` input setter for whether or not to show zoom controls.
+   - `showZoomControl` getter for whether or not zoom controls are shown.
+   - `zoomControlPosition` input setter for where the zoom control shows up on the embedded graph.
+   - `zoomControlPosition` getter for where the zoom control shows up on the embedded graph.
+   - `graphZoom` input setter for the current zoom level of the graph.
+   - `graphZoom` getter for the current zoom level of the graph.
+   - `onGraphZoom()` handler for proxying zoom state of graph component to local scope.
+   - `zoomIn()` zooms the graph in.
+   - `zoomOut()` zooms the graph out.
+- `SzEntityDetailComponent`
+   - `graphZoomControlPosition` input setter for where the zoom control shows up on the embedded graph.
+   - `graphShowZoomControl` input setter for whether or not to show zoom controls on embedded graph.
+
+relevant tickets: #245 #240
+
 ## [2.2.5] - 2021-11-01
 
 - Graph now allows the user to be able to show/hide entities on the graph control whos' relationships belong to specific match keys present in the graph in the filters control.

diff --git a/docs/changelog.html b/docs/changelog.html
@@ -35,6 +35,40 @@ <h1 id="changelog">Changelog</h1>
 <p>The format is based on <a href="https://keepachangelog.com/en/1.0.0/">Keep a Changelog</a>,
 <a href="https://dlaa.me/markdownlint/">markdownlint</a>,
 and this project adheres to <a href="https://semver.org/spec/v2.0.0.html">Semantic Versioning</a>.</p>
+<h2 id="226---2021-11-23">[2.2.6] - 2021-11-23</h2>
+<h3 id="added">Added</h3>
+<ul>
+<li><code>SzEntityDetailGraphComponent</code><ul>
+<li><code>showZoomControl</code> input setter for whether or not to show zoom controls.</li>
+<li><code>showZoomControl</code> getter for whether or not zoom controls are shown.</li>
+<li><code>zoomControlPosition</code> input setter for where the zoom control shows up on the embedded graph.</li>
+<li><code>zoomControlPosition</code> getter for where the zoom control shows up on the embedded graph.</li>
+<li><code>graphZoom</code> input setter for the current zoom level of the graph.</li>
+<li><code>graphZoom</code> getter for the current zoom level of the graph.</li>
+<li><code>onGraphZoom()</code> handler for proxying zoom state of graph component to local scope.</li>
+<li><code>zoomIn()</code> zooms the graph in.</li>
+<li><code>zoomOut()</code> zooms the graph out.</li>
+</ul>
+</li>
+<li><code>SzStandaloneGraphComponent</code><ul>
+<li><code>showZoomControl</code> input setter for whether or not to show zoom controls.</li>
+<li><code>showZoomControl</code> getter for whether or not zoom controls are shown.</li>
+<li><code>zoomControlPosition</code> input setter for where the zoom control shows up on the embedded graph.</li>
+<li><code>zoomControlPosition</code> getter for where the zoom control shows up on the embedded graph.</li>
+<li><code>graphZoom</code> input setter for the current zoom level of the graph.</li>
+<li><code>graphZoom</code> getter for the current zoom level of the graph.</li>
+<li><code>onGraphZoom()</code> handler for proxying zoom state of graph component to local scope.</li>
+<li><code>zoomIn()</code> zooms the graph in.</li>
+<li><code>zoomOut()</code> zooms the graph out.</li>
+</ul>
+</li>
+<li><code>SzEntityDetailComponent</code><ul>
+<li><code>graphZoomControlPosition</code> input setter for where the zoom control shows up on the embedded graph.</li>
+<li><code>graphShowZoomControl</code> input setter for whether or not to show zoom controls on embedded graph.</li>
+</ul>
+</li>
+</ul>
+<p>relevant tickets: #245 #240</p>
 <h2 id="225---2021-11-01">[2.2.5] - 2021-11-01</h2>
 <ul>
 <li>Graph now allows the user to be able to show/hide entities on the graph control whos&#39; relationships belong to specific match keys present in the graph in the filters control.</li>

diff --git a/docs/components/SzEntityDetailComponent.html b/docs/components/SzEntityDetailComponent.html
@@ -277,9 +277,15 @@ <h6><b>Inputs</b></h6>
                             <li>
                                 <a href="#graphShowPopOutIcon">graphShowPopOutIcon</a>
                             </li>
+                            <li>
+                                <a href="#graphShowZoomControl">graphShowZoomControl</a>
+                            </li>
                             <li>
                                 <a href="#graphTitle">graphTitle</a>
                             </li>
+                            <li>
+                                <a href="#graphZoomControlPosition">graphZoomControlPosition</a>
+                            </li>
                             <li>
                                 <a href="#possibleMatchesSectionCollapsed">possibleMatchesSectionCollapsed</a>
                             </li>
@@ -793,6 +799,27 @@ <h3 id="inputs">Inputs</h3>
                 <tr>
                     <td class="col-md-4">
                         <div class="io-description"><p>show the pop-out icon control </p>
+</div>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+        <table class="table table-sm table-bordered">
+            <tbody>
+                <tr>
+                    <td class="col-md-4">
+                        <a name="graphShowZoomControl"></a>
+                        <b>graphShowZoomControl</b>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="col-md-4">
+                        <i>Default value : </i><code>false</code>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="col-md-4">
+                        <div class="io-description"><p>show the pop-out icon control </p>
 </div>
                     </td>
                 </tr>
@@ -815,6 +842,28 @@ <h3 id="inputs">Inputs</h3>
                 <tr>
                     <td class="col-md-4">
                         <div class="io-description"><p>graph section title</p>
+</div>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+        <table class="table table-sm table-bordered">
+            <tbody>
+                <tr>
+                    <td class="col-md-4">
+                        <a name="graphZoomControlPosition"></a>
+                        <b>graphZoomControlPosition</b>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="col-md-4">
+                        <i>Default value : </i><code>&#x27;top-left&#x27;</code>
+                    </td>
+                </tr>
+                <tr>
+                    <td class="col-md-4">
+                        <div class="io-description"><p>what position the pop-out icon should be displayed
+(&#39;top-left&#39; | &#39;top-right&#39; | &#39;bottom-right&#39; | &#39;bottom-left&#39;)</p>
 </div>
                     </td>
                 </tr>
@@ -4278,6 +4327,8 @@ <h3 id="accessors">
     [captureMouseWheel]&#x3D;&quot;graphAllowScrollingZoom&quot;
     [showPopOutIcon]&#x3D;&quot;graphShowPopOutIcon&quot;
     [popOutIconPosition]&#x3D;&quot;graphPopOutIconPosition&quot;
+    [showZoomControl]&#x3D;&quot;graphShowZoomControl&quot;
+    [zoomControlPosition]&#x3D;&quot;graphZoomControlPosition&quot;
     (popoutClick)&#x3D;&quot;onGraphPopoutClick($event)&quot;
     [showMatchKeyControl]&#x3D;&quot;graphShowMatchKeyControl&quot;
     [showFiltersControl]&#x3D;&quot;graphShowFiltersControl&quot;
@@ -4369,7 +4420,7 @@ <h3 id="accessors">
 <script src="../js/libs/htmlparser.js"></script>
 <script src="../js/libs/deep-iterator.js"></script>
 <script>
-        var COMPONENT_TEMPLATE = '<div><!-- @senzing/sdk/entity/detail/sz-entity-detail --><div #nativeElementRef>  <sz-entity-detail-header  [entity]="entity"  [forceLayout]="_forceLayout"  [layoutClasses]="_layoutEnforcers">  </sz-entity-detail-header>  <sz-entity-detail-graph data-html2canvas-ignore    *ngIf="graphData && this.showGraphSection"    [data]="graphData"    [title]="this.graphTitle"    [captureMouseWheel]="graphAllowScrollingZoom"    [showPopOutIcon]="graphShowPopOutIcon"    [popOutIconPosition]="graphPopOutIconPosition"    (popoutClick)="onGraphPopoutClick($event)"    [showMatchKeyControl]="graphShowMatchKeyControl"    [showFiltersControl]="graphShowFiltersControl"    [showMatchKeys]="this._showGraphMatchKeys"    (contextMenuClick)="onGraphRightClick($event)"    (scrollWheelEvent)="graphScrollWheelEvent.emit($event)"    (entityClick)="onGraphEntityClick($event)"  ></sz-entity-detail-graph>  <sz-entity-details-section class="details-section datasources"    *ngIf="entity?.resolvedEntity?.records?.length && this.showMatchesSection"    collapsedStatePrefsKey="recordsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'recordsSectionCollapsed\', $event)"    [sectionData]="entity?.resolvedEntity?.records"    [sectionTitle]="\'Matched Records\'"    sectionId="detail-section-1"    [sectionCount]="entity?.resolvedEntity?.records?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInMatchesSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section possible"    *ngIf="this._possibleMatches?.length && this.showPossibleMatchesSection"    collapsedStatePrefsKey="possibleMatchesSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleMatchesSectionCollapsed\', $event)"    [sectionData]="this._possibleMatches"    [sectionTitle]="\'Possible Matches\'"    sectionId="detail-section-2"    [sectionCount]="this._possibleMatches?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInPossibleMatchesSection"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleMatches\', $event)"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section discovered"    *ngIf="this._discoveredRelationships?.length && this.showPossibleRelationshipsSection"    collapsedStatePrefsKey="possibleRelationshipsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleRelationshipsSectionCollapsed\', $event)"    [sectionData]="this._discoveredRelationships"    [sectionTitle]="\'Possible Relationships\'"    sectionId="detail-section-3"    [sectionCount]="this._discoveredRelationships?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInPossibleRelationshipsSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section disclosed"    *ngIf="this._disclosedRelationships?.length && this.showDisclosedSection"    collapsedStatePrefsKey="disclosedRelationshipsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'disclosedRelationshipsSectionCollapsed\', $event)"    [sectionData]="this._disclosedRelationships"    [sectionTitle]="\'Disclosed Relationships\'"    sectionId="detail-section-4"    [sectionCount]="this._disclosedRelationships?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInDisclosedSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section></div></div>'
+        var COMPONENT_TEMPLATE = '<div><!-- @senzing/sdk/entity/detail/sz-entity-detail --><div #nativeElementRef>  <sz-entity-detail-header  [entity]="entity"  [forceLayout]="_forceLayout"  [layoutClasses]="_layoutEnforcers">  </sz-entity-detail-header>  <sz-entity-detail-graph data-html2canvas-ignore    *ngIf="graphData && this.showGraphSection"    [data]="graphData"    [title]="this.graphTitle"    [captureMouseWheel]="graphAllowScrollingZoom"    [showPopOutIcon]="graphShowPopOutIcon"    [popOutIconPosition]="graphPopOutIconPosition"    [showZoomControl]="graphShowZoomControl"    [zoomControlPosition]="graphZoomControlPosition"    (popoutClick)="onGraphPopoutClick($event)"    [showMatchKeyControl]="graphShowMatchKeyControl"    [showFiltersControl]="graphShowFiltersControl"    [showMatchKeys]="this._showGraphMatchKeys"    (contextMenuClick)="onGraphRightClick($event)"    (scrollWheelEvent)="graphScrollWheelEvent.emit($event)"    (entityClick)="onGraphEntityClick($event)"  ></sz-entity-detail-graph>  <sz-entity-details-section class="details-section datasources"    *ngIf="entity?.resolvedEntity?.records?.length && this.showMatchesSection"    collapsedStatePrefsKey="recordsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'recordsSectionCollapsed\', $event)"    [sectionData]="entity?.resolvedEntity?.records"    [sectionTitle]="\'Matched Records\'"    sectionId="detail-section-1"    [sectionCount]="entity?.resolvedEntity?.records?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInMatchesSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section possible"    *ngIf="this._possibleMatches?.length && this.showPossibleMatchesSection"    collapsedStatePrefsKey="possibleMatchesSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleMatchesSectionCollapsed\', $event)"    [sectionData]="this._possibleMatches"    [sectionTitle]="\'Possible Matches\'"    sectionId="detail-section-2"    [sectionCount]="this._possibleMatches?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInPossibleMatchesSection"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleMatches\', $event)"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section discovered"    *ngIf="this._discoveredRelationships?.length && this.showPossibleRelationshipsSection"    collapsedStatePrefsKey="possibleRelationshipsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'possibleRelationshipsSectionCollapsed\', $event)"    [sectionData]="this._discoveredRelationships"    [sectionTitle]="\'Possible Relationships\'"    sectionId="detail-section-3"    [sectionCount]="this._discoveredRelationships?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInPossibleRelationshipsSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section>  <sz-entity-details-section class="details-section disclosed"    *ngIf="this._disclosedRelationships?.length && this.showDisclosedSection"    collapsedStatePrefsKey="disclosedRelationshipsSectionCollapsed"    (onCollapsedChange)="this.onSectionCollapsedChange(\'disclosedRelationshipsSectionCollapsed\', $event)"    [sectionData]="this._disclosedRelationships"    [sectionTitle]="\'Disclosed Relationships\'"    sectionId="detail-section-4"    [sectionCount]="this._disclosedRelationships?.length"    [forceLayout]="_forceLayout"    [layoutClasses]="_layoutEnforcers"    [showNameDataInEntities]="showNameDataInDisclosedSection"    (entityRecordClick)="onEntityRecordClick($event)">  </sz-entity-details-section></div></div>'
     var COMPONENTS = [{'name': 'SzConfigurationAboutComponent', 'selector': 'sz-configuration-about'},{'name': 'SzConfigurationComponent', 'selector': 'sz-configuration'},{'name': 'SzEntityDetailComponent', 'selector': 'sz-entity-detail'},{'name': 'SzEntityDetailGraphFilterComponent', 'selector': 'sz-entity-detail-graph-filter'},{'name': 'SzEntityRecordViewerComponent', 'selector': 'sz-entity-record-viewer'},{'name': 'SzPoweredByComponent', 'selector': 'sz-powered-by'},{'name': 'SzPreferencesComponent', 'selector': 'sz-preferences'},{'name': 'SzSearchByIdComponent', 'selector': 'sz-search-by-id'},{'name': 'SzSearchComponent', 'selector': 'sz-search'},{'name': 'SzSearchIdentifiersPickerDialogComponent', 'selector': 'sz-search-identifiers-picker-dialog'},{'name': 'SzSearchIdentifiersPickerSheetComponent', 'selector': 'sz-search-identifiers-picker-sheet'},{'name': 'SzSearchResultsComponent', 'selector': 'sz-search-results'},{'name': 'SzStandaloneGraphComponent', 'selector': 'sz-standalone-graph'}];
     var DIRECTIVES = [];
     var ACTUAL_COMPONENT = {'name': 'SzEntityDetailComponent'};