1<div ng-show="qc.validated.valid()" class="wb-wrapper"> 2 3 <mn-element-cargo depot="actions" ng-if="qc.validated.valid()"> 4 <div class="header-controls"> 5 <input type="file" id="loadQuery" name="files" style="display:none" accept="text/plain"> 6 <a ng-if="qc.fileSupport" 7 id="loadQueryButton" 8 ng-click="qc.load_query()" 9 class="outline" 10 onchange="console.log('changed files')">IMPORT</a> 11 <a href="" ng-click="qc.unified_save()">EXPORT</a> 12 </div> 13 </mn-element-cargo> 14 15<!-- wrapper for query editor and results --> 16 <div mn-spinner="queryInProgress" class="wb-main-wrapper width-9 resp-small"> 17<!-- query editor header, main editor area, and results footer --> 18 <div class="wb-query-editor"> 19 <div class="text-smaller text-center grayblack-3" style="margin-top:-.85rem;"> 20 Unsupported developer preview. Not recommended for production use. 21 </div> 22<!-- Editor "header row" --> 23 <div class="wb-query-editor-header"> 24 <h4>Analytics Query Editor</h4> 25 <span> 26 <button 27 title="View previous queries/results" ng-click="qc.prev()" 28 qw-long-press="qc.historyMenu" 29 class="outline btn-small" 30 ng-disabled="!qc.hasPrev()"> 31 ← 32 </button> 33 <span class="wb-history-controls-inner"> 34 <a ng-click="qc.historyMenu()">history</a> 35 <small>({{qc.getCurrentIndex()}})</small> 36 </span> 37 <button 38 title="View subsequent queries/results" 39 ng-click="qc.next()" 40 qw-long-press="qc.historyMenu" 41 class="outline btn-small" 42 ng-disabled="!qc.hasNext()"> 43 → 44 </button> 45 </span> 46 </div> 47<!-- Ace editor *********************************************************** --> 48 <div 49 class="wb-ace-editor" 50 ui-ace="qc.aceInputOptions" 51 ng-disabled="qc.executingQuery.busy" 52 ng-model="qc.lastResult.query">{{qc.renderPage()}} 53 </div> 54 55<!-- wrapper under query editor for button and stats --> 56 <div class="wb-query-editor-footer"> 57 <span class="nowrap"> 58 <button ng-click="qc.query()" class="wb-button-execute"> 59 <div ng-if="!qc.executingQuery.busy">Execute</div> 60 <div ng-if="qc.executingQuery.busy" class="icon-button"> 61 Cancel <span class="icon fa-spinner fa-spin fa-pulse"></span> 62 </div> 63 </button> 64 <button ng-disabled="qc.executingQuery.busy" ng-click="qc.query(true)" class="outline tight"> 65 Explain 66 <span ng-if="qc.executingQuery.busy" class="icon fa-spinner fa-spin fa-pulse"></span> 67 </button> 68 </span> 69 70<!-- query results stats --> 71 <div ng-hide="qc.lastResult.hide" class="wb-result-summary"> 72 <span 73 class="wb-result-status" 74 ng-class="{success: qc.status_success(), error: qc.status_fail()}"> 75 {{qc.lastResult.status}} 76 </span> 77 <span ng-if="!qc.executingQuery.busy"> 78 <span ng-if="qc.lastResult.elapsedTime"> | elapsed: {{qc.lastResult.elapsedTime}} | </span> 79 <span ng-if="qc.lastResult.executionTime">execution: {{qc.lastResult.executionTime}} | </span> 80 <span ng-if="qc.lastResult.resultCount">count: {{qc.lastResult.resultCount}} | </span> 81 <span ng-if="qc.lastResult.resultSize">size: {{qc.lastResult.resultSize}} | </span> 82 <span ng-if="qc.lastResult.processedObjects == 0 || qc.lastResult.processedObjects">processed objects: {{qc.lastResult.processedObjects}}</span> 83 </span> 84 </div> 85 86<!-- run-time preferences --> 87 <a ng-if="qc.showOptions" ng-click="qc.options()" class="row resp-hide-xsml"> 88 <span class="icon fa-cog margin-right"></span> 89 <span class="text-smaller">preferences</span> 90 </a> 91 </div> 92 </div> 93 94 <!-- query results --> 95 <div class="wb-results-header"> 96 <h4>Analytics Query Results</h4> 97 <span class="pills"> 98 <a ng-click="qc.selectTab(1)" 99 ng-class="{selected: qc.isSelected(1)}">JSON</a> 100 <a ng-click="qc.selectTab(2)" 101 ng-class="{selected: qc.isSelected(2)}">Table</a> 102 <a ng-click="qc.selectTab(3)" 103 ng-class="{selected: qc.isSelected(3)}">Tree</a> 104 <!-- Temporary Hide Plan Tab --> 105 <a ng-click="qc.selectTab(4)" ng-if="qc.isEnterprise && false" 106 ng-class="{selected: qc.isSelected(4)}">Plan</a> 107 <a ng-click="qc.selectTab(5)" 108 ng-class="{selected: qc.isSelected(5)}">Plan Text</a> 109 </span> 110 </div> 111 112 <div class="wb-results-wrapper"> 113 <div class="wb-results-show-anyway" ng-if="!qc.showBigDatasets && qc.dataTooBig()"> 114 <div ng-bind-html="qc.getBigDataMessage()"></div> 115 <a ng-click="qc.setShowBigData(true)" class="text-medium link-heavy">Show anyway <span class="icon fa-angle-right"></span></a> 116 </div> 117 <div class="wb-results-json" ui-ace="qc.aceOutputOptions" 118 ng-if="qc.isSelected(1) && (!qc.dataTooBig() || qc.showBigDatasets)" 119 ng-model="qc.lastResult.result"></div> 120 121 <div class="wb-results-table" 122 ng-if="qc.isSelected(2) && (!qc.dataTooBig() || qc.showBigDatasets)" 123 qw-json-data-table="qc.lastResult.data"></div> 124 125 <div class="wb-results-tree" 126 ng-if="qc.isSelected(3) && (!qc.dataTooBig() || qc.showBigDatasets)" 127 qw-json-tree="qc.lastResult.data"></div> 128 129<!-- <div class="wb-results-explain" 130 ng-if="qc.isSelected(4)" 131 qw-explain-viz="qc.lastResult.explainResult"></div> --> 132 133 <div class="wb-results-explain-text" 134 ng-if="qc.isSelected(5)" 135 ui-ace="qc.acePlanOptions" 136 ng-model="qc.lastResult.explainResultText"></div> 137 </div> 138 </div> 139 140 <!-- bucket insights sidebar --> 141 <div class="insights-sidebar width-3 resp-hide-sml"> 142 <div class="insights-sidebar-body"> 143 <div class="row"> 144 <h4>Bucket Insights</h4> 145 <span> 146 <a title="Refresh bucket insights" 147 ng-click="qc.updateBuckets()" 148 class="margin-right-half" 149 ng-disabled="qc.qqs.loadingBuckets"> 150 <span ng-if="qc.qqs.loadingBuckets" class="icon fa-refresh"></span> 151 <span ng-if="!qc.qqs.loadingBuckets" class="icon fa-refresh"></span> 152 </a> 153 <a title="expand or contract sidebar" ng-click="qc.toggleAnalysisSize()"> 154 <span ng-if="!qc.analysisExpanded" class="icon fa-expand"></span> 155 <span ng-if="qc.analysisExpanded" class="icon fa-compress"></span> 156 </a> 157 </span> 158 </div> 159 160 <div mn-spinner="qc.qqs.loadingBuckets"> 161 <div ng-if="qc.qqs.bucket_errors"> 162 <br> 163 <p style="white-space:pre-wrap;">{{qc.qqs.bucket_errors}} 164 </p> 165 </div> 166 <div ng-if="!qc.qqs.bucket_errors"> 167 <section> 168 <div class="row"> 169 <h5 title="Available bucket connections">{{qc.analysisFirstSection}}</h5> 170 </div> 171 <span class="text-small" ng-repeat="bucket in qc.buckets"> 172 <ul> 173 <ul> 174 {{bucket.cbBucketName}} 175 <span ng-if="bucket.connected" title="connected" class="icon fa-link fa-rotate-90" style="cursor:auto;"></span> 176 <span ng-if="!bucket.connected" title="disconnected" class="icon fa-unlink fa-rotate-90" style="cursor:auto;"></span> 177 <span ng-if="bucket.cbBucketName != bucket.id">{{bucket.id}}</span> 178 <span ng-repeat="shadow in qc.shadows"> 179 <div ng-if="shadow.bucketName == bucket.id"> 180 <!-- only show shadow name if not expandable --> 181 <ul ng-if="!shadow.expandable" class="text-small">{{shadow.id}}</ul> 182 <!-- show expandable shadow details if expandable --> 183 <ul ng-if="shadow.expandable"> 184 <a href="" ng-click="changeExpandShadow(shadow)" style="color: black" class="text-small"> 185 {{shadow.id}} 186 <span class="icon fa-info-circle" style="color: #4287d6;" ng-hide="shadow.expanded"></span> 187 <span class="icon fa-info-circle" style="color: gray;" ng-show="shadow.expanded"></span> 188 </a> 189 <ul class="text-small" ng-if="shadow.expanded && shadow.filter"> 190 <ul> 191 <span title="Filter" class="icon fa-filter" style="cursor:auto"></span> {{shadow.filter}} 192 </ul> 193 </ul> 194 </ul> 195 <ul ng-if="shadow.expanded && shadow.indexes" class="text-small"> 196 <ul> 197 <ul ng-repeat="idx in shadow.indexes"> 198 <span title="Index" class="icon fa-caret-up fa-lg" style="cursor:auto"></span> {{idx.IndexName}} 199 <ul ng-repeat="key in idx.keys"> 200 <ul> 201 <span title="Key" class="icon fa-map-pin" style="cursor:auto"></span> {{key}} 202 </ul> 203 </ul> 204 </ul> 205 </ul> 206 </ul> 207 </div> 208 </span> 209 </ul> 210 </ul> 211 </span> 212 </section> 213 214 <section> 215 <div class="row"> 216 <h5 title="Cluster bucket with no connections">{{qc.analysisSecondSection}}</h5> 217 </div> 218 <span class="text-small" ng-repeat="bucket in qc.bucketsWithNoConnection"> 219 <ul> 220 <ul> 221 {{bucket}} 222 </ul> 223 </ul> 224 </span> 225 </section> 226 </div> 227 </div> 228 </div> 229 </div> 230</div> 231