UNPKG

api-console-assets

Version:

This repo only exists to publish api console components to npm

99 lines (93 loc) 3.54 kB
<!doctype html> <!-- @license Copyright (c) 2015 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt --> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes"> <title>raml-main-entry-lookup demo</title> <script src="../../webcomponentsjs/webcomponents-lite.js"></script> <link rel="import" href="../../iron-demo-helpers/demo-pages-shared-styles.html"> <link rel="import" href="../../file-drop/file-drop.html"> <link rel="import" href="../../paper-toast/paper-toast.html"> <link rel="import" href="../raml-main-entry-lookup.html"> <style is="custom-style" include="demo-pages-shared-styles"> .vertical-section-container { max-width: 600px; } file-drop { margin: 0; } h1 { @apply(--paper-font-title); } h3 { @apply(--paper-font-subhead); } </style> </head> <body unresolved> <template is="dom-bind" id="app"> <div class="vertical-section-container centered"> <h1>Drop RAML file here.</h1> <file-drop file="{{file}}" multiple on-file-accepted="fileListChanged"></file-drop> <raml-main-entry-lookup files="[[file]]" on-entry="entryFound"></raml-main-entry-lookup> <section class="no-entry-point" hidden$="[[!noEntryPoint]]"> <h3>No entry point found</h3> <p>The app scanned files and there were no candidates for entry point raml file. Please, try again.</p> </section> <section class="multiple-entry-points" hidden$="[[!multipleEntryPoints]]"> <h3>Multiple entry points found</h3> <p>Please, select file that is the entry point to the API definition.</p> <template is="dom-repeat" items="[[entryPoints]]" index-as="index"> <p>[[item.path]][[item.name]] <paper-button raised on-tap="useEntryPoint">use this</paper-button> </p> </template> </section> <section class="has-shingle-entry-point" hidden$="[[!singleEntryPoint]]"> <h3>Single entry point found</h3> <p>[[entryPoint.path]][[entryPoint.name]]</p> </section> </div> <paper-toast text="You have selected a main RAML file." id="selection"></paper-toast> </template> <script> (function(scope) { scope.fileListChanged = () => { scope.noEntryPoint = false; scope.multipleEntryPoints = false; scope.singleEntryPoint = false; scope.entryPoints = []; scope.entryPoint = null; }; scope.entryFound = (e) => { var file = e.detail.entry; if (!file) { scope.noEntryPoint = true; return; } if (file instanceof Array) { scope.multipleEntryPoints = true; scope.entryPoints = file; } else { scope.singleEntryPoint = true; scope.entryPoint = file; } }; scope.useEntryPoint = () => { app.$.selection.open(); }; scope.fileListChanged(); })(document.querySelector('#app')); </script> </body> </html>