display: block;
float: left;
width: 400px;
- height: 400px;
margin-right: 1em;
margin-bottom: 1em;
+ padding: 0;
}
#analysis {
display: block;
min-width: 400px;
overflow: hidden;
}
+
+/* If the board is too wide for the screen, shrink it to fit,
+ * and then put the analysis below. */
+@media all and (max-width: 400px) {
+ #board {
+ width: 100%;
+ float: none;
+ }
+ #analysis {
+ min-width: 0;
+ }
+}
+
+/* If there is almost space for the analysis, shrink the board a bit, too. */
+@media all and (min-width: 500px) and (max-width: 810px) {
+ #board {
+ float: left;
+ width: 50%;
+ }
+ #analysis {
+ min-width: 0;
+ }
+}
<link rel="stylesheet" href="css/chessboard-0.3.0.min.css" />
<link rel="stylesheet" href="css/remoteglot.css" />
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
-<body>
+<body onresize="board.resize()">
<h1 id="headline">Analysis</h1>
<div id="board"></div>
<div id="analysis">
+var board = [];
var arrows = [];
var arrow_targets = [];
var occupied_by_arrows = [];
var to_col = to_square.charCodeAt(0) - "a1".charCodeAt(0);
var to_row = to_square.charCodeAt(1) - "a1".charCodeAt(1);
- var from_y = (7 - from_row)*49 + 25;
- var to_y = (7 - to_row)*49 + 25;
- var from_x = from_col*49 + 25;
- var to_x = to_col*49 + 25;
+ var zoom_factor = $("#board").width() / 400.0;
+ line_width *= zoom_factor;
+ arrow_size *= zoom_factor;
+
+ var square_width = Math.floor(($("#board").width() - 1) / 8);
+ var from_y = (7 - from_row + 0.5)*square_width + 1;
+ var to_y = (7 - to_row + 0.5)*square_width + 1;
+ var from_x = (from_col + 0.5)*square_width + 1;
+ var to_x = (to_col + 0.5)*square_width + 1;
var dx = to_x - from_x;
var dy = to_y - from_y;
["Arrow", {
cssClass:"l1arrow",
location:1.0,
- width: arrow_size, length: arrow_size,
+ width: arrow_size,
+ length: arrow_size,
paintStyle:{
lineWidth:line_width,
strokeStyle:"#000",
var init = function() {
// Create board.
- var board = new ChessBoard('board', 'start');
+ board = new ChessBoard('board', 'start');
request_update(board, 1);
projects / remoteglot / commitdiff