[llvm-commits] [zorg] r125939 - in /zorg/trunk/llvmlab/llvmlab/ui: static/style.css templates/dashboard.html
Daniel Dunbar
daniel at zuster.org
Fri Feb 18 08:45:06 PST 2011
Author: ddunbar
Date: Fri Feb 18 10:45:06 2011
New Revision: 125939
URL: http://llvm.org/viewvc/llvm-project?rev=125939&view=rev
Log:
llvmlab: Tweak popups to show up near the mouse, again stealing methods from
buildbot.
Modified:
zorg/trunk/llvmlab/llvmlab/ui/static/style.css
zorg/trunk/llvmlab/llvmlab/ui/templates/dashboard.html
Modified: zorg/trunk/llvmlab/llvmlab/ui/static/style.css
URL: http://llvm.org/viewvc/llvm-project/zorg/trunk/llvmlab/llvmlab/ui/static/style.css?rev=125939&r1=125938&r2=125939&view=diff
==============================================================================
--- zorg/trunk/llvmlab/llvmlab/ui/static/style.css (original)
+++ zorg/trunk/llvmlab/llvmlab/ui/static/style.css Fri Feb 18 10:45:06 2011
@@ -44,6 +44,27 @@
border: 1px solid #AACBE2;
}
+div.popup {
+ border-radius: 7px;
+ -webkit-border-radius: 7px;
+ -moz-border-radius: 7px;
+ position: absolute;
+ background-color: #FFFFFF;
+ padding: 4px 4px 4px 4px;
+ float: left;
+ display: none;
+ border-width: 1px;
+ border-style: solid;
+}
+
+div.popup_inner {
+ border-radius: 3px;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ background-color: #F0F3EF;
+ padding: 4px 4px 4px 4px;
+}
+
/* Dashboard Features */
a.help-link {
Modified: zorg/trunk/llvmlab/llvmlab/ui/templates/dashboard.html
URL: http://llvm.org/viewvc/llvm-project/zorg/trunk/llvmlab/llvmlab/ui/templates/dashboard.html?rev=125939&r1=125938&r2=125939&view=diff
==============================================================================
--- zorg/trunk/llvmlab/llvmlab/ui/templates/dashboard.html (original)
+++ zorg/trunk/llvmlab/llvmlab/ui/templates/dashboard.html Fri Feb 18 10:45:06 2011
@@ -10,7 +10,7 @@
{% macro help_text(text) %}
<a href='#'
- onclick='show_content_in_popup("help", "{{ text }}", event); return false;'
+ onclick='show_help_popup("{{ text }}"); return false;'
title='Help'
class='help-link'
target="_blank">?</a>
@@ -77,7 +77,7 @@
{% endblock %}
{% block javascript %}
-function show_content_in_popup(kind, content, event) {
+function show_content_in_popup(kind, content) {
var popup_holder = document.getElementById(kind + "_popup_holder");
var popup = document.getElementById(kind + "_popup");
@@ -85,15 +85,27 @@
popup_holder.style.display = "block";
}
+// Handler for popup close onclick events.
function close_popup(kind) {
var popup_holder = document.getElementById(kind + "_popup_holder");
var popup = document.getElementById(kind + "_popup");
- popup.innerHTML = "";
popup_holder.style.display = "none";
}
+// Handler for help onclick events.
+function show_help_popup(text, event) {
+ // Update the popup location.
+ update_popup_location("help", event);
+
+ // Update the help txt.
+ show_content_in_popup("help", text);
+}
+
// Handler for phase onclick events.
function show_popup(kind, url, event) {
+ // Update the popup location.
+ update_popup_location(kind, event);
+
// Get the popup elements.
var popup = document.getElementById(kind + "_popup");
var popup_frame = document.getElementById(kind + "_popup_frame");
@@ -102,10 +114,36 @@
popup_frame.src = url;
}
+// Helper for moving popups around.
+function update_popup_location(kind, event) {
+ var popup_holder = document.getElementById(kind + "_popup_holder");
+ var popup = document.getElementById(kind + "_popup");
+
+ // Find the current curson position.
+ var cx = (window.event ? window.event.clientX : event.pageX);
+ var cy = (window.event ? window.event.clientY : event.pageY);
+
+ // Offset the popup to not hide the local content.
+ cx = cx + document.body.scrollLeft + 15;
+ cy = cy + document.body.scrollTop + 10;
+
+ // Move the div (hidden) under the cursor.
+ popup_holder.style.left = parseInt(cx) + 'px';
+ popup_holder.style.top = parseInt(cy) + 'px';
+
+ // Close all current the popups.
+ document.getElementById("help_popup_holder").style.display = "none";
+ document.getElementById("phase_popup_holder").style.display = "none";
+ document.getElementById("timing_popup_holder").style.display = "none";
+}
+
// Handler for timing onclick events.
function show_timing_popup(url, event) {
+ // Update the popup location.
+ update_popup_location("timing", event);
+
// Get the popup elements.
- var popup = document.getElementById("timing_popup");
+ var popup_holder = document.getElementById("timing_popup_holder");
var popup_legend = document.getElementById("timing_popup_legend");
// Get the timing data from the server.
@@ -142,7 +180,7 @@
graph.draw();
// Show the timing popup.
- popup.style.display = "block";
+ popup_holder.style.display = "block";
});
}
@@ -152,7 +190,7 @@
// Get the frame contents and put it in the popup div.
var content = popup_frame.contentWindow.document.body.innerHTML;
- show_content_in_popup(kind, content, event);
+ show_content_in_popup(kind, content);
}
// On load, set the iframe's onload handler.
@@ -314,8 +352,9 @@
</table>
{# The div we use to include help popups. #}
-<div id="help_popup_holder" style="display: none;">
+<div id="help_popup_holder" style="display: none;" class="popup">
{% call close_popup_link("help") %}(close) {% endcall %}
+ <hr>
<div id="help_popup"></div>
</div>
{# The iframe we use to load the help source. This is never actually
@@ -323,17 +362,18 @@
<iframe id="help_popup_frame" style="display: none;"></iframe>
{# The div we use to include phase popups. #}
-<div id="phase_popup_holder" style="display: none;">
+<div id="phase_popup_holder" style="display: none;" class="popup">
{% call close_popup_link("phase") %}(close) {% endcall %}
- <div id="phase_popup"></div>
+ <div class="popup_inner"><div id="phase_popup"></div></div>
</div>
{# The iframe we use to load the phase popup source. This is never actually
displayed, just used to load the HTML we insert into the popup div. #}
<iframe id="phase_popup_frame" style="display: none;"></iframe>
{# The div we use to include timing popups. #}
-<div id="timing_popup_holder" style="display: none;">
- {% call close_popup_link("help") %}(close) {% endcall %}
+<div id="timing_popup_holder" style="display: none;" class="popup">
+ {% call close_popup_link("timing") %}(close) {% endcall %}
+ <hr>
<div id="timing_popup">
<canvas id="timing_graph" width="400" height="300"></canvas>
<div id="timing_popup_legend"></div>
More information about the llvm-commits
mailing list