Check out Symmetric Chess, our featured variant for March, 2024.

Enter Your Reply

The Comment You're Replying To
H. G. Muller wrote on Fri, Mar 31, 2023 02:46 PM UTC in reply to Fergus Duniho from 01:04 PM:

Currently the board squares are defined by the statement

     row = row + '<td id="' + bnr + 'y' + h + 'y' + j + '" style="width:' + sqrSize + 'px;height:' + sqrSize + 'px' +
            ';border:' + bb + ';font-size:xx-large;background-repeat:no-repeat;background-position: center center;background-size:contain"' +
            ' onmousedown="Down(' + bnr + ',' + j + ',' + h + ',event)" onmouseup="Up(' + bnr + ',' + j + ',' + h +
            ',event)" ontouch="Touch(' + bnr + ',' + j + ',' + h +
            ')" onmouseover="Hover(event' +
            ')" ondragover="PreDrop(event)" ondrop="Drop(event)" ondragend="Relay(event)" valign="center" align="center"></td>';

 

and it should not be difficult to replace all the style stuff in the first two lines there by a class="boardsquare". But it seems a problem that sqrSize is not fixed here, but a JavaScript variable that only becomes known after the JavaScript has parsed the Diagram's definition squareSize=N.

Apart from that, we should also handle the situation where there are multiple Diagrams on the same page, which each use different squareSize. I suppose this could be fixed by defining a separate class for the squares of each Diagram, with name 'boardsquare'+bnr.

But I guess it would be simpler if the JavaScript could somehow query the screen width in pixels as well as in inches. Then it could set a variable bigScreen to 1 or 2 based on some logical combination of that, and it could multiply the parameter value of sqrSize by that at the point at the point where it gets read from the Diargarm definitions.

But it would still be a problem if the Diagram was contained in a surrounding HTML element with a fixed width specified in pixels. (Like almost all Diagrams I made so far are.) Then the Diagram would have understood it would have to present itself with twice the size, but the browser would then think "hey, this is too large to fit", and reduce it back. (And perhaps not at exactly 50%.)

So I guess it would only work if the Diagram script would somehow double the size of all surrounding HTML elements that did have a specified size in pixels as well. I suppose this would be possible, even though such elements would in general not have an id (and even when they have, it would be unknown): I think it is possible to ask a HTML element what its parent is, and work your way outwards from the Diagram that way. It sounds a bit tricky, though.


Edit Form

Comment on the page Ultima

Quick Markdown Guide

By default, new comments may be entered as Markdown, simple markup syntax designed to be readable and not look like markup. Comments stored as Markdown will be converted to HTML by Parsedown before displaying them. This follows the Github Flavored Markdown Spec with support for Markdown Extra. For a good overview of Markdown in general, check out the Markdown Guide. Here is a quick comparison of some commonly used Markdown with the rendered result:

Top level header: <H1>

Block quote

Second paragraph in block quote

First Paragraph of response. Italics, bold, and bold italics.

Second Paragraph after blank line. Here is some HTML code mixed in with the Markdown, and here is the same <U>HTML code</U> enclosed by backticks.

Secondary Header: <H2>

  • Unordered list item
  • Second unordered list item
  • New unordered list
    • Nested list item

Third Level header <H3>

  1. An ordered list item.
  2. A second ordered list item with the same number.
  3. A third ordered list item.
Here is some preformatted text.
  This line begins with some indentation.
    This begins with even more indentation.
And this line has no indentation.

Alt text for a graphic image

A definition list
A list of terms, each with one or more definitions following it.
An HTML construct using the tags <DL>, <DT> and <DD>.
A term
Its definition after a colon.
A second definition.
A third definition.
Another term following a blank line
The definition of that term.