Mercurial > agora-palash
annotate templates/snippet/snippet_details.js @ 104:7d753658dc0e
Add line-number alignment for snippet display
Now, the line number lines up with the line itself, even if the line is
longer than the width of the box and even if you zoom in. Since this
change removes the need for the toggle-wordwrap feature, that has been
removed. Also, the line numbers are now right-aligned, and the pre tags
have been removed, allowing for neater indentation in the template file.
(The useful attributes of <pre> are now being applied via CSS.)
There is one minor cosmetic issue: the corners of the snippet display
box look a bit fuzzy when the background of the box is dark. Not quite
sure how to fix it at the moment.
author | dellsystem <ilostwaldo@gmail.com> |
---|---|
date | Tue, 11 Sep 2012 17:42:32 -0400 |
parents | f872c643b056 |
children | 3cd28df6f85b |
rev | line source |
---|---|
102
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
1 jQuery(document).ready(function () { |
46
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
2 |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
3 curLine = document.location.hash; |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
4 if(curLine.substring(0,2) == '#l'){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
5 $('div.snippet div.line'+curLine).addClass('marked'); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
6 } |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
7 |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
8 /** |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
9 * Diff Ajax Call |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
10 */ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
11 $("form#diffform").submit(function() { |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
12 $.get("{% url snippet_diff %}", { |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
13 a: $("input[name=a]:checked").val(), |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
14 b: $("input[name=b]:checked").val() |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
15 }, function(data){ |
48
329a9d17be88
Implement/fix js for snippets and make whiteboxes all same width
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
47
diff
changeset
|
16 $('#diff').html(data).slideDown('fast'); |
46
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
17 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
18 return false; |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
19 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
20 |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
21 /** |
102
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
22 * Changing syntax highlighting colours |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
23 */ |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
24 var currentStyle = $('#change-highlighting').attr('data-default'); |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
25 $('#change-highlighting').change(function () { |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
26 var newStyle = $(this).find(':selected').attr('name'); |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
27 |
104
7d753658dc0e
Add line-number alignment for snippet display
dellsystem <ilostwaldo@gmail.com>
parents:
102
diff
changeset
|
28 $('.snippet').removeClass(currentStyle).addClass(newStyle); |
102
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
29 currentStyle = newStyle; |
f872c643b056
Updates to snippet functionality (see details)
dellsystem <ilostwaldo@gmail.com>
parents:
48
diff
changeset
|
30 }); |
46
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
31 |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
32 /** |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
33 * Line Highlighting |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
34 */ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
35 $('div.snippet th a').each(function(i){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
36 $(this).click(function(){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
37 var j = $(this).text(); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
38 $('div.snippet div.line.marked').removeClass('marked'); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
39 $('div.snippet div.line#l'+j).toggleClass('marked'); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
40 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
41 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
42 |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
43 //{% if request.session.userprefs.display_all_lexer %} |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
44 /** |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
45 * Lexer Guessing |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
46 */ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
47 $('#guess_lexer_btn').click(function(){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
48 $.getJSON('{% url snippet_guess_lexer %}', |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
49 {'codestring': $('#id_content').val()}, |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
50 function(data){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
51 if(data.lexer == "unknown"){ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
52 $('#guess_lexer_btn').css('color', 'red'); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
53 }else{ |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
54 $('#id_lexer').val(data.lexer); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
55 $('#guess_lexer_btn').css('color', 'inherit'); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
56 } |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
57 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
58 }); |
b7c1c22fdfe8
Format code for 80 columns, add some js to static/ dir
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
diff
changeset
|
59 //{% endif %} |
47
139e4b8ffb17
Fix display of js code and copy-pastability of displayed code
Jordi Gutiérrez Hermoso <jordigh@gmail.com>
parents:
46
diff
changeset
|
60 }); |