github.com/kjdelisle/consul@v1.4.5/ui/index.html (about) 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=0.7, user-scalable=no"> 7 <title>Consul by HashiCorp</title> 8 <link rel="stylesheet" href="static/bootstrap.min.css"> 9 <link rel="stylesheet" href="static/base.css"> 10 <link rel="icon" type="image/png" href="static/favicon-32x32.png" sizes="32x32"> 11 <link rel="icon" type="image/png" href="static/favicon-16x16.png" sizes="16x16"> 12 13 <script type="text/javascript"> 14 // Change this value to your consul host if you are not running 15 // the UI on the same host as a consul instance. 16 // e.g. "http://myserver.com:8500" 17 var consulHost = '' 18 </script> 19 20 </head> 21 <body> 22 23 <noscript> 24 <center> 25 <h2>JavaScript Required</h2> 26 <p>Please enable JavaScript in your web browser to use Consul UI.</p> 27 </center> 28 </noscript> 29 30 <div class="wrapper"> 31 <div class="container"> 32 <div class="col-md-12"> 33 <div id="app"> 34 </div> 35 </div> 36 </div> 37 38 <div class="push"></div> 39 </div> 40 41 <div class="footer"> 42 <div class="container"> 43 <div class="col-md-12"> 44 </div> 45 </div> 46 </div> 47 48 <script type="text/x-handlebars"> 49 {{outlet}} 50 </script> 51 52 <script type="text/x-handlebars" data-template-name="error"> 53 <div class="row"> 54 <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12"> 55 <div class="text-center vertical-center"> 56 {{#if controller.model.statusText }} 57 <p class="bold">HTTP error code from Consul: <code>{{controller.model.status}} {{controller.model.statusText}}</code></p> 58 {{/if}} 59 {{#if controller.model.responseText }} 60 <p class="bold">Error message from Consul: <code>{{limit controller.model.responseText 255}}</code></p> 61 {{/if}} 62 <p>Consul returned an error. You may have visited a URL that is loading an unknown resource, so you 63 can try going back to the root. If your ACL token was not found you can reset it, and then you 64 will be redirected to the settings page to enter a new ACL token.</p> 65 <div class="form-group"> 66 <button {{ action "resetToken" }} {{ bind-attr class=":btn :btn-danger" }}>Reset ACL Token</button> 67 <button {{ action "backHome" }} {{ bind-attr class=":btn :btn-default" }}>Go Back to Root</button> 68 </div> 69 </div> 70 </div> 71 </div> 72 </script> 73 74 <script type="text/x-handlebars" data-template-name="dc/unauthorized"> 75 <div class="row"> 76 <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12"> 77 <div class="text-center vertical-center"> 78 <p class="bold">Access Denied</p> 79 <p>Your ACL token does not have the appropriate permissions to perform the expected action.</p> 80 <p>Learn more in the <a href="https://www.consul.io/docs/guides/acl.html" target="_blank">ACL documentation</a>.</p> 81 </div> 82 </div> 83 </div> 84 </script> 85 86 <script type="text/x-handlebars" data-template-name="dc/aclsdisabled"> 87 <div class="row"> 88 <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12"> 89 <div class="text-center vertical-center"> 90 <p class="bold">ACLs Disabled</p> 91 <p>ACLs are disabled in this Consul cluster. This is the default behavior, as you have to explicitly enable them.</p> 92 <p>Learn more in the <a href="https://www.consul.io/docs/guides/acl.html" target="_blank">ACL documentation</a>.</p> 93 </div> 94 </div> 95 </div> 96 </script> 97 98 <script type="text/x-handlebars" data-template-name="loading"> 99 <div class="row"> 100 <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12"> 101 <div class="text-center vertical-center"> 102 <img src="static/loading-cylon-pink.svg" width="384" height="48"> 103 <p><small>Loading...</small></p> 104 </div> 105 </div> 106 </div> 107 </script> 108 109 <script type="text/x-handlebars" id="actionbar"> 110 <div class="row"> 111 <div class="action-bar"> 112 <div {{ bind-attr class="searchBar:col-md-10:col-md-5" }} > 113 <div class="form-group"> 114 {{ input type="text" value=filter class="form-control form-control-mini" placeholder=filterText}} 115 </div> 116 </div> 117 {{#if newAclButton }} 118 <div class="col-md-2"> 119 <div class="form-group"> 120 {{#link-to 'acls' class='btn btn-mini btn-default btn-noactive pull-right'}}New ACL{{/link-to}} 121 </div> 122 </div> 123 {{/if}} 124 {{#if statuses}} 125 <div class="col-md-5"> 126 <div class="form-group"> 127 {{view Ember.Select content=statuses value=status class="form-control form-control-mini"}} 128 </div> 129 </div> 130 {{/if}} 131 {{#if hasExpanded }} 132 <div class="col-md-2 hidden-xs hidden-sm"> 133 <div class="form-group"> 134 <button {{ bind-attr class=":btn :btn-mini :pull-right condensed:btn-default:btn-primary" }} {{action toggleCondensed }}>Expand</button> 135 </div> 136 </div> 137 {{/if}} 138 </div> 139 </div> 140 </script> 141 142 <script type="text/x-handlebars" data-template-name="dc"> 143 <div class="row"> 144 <div {{ bind-attr class=":col-md-12 :col-sm-12 :col-xs-12 :topbar" }}> 145 146 <div class="col-md-1 col-sm-2 col-xs-8 col-sm-offset-0 col-xs-offset-1"> 147 <a href="#"><div class="top-brand"></div></a> 148 </div> 149 <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> 150 {{#link-to 'services' class='btn btn-default col-xs-12'}}Services{{/link-to}} 151 </div> 152 153 <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> 154 {{#link-to 'nodes' class='btn btn-default col-xs-12'}}Nodes{{/link-to}} 155 </div> 156 157 <div class="col-md-2 col-sm-3 col-xs-8 col-sm-offset-0 col-xs-offset-1"> 158 {{#link-to 'kv' class='btn btn-default col-xs-12'}}Key/Value{{/link-to}} 159 </div> 160 161 <div class="col-md-2 col-sm-2 col-xs-8 col-md-offset-0 col-sm-offset-2 col-xs-offset-1"> 162 {{#link-to 'acls' class='btn btn-default col-xs-12'}}ACL{{/link-to}} 163 </div> 164 165 <div class="col-md-2 col-sm-2 col-xs-6 col-md-offset-0 col-sm-offset-4 col-xs-offset-1"> 166 <a {{bind-attr class=":col-xs-12 :btn hasFailingChecks:btn-warning:btn-success"}} {{action "toggle"}}> <span class="elip-overflow">{{model}} <span class="caret"></span></span> </a> 167 168 {{#if isDropdownVisible}} 169 <ul class="dropdown-menu col-xs-8" style="display:block;"> 170 {{#each dc in dcs}} 171 <li {{action "hideDrop"}}>{{#link-to 'services' dc}}{{dc}}{{/link-to}}</li> 172 {{/each}} 173 </ul> 174 {{/if}} 175 176 </div> 177 178 <div class="col-md-1 col-sm-2 col-xs-2 col-md-offset-0 col-sm-offset-0 col-xs-offset-0"> 179 {{#link-to 'settings' class='btn btn-default col-xs-6 icon'}} 180 <svg xmlns="http://www.w3.org/2000/svg" data-icon="cog" viewBox="0 0 32 40"> 181 <path d="M14 0l-1.313 4c-1 .3-1.975.688-2.875 1.188l-3.72-1.875-2.78 2.78 1.875 3.72c-.5.9-.888 1.875-1.188 2.875L0 14v4l4 1.314c.3 1 .687 1.975 1.187 2.875l-1.78 3.718 2.78 2.78 3.72-1.874c.9.5 1.905.887 2.905 1.188l1.28 4h4l1.314-4c1-.3 2.006-.688 2.906-1.188L26 28.594l2.813-2.78-1.906-3.72c.5-.9.887-1.905 1.188-2.905L32 18v-4l-4-1.312c-.3-1-.687-1.975-1.187-2.875l1.78-3.72-2.78-2.78-3.72 1.875c-.9-.5-1.905-.888-2.905-1.188L18 0h-4zm2 9c3.9 0 7 3.1 7 7s-3.1 7-7 7-7-3.1-7-7 3.1-7 7-7z"/> 182 </svg> 183 {{/link-to}} 184 </div> 185 </div> 186 </div> 187 188 {{outlet}} 189 </script> 190 191 <script type="text/x-handlebars" data-template-name="kv/show"> 192 <div class="row"> 193 <div class="col-md-6 col-lg-5 padded-right-middle"> 194 <h4 class="breadcrumbs"><a href="" {{action 'linkToKey' grandParentKey }}>{{parentKey}}</a> <a href="" {{action 'linkToKey' parentKey }}>+</a></h4> 195 </div> 196 </div> 197 198 <div class="row"> 199 <div class="col-md-6 col-lg-5 padded-right-middle"> 200 201 {{#each item in model }} 202 {{#link-to item.linkToRoute item.Key tagName="div" href=false class="list-group-item list-condensed-link" }} 203 <div {{bind-attr class="item.isFolder:bg-gray:bg-light-gray :list-bar-horizontal"}}></div> 204 <div class="name"> 205 {{item.keyWithoutParent}} 206 </div> 207 {{/link-to}} 208 209 {{/each}} 210 </div> 211 212 <div class="border-left hidden-xs hidden-sm"> 213 </div> 214 215 <div class="visible-xs visible-sm"> 216 <hr> 217 </div> 218 219 <div class="col-md-6 col-lg-7 border-left"> 220 <div class="padded-border"> 221 <div class="panel"> 222 <div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-light-gray" }}></div> 223 <div class="panel-heading"> 224 <h4 class="panel-title"> 225 Create Key 226 </h4> 227 </div> 228 229 <div class="panel-body panel-form"> 230 <form class="form"> 231 232 <div class="form-group"> 233 <p>{{errorMessage}}</p> 234 </div> 235 236 <div {{ bind-attr class=":form-group newKey.keyValid:valid" }}> 237 <div class="input-group"> 238 <span class="input-group-addon">{{parentKey}}</span> 239 {{ input value=newKey.Key class="form-control" required=true }} 240 </div> 241 <span class="help-block">To create a folder, end the key with <code>/</code></span> 242 </div> 243 244 {{#if newKey.isFolder }} 245 <p>No value needed for nested keys.</p> 246 {{else}} 247 <div {{ bind-attr class=":form-group newKey.validateJson:validate newKey.isValidJson:success:error" }}> 248 {{ textarea value=newKey.Value class="form-control"}} 249 <span class="help-block">Value can be any format and length</span> 250 </div> 251 {{/if}} 252 253 <button {{ action "createKey"}} {{bind-attr disabled=newKey.isInvalid }} {{ bind-attr class=":btn newKey.isValid:btn-success:btn-default" }}>Create</button> 254 {{#unless newKey.isFolder }} 255 <label class="form-checkbox">{{ input type=checkbox checked=newKey.validateJson }}Validate JSON</label> 256 {{/unless}} 257 <button {{ action "deleteFolder"}} {{ bind-attr class=":btn :pull-right isLoading:btn-warning:btn-danger isRoot:hidden" }}>Delete folder</button> 258 </form> 259 </div> 260 </div> 261 </div> 262 </div> 263 </div> 264 </script> 265 266 <script type="text/x-handlebars" data-template-name="kv/edit"> 267 <div class="row"> 268 <div class="col-md-6 col-lg-5 padded-right-middle"> 269 <h4 class="breadcrumbs"><a href="" {{action 'linkToKey' grandParentKey }}>{{parentKey}}</a> <a href="" {{action 'linkToKey' parentKey }}>+</a></h4> 270 </div> 271 </div> 272 273 <div class="row"> 274 <div class="col-md-6 col-lg-5 padded-right-middle"> 275 {{#each item in siblings }} 276 {{#link-to item.linkToRoute item.Key tagName="div" href=false class="list-group-item list-condensed-link" }} 277 <div {{bind-attr class="item.isFolder:bg-gray:bg-light-gray :list-bar-horizontal"}}></div> 278 <div class="name"> 279 {{item.keyWithoutParent}} 280 </div> 281 {{/link-to}} 282 {{/each}} 283 </div> 284 285 <div class="border-left hidden-xs hidden-sm"> 286 </div> 287 288 <div class="visible-xs visible-sm"> 289 <hr> 290 </div> 291 292 <div class="col-md-6 col-lg-7 border-left sticky-scroll"> 293 <div class="padded-border"> 294 295 <div class="panel"> 296 <div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-green isLocked:bg-light-gray" }}></div> 297 <div class="panel-heading"> 298 <h4 {{bind-attr class=":panel-title isLocked:locked"}}> 299 {{model.Key}} 300 {{#if model.isLocked}} 301 <small class="pull-right"> 302 KEY LOCKED 303 </small> 304 {{/if}} 305 </h4> 306 </div> 307 308 <div class="panel-body panel-form"> 309 <div class="form-group"> 310 {{errorMessage}} 311 </div> 312 <form class="form"> 313 <div {{ bind-attr class=":form-group model.validateJson:validate model.isValidJson:success:error" }}> 314 {{ textarea value=model.valueDecoded class="form-control" disabled=model.isLocked}} 315 </div> 316 <button {{action "updateKey"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn isLoading:btn-warning:btn-success"}} {{bind-attr disabled=isLocked}}>Update</button> 317 <button {{action "cancelEdit"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn isLoading:btn-warning:btn-default"}}>Cancel</button> 318 <label class="form-checkbox">{{ input type=checkbox checked=model.validateJson }}Validate JSON</label> 319 <button {{action "deleteKey"}} {{bind-attr disabled=isLoading}} {{bind-attr class=":btn :pull-right isLoading:btn-warning:btn-danger"}} {{bind-attr disabled=isLocked}}>Delete key</button> 320 </form> 321 </div> 322 </div> 323 324 {{#if model.isLocked}} 325 <h5>Lock Session</h5> 326 327 {{#link-to 'nodes.show' model.session.Node tagName="div" href=false class="list-group-item list-condensed-link" }} 328 <div class="bg-light-gray list-bar-horizontal"></div> 329 <div class="name"> 330 {{ sessionName session }} 331 <small class="pull-right"> 332 {{session.Node}} 333 </small> 334 </div> 335 {{/link-to}} 336 {{/if}} 337 338 </div> 339 </div> 340 341 </div> 342 </script> 343 344 <script type="text/x-handlebars" data-template-name="item/loading"> 345 <div class="row"> 346 <div class="col-md-8 col-md-offset-2 col-sm-12 col-xs-12"> 347 <div class="text-center vertical-center"> 348 <img src="static/loading-cylon-pink.svg" width="384" height="48"> 349 <p><small>Loading...</small></p> 350 </div> 351 </div> 352 </div> 353 </script> 354 355 <script type="text/x-handlebars" id="services"> 356 <div class="row"> 357 <div {{ bind-attr class=":col-md-6 :col-lg-5 :padded-right-middle isShowingItem:hidden-xs isShowingItem:hidden-sm" }}> 358 {{view App.ActionBarView }} 359 360 {{#if filteredContent}} 361 362 {{#if condensed }} 363 364 {{#collection Ember.ListView contentBinding="filteredContent" height=800 rowHeight=44 }} 365 {{#link-to 'services.show' Name tagName="div" href=false class="list-group-item list-condensed-link" }} 366 <div {{bind-attr class="hasFailingChecks:bg-orange:bg-green :list-bar-horizontal"}}></div> 367 <div class="name"> 368 {{Name}} 369 <small class="pull-right"> 370 {{ checkMessage }} 371 </small> 372 </div> 373 {{/link-to}} 374 {{/collection}} 375 376 {{else}} 377 378 {{#collection Ember.ListView contentBinding="filteredContent" height=800 rowHeight=120 }} 379 {{#link-to 'services.show' Name tagName="div" href=false class="list-group-item list-link" }} 380 <div {{bind-attr class="hasFailingChecks:bg-orange:bg-green :list-bar"}}></div> 381 <h4 class="list-group-item-heading"> 382 {{#link-to 'services.show' Name class='subtle'}}{{Name}}{{/link-to}} 383 <div class="heading-helper"> 384 <a class="subtle" href="#">{{checkMessage}}</a> 385 </div> 386 </h4> 387 <ul class="list-inline"> 388 {{#each node in nodes }} 389 <li class="bold">{{node}}</li> 390 {{/each}} 391 </ul> 392 {{/link-to}} 393 {{/collection}} 394 395 {{/if}} 396 397 {{else}} 398 <p class="light">There are no services to show.</p> 399 {{/if}} 400 401 </div> 402 403 <div class="border-left hidden-xs hidden-sm"> 404 </div> 405 406 <div class="visible-xs visible-sm"> 407 <hr> 408 </div> 409 410 <div class="col-md-6 col-lg-7 border-left scrollable"> 411 <div class="row padded-border"> 412 {{outlet}} 413 </div> 414 </div> 415 </div> 416 </script> 417 418 <script type="text/x-handlebars" id="service"> 419 <div class="col-xs-12 col-sm-12 visible-xs visible-sm"> 420 {{#link-to "services" class="btn btn-default btn-block" }}Back to all services{{/link-to}} 421 <hr> 422 </div> 423 424 <h3 class="no-margin">{{ model.0.Service.Service }}</h3> 425 <hr> 426 427 <h5>Tags</h5> 428 {{#if tags}} 429 <p>{{tags}}</p> 430 {{else}} 431 <p>No tags</p> 432 {{/if}} 433 434 <h5>Nodes</h5> 435 436 {{#each node in model }} 437 438 {{#link-to 'nodes.show' node.Node.Node tagName="div" href=false class="panel panel-link panel-list" }} 439 <div {{bind-attr class="node.hasFailingChecks:bg-orange:bg-green :panel-bar-horizontal"}}></div> 440 441 <div class="panel-heading"> 442 <h3 class="panel-title"> 443 {{node.Node.Node}} 444 <small>{{node.Node.Address}}</small> 445 <span class="panel-note">{{node.checkMessage}}</span> 446 </h3> 447 </div> 448 449 <ul class="list-unstyled"> 450 {{#each check in node.Checks }} 451 <li class="list-group-item list-condensed-link"> 452 {{listBar check.Status}} 453 <div class="name"> 454 {{check.Name}} 455 <small>{{ check.CheckID }}</small> 456 <small class="pull-right"> 457 {{check.Status}} 458 </small> 459 </div> 460 </li> 461 {{/each}} 462 </ul> 463 464 {{/link-to}} 465 466 {{/each}} 467 </script> 468 469 <script type="text/x-handlebars" id="nodes"> 470 <div class="row"> 471 <div {{ bind-attr class=":col-md-6 :col-lg-5 :padded-right-middle isShowingItem:hidden-xs isShowingItem:hidden-sm" }}> 472 {{view App.ActionBarView }} 473 474 {{#if filteredContent}} 475 476 {{#if condensed }} 477 {{#collection Ember.ListView contentBinding="filteredContent" height=800 rowHeight=44 }} 478 {{#link-to 'nodes.show' Node tagName="div" href=false class="list-group-item list-condensed-link" }} 479 <div {{bind-attr class="hasFailingChecks:bg-orange:bg-green :list-bar-horizontal"}}></div> 480 <div class="name"> 481 {{Node}} 482 <small class="pull-right"> 483 {{ numServices }} services 484 </small> 485 </div> 486 {{/link-to}} 487 {{/collection}} 488 489 {{else}} 490 491 {{#collection Ember.ListView contentBinding="filteredContent" height=800 rowHeight=120 }} 492 {{#link-to 'nodes.show' Node tagName="div" href=false class="list-group-item list-link" }} 493 <div {{bind-attr class="hasFailingChecks:bg-orange:bg-green :list-bar"}}></div> 494 <h4 class="list-group-item-heading"> 495 {{Node}} 496 <small>{{Address}}</small> 497 <div class="heading-helper"> 498 <a class="subtle" href="#">{{checkMessage}}</a> 499 </div> 500 </h4> 501 <ul class="list-inline"> 502 {{#each service in services}} 503 <li class="bold">{{service.Service}}</li> 504 {{/each}} 505 </ul> 506 {{/link-to}} 507 {{/collection}} 508 509 {{/if}} 510 511 {{else}} 512 <p class="light">There are no nodes to show.</p> 513 {{/if}} 514 </div> 515 516 <div class="border-left hidden-xs hidden-sm"> 517 </div> 518 519 <div class="col-md-6 col-lg-7 border-left scrollable"> 520 <div class="row padded-border"> 521 {{outlet}} 522 </div> 523 </div> 524 </div> 525 </script> 526 527 <script type="text/x-handlebars" id="node"> 528 <div class="col-xs-12 col-sm-12 visible-xs visible-sm"> 529 {{#link-to "nodes" class="btn btn-default btn-block" }}Back to all nodes{{/link-to}} 530 <hr> 531 </div> 532 533 <h3 class="no-margin"> 534 {{ model.Node }} <small> {{ model.Address }}</small> 535 </h3> 536 <hr> 537 538 <h5>Services</h5> 539 540 {{#each service in model.Services }} 541 {{#link-to 'services.show' service.Service tagName="div" href=false class="list-group-item list-condensed-link double-line" }} 542 <div class="list-bar-horizontal bg-light-gray"></div> 543 <div class="name"> 544 {{service.Service}} 545 <small class="pull-right"> 546 {{service.Address}}:{{service.Port}} 547 </small> 548 </div> 549 <ul class="list-inline sub"> 550 {{#each tag in service.Tags}} 551 <li>{{tag}}</li> 552 {{/each}} 553 {{serviceTagMessage service.Tags}} 554 </ul> 555 {{/link-to}} 556 557 {{/each}} 558 559 <h5>Checks</h5> 560 561 {{#each check in model.Checks }} 562 563 <div class="panel"> 564 {{ panelBar check.Status }} 565 <div class="panel-heading"> 566 <h3 class="panel-title"> 567 {{check.Name}} 568 <small>{{check.CheckID}}</small> 569 <span class="panel-note">{{check.Status}}</span> 570 </h3> 571 </div> 572 573 <div class="panel-body"> 574 <h5>Notes</h5> 575 <p>{{ check.Notes }}</p> 576 <h5>Output</h5> 577 <pre>{{check.Output}}</pre> 578 </div> 579 </div> 580 581 {{/each}} 582 583 <h5>Lock Sessions</h5> 584 585 {{#if sessions }} 586 {{errorMessage}} 587 588 {{#each session in sessions }} 589 <div class="list-group-item list-condensed double-line"> 590 <div class="bg-light-gray list-bar-horizontal"></div> 591 <div class="name"> 592 {{ sessionName session }} 593 <button {{ action "invalidateSession" session.ID }} {{ bind-attr class=":btn :btn-danger :pull-right :btn-list isLoading:btn-warning" }}>Invalidate</button> 594 </div> 595 596 <ul class="list-inline sub"> 597 {{#each check in session.Checks}} 598 <li class="bold">{{check}}</li> 599 {{/each}} 600 </ul> 601 {{ sessionMeta session }} 602 </div> 603 {{/each}} 604 605 {{else}} 606 <p class="light small">No sessions</p> 607 {{/if}} 608 609 <h5>Network Tomography</h5> 610 611 {{ tomographyGraph tomography 336 }} 612 613 <p class="light small">Node: <span id="tomography-node-info"></span></p> 614 <p class="light small">Minimum: {{ tomography.min }}ms</p> 615 <p class="light small">Median: {{ tomography.median }}ms</p> 616 <p class="light small">Maximum: {{ tomography.max }}ms</p> 617 </script> 618 619 <script type="text/x-handlebars" id="acls"> 620 <div class="row"> 621 <div {{ bind-attr class=":col-md-6 :col-lg-5 :padded-right-middle isShowingItem:hidden-xs isShowingItem:hidden-sm" }}> 622 {{view App.ActionBarView }} 623 624 {{#if filteredContent}} 625 {{#collection Ember.ListView contentBinding="filteredContent" height=800 rowHeight=44 }} 626 {{#link-to 'acls.show' ID tagName="div" href=false class="list-group-item list-condensed-link" }} 627 <div class="bg-light-gray list-bar-horizontal"></div> 628 <div class="name"> 629 {{ aclName Name ID }} 630 </div> 631 {{/link-to}} 632 {{/collection}} 633 {{else}} 634 <p class="light">There are no ACLs to show.</p> 635 {{/if}} 636 </div> 637 638 <div class="border-left hidden-xs hidden-sm"> 639 </div> 640 641 {{#if isShowingItem}} 642 <div class="col-md-6 col-lg-7 border-left scrollable"> 643 <div class="row padded-border"> 644 {{outlet}} 645 </div> 646 </div> 647 {{else}} 648 <div class="col-md-6 col-lg-7 border-left"> 649 <div class="row padded-border"> 650 <div class="panel"> 651 <div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-light-gray" }}></div> 652 <div class="panel-heading"> 653 <h4 class="panel-title"> 654 New ACL 655 </h4> 656 </div> 657 658 <div class="panel-body panel-form"> 659 <div class="form-group"></div> 660 661 <form class="form"> 662 <div class="form-group"> 663 {{ input value=newAcl.Name class="form-control" }} 664 <span class="help-block">Set the optional name for the ACL.</span> 665 </div> 666 667 <div class="form-group"> 668 {{view Ember.Select content=types value=newAcl.Type class="form-control form-control-mini"}} 669 <span class="help-block">The type of ACL this is.</span> 670 </div> 671 672 <div class="form-group"> 673 <label>Rules</label> 674 {{ textarea value=newAcl.Rules class="form-control" }} 675 <span class="help-block">For more information on rules, visit the <a href="https://www.consul.io/docs/guides/acl.html" target="_blank">ACL documentation.</a></span> 676 </div> 677 678 <button {{ action "createAcl"}} {{ bind-attr class=":btn :btn-success" }}>Create</button> 679 </form> 680 </div> 681 </div> 682 </div> 683 </div> 684 {{/if}} 685 </div> 686 </script> 687 688 <script type="text/x-handlebars" id="acl"> 689 <div class="row"> 690 <div class="col-xs-12 col-sm-12 visible-xs visible-sm"> 691 {{#link-to "acls" class="btn btn-default btn-block" }}Back to all ACLs{{/link-to}} 692 <hr> 693 </div> 694 </div> 695 696 <div class="panel"> 697 <div {{ bind-attr class=":panel-bar isLoading:bg-orange:bg-light-gray" }}></div> 698 <div class="panel-heading"> 699 <h4 class="panel-title"> 700 {{ aclName "Update ACL" model.ID }} 701 </h4> 702 </div> 703 704 <div class="panel-body panel-form"> 705 <div class="form-group"></div> 706 707 <form class="form"> 708 <div class="form-group"> 709 {{ input value=model.Name class="form-control" }} 710 <span class="help-block">Set the optional name for the ACL.</span> 711 </div> 712 713 <div class="form-group"> 714 {{view Ember.Select content=types value=model.Type class="form-control form-control-mini"}} 715 <span class="help-block">The type of ACL this is.</span> 716 </div> 717 718 <div class="form-group"> 719 <label>Rules</label> 720 {{ textarea value=model.Rules class="form-control" }} 721 <span class="help-block">For more information on rules, visit the <a href="https://www.consul.io/docs/guides/acl.html" target="_blank">ACL documentation.</a></span> 722 </div> 723 724 <button {{ action "updateAcl"}} {{ bind-attr class=":btn :btn-success" }}>Update</button> 725 <button {{ action "clone" }} {{ bind-attr class=":btn :btn-default" }}>Clone</button> 726 <button {{ action "set" }} {{ bind-attr class=":btn :btn-default" }}>Use Token</button> 727 {{# if model.isNotAnon }} 728 <button {{ action "delete"}} {{ bind-attr class=":btn isLoading:btn-warning:btn-danger :pull-right" }}>Delete</button> 729 {{/if}} 730 731 </form> 732 </div> 733 </div> 734 <hr> 735 </script> 736 737 <script type="text/x-handlebars" id="index"> 738 <div class="col-md-8 col-md-offset-2 col-xs-offset-0 col-sm-offset-0 col-xs-12 col-sm-12 vertical-center"> 739 <h5>Select a datacenter</h5> 740 {{#each item in model}} 741 {{#link-to 'services' item }} 742 <div class="panel panel-link panel-short"> 743 <div class="panel-bar bg-light-gray"></div> 744 <div class="panel-heading"> 745 <h3 class="panel-title"> 746 {{item}} 747 <span class="panel-note"></span> 748 </h3> 749 </div> 750 </div> 751 {{/link-to}} 752 {{/each}} 753 </div> 754 </script> 755 756 <script type="text/x-handlebars" id="settings"> 757 <div class="col-md-8 col-md-offset-2 col-xs-offset-0 col-sm-offset-0 col-xs-12 col-sm-12"> 758 <h3>Settings</h3> 759 <p>These settings allow you to configure your browser for the Consul Web UI. Everything is saved to localstorage, 760 and should persist through visits and browser usage.</p> 761 <p>Settings are automatically persisted upon modification, so no manual save is required.</p> 762 <h5>ACL Token</h5> 763 <div class="form-group"> 764 {{ input type="text" value=model.token class="form-control form-mono" placeholder="token"}} 765 <span class="help-block">The token is sent with requests as the <code>?token</code> parameter. This is used to control the ACL for the 766 web UI.</span> 767 </div> 768 <div class="form-group"> 769 <button {{ action "reset" }} {{ bind-attr class=":btn :btn-danger" }}>Reset Defaults</button> 770 <button {{ action "close" }} {{ bind-attr class=":btn :btn-default" }}>Close</button> 771 </div> 772 </div> 773 </script> 774 775 776 <script> 777 // Enable query params, must be loaded before ember is 778 EmberENV = {FEATURES: {'query-params-new': true}}; 779 </script> 780 781 <!-- ASSETS --> 782 <script src="javascripts/libs/jquery-1.10.2.min.js"></script> 783 <script src="javascripts/libs/handlebars-1.3.0.min.js"></script> 784 <script src="javascripts/libs/base64.min.js"></script> 785 <script src="javascripts/libs/ember-debug.min.js"></script> 786 <script src="javascripts/libs/ember-validations.min.js"></script> 787 <script src="javascripts/libs/list-view.min.js"></script> 788 <script src="javascripts/libs/classie.js"></script> 789 <script src="javascripts/libs/notificationFx.js"></script> 790 <script src="javascripts/fixtures.js"></script> 791 <script src="javascripts/app/router.js"></script> 792 <script src="javascripts/app/routes.js"></script> 793 <script src="javascripts/app/models.js"></script> 794 <script src="javascripts/app/views.js"></script> 795 <script src="javascripts/app/controllers.js"></script> 796 <script src="javascripts/app/helpers.js"></script> 797 <!-- to activate the test runner, add the "?test" query string parameter --> 798 <script src="tests/runner.js"></script> 799 <!-- <script src="static/application.min.js"></script> --> 800 <!-- /ASSETS --> 801 802 </body> 803 </html>