Exolve option for multiple letters per square

[DKMiller71]

I've seen this as a variety puzzle format where you have to put multiple letters into certain squares. Is there a way to represent that in Exolve?

[viresh-ratnakar]

Sorry, I had missed this (I should check if there is a way to trigger emailed notifications after new activity on the Discussions tab) until you emailed me,

There isn't currently, but I do want to add support for such "rebus" cells, and I will.

In the interim, a hacky work-around could be to use:

exolve-language: en Latin 2

The "2" value of the <max-char-codes-per-letter> parameter would allow 2 letters to be entered in any cell. You can make that higher too. However, the experience would be less than ideal, as this would apply to all cells, and the cursor will not auto-advance after entering a letter in any cell. You could add custom code to mitigate some of this.

When I do add the feature, I think I would add an option that allows extra letters to be added with a ctrl-/cmd-/shift- key-press , I would keep the <max-char-codes-per-letter> parameter at 1, and would just sweep through the code to find and fix any place that assumes that the length of a cell entry is 1.

[DKMiller71]

So I found that if I set puz.currCell().textNode.nodeValue to the override value, it works for display (assuming the text fits into the cell), however the override text is not saved to the puzzle state. On reload, the cell will be blank or have whatever was previously in the cell.

If I set puz.currCell().currLetter to the override value and do updateAndSaveState() (or after the user enters a normal cell's entry), it does get written to the puzzle state, but then reload gets confused and the multiple characters are split over adjacent cells. Obviously, on the restore side, it doesn't know about the multiple-letters-per-cell and so tries splitting it normally. I was pondering if there was a way that the state string could represent a cell override (like parenthesis or something in a URL-safe way, but didn't want to try to get into that level of surgery.

Besides, of course, there's probably plenty of other places in the code that need to be thought about too.

[viresh-ratnakar]

I use the dollar sign to separate cell entries with langMaxCharCodes is greater than 1, in the saved state. The state-parsing code is also aware of that, but only when langMaxCharCodes is greater than 1. I guess when I make the changes I would factor out the condition this.langMaxCharCodes > 1 || this.hasRebusCells into a boolean function that determines whether the dollar separator is to be used.

The parseGrid() function would also need some tweaking (for crosswords containing solutions). As would handleGridInput().

But hopefully, not much more than these places :-).

[viresh-ratnakar]

I have a draft implementation. Much testing/cleanup needs to happen before I release this, but perhaps you can try it out and also give your inputs?

Draft documentation

URL for the proposed update for exolve-m.js : https://viresh-ratnakar.github.io/dev/exolve-m.js

[DKMiller71]

Awesome, I will check it out tonight.

(I had almost gotten a workaround working, including auto-advance, but I'd rather something that's in line with your direction!).

[viresh-ratnakar]

OK, great. I just tweaked the code a bit more and updated the documentation too. I had set it up earlier to look for Shift as well as Control/Command key modifiers to enable multi-letter entry, but have now pared it down to just the Shift key, as "Ctrl/Cmd + letter" is already likely to have special meanings. You can also double-click to enter multi-letter mode, which should help on phones (but I haven't yet tested on a phone).

[DKMiller71]

Limited testing, but it looks like it works so far. Holding shift while typing in the cell allows multiple letters. Saving/recovering state looks good. Backspacing is a little weird, but that's ok. The font sizing bothers me for doubled-up cells. I wish it could be more dynamically sized. Two letters in a cell work reasonably well anyway at 100% the size of the other text, but this has them much smaller. Don't know if a screen shot will take... (top row your code, bottom row: me overriding cell values):

[viresh-ratnakar]

OK, I've added your idea and code now (with some minor tweaks, PTAL).

I've tested a bit now on Linux+Chrome as well as Linux+Firefox, and Android+Chrome, and it looks OK.

BTW, Android+Firefox (and probably iPhone+Firefox) has had issues forever (and the same issues also surface if you try to solve a non-Exolve-based Guardian crossword on Android+Firefox) — basically, after entering any letter in a cell, there is some spurious event and that makes the cursor skip the next cell.

[DKMiller71]

Looking good! I did think it maybe crowded the cell a bit too much, so I changed the following:

const AVAILABLE_WIDTH = this.cellW - (3*this.BAR_WIDTH);

4* looked even better to me, but 3 was sufficient.

Alternately:

const AVAILABLE_WIDTH = this.cellW - 4 - (2*this.BAR_WIDTH);

[viresh-ratnakar]

Note that if hasRebusCells, I now move the directional right-arrow in the current cell to go below the text, to leave more room for the text.

Also, FYI, I'm not likely to push this release out till after the coming Monday. On Sunday, there is the last online round of Indian Crossword League, and they use Exolve, loading the script files from my site. This change is big enough that I don't want to risk breaking their puzzles and would just wait a bit :-). In any case, I believe you use your own served copies of the files.

[DKMiller71]

Also, FYI, I'm not likely to push this release out till after the coming Monday.

That's fine, thanks!

[viresh-ratnakar]

I was looking at something like "WW" in one cell and "GH" in the next cell, and the "WW" gets shrunk much more (as it takes more width) compared to the "GH" as we make AVAILABLE_WIDTH smaller, and that bothers me a bit :-). How about:

const AVAILABLE_WIDTH = this.cellW - (2.5 * this.BAR_WIDTH);

as a compromise? I've pushed this "2.5" version to the dev dir for now.

[viresh-ratnakar]

I've merged your Delete-key change into my dev served version.

[DKMiller71]

Minor thing: I've noticed: the completed clue numbers don't change color.

[viresh-ratnakar]

Can you point me to an example please? On my test puzzle, the clues numbers are changing color:

Eg: https://viresh-ratnakar.github.io/dev/test-rebus.html#xxllvvxlv-#x2iodxRAN$G$E$DO$.0$M$0$0$

[viresh-ratnakar]

Ah, I think I see the issue: we also need to call

  this.updateActiveCluesState();

in the delete-key handling. I'll add it.

[DKMiller71]

I don't think it's just that. I send you a sample.

[viresh-ratnakar]

OK, the way a clue is judged to be filled is if its number of cells (taken from the enum if there is an enum) == the number of filled cells. For 1A, for example, your "hidden" enum should just say "(8)*" instead of "(9)*" and that will fix the situation.

[DKMiller71]

Hmm I’ll check that (I thought I had), but… wouldn’t that mess up the placeholder?

[viresh-ratnakar]

Yeah, but you can control the placeholder too. From the README:

If you place just one underscore, then the actual displayed size of the blank will be determined using the enum. If you place more than one underscore, then the displayed size of the blank will equal the number of underscores that you have provided.

[DKMiller71]

Hm for some reason the number of dots in the cell match the hidden enum, not the number of blanks.

[viresh-ratnakar]

I should be able to find the bug and fix. Will do, later today, hopefully. For now, off to bed after having stayed up all night watching the World Cup Cricket semifinal :-)

[viresh-ratnakar]

OK, I made some changes to address your case. I've included these changes in my current work-in-progress update and have also pushed them out to my dev site.

Here's the updated README section

Noteworthy changes:

• You can now follow the underscore(s) that create a placeholder blank with the placeholder text that you want to show in gray in the blank when it is empty, like this:

    5 A clue with overridden placeholder text in the placeholder blank (5) _ [···· ······]
    7 Another clue with an even more arbitrary placeholder text override and placeholder blank length = 9 not 6 (6) _ _ _ _ _ _ _ _ _ [42]
  

• The length of the blank space now exactly equals its capacity (there's no trailing padding as was the case earlier)
• The length is the max of the length needed for the placeholder text (coming from the enum or the override), and the number of underscore characters

[viresh-ratnakar]

Hi Darren, hope this worked out. Not sure if you got my response to your follow-up as it does not show up here.

[DKMiller71]

Yep, it's looking good. I've gone through and overhauled the clues and it's look right.

Basically:
Clue goes here (A) (B)* [......]

Such that:
A is the enumeration shown to the user (which matches the real length of the answer).
B is the hidden enumeration that matches the number of cells that need to be filled in (not needed if A == B).
[.....] is the size of the blanks to present with the dots - not need if A == B.

And it seems to be working

[DKMiller71]

One feedback item from a tester (I'm not asking for this, just passing it along as feedback):

I like the hold-Shift method for typing in rebuses (rebii??), very convenient. I believe using ESC for rebuses is used across multiple apps, so you may want to consider supporting it?

[viresh-ratnakar]

Interesting, I wasn't even aware of this norm. My first inclination is to not implement this as it doesn't seem very intuitive to me. However, if I get this request more often over time then I'll reconsider.

[DKMiller71]

Not everyone might want this, but I wanted to highlight the cells that were filled as rebus cells, so I added the following:

var specialCells = {}   // cells to be highlighted dynamically

function customizeExolve(puz) {

  highlightSpecialCells(puz, 'palegreen')
  
  // override so highlightSpecialCells gets invoked on display updates    
  puz.updateDisplayAndGetState = function(notifyIfComplete=true) {
    highlightSpecialCells(puz, 'palegreen')
    return Exolve.prototype.updateDisplayAndGetState.call(puz, notifyIfComplete)
  }
}

function highlightSpecialCells(puz, color) {
  for (let i = 0; i < puz.gridHeight; i++) {
  for (let j = 0; j < puz.gridWidth; j++) {
    let gridCell = puz.grid[i][j]
    if (!gridCell.isLight) continue
    
    if (gridCell.currLetter.length <= 1) {
      if (specialCells[[i, j]]) {
        puz.colourGroup.removeChild(specialCells[[i, j]])
        delete specialCells[[i, j]]
      }
      continue;
    }
    
    if([i, j] in specialCells) continue
    
    specialCells[[i, j]] = puz.makeCellDiv(i, j, color, 1)
    puz.colourGroup.appendChild(specialCells[[i, j]] )

  }}
  
  puz.colourGroup.style.display = (Object.keys(specialCells).length > 0) ||
      (this.colourfuls.length > 0)? '' : 'none';

}