panel.html revision 8296b7bd5a8c596eadf8aa0956b40416b84c0e88
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo<!DOCTYPE html>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo<html>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo<head>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <meta charset="utf-8" />
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <title>Panel Manual Test</title>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <link rel="stylesheet" href="/build/cssreset/reset-min.css" />
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <link rel="stylesheet" href="/build/cssfonts/fonts-min.css" />
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <link rel="stylesheet" href="/build/cssbase/base-min.css" />
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo</head>
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo<body class="yui3-skin-sam">
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <h1>Panel Manual Test</h1>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <script src="/build/yui/yui.js"></script>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo <script>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo YUI({
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo skin : 'sam',
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo filter: 'raw'
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo }).use('panel', function (Y) {
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo var panel = new Y.Panel({
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo headerContent: 'Foo Panel',
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo bodyContent : '<p>Looks like you want to save something.</p>',
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo centered : true,
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo width : 250,
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo buttons: {
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo header: ['close'],
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo footer: [
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo {
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo label : 'Cancel',
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo action: 'hide'
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo },
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo {
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo label : 'Save',
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo action : 'onSave',
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo isDefault: true
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo }
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo ]
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo }
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo });
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo panel.onSave = function (e) {
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo Y.all(panel.get('buttons.footer')).set('disabled', true);
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo panel.set('bodyContent', '<p>Saving now…</p>');
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo setTimeout(function () {
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo panel.hide();
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo }, 750);
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo }
8296b7bd5a8c596eadf8aa0956b40416b84c0e88Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo panel.render().align();
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo });
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo </script>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo</body>
3adb0d80f3aad0b2be2fd6c8a45091d1e9fb5ec7Eric Ferraiuolo</html>