Skip to content

Commit ae2ef24

Browse files
rjkatrjkat
committed
get scrolling working again
1 parent 550d094 commit ae2ef24

File tree

6 files changed

+61
-43
lines changed

6 files changed

+61
-43
lines changed

‎@confuzzle/confuz-parser/builder.js

Lines changed: 31 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,9 @@ function parseAndBuild(input, compiling) {
99
} else if (cw.meta.copyright) {
1010
cw.meta.copyrightText = '© ' + cw.meta.copyright;
1111
}
12-
cw.acrossClues = [];
13-
cw.downClues = [];
12+
cw.acrossClueIds = [];
13+
cw.downClueIds = [];
14+
let i = 0;
1415
for (let [clueid, clue] of Object.entries(cw.clues)) {
1516

1617
// populate cell across and down clues for convenience
@@ -26,7 +27,6 @@ function parseAndBuild(input, compiling) {
2627
if (clue.primaryId && clue.primaryId != clueid) {
2728
clue.primary = cw.clues[clue.primaryId];
2829
}
29-
3030
clue.idText = clue.numbering.clueText;
3131
clue.numberText = clue.numbering.clueText;
3232
clue.refText = '';
@@ -47,35 +47,45 @@ function parseAndBuild(input, compiling) {
4747

4848
// populate crossword across and down clues for convenience
4949
if (clue.isAcross) {
50-
cw.acrossClues.push(clue);
50+
cw.acrossClueIds.push(clueid);
5151
} else {
52-
cw.downClues.push(clue);
52+
cw.downClueIds.push(clueid);
5353
}
5454
clue.selected = false;
5555
clue.forcedSelection = false;
5656
clue.highlightMask = 0;
5757
clue.showCorrect = false;
5858
clue.showIncorrect = false;
59+
clue.index = i;
60+
i += 1
5961
}
62+
const numClues = i;
6063

61-
cw.acrossClues.sort((a, b) => {
62-
return a.row != b.row ? a.row - b.row : a.col - b.col;
63-
});
64-
cw.downClues.sort((a, b) => {
65-
return a.row != b.row ? a.row - b.row : a.col - b.col;
64+
cw.acrossClueIds.sort((aid, bid) => {
65+
const a = cw.clues[aid] ;
66+
const b = cw.clues[bid] ;
67+
return a.row != b.row ? a.row - b.row : a.col - b.col;
6668
});
67-
68-
[cw.acrossClues, cw.downClues].forEach(clues => {
69-
clues.forEach((clue, i) => {
70-
const nextIndex = (i + 1) % clues.length;
71-
const otherClues = (clue.isAcross ? cw.downClues : cw.acrossClues);
72-
const nextClues = nextIndex == 0 ? otherClues : clues;
73-
const prevClues = i == 0 ? otherClues : clues;
74-
const prevIndex = i > 0 ? i - 1 : otherClues.length - 1;
75-
clue.nextNumericalClue = nextClues[nextIndex];
76-
clue.prevNumericalClue = prevClues[prevIndex];
77-
})
69+
cw.downClueIds.sort((aid, bid) => {
70+
const a = cw.clues[aid] ;
71+
const b = cw.clues[bid] ;
72+
return a.row != b.row ? a.row - b.row : a.col - b.col;
7873
});
74+
75+
let clueIds = [];
76+
for (const clueid of Object.keys(cw.clues)) {
77+
clueIds.push(clueid)
78+
}
79+
for (let [clueid, clue] of Object.entries(cw.clues)) {
80+
let i = clue.index;
81+
const nextIndex = (i + 1) % numClues;
82+
const otherClueIds = (clue.isAcross ? cw.downClueIds : cw.acrossClueIds);
83+
const nextClueId = nextIndex == 0 ? otherClueIds : clueIds;
84+
const prevClues = clue.index == 0 ? otherClueIds : clueIds;
85+
const prevIndex = i > 0 ? i - 1 : otherClueIds.length - 1;
86+
clue.nextNumericalClue = nextClueId[nextIndex];
87+
clue.prevNumericalClue = prevClues[prevIndex];
88+
}
7989
return cw;
8090
}
8191

‎client/App.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2137,6 +2137,7 @@ export default Vue.extend({
21372137
this.crossword.clues[clueid].selected = true;
21382138
this.selectedClue = this.crossword.clues[clueid];
21392139
this.highlightClue(clueid, solverid);
2140+
this.$refs.clues.scrollToClue(this.crossword.clues[clueid]);
21402141
},
21412142
highlightClue(clueid, solverid, recursive) {
21422143
solverid %= this.maxSolvers;

‎client/components/CfzCell.vue

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -441,14 +441,16 @@ export default Vue.extend({
441441
this.popper.update();
442442
},
443443
select() {
444-
if (!this.editable)
445-
return;
446-
447-
if (this.cell.contents) {
448-
this.$refs.input.placeholder = this.cell.contents;
449-
this.$refs.input.value = '';
450-
}
451-
this.$refs.input.focus();
444+
Vue.nextTick(() => {
445+
if (!this.editable)
446+
return;
447+
448+
if (this.cell.contents) {
449+
this.$refs.input.placeholder = this.cell.contents;
450+
this.$refs.input.value = '';
451+
}
452+
this.$refs.input.focus();
453+
});
452454
},
453455
},
454456
mounted() {

‎client/components/CfzClue.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<div class=clue-item
3-
:class="{highlighted: selected || highlighted}"
3+
:data-highlighted="clue.selected || ((clue.highlightMask & solverMask) > 0)"
44
:data-solver-mask="solverMask"
55
ref="item">
66
<div class="clue-directions" @click="directionsClicked()">
@@ -32,7 +32,7 @@
3232
:value="gridCells[cellId].contents"
3333
:data-solver-mask="solverMask"
3434
:data-is-pencil="gridCells[cellId].special == '?'"
35-
:data-highlighted="selected || highlighted"
35+
:data-highlighted="clue.selected || ((clue.highlightMask & solverMask) > 0)"
3636
>
3737
</input>
3838
<span v-if="separator(gridCells[cellId])" class="crossword-separator" v-html="separator(gridCells[cellId])"></span>
@@ -242,7 +242,7 @@ export default Vue.extend({
242242
return contents;
243243
},
244244
highlighted() {
245-
return !!(this.clue.highlightMask & this.solverMask);
245+
return (this.clue.highlightMask & this.solverMask) > 0;
246246
},
247247
selected() {
248248
return this.clue.selected;

‎client/components/CfzClueList.vue

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,10 @@
55
<div class="crossword-clues-li"
66
is="cfz-clue"
77
ref="items"
8-
v-for="(clue, i) in filteredClues"
8+
v-for="(clue, i) in clues"
9+
v-if="clue.isAcross == isAcross"
910
v-on="$listeners"
10-
v-model="filteredClues[i]"
11+
v-model="clues[i]"
1112
:gridCells="gridCells"
1213
:usingPencil="usingPencil"
1314
:solverid="solverid"
@@ -27,16 +28,16 @@
2728
@media screen {
2829
@include each-solver using ($color, $lightColor, $sel) {
2930
.theme-light, * {
30-
.crossword-clues-li.highlighted#{$sel} {
31+
.crossword-clues-li[data-highlighted]#{$sel} {
3132
color: $lightColor;
3233
}
3334
}
3435
@media (prefers-color-scheme: dark) {
35-
.crossword-clues-li.highlighted#{$sel} {
36+
.crossword-clues-li[data-highlighted]#{$sel} {
3637
color: $color;
3738
}
3839
}
39-
.theme-dark .crossword-clues-li.highlighted#{$sel} {
40+
.theme-dark .crossword-clues-li[data-highlighted]#{$sel} {
4041
color: $color;
4142
}
4243
}
@@ -96,7 +97,7 @@ export default Vue.extend({
9697
solvers: Array,
9798
gridCells: Object,
9899
clues: {
99-
type: Array,
100+
type: Object,
100101
required: true
101102
},
102103
solverid: {
@@ -118,10 +119,10 @@ export default Vue.extend({
118119
},
119120
methods: {
120121
scrollToClue(clue) {
121-
for (var i = 0; i < this.clues.length; i++) {
122-
if (this.clues[i].id == clue.id) {
122+
123+
for (let i = 0; i < this.$refs.items.length; i++) {
124+
if (this.$refs.items[i].clue.id == clue.id) {
123125
this.$refs.items[i].directionsClicked(true)
124-
break;
125126
}
126127
}
127128
}

‎client/components/CfzCrosswordClues.vue

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
@deselect-clue="clueDeselected($event)"
1818
@select-clue="$emit('select-clue', $event)"
1919
@move-to-clue="moveToClue($event)"
20-
v-model="crossword.acrossClues"
20+
v-model="crossword.clues"
2121
v-on="$listeners"
2222
v-if="!hideAcross"
2323
>
@@ -34,7 +34,7 @@
3434
@deselect-clue="clueDeselected($event)"
3535
@select-clue="$emit('select-clue', $event)"
3636
@move-to-clue="moveToClue($event)"
37-
v-model="crossword.downClues"
37+
v-model="crossword.clues"
3838
v-on="$listeners"
3939
v-if="!hideDown"
4040
>
@@ -200,6 +200,10 @@ export default Vue.extend({
200200
const nextList = next.isAcross ? this.$refs.acrossList : this.$refs.downList;
201201
nextList.scrollToClue(next);
202202
},
203+
scrollToClue(clue) {
204+
const list = clue.isAcross ? this.$refs.acrossList : this.$refs.downList;
205+
list.scrollToClue(clue);
206+
}
203207
},
204208
data() {
205209
return {

0 commit comments

Comments
 (0)