Skip to content

Commit

Permalink
view source button stuff.
Browse files Browse the repository at this point in the history
  • Loading branch information
anutron committed Apr 30, 2011
1 parent da87b42 commit 1e37d12
Show file tree
Hide file tree
Showing 8 changed files with 167 additions and 154 deletions.
69 changes: 69 additions & 0 deletions static/css/minibuttons.css
@@ -0,0 +1,69 @@
#mt-test-buttons {
position: fixed;
bottom: 20px;
right: 20px;
z-index: 100;
}

/* button basics from github */
a.minibutton {
outline: none;
display:inline-block;
height:23px;
padding:0 0 0 3px;
font-size:11px;
font-weight:bold;
color:#333;
text-shadow:1px 1px 0 #fff;
background:url(/static/art/minibutton_matrix.png) 0 0 no-repeat;
white-space:nowrap;
border:none;
overflow:visible;
cursor:pointer;
text-decoration:none;
vertical-align: middle;
}

a.minibutton>span {
display:block;
height:23px;
padding:0 10px 0 8px;
line-height:23px;
background:url(/static/art/minibutton_matrix.png) 100% 0 no-repeat;
}
a.btn-no-txt>span {
padding: 0 15px 0 8px;
text-indent: -9999px;
}

a.minibutton:hover, a.minibutton:focus, a.minibutton.selected {
color:#fff;
text-decoration:none;
text-shadow:-1px -1px 0 rgba(0,0,0,0.3);
background-position:0 -30px;
}
a.minibutton:hover>span, a.minibutton:focus>span, a.minibutton.selected>span {background-position:100% -30px;}

a.minibutton.mousedown{background-position:0 -60px; }
a.minibutton.mousedown>span{background-position:100% -60px; }

/* icons */
a.minibutton .icon {
float:left;
margin-left:-4px;
width:18px;
height:22px;
background:url(/static/art/minibutton_icons.png) 0 0 no-repeat;
}

a.btn-download .icon {background-position:-40px 0;}
a.btn-download:hover .icon, a.btn-download:focus .icon {background-position:-40px -25px;}

a.btn-left .icon {background-position:-161px 1px;}
a.btn-left:hover .icon, a.btn-left:focus .icon {background-position:-161px -24px;}

a.btn-right .icon {background-position:-178px 1px;}
a.btn-right:hover .icon, a.btn-right:focus .icon {background-position:-178px -24px;}

a.btn-source .icon {background-position:-211px 0px;}
a.btn-source:hover .icon, a.btn-right:focus .icon {background-position:-211px -24px;}
64 changes: 1 addition & 63 deletions static/css/shared.css
Expand Up @@ -12,66 +12,4 @@ a {
color:#009; color:#009;
} }



@import url("minibuttons.css");
/* button basics from github */
a.minibutton {
outline: none;
display:inline-block;
height:23px;
padding:0 0 0 3px;
font-size:11px;
font-weight:bold;
color:#333;
text-shadow:1px 1px 0 #fff;
background:url(/static/art/minibutton_matrix.png) 0 0 no-repeat;
white-space:nowrap;
border:none;
overflow:visible;
cursor:pointer;
text-decoration:none;
vertical-align: middle;
}

a.minibutton>span {
display:block;
height:23px;
padding:0 10px 0 8px;
line-height:23px;
background:url(/static/art/minibutton_matrix.png) 100% 0 no-repeat;
}
a.btn-no-txt>span {
padding: 0 15px 0 8px;
text-indent: -9999px;
}

a.minibutton:hover, a.minibutton:focus, a.minibutton.selected {
color:#fff;
text-decoration:none;
text-shadow:-1px -1px 0 rgba(0,0,0,0.3);
background-position:0 -30px;
}
a.minibutton:hover>span, a.minibutton:focus>span, a.minibutton.selected>span {background-position:100% -30px;}

a.minibutton.mousedown{background-position:0 -60px; }
a.minibutton.mousedown>span{background-position:100% -60px; }

/* icons */
a.minibutton .icon {
float:left;
margin-left:-4px;
width:18px;
height:22px;
background:url(/static/art/minibutton_icons.png) 0 0 no-repeat;
}

a.btn-download .icon {background-position:-40px 0;}
a.btn-download:hover .icon, a.btn-download:focus .icon {background-position:-40px -25px;}

