| OLD | NEW |
| (Empty) | |
| 1 <!doctype html> |
| 2 <!-- Copyright (c) 2014 Google Inc. All rights reserved. --> |
| 3 <html> |
| 4 <head> |
| 5 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-
scale=1.0, user-scalable=yes"> |
| 6 <title>google-url-shortener Demo</title> |
| 7 |
| 8 <link rel="import" href="../google-url-shortener.html"> |
| 9 |
| 10 </head> |
| 11 <body> |
| 12 <p>A `google-url-shortener` allows you to build this:</p> |
| 13 <template is="dom-bind"> |
| 14 <google-url-shortener id="shortener" |
| 15 long-url="{{longUrl}}" |
| 16 short-url="{{shortUrl}}" |
| 17 error="{{urlError}}" |
| 18 auto> |
| 19 </google-url-shortener> |
| 20 <form on-submit="shorten"> |
| 21 <p> |
| 22 <input type="url" id="longUrl" |
| 23 placeholder="Input URL here:" |
| 24 value="http://www.google.com/" |
| 25 size="50"> |
| 26 <input type="submit" value="submit"> |
| 27 </p> |
| 28 <p> |
| 29 <strong>Short URL</strong>: |
| 30 <a href="{{shortUrl}}" target="_blank">{{shortUrl}}</a> |
| 31 </p> |
| 32 <p> |
| 33 <p><strong>Error: </strong><span style="color:red">{{urlError}}</span></
p> |
| 34 </p> |
| 35 </form> |
| 36 </template> |
| 37 <script> |
| 38 document.querySelector('template').shorten = function(e) { |
| 39 e.preventDefault(); |
| 40 this.longUrl = this.$.longUrl.value; |
| 41 }; |
| 42 </script> |
| 43 </body> |
| 44 </html> |
| OLD | NEW |