Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Display compile errors in Try CoffeeScript more clearly #1728

Closed
wants to merge 4 commits into from

5 participants

@jeremybanks

The error message the display for a compile error in Try CoffeeScript isn't very noticeable, and is often cut off because of the lack of room.

This change displays the compile error in red where the compiled source code would be, and dims the "Run" button to indicate that it's disabled.

You can see this running on my gh-pages branch.

@michaelficarra
Collaborator

Very nice, big +1 from me. Code LGTM as well. One nitpick: why name the variable $results?

@jeremybanks

In stuff I've been working on recently, the $- prefix is used to indicate variables containing jQuery objects. Should I change it to results?

@michaelficarra
Collaborator

I don't really care, but it would be more consistent, so probably, yeah.

@vendethiel
Collaborator

@michaelficarra / @jashkenas That'd be cool to have.

@michaelficarra
Collaborator

Agreed. If someone wants to rebase this, I'd gladly merge it.

@jashkenas
Owner

Yeah, this looks great. I never liked shoving them up there in the corner in the first place.

@xixixao

+1 to get rid of the capitalization, try

"wrong" "code"

to see how it messes up the tokens in the error message.

@jashkenas jashkenas closed this
@jashkenas jashkenas added bug fixed change and removed bug labels
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
View
24 documentation/css/docs.css
@@ -152,22 +152,6 @@ div.code {
position: absolute;
top: 0px; left: 10px;
}
- #error {
- position: absolute;
- -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
- -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-top-left-radius: 0;
- -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0;
- right: 0px; top: 0px; left: 726px; bottom: 0;
- padding: 0 0 0 15px;
- background: #fdcdcc;
- background: -webkit-gradient(linear, left top, left bottom, from(#ffedec), to(#ff9a95));
- background: -moz-linear-gradient(top, #f8f8f8, #dadada);
- color: #862322;
- font-size: 10px;
- line-height: 50px;
- overflow: hidden;
- text-transform: uppercase;
- }
.navigation {
height: 50px;
font-size: 11px;
@@ -319,6 +303,9 @@ div.code {
margin-bottom: 0;
top: 10px; left: 10px; right: 10px; bottom: 15px;
}
+ #repl_results.error {
+ color: red;
+ }
#repl_source_wrap {
margin-left: 5px;
width: 47%; right: 50%;
@@ -380,4 +367,9 @@ div.code {
box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none;
background-image: url(../images/button_bg_dark.gif);
text-shadow: none;
+ }
+ .minibutton.error {
+ opacity: 0.5;
+ color: #600;
+ cursor: not-allowed;
}
View
12 documentation/index.html.erb
@@ -108,7 +108,6 @@
<a href="documentation/docs/repl.html">Interactive REPL &mdash; src/repl</a>
</div>
</div>
- <div id="error" style="display:none;"></div>
</div>
<div class="container">
@@ -1687,17 +1686,20 @@ Expressions
# Set up the compilation function, to run when you stop typing.
compileSource = ->
source = $('#repl_source').val()
+ results = $('#repl_results')
window.compiledJS = ''
try
window.compiledJS = CoffeeScript.compile source, bare: on
- el = $('#repl_results')[0]
+ el = results[0]
if el.innerText
el.innerText = window.compiledJS
else
- $(el).text window.compiledJS
- $('#error').hide()
+ results.text(window.compiledJS)
+ results.removeClass 'error'
+ $('.minibutton.run').removeClass 'error'
catch error
- $('#error').text(error.message).show()
+ results.text(error.message).addClass 'error'
+ $('.minibutton.run').addClass 'error'
# Update permalink
$('#repl_permalink').attr 'href', "##{sourceFragment}#{encodeURIComponent source}"
View
12 index.html
@@ -86,7 +86,6 @@
<a href="documentation/docs/repl.html">Interactive REPL &mdash; src/repl</a>
</div>
</div>
- <div id="error" style="display:none;"></div>
</div>
<div class="container">
@@ -2814,17 +2813,20 @@
# Set up the compilation function, to run when you stop typing.
compileSource = ->
source = $('#repl_source').val()
+ results = $('#repl_results')
window.compiledJS = ''
try
window.compiledJS = CoffeeScript.compile source, bare: on
- el = $('#repl_results')[0]
+ el = results[0]
if el.innerText
el.innerText = window.compiledJS
else
- $(el).text window.compiledJS
- $('#error').hide()
+ results.text(window.compiledJS)
+ results.removeClass 'error'
+ $('.minibutton.run').removeClass 'error'
catch error
- $('#error').text(error.message).show()
+ results.text(error.message).addClass 'error'
+ $('.minibutton.run').addClass 'error'
# Update permalink
$('#repl_permalink').attr 'href', "##{sourceFragment}#{encodeURIComponent source}"
Something went wrong with that request. Please try again.