a.btn-left .icon {background-position:-161px 1px;}
a.btn-left:hover .icon, a.btn-left:focus .icon {background-position:-161px -24px;}

a.btn-right .icon {background-position:-178px 1px;}
a.btn-right:hover .icon, a.btn-right:focus .icon {background-position:-178px -24px;}

a.btn-source .icon {background-position:-211px 0px;}
a.btn-source:hover .icon, a.btn-right:focus .icon {background-position:-211px -24px;}
1 change: 0 additions & 1 deletion static/css/tests.css
Expand Up @@ -67,7 +67,6 @@ body.loaded #mt-loading {
height: 100px; height: 100px;
} }
#mt-log { #mt-log {
padding-left: 200px;
height: 100px; height: 100px;
overflow: auto; overflow: auto;
} }
Expand Down
162 changes: 86 additions & 76 deletions static/js/test-helpers.js
@@ -1,81 +1,91 @@
var makeActions = function(tests){ var makeActions = function(tests){
try { try {
if (!$('actions')) new Element('dt', {'id': 'actions'}).inject($('mt-content'), 'top'); if (!$('actions')) new Element('dt', {'id': 'actions'}).inject($('mt-content'), 'top');
tests.each(function(test, i) { tests.each(function(test, i) {
new Element('dt').adopt( new Element('dt').adopt(
new Element('a', { new Element('a', {
text: test.title, text: test.title,
events: { events: {
click: test.fn click: test.fn
}, },
id: 'test-' + i id: 'test-' + i
}) })
).inject('actions'); ).inject('actions');
if (test.description) new Element('dd', { text: test.description }).inject('actions'); if (test.description) new Element('dd', { text: test.description }).inject('actions');
}); });
} catch(e) { } catch(e) {
alert('Could not create actions. Check console for details.'); alert('Could not create actions. Check console for details.');
console.log('Ensure you have Core/Element.Event - plus its dependencies.', e); console.log('Ensure you have Core/Element.Event - plus its dependencies.', e);
} }
}; };
var log = function(msg) { var log = function(msg) {
var type = function(obj){ if (!log.log_wrapper) {
if (obj == undefined) return false; log.log_wrapper = document.createElement('div');
if (obj.nodeName){ log.log_wrapper.id = 'mt-log-wrapper';
switch (obj.nodeType){ log.log_element = document.createElement('div');
case 1: return 'element'; log.log_element.id = 'mt-log';
case 3: return (/\S/).test(obj.nodeValue) ? 'textnode' : 'whitespace'; log.log_wrapper.appendChild(log.log_element);
} document.body.appendChild(log.log_wrapper);
} else if (typeof obj.length == 'number'){ }
if (obj.callee) return 'arguments';
}
return typeof obj; var type = function(obj){
}; if (obj == undefined) return false;
var parse = function(){ if (obj.nodeName){
var str = ''; switch (obj.nodeType){
for (var i = 0; i < arguments.length; i++) { case 1: return 'element';
var value = arguments[i]; case 3: return (/\S/).test(obj.nodeValue) ? 'textnode' : 'whitespace';
switch (type(value)) { }
case 'element': } else if (typeof obj.length == 'number'){
str += value.tagName.toLowerCase(); if (obj.callee) return 'arguments';
if (value.id) str += '#' + value.id; }
if (value.className) str += value.className.split(' ').join('.'); return typeof obj;
break; };
var parse = function(){
var str = '';
for (var i = 0; i < arguments.length; i++) {
var value = arguments[i];
switch (type(value)) {
case 'element':
str += value.tagName.toLowerCase();
if (value.id) str += '#' + value.id;
if (value.className) str += value.className.split(' ').join('.');
break;


case 'array': case 'array':
str +='['; str +='[';
var results = []; var results = [];
for (var index = 0; index < value.length; index++) { for (var index = 0; index < value.length; index++) {
results.push(parse(value[index])); results.push(parse(value[index]));
} }
str += results.join(', ') + ']'; str += results.join(', ') + ']';
break; break;


case 'object': case 'object':
var objs = []; var objs = [];
for (name in value) { for (name in value) {
if (type(value[name]) != 'object') { if (type(value[name]) != 'object') {
objs.push(name + ': ' + parse(value[name])); objs.push(name + ': ' + parse(value[name]));
} else { } else {
objs.push(name + ': (object)'); objs.push(name + ': (object)');
} }
} }
str += '{' + objs.join(', ') + '}'; str += '{' + objs.join(', ') + '}';
break; break;


case 'function': case 'function':
str += '(function)'; str += '(function)';
break; break;


case 'boolean': case 'boolean':
str += String(value); str += String(value);
break; break;


default: str += value; default: str += value;
} }
if (i != (arguments.length - 1)) str += ' '; if (i != (arguments.length - 1)) str += ' ';
} }
return str; return str;
}; };
document.getElementById('mt-log').innerHTML += parse.apply(this, arguments) + '<br/>'; document.getElementById('mt-log').innerHTML += parse.apply(this, arguments) + '<br/>';
}; };
6 changes: 5 additions & 1 deletion test_runner/templates/blank.mako
@@ -1 +1,5 @@
${test} ${test}
<link rel="stylesheet" href="/static/css/minibuttons.css" type="text/css" media="screen" title="no title" charset="utf-8">
<%namespace name="components" file="test_components.mako" />
${components.nav(current=current)}

1 change: 1 addition & 0 deletions test_runner/templates/test.mako
@@ -1,4 +1,5 @@
<%namespace name="components" file="test_components.mako" /> <%namespace name="components" file="test_components.mako" />
${components.header(title=title, projects=projects, current=current, next=next, previous=previous, excluded_tests=excluded_tests)} ${components.header(title=title, projects=projects, current=current, next=next, previous=previous, excluded_tests=excluded_tests)}
${test} ${test}
${components.nav(current=current)}
${components.footer()} ${components.footer()}
15 changes: 3 additions & 12 deletions test_runner/templates/test_components.mako
Expand Up @@ -8,6 +8,7 @@
<title>${title_prefix} - ${title}</title> <title>${title_prefix} - ${title}</title>
<link rel="stylesheet" href="/static/css/reset.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="/static/css/reset.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="/static/css/tests.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="/static/css/tests.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="/static/css/minibuttons.css" type="text/css" media="screen" title="no title" charset="utf-8">
<script src="/static/js/test-helpers.js"></script> <script src="/static/js/test-helpers.js"></script>
</head> </head>
<div id="mt-content"> <div id="mt-content">
Expand All @@ -23,22 +24,12 @@
</html> </html>
</%def> </%def>


<%def name="nav(title, projects=None, current=None, previous=None, next=None, view='test', excluded_tests=None)"> <%def name="nav(current=None, view='test')">
<div id="mt-content_header"> <div id="mt-test-buttons">
<h2>${title}</h2>
<div>
% if previous:
<a class="mt-prev minibutton btn-left" href="${previous}"><span><span class="icon"></span>previous (${prev_name})</span></a>
% endif
% if next:
<a class="mt-next minibutton btn-right" href="${next}"><span><span class="icon"></span>next (${next_name})</span></a>
% endif
% if view == 'test' and test: % if view == 'test' and test:
<a class="btn-source minibutton" href="/source/${current}"><span><span class="icon"></span>view source</span></a> <a class="btn-source minibutton" href="/source/${current}"><span><span class="icon"></span>view source</span></a>
% elif view == 'source': % elif view == 'source':
<a class="btn-left minibutton" href="${current}"><span><span class="icon"></span>back to test</span></a> <a class="btn-left minibutton" href="${current}"><span><span class="icon"></span>back to test</span></a>
% endif % endif
</div>
</div> </div>
<div id="mt-log-wrapper"><div id="mt-log"></div></div>
</%def> </%def>
3 changes: 2 additions & 1 deletion test_runner/templates/view_source.mako
Expand Up @@ -6,10 +6,11 @@
<title>${title_prefix} - ${title}</title> <title>${title_prefix} - ${title}</title>
<link rel="stylesheet" href="/static/css/reset.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="/static/css/reset.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="/static/css/tests.css" type="text/css" media="screen" title="no title" charset="utf-8"> <link rel="stylesheet" href="/static/css/tests.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="/static/css/minibuttons.css" type="text/css" media="screen" title="no title" charset="utf-8">
</head> </head>
<body> <body>
<div class="view_source"> <div class="view_source">
${components.nav(title=title + " source", current=current, view="source")} ${components.nav(current=current, view="source")}
<div class="source"> <div class="source">
<h3>Relevant sources</h3> <h3>Relevant sources</h3>
<a name="top"></a> <a name="top"></a>
Expand Down

0 comments on commit 1e37d12

Please sign in to comment.