diff --git a/pndopt.html b/pndopt.html index ce6ec99..6efd644 100644 --- a/pndopt.html +++ b/pndopt.html @@ -86,6 +86,7 @@ position: absolute; left: 40px; top: 480px; + z-index: 10000; } #solve { width: 180px; @@ -106,13 +107,8 @@ bottom: 20px; overflow: scroll; } -#solutions li { - padding: 4px; - cursor: pointer; -} -#solutions li:hover { - background: lightyellow; -} +#solutions li { padding: 4px; cursor: pointer; } +#solutions li:hover { background: #cfc; } #hand { position: absolute; background: yellow; @@ -120,19 +116,27 @@ width: 10px; height: 10px; } -#import-popup { +#import-popup, #change-popup { position: absolute; border: 3px solid black; background: #eee; padding: 20px; +} +#import-popup { width: 400px; height: 220px; left: 440px; top: 190px; } -#import-legend { - line-height: 1.6em; +#change-popup { + width: 150px; + height: 430px; + top: 65px; + left: 450px; + font-size: 30px; + z-index: 10001; } +#import-legend, #change-popup { line-height: 1.6em; } #import-textarea { position: absolute; left: 125px; @@ -141,14 +145,14 @@ font-family: Consolas, monospace; letter-spacing: 28px; } -#import-control { +#import-control, #change-control { position: absolute; right: 20px; bottom: 20px; } -#import-import { - font-weight: bold; -} +#import-import, #change-change { font-weight: bold; } +.change-target { cursor: pointer; } +.prev-selection { background: #ffc; } @@ -240,6 +244,10 @@

Profile:

@@ -265,8 +270,8 @@
- - • + • + - - • - - • - + • + • + • +
@@ -299,13 +303,30 @@ = 6 / j
= . / x
- +
+
+
+
+
+
+
+
+
+
+ +
+
+ + +
+
+
Fork me on GitHub @@ -712,7 +733,19 @@ html_array.push(solution.weight.toFixed(2)); html_array.push(', L='); html_array.push(solution.path.length); - solution.matches.forEach(function(match, i) { + var sorted_matches = solution.matches.slice(); + sorted_matches.sort(function(a, b) { + if (a.count != b.count) { + return b.count - a.count; + } else if (a.type > b.type) { + return 1; + } else if (a.type < b.type) { + return -1; + } else { + return 0; + } + }); + sorted_matches.forEach(function(match, i) { html_array.push(', × '); @@ -760,6 +793,21 @@ return simplified_solutions; } +function draw_line_to(canvas, px, py, x, y) { + var mx = (px*2 + x) / 3; + var my = (py*2 + y) / 3; + canvas.lineTo(mx, my); + var dx = x - px; + var dy = y - py; + var dr = Math.sqrt(dx*dx + dy*dy) / 3; + dx /= dr; + dy /= dr; + canvas.lineTo(mx - (dx+dy), my + (dx-dy)); + canvas.lineTo(mx - (dx-dy), my - (dx+dy)); + canvas.lineTo(mx, my); + canvas.lineTo(x, y); +} + function draw_path(init_rc, path) { var canvas = clear_canvas(); @@ -775,9 +823,15 @@ canvas.lineWidth = 4; canvas.strokeStyle = 'rgba(0, 0, 0, 0.75)'; canvas.beginPath(); - xys.forEach(function(xy, i) { - canvas[i == 0 ? 'moveTo' : 'lineTo'](xy.x, xy.y); - }); + for (var i = 0; i < xys.length; ++ i) { + var xy = xys[i]; + if (i == 0) { + canvas.moveTo(xy.x, xy.y); + } else { + var prev_xy = xys[i-1]; + draw_line_to(canvas, prev_xy.x, prev_xy.y, xy.x, xy.y); + } + } canvas.stroke(); var init_xy = xys[0]; @@ -815,14 +869,22 @@ $(document).ready(function() { $('#grid > div').each(function() { $(this).addClass('eX'); - }).mousedown(function(e) { + }) + + $('#grid > div, .change-target').mousedown(function(e) { var type = get_type(this); - show_element_type($(this), advance_type(type, e.which == 1 ? 1 : -1)); + var target_type; + switch (e.which) { + case 1: target_type = advance_type(type, 1); break; // left + case 3: target_type = advance_type(type, -1); break; // right + case 2: target_type = 'X'; break; // middle + default: break; + } + show_element_type($(this), target_type); clear_canvas(); }); - $('#hand').hide(); - $('#import-popup').hide(); + $('#hand, #import-popup, #change-popup').hide(); $('#profile-selector').change(function() { var values = this.value.split(/,/); @@ -857,12 +919,14 @@ var solution = global_solutions[global_index]; var path = draw_path(solution.init_cursor, solution.path); var hand_elem = $('#hand'); - hand_elem.stop().show(); + hand_elem.stop(/*clearQueue*/true).show(); path.forEach(function(xy, i) { var left = xy.x + 13; var top = xy.y + 13; hand_elem[i == 0 ? 'offset' : 'animate']({left: left, top: top}); }); + $('#solutions li.prev-selection').removeClass('prev-selection'); + $(this).addClass('prev-selection'); }); $('#randomize').click(function() { @@ -875,9 +939,7 @@ }); $('#clear').click(function() { - $('#grid > div').each(function() { - show_element_type($(this), 'X'); - }); + $('#grid > div').each(function() { show_element_type($(this), 'X'); }); clear_canvas(); }); @@ -891,16 +953,26 @@ clear_canvas(); }); + $('#final').click(function() { + var solution = global_solutions[global_index]; + if (solution) { + show_board(solution.board); + } + }); + $('#import').click(function() { var board = get_board(); - var content = board.map(function(row) { return row.join(''); }).join('\n').replace(/X/g, '.'); + var type_chars = 'rbgyphj'; + var content = board.map(function(row) { return row.join(''); }).join('\n') + .replace(/X/g, '.') + .replace(/(\d)/g, function(s) { return type_chars.charAt(s); }); $('#import-textarea').val(content); $('#import-popup').show(); }); - $('#import-cancel').click(function() { - $('#import-popup').hide(); - }); + $('#change').click(function() { $('#change-popup').show(); }); + $('#import-cancel').click(function() { $('#import-popup').hide(); }); + $('#change-cancel').click(function() { $('#change-popup').hide(); }); $('#import-import').click(function() { var board_raw = $('#import-textarea').val(); @@ -923,6 +995,27 @@ clear_canvas(); $('#import-popup').hide(); }); + + $('#change-change').click(function() { + var change_targets = $('.change-target').map(function() { + return get_type(this); + }); + var board = get_board(); + for (var i = 0; i < ROWS; ++ i) { + for (var j = 0; j < COLS; ++ j) { + var type = board[i][j]; + if (type == 'X') { + type = change_targets[change_targets.length-1]; + } else { + type = change_targets[type]; + } + board[i][j] = type; + } + } + show_board(board); + clear_canvas(); + $('#change-popup').hide(); + }); });