1fc09ce2bSRob Ashcom<div
2b5616a03SEben Haber   ng-controller="qwQueryController as qc"
3862cf459Srobashcom   ng-show="qc.validated.valid()"
4fc09ce2bSRob Ashcom   class="wb-wrapper">
5b5616a03SEben Haber
65c715f82SEben Haber  <mn-element-cargo depot="actions" ng-if="qc.validated.valid()">
7f5f7694fSEben Haber    <div class="header-controls">
824dc7a5aSEben Haber      <input type="file" id="loadQuery" name="files" style="display:none" accept="text/plain">
9fc09ce2bSRob Ashcom      <a
10fc09ce2bSRob Ashcom         ng-if="qc.fileSupport"
11fc09ce2bSRob Ashcom         id="loadQueryButton"
12fc09ce2bSRob Ashcom         ng-click="qc.load_query()"
13fc09ce2bSRob Ashcom         class="outline"
14fc09ce2bSRob Ashcom         onchange="console.log('changed files')">
15fc09ce2bSRob Ashcom        IMPORT
16fc09ce2bSRob Ashcom      </a>
17fc09ce2bSRob Ashcom      <a ng-click="qc.unified_save()">EXPORT</a>
18f5f7694fSEben Haber    </div>
19f5f7694fSEben Haber  </mn-element-cargo>
20f5f7694fSEben Haber
21b5616a03SEben Haber<!-- wrapper for query editor and results -->
22fc09ce2bSRob Ashcom  <div mn-spinner="queryInProgress" class="wb-main-wrapper width-9 resp-small">
23fc09ce2bSRob Ashcom<!-- query editor header, main editor area, and results footer -->
24fc09ce2bSRob Ashcom    <div class="wb-query-editor">
25b5616a03SEben Haber<!-- Editor "header row" -->
26fc09ce2bSRob Ashcom      <div class="wb-query-editor-header">
27fc09ce2bSRob Ashcom        <h4>Query Editor</h4>
28fc09ce2bSRob Ashcom        <span>
29862cf459Srobashcom          <button
30fc09ce2bSRob Ashcom             title="View previous queries & results" ng-click="qc.prev()"
31862cf459Srobashcom             qw-long-press="qc.historyMenu"
32862cf459Srobashcom             class="outline btn-small"
33fa3b1615SEben Haber             ng-disabled="!qc.hasPrev()">
34862cf459Srobashcom            &larr;
35862cf459Srobashcom          </button>
36fc09ce2bSRob Ashcom          <span class="wb-history-controls-inner">
37fc09ce2bSRob Ashcom            <a ng-click="qc.historyMenu()">history</a>
38fc09ce2bSRob Ashcom            ({{qc.getCurrentIndex()}})
39862cf459Srobashcom          </span>
40862cf459Srobashcom          <button
41fc09ce2bSRob Ashcom             title="View subsequent queries & results"
42862cf459Srobashcom             ng-click="qc.next()"
43862cf459Srobashcom             qw-long-press="qc.historyMenu"
44862cf459Srobashcom             class="outline btn-small"
45fa3b1615SEben Haber             ng-disabled="!qc.hasNext()">
46862cf459Srobashcom            &rarr;
47862cf459Srobashcom          </button>
48fc09ce2bSRob Ashcom        </span>
49fc09ce2bSRob Ashcom      </div>
50fc09ce2bSRob Ashcom<!-- Ace editor *********************************************************** -->
51fc09ce2bSRob Ashcom      <div
52fc09ce2bSRob Ashcom         class="wb-ace-editor"
53fc09ce2bSRob Ashcom         ui-ace="qc.aceInputOptions"
54fc09ce2bSRob Ashcom         ng-disabled="qc.executingQuery.busy"
55fc09ce2bSRob Ashcom         ng-model="qc.lastResult.query">
56862cf459Srobashcom      </div>
572e71fe42SEben Haber
58862cf459Srobashcom<!-- wrapper under query editor for button and stats -->
59fc09ce2bSRob Ashcom      <div class="wb-query-editor-footer">
60fc09ce2bSRob Ashcom        <span class="nowrap">
61fc09ce2bSRob Ashcom          <button ng-click="qc.query()" class="wb-button-execute">
62fc09ce2bSRob Ashcom            <div ng-if="!qc.executingQuery.busy">Execute</div>
63fc09ce2bSRob Ashcom            <div ng-if="qc.executingQuery.busy" class="icon-button">
64fc09ce2bSRob Ashcom              Cancel <span class="icon fa-spinner fa-spin fa-pulse"></span>
65fc09ce2bSRob Ashcom            </div>
66fc09ce2bSRob Ashcom          </button>
67fc09ce2bSRob Ashcom          <button ng-disabled="qc.executingQuery.busy" ng-click="qc.query(true)" class="outline tight">
68fc09ce2bSRob Ashcom             Explain
69fc09ce2bSRob Ashcom             <span  ng-if="qc.executingQuery.busy" class="icon fa-spinner fa-spin fa-pulse"></span>
70fc09ce2bSRob Ashcom          </button>
71fc09ce2bSRob Ashcom        </span>
72862cf459Srobashcom
73b5616a03SEben Haber<!-- query results stats -->
74fc09ce2bSRob Ashcom        <div ng-hide="qc.lastResult.hide" class="wb-result-summary">
75fc09ce2bSRob Ashcom          <span
76fc09ce2bSRob Ashcom            class="wb-result-status"
77fc09ce2bSRob Ashcom            ng-class="{success: qc.status_success() || qc.lastResult.status == 'explain success', error: qc.status_fail()}">
78fc09ce2bSRob Ashcom            {{qc.lastResult.status}}</span>
79fc09ce2bSRob Ashcom          <span ng-if="qc.lastResult.elapsedTime"> | elapsed: {{qc.lastResult.elapsedTime}} | </span>
80fc09ce2bSRob Ashcom          <span ng-if="qc.lastResult.executionTime">execution: {{qc.lastResult.executionTime}} | </span>
81fc09ce2bSRob Ashcom          <span ng-if="qc.lastResult.mutationCount">mutations: {{qc.lastResult.mutationCount}} | </span>
82fc09ce2bSRob Ashcom          <span ng-if="!qc.lastResult.mutationCount && qc.lastResult.resultCount" ng-attr-title="sortCount: {{qc.lastResult.sortCount}}">
83fc09ce2bSRob Ashcom          count: {{qc.lastResult.resultCount}} | </span>
84fc09ce2bSRob Ashcom          <span ng-if="qc.lastResult.resultSize">size: {{qc.lastResult.resultSize}}</span>
85fc09ce2bSRob Ashcom        </div>
86fc09ce2bSRob Ashcom
87fc09ce2bSRob Ashcom<!-- run-time preferences -->
88fc09ce2bSRob Ashcom        <a ng-if="qc.showOptions" ng-click="qc.options()" class="row resp-hide-xsml">
89fc09ce2bSRob Ashcom          <span class="icon fa-cog margin-right"></span>
90fc09ce2bSRob Ashcom          <span class="text-smaller">preferences</span>
91fc09ce2bSRob Ashcom        </a>
92862cf459Srobashcom      </div>
937140fb8fSrobashcom
942e71fe42SEben Haber    </div>
952e71fe42SEben Haber
96b5616a03SEben Haber<!-- query results -->
97fc09ce2bSRob Ashcom    <div class="wb-results-header">
98064975d3SEben Haber      <h4>Query Results
99accf6d3bSRob Ashcom        <a
100accf6d3bSRob Ashcom           ng-click="qc.copyResultAsCSV()"
101accf6d3bSRob Ashcom           class="margin-left-half"
102accf6d3bSRob Ashcom           title="Copy results in tabular format">
103accf6d3bSRob Ashcom          <span class="icon fa-copy"></span>
104accf6d3bSRob Ashcom        </a>
105accf6d3bSRob Ashcom        <span
106accf6d3bSRob Ashcom           ng-if="qc.lastResult.warnings"
107accf6d3bSRob Ashcom           tooltip-trigger="'mouseenter'"
108accf6d3bSRob Ashcom           tooltip-append-to-body="true"
109accf6d3bSRob Ashcom           class="fa-warning icon orange-3 cursor-pointer"
1103dbe058fSEben M Haber           uib-tooltip-html="{{qc.lastResult.warnings}}">
111accf6d3bSRob Ashcom        </span>
112accf6d3bSRob Ashcom      </h4>
113b5616a03SEben Haber      <span class="pills">
114b5616a03SEben Haber        <a ng-click="qc.selectTab(1)"
115b5616a03SEben Haber           ng-class="{selected: qc.isSelected(1)}">JSON</a>
116b5616a03SEben Haber        <a ng-click="qc.selectTab(2)"
117b5616a03SEben Haber           ng-class="{selected: qc.isSelected(2)}">Table</a>
118b5616a03SEben Haber        <a ng-click="qc.selectTab(3)"
119b5616a03SEben Haber           ng-class="{selected: qc.isSelected(3)}">Tree</a>
1205e4ebe05SEben Haber        <a ng-click="qc.selectTab(4)" ng-if="qc.isEnterprise"
121b5616a03SEben Haber           ng-class="{selected: qc.isSelected(4)}">Plan</a>
122b5616a03SEben Haber        <a ng-click="qc.selectTab(5)"
123fc09ce2bSRob Ashcom           ng-class="{selected: qc.isSelected(5)}"
124fc09ce2bSRob Ashcom           class="resp-hide-xsml">Plan Text</a>
125b5616a03SEben Haber      </span>
126b5616a03SEben Haber    </div>
1272e71fe42SEben Haber
128fc09ce2bSRob Ashcom    <div class="wb-results-wrapper">
129fc09ce2bSRob Ashcom      <div class="wb-results-show-anyway" ng-if="!qc.showBigDatasets && qc.dataTooBig()">
130b5616a03SEben Haber        <div ng-bind-html="qc.getBigDataMessage()"> </div>
131fc09ce2bSRob Ashcom        <a ng-click="qc.setShowBigData(true)" class="text-medium link-heavy">Show anyway <span class="icon fa-angle-right"></span></a>
1322e71fe42SEben Haber      </div>
133fc09ce2bSRob Ashcom
134fc09ce2bSRob Ashcom      <div class="wb-results-json" ui-ace="qc.aceOutputOptions"
135b5616a03SEben Haber        ng-if="qc.isSelected(1) && (!qc.dataTooBig() || qc.showBigDatasets)"
136b5616a03SEben Haber        ng-model="qc.lastResult.result"></div>
137fc09ce2bSRob Ashcom
138fc09ce2bSRob Ashcom      <div class="wb-results-table"
139ae3a863aSEben Haber        ng-if="qc.isSelected(2)"
140ae3a863aSEben Haber        qw-json-data-table="qc.lastResult.data"></div>
141fc09ce2bSRob Ashcom
142fc09ce2bSRob Ashcom      <div class="wb-results-tree"
143b5616a03SEben Haber        ng-if="qc.isSelected(3) && (!qc.dataTooBig() || qc.showBigDatasets)"
144b5616a03SEben Haber        qw-json-tree="qc.lastResult.data"></div>
145fc09ce2bSRob Ashcom
146fc09ce2bSRob Ashcom      <div class="wb-results-explain" ng-if="qc.isSelected(4)"
147052a22f0SEben M Haber        qw-explain-viz-d3="qc.lastResult.explainResult"></div>
148fc09ce2bSRob Ashcom
149fc09ce2bSRob Ashcom      <div class="wb-results-explain-text" ng-if="qc.isSelected(5)"
150b5616a03SEben Haber        ui-ace="qc.acePlanOptions"
151b5616a03SEben Haber        ng-model="qc.lastResult.explainResultText"></div>
152b5616a03SEben Haber    </div>
153b5616a03SEben Haber  </div>
154b5616a03SEben Haber
15516f8fa01Srobashcom<!-- bucket insights sidebar -->
156fc09ce2bSRob Ashcom  <div class="insights-sidebar width-3 show-scrollbar resp-hide-sml">
157fc09ce2bSRob Ashcom    <div ng-if="qc.qqs.bucket_errors"  class="insights-sidebar-body">{{qc.qqs.bucket_errors}}</div>
158fc09ce2bSRob Ashcom    <div ng-if="!qc.qqs.bucket_errors" class="insights-sidebar-body">
159b8b5b1c5Srobashcom      <div class="row">
160b8b5b1c5Srobashcom        <h4>Bucket Insights</h4>
161b8b5b1c5Srobashcom          <a title="expand or contract sidebar"
162b8b5b1c5Srobashcom             ng-click="qc.toggleAnalysisSize()">
163b8b5b1c5Srobashcom            <span ng-if="!qc.analysisExpanded" class="icon fa-expand"></span>
164b8b5b1c5Srobashcom            <span ng-if="qc.analysisExpanded" class="icon fa-compress"></span>
165b8b5b1c5Srobashcom          </a>
166b5616a03SEben Haber      </div>
167b8b5b1c5Srobashcom
168b8b5b1c5Srobashcom      <section>
169b5616a03SEben Haber        <h5 title="Buckets with a primary index support all queries.">Fully Queryable Buckets</h5>
170b8b5b1c5Srobashcom        <span ng-repeat="bucket in qc.buckets"
171b5616a03SEben Haber            ng-show="bucket.has_prim">
172b5616a03SEben Haber            <div bucket-display="bucket"></div>
173b5616a03SEben Haber        </span>
174b5616a03SEben Haber      </section>
1752e71fe42SEben Haber
176b8b5b1c5Srobashcom      <section>
177b5616a03SEben Haber        <h5 title="Buckets with only secondary indexes require a 'where' clause using indexed fields.">Queryable on Indexed Fields</h5>
178b8b5b1c5Srobashcom          <span ng-repeat="bucket in qc.buckets"
179b5616a03SEben Haber            ng-show="!bucket.has_prim && bucket.has_sec">
180b5616a03SEben Haber            <div bucket-display="bucket"></div>
181b5616a03SEben Haber          </span>
182b5616a03SEben Haber      </section>
1832e71fe42SEben Haber
184b8b5b1c5Srobashcom      <section>
185b5616a03SEben Haber        <h5 title="Buckets with no index cannot be queried.">Non-Indexed Buckets</h5>
186b8b5b1c5Srobashcom          <span ng-repeat="bucket in qc.buckets"
187b5616a03SEben Haber            ng-show="!bucket.has_prim && !bucket.has_sec">
188b5616a03SEben Haber            <div bucket-display="bucket"></div>
189b5616a03SEben Haber          </span>
190b5616a03SEben Haber      </section>
1912e71fe42SEben Haber    </div>
192b5616a03SEben Haber  </div>
193862cf459Srobashcom</div>
194