Dialog boxes moved into base_panels, demonstration using the 'quickie' on the welcome page

This commit is contained in:
James Taylor
2009-02-24 15:10:49 -05:00
parent cded5eb776
commit 9ae9849ba7
3 changed files with 73 additions and 31 deletions
+34 -13
View File
@@ -13,6 +13,7 @@
<meta name="generator" content="Docutils 0.6: http://docutils.sourceforge.net/"/>
<script src="http://www.apple.com/library/quicktime/scripts/ac_quicktime.js" language="JavaScript" type="text/javascript"></script>
<script src="http://www.apple.com/library/quicktime/scripts/qtp_library.js" language="JavaScript" type="text/javascript"></script>
<script src="scripts/jquery.js" language="JavaScript" type="text/javascript"></script>
<link href="http://www.apple.com/library/quicktime/stylesheets/qtp_library.css" rel="StyleSheet" type="text/css" />
<link rel="stylesheet" href="style/base.css" type="text/css" />
</head>
@@ -39,21 +40,41 @@
<td valign="middle" align="center">
<br>
<script type="text/javascript"><!--
QT_WritePoster_XHTML('click to play', 'http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping-poster.jpg',
'http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping.mov',
'640', '480', '',
'controller', 'true',
'autoplay', 'true',
'bgcolor', '#CCCCFF',
'scale', 'aspect');
//-->
</script>
<div style="background: black; width: 100%; height: 300px; text-align: center;">
<div style="margin: auto;">
<div style="padding: 50px 0; color: white; font-size: 300%;">Galaxy quickie</div>
<div><span class="playButton" onclick="showmovie()">click to play</span></div>
<div style="padding: 50px 0; font-size: 200%; color: orange;">Grouping</div>
</div>
</div>
<script type="text/javascript">
function showmovie() {
if ( parent.show_modal ) {
console.log( $( "#movie" ).html() );
parent.show_modal( "Galaxy quickie", $( "#movie" ).html(), { "close" : parent.hide_modal }, {} );
}
}
</script>
<div style="display: none;">
<div id="movie">
<div style="width: 640px; height: 480px;">
<object width="640" height="480" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping.mov" />
<param name="target" value="myself" />
<param name="controller" value="true" />
<param name="autoplay" value="true" />
<param name="scale" value="aspect" />
</object>
</div>
</div>
</div>
<noscript>
<object width="640" height="480" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping.jpg" />
<param name="href" value="http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping.mov" />
<param name="src" value="http://screencast.g2.bx.psu.edu/galaxy/quickie2_Grouping/quickie2_Grouping.mov" />
<param name="target" value="myself" />
<param name="controller" value="false" />
<param name="autoplay" value="false" />
+34
View File
@@ -5,6 +5,7 @@
self.has_left_panel=True
self.has_right_panel=True
self.message_box_visible=False
self.overlay_visible=False
self.message_box_class=""
self.active_view=None
%>
@@ -190,6 +191,38 @@
</%def>
<%def name="overlay( title='', content='' )">
<%def name="title()"></%def>
<%def name="content()"></%def>
<div id="overlay"
%if not self.overlay_visible:
style="display: none;"
%endif
>
## Need a table here for centering in IE6
<table class="dialog-box-container" border="0" cellpadding="0" cellspacing="0"
%if not self.overlay_visible:
style="display: none;"
%endif
><tr><td>
<div class="dialog-box-wrapper">
<div class="dialog-box">
<div class="unified-panel-header">
<div class="unified-panel-header-inner"><span class='title'>${title}</span></div>
</div>
<div class="body" style="max-height: 600px; overflow: auto;">${content}</div>
<div>
<div class="buttons" style="display: none; float: right;"></div>
<div class="extra_buttons" style="display: none; padding: 5px;"></div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</td></tr></table>
</div>
</%def>
## Messagebox
<%def name="message_box_content()">
</%def>
@@ -217,6 +250,7 @@
${self.message_box_content()}
%endif
</div>
${self.overlay()}
%if self.has_left_panel:
<div id="left">
${self.left_panel()}
+5 -18
View File
@@ -5,6 +5,7 @@
self.active_view="workflow"
self.message_box_visible=True
self.message_box_class="warning"
self.overlay_visible=True
%>
</%def>
@@ -536,24 +537,10 @@
<div class="toolSectionPad"></div>
</%def>
<div id="overlay">
## Need a table here for centering in IE6
<table class="dialog-box-container" border="0" cellpadding="0" cellspacing="0"><tr><td>
<div class="dialog-box-wrapper">
<div class="dialog-box">
<div class="unified-panel-header">
<div class="unified-panel-header-inner"><span class='title'>Loading workflow editor...</span></div>
</div>
<div class="body" style="max-height: 500px; overflow: auto;"><img src="${h.url_for('/static/images/yui/rel_interstitial_loading.gif')}" /></div>
<div>
<div class="buttons" style="display: none; float: right;"></div>
<div class="extra_buttons" style="display: none; padding: 5px;"></div>
<div style="clear: both;"></div>
</div>
</div>
</div>
</td></tr></table>
</div>
<%def name="overlay()">
${parent.overlay( "Loading workflow editor...",
"<img src='" + h.url_for('/static/images/yui/rel_interstitial_loading.gif') + "'/>" )}
</%def>
<%def name="left_panel()">
<div class="unified-panel-header" unselectable="on">