Last active
April 5, 2017 12:01
-
-
Save JeroenVinke/868d729b678316eebc43755decbf8ad9 to your computer and use it in GitHub Desktop.
Aurelia KendoUI component - problem report
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <template> | |
| <require from="./basic-use.css"></require> | |
| <require from="aurelia-kendoui-bridge/window/window"></require> | |
| <require from="aurelia-kendoui-bridge/button/button"></require> | |
| <div id="example"> | |
| <div id="window" | |
| ak-window="k-no-init.bind: true; k-width: 600px; k-title: About Alvar Aalto; k-visible.bind: false; k-actions.bind: actions; k-widget.bind: window" | |
| ak-window.ref="windowVM" | |
| k-on-close.delegate="onClose()"> | |
| <div class="armchair" if.bind="visible"> | |
| <div> | |
| <img src="http://demos.telerik.com/kendo-ui/content/web/window/armchair-402.png" alt="Artek Alvar Aalto - Armchair 402" /> Artek Alvar Aalto - Armchair 402</div> | |
| <p>Alvar Aalto is one of the greatest names in modern architecture and design. Glassblowers at the iittala factory still meticulously handcraft the legendary vases that are variations on one theme, fluid organic shapes that let the end user decide the use. Interpretations of the shape in new colors and materials add to the growing Alvar Aalto Collection that remains true to his original design.</p> | |
| <p>Born Hugo Alvar Henrik Aalto (February 3, 1898 - May 11, 1976) in Kuortane, Finland, was noted for his humanistic approach to modernism. He studied architecture at the Helsinki University of Technology from 1916 to 1921. In 1924 he married architect Aino Marsio.</p> | |
| <p>Alvar Aalto was one of the first and most influential architects of the Scandinavian modern movement, and a member of the Congres Internationaux d'Architecture Moderne. Major architectural works include the Finlandia Hall in Helsinki, Finland, and the campus of Helsinki University of Technology.</p> | |
| <p>Source: <a href="http://www.aalto.com/about-alvar-aalto.html" title="About Alvar Aalto">www.aalto.com</a></p> | |
| </div> | |
| </div> | |
| <span id="show" ref="show" ak-button click.delegate="open()">Click here to open the window.</span> | |
| <div class="responsive-message"></div> | |
| </div> | |
| </template> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| export class App { | |
| actions = ['Pin', 'Minimize', 'Maximize', 'Close']; | |
| open() { | |
| this.windowVM.recreate(); | |
| this.visible = true; | |
| setTimeout(() => { | |
| this.window.center().open(); | |
| $(this.show).fadeOut(); | |
| }, 50); | |
| } | |
| onClose() { | |
| this.visible = false; | |
| $(this.show).fadeIn(); | |
| this.windowVM.destroy(); | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #example | |
| { | |
| min-height:500px; | |
| } | |
| #undo { | |
| text-align: center; | |
| position: absolute; | |
| white-space: nowrap; | |
| padding: 1em; | |
| cursor: pointer; | |
| } | |
| .armchair { | |
| float: left; | |
| margin: 30px 30px 120px 30px; | |
| text-align: center; | |
| } | |
| .armchair img { | |
| display: block; | |
| margin-bottom: 10px; | |
| } | |
| @media screen and (max-width: 1023px) { | |
| #window-basic-use div.ak-window { | |
| display: none !important; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <title>Aurelia KendoUI bridge</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css"> | |
| <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.rtl.min.css"> | |
| <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.default.min.css"> | |
| <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.mobile.all.min.css"> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.4.0/bluebird.min.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.2.1/chroma.min.js"></script> | |
| <script src="https://kendo.cdn.telerik.com/2017.1.118/js/jquery.min.js"></script> | |
| <script src="https://kendo.cdn.telerik.com/2017.1.118/js/jszip.min.js"></script> | |
| <script src="https://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script> | |
| </head> | |
| <body aurelia-app="main"> | |
| <h1>Loading...</h1> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.6/system.js"></script> | |
| <script src="https://rawgit.com/aurelia-ui-toolkits/aurelia-kendoui-bundles/1.2.2/config2.js"></script> | |
| <script> | |
| System.import('aurelia-bootstrapper'); | |
| </script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| export function configure(aurelia) { | |
| aurelia.use | |
| .standardConfiguration() | |
| .developmentLogging() | |
| .plugin('aurelia-kendoui-bridge', kendo => kendo.pro()); | |
| aurelia.start().then(a => a.setRoot()); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment