@windward/games 0.0.3 → 0.0.5

package/components/content/DatableEditor.vue

@@ -170,8 +170,6 @@ export default {
             const item = evt.draggedContext.element
             const itemIdx = evt.draggedContext.futureIndex
 
-            console.log('onMoveCallback', evt)
-
             if (item.locked) {
                 return false
             }
@@ -179,7 +177,6 @@ export default {
             return true
         },
         onDropCallback(evt, originalEvent) {
-            console.log('onDropCallback')
             this.$emit('input', this.items)
         },
         editItem(item) {

package/components/content/blocks/crosswordPuzzle/Crossword.ts

@@ -0,0 +1,553 @@
+import {
+    CrosswordCell,
+    CrosswordCellNode,
+    WordElement,
+} from './CrosswordElements'
+class Crossword {
+    public GRID_COLS: any = 50
+    public GRID_ROWS: any = 50
+    // This is an index of the positions of the char in the crossword (so we know where we can potentially place words)
+    // example {"a" : [{'row' : 10, 'col' : 5}, {'row' : 62, 'col' :17}], {'row' : 54, 'col' : 12}], "b" : [{'row' : 3, 'col' : 13}]}
+    // where the two item arrays are the row and column of where the letter occurs
+    public charIndex: any = {}
+    // these words are the words that can't be placed on the crossword
+    public badWords!: any
+    public wordsIn!: any
+    public cluesIn!: any
+    public grid: any = []
+    public wordElements: any = []
+
+    constructor(wordsIn: any, cluesIn: any) {
+        this.wordsIn = wordsIn
+        this.cluesIn = cluesIn
+        // constructor
+        if (this.wordsIn.length < 2)
+            throw 'A crossword must have at least 2 words'
+        if (this.wordsIn.length !== cluesIn.length)
+            throw 'The number of words must equal the number of clues'
+        // build the grid;
+        this.grid = new Array(this.GRID_ROWS)
+        for (let i = 0; i < this.GRID_ROWS; i++) {
+            this.grid[i] = new Array(this.GRID_COLS)
+        }
+
+        // build the element list (need to keep track of indexes in the originial input arrays)
+        for (let i = 0; i < wordsIn.length; i++) {
+            this.wordElements.push(new WordElement(wordsIn[i], i))
+        }
+
+        // I got this sorting idea from http://stackoverflow.com/questions/943113/algorithm-to-generate-a-crossword/1021800#1021800
+        // seems to work well
+        this.wordElements.sort(function (a: any, b: any) {
+            return b.word.length - a.word.length
+        })
+    }
+
+    // returns the crossword grid that has the ratio closest to 1 or null if it can't build one
+    public getSquareGrid(maxTries: number) {
+        let bestGrid: any = null
+        let bestRatio = 0
+        for (let i = 0; i < maxTries; i++) {
+            let aGrid: any = this.getGrid(1)
+            if (aGrid === null) {
+                continue
+            }
+            let ratio =
+                (Math.min(aGrid.length, aGrid[0].length) * 1.0) /
+                Math.max(aGrid.length, aGrid[0].length)
+            if (ratio > bestRatio) {
+                bestGrid = aGrid
+                bestRatio = ratio
+            }
+
+            if (bestRatio === 1) break
+        }
+        return bestGrid
+    }
+
+    // returns an abitrary grid, or null if it can't build one
+    public getGrid(maxTries: number) {
+        const groups: any = []
+        let wordHasBeenAddedToGrid: boolean = false
+
+        for (let tries = 0; tries < maxTries; tries++) {
+            this.clear() // always start with a fresh grid and charIndex
+            // place the first word in the middle of the grid
+            let start_dir = this.randomDirection()
+            let r = Math.floor(this.grid.length / 2)
+            let c = Math.floor(this.grid[0].length / 2)
+
+            let wordElement = this.wordElements[0]
+            if (start_dir === 'across') {
+                c -= Math.floor(wordElement.word.length / 2)
+            } else {
+                r -= Math.floor(wordElement.word.length / 2)
+            }
+
+            if (
+                this.canPlaceWordAt(wordElement.word, r, c, start_dir) !== false
+            ) {
+                this.placeWordAt(
+                    wordElement.word,
+                    wordElement.index,
+                    r,
+                    c,
+                    start_dir
+                )
+            } else {
+                this.badWords = [wordElement]
+                return null
+            }
+
+            // start with a group containing all the words (except the first)
+            // as we go, we try to place each word in the group onto the grid
+            // if the word can't go on the grid, we add that word to the next group
+
+            groups.push(this.wordElements.slice(1))
+            for (let g = 0; g < groups.length; g++) {
+                wordHasBeenAddedToGrid = false
+                // try to add all the words in this group to the grid
+                for (let i = 0; i < groups[g].length; i++) {
+                    wordElement = groups[g][i]
+                    const bestPosition: any = this.findPositionForWord(
+                        wordElement.word
+                    )
+                    if (!bestPosition) {
+                        // make the new group (if needed)
+                        if (groups.length - 1 === g) groups.push([])
+                        // place the word in the next group
+                        groups[g + 1].push(wordElement)
+                    } else {
+                        r = bestPosition['row']
+                        c = bestPosition['col']
+
+                        this.placeWordAt(
+                            wordElement.word,
+                            wordElement.index,
+                            r,
+                            c,
+                            bestPosition['direction']
+                        )
+                        wordHasBeenAddedToGrid = true
+                    }
+                }
+                // if we haven't made any progress, there is no point in going on to the next group
+                if (!wordHasBeenAddedToGrid) break
+            }
+            // no need to try again
+            if (wordHasBeenAddedToGrid) return this.minimizeGrid()
+        }
+
+        this.badWords = groups[groups.length - 1]
+        return null
+    }
+
+    // returns the list of WordElements that can't fit on the crossword
+    public getBadWords() {
+        return this.badWords
+    }
+
+    // get two arrays ("across" and "down") that contain objects describing the
+    // topological position of the word (e.g. 1 is the first word starting from
+    // the top left, going to the bottom right), the index of the word (in the
+    // original input list), the clue, and the word itself
+    public getLegend(grid: any) {
+        let groups: any = { across: [], down: [] }
+        let position = 1
+        for (let row = 0; row < grid.length; row++) {
+            for (let col = 0; col < grid[row].length; col++) {
+                let cell = grid[row][col]
+                let increment_position = false
+                // check across and down
+                for (let direction in groups) {
+                    // does a word start here? (make sure the cell isn't null, first)
+                    if (
+                        cell &&
+                        cell[direction] &&
+                        cell[direction].isStartOfWord
+                    ) {
+                        const index = cell[direction].index
+                        groups[direction].push({
+                            position: position,
+                            index: index,
+                            clue: this.cluesIn[index],
+                            word: this.wordsIn[index],
+                        })
+                        // Set the cell position now that we've generated a legend
+                        cell[direction].position = position
+                        increment_position = true
+                    }
+                }
+
+                if (increment_position) position++
+            }
+        }
+        return groups
+    }
+
+    // move the grid onto the smallest grid that will fit it
+    public minimizeGrid() {
+        // find bounds
+        let r_min = this.GRID_ROWS - 1
+        let r_max = 0
+        let c_min = this.GRID_COLS - 1
+        let c_max = 0
+
+        for (let r = 0; r < this.GRID_ROWS; r++) {
+            for (let c = 0; c < this.GRID_COLS; c++) {
+                let cell = this.grid[r][c]
+                if (cell !== null) {
+                    if (r < r_min) r_min = r
+                    if (r > r_max) r_max = r
+                    if (c < c_min) c_min = c
+                    if (c > c_max) c_max = c
+                }
+            }
+        }
+        // initialize new grid
+        let rows = r_max - r_min + 1
+        let cols = c_max - c_min + 1
+        let new_grid = new Array(rows)
+        for (let r = 0; r < rows; r++) {
+            for (let c = 0; c < cols; c++) {
+                new_grid[r] = new Array(cols)
+            }
+        }
+
+        // copy the grid onto the smaller grid
+        for (let r = r_min, r2 = 0; r2 < rows; r++, r2++) {
+            for (let c = c_min, c2 = 0; c2 < cols; c++, c2++) {
+                new_grid[r2][c2] = this.grid[r][c]
+            }
+        }
+
+        return new_grid
+    }
+
+    // helper for placeWordAt();
+    public addCellToGrid(
+        word: any,
+        indexOfWordInInputList: any,
+        indexOfChar: any,
+        row: any,
+        col: any,
+        direction: any
+    ) {
+        const char = word.charAt(indexOfChar)
+        if (this.grid[row][col] === null) {
+            this.grid[row][col] = new CrosswordCell(char)
+
+            // init the charIndex for that character if needed
+            if (!this.charIndex[char]) this.charIndex[char] = []
+
+            // add to index
+            this.charIndex[char].push({ row, col })
+        }
+
+        this.grid[row][col][direction] = new CrosswordCellNode(
+            indexOfChar === 0,
+            indexOfWordInInputList
+        )
+    }
+
+    // place the word at the row and col indicated (the first char goes there)
+    // the next chars go to the right (across) or below (down), depending on the direction
+    public placeWordAt(
+        word: any,
+        indexOfWordInInputList: any,
+        row: any,
+        col: any,
+        direction: any
+    ) {
+        if (direction === 'across') {
+            for (let c = col, i = 0; c < col + word.length; c++, i++) {
+                this.addCellToGrid(
+                    word,
+                    indexOfWordInInputList,
+                    i,
+                    row,
+                    c,
+                    direction
+                )
+            }
+        } else if (direction === 'down') {
+            for (let r = row, i = 0; r < row + word.length; r++, i++) {
+                this.addCellToGrid(
+                    word,
+                    indexOfWordInInputList,
+                    i,
+                    r,
+                    col,
+                    direction
+                )
+            }
+        } else {
+            throw 'Invalid Direction'
+        }
+    }
+
+    // you can only place a char where the space is blank, or when the same
+    // character exists there already
+    // returns false, if you can't place the char
+    // 0 if you can place the char, but there is no intersection
+    // 1 if you can place the char, and there is an intersection
+    public canPlaceCharAt(char: any, row: any, col: any) {
+        // no intersection
+        if (this.grid[row][col] === null) return 0
+        // intersection!
+        if (this.grid[row][col]['char'] === char) return 1
+
+        return false
+    }
+
+    // determines if you can place a word at the row, column in the direction
+    public canPlaceWordAt(word: any, row: any, col: any, direction: any): any {
+        // out of bounds
+        if (
+            row < 0 ||
+            row >= this.grid.length ||
+            col < 0 ||
+            col >= this.grid[row].length
+        )
+            return false
+
+        let intersections
+
+        if (direction === 'across') {
+            // out of bounds (word too long)
+            if (col + word.length > this.grid[row].length) return false
+            // can't have a word directly to the left
+            if (col - 1 >= 0 && this.grid[row][col - 1] !== null) return false
+            // can't have word directly to the right
+            if (
+                col + word.length < this.grid[row].length &&
+                this.grid[row][col + word.length] !== null
+            )
+                return false
+
+            // check the row above to make sure there isn't another word
+            // running parallel. It is ok if there is a character above, only if
+            // the character below it intersects with the current word
+            for (
+                let r = row - 1, c = col, i = 0;
+                r >= 0 && c < col + word.length;
+                c++, i++
+            ) {
+                let is_empty = this.grid[r][c] === null
+                let is_intersection =
+                    this.grid[row][c] !== null &&
+                    this.grid[row][c]['char'] === word.charAt(i)
+                let can_place_here = is_empty || is_intersection
+                if (!can_place_here) return false
+            }
+
+            // same deal as above, we just search in the row below the word
+            for (
+                let r = row + 1, c = col, i = 0;
+                r < this.grid.length && c < col + word.length;
+                c++, i++
+            ) {
+                let is_empty = this.grid[r][c] === null
+                let is_intersection =
+                    this.grid[row][c] !== null &&
+                    this.grid[row][c]['char'] === word.charAt(i)
+                let can_place_here = is_empty || is_intersection
+                if (!can_place_here) return false
+            }
+
+            // check to make sure we aren't overlapping a char (that doesn't match)
+            // and get the count of intersections
+            intersections = 0
+            for (let c = col, i = 0; c < col + word.length; c++, i++) {
+                let result = this.canPlaceCharAt(word.charAt(i), row, c)
+                if (result === false) return false
+                intersections += result
+            }
+        } else if (direction === 'down') {
+            // out of bounds
+            if (row + word.length > this.grid.length) return false
+            // can't have a word directly above
+            if (row - 1 >= 0 && this.grid[row - 1][col] !== null) return false
+            // can't have a word directly below
+            if (
+                row + word.length < this.grid.length &&
+                this.grid[row + word.length][col] !== null
+            )
+                return false
+
+            // check the column to the left to make sure there isn't another
+            // word running parallel. It is ok if there is a character to the
+            // left, only if the character to the right intersects with the
+            // current word
+            for (
+                let c = col - 1, r = row, i = 0;
+                c >= 0 && r < row + word.length;
+                r++, i++
+            ) {
+                let is_empty = this.grid[r][c] === null
+                let is_intersection =
+                    this.grid[r][col] !== null &&
+                    this.grid[r][col]['char'] === word.charAt(i)
+                let can_place_here = is_empty || is_intersection
+                if (!can_place_here) return false
+            }
+
+            // same deal, but look at the column to the right
+            for (
+                let c = col + 1, r = row, i = 0;
+                r < row + word.length && c < this.grid[r].length;
+                r++, i++
+            ) {
+                let is_empty = this.grid[r][c] === null
+                let is_intersection =
+                    this.grid[r][col] !== null &&
+                    this.grid[r][col]['char'] === word.charAt(i)
+                let can_place_here = is_empty || is_intersection
+                if (!can_place_here) return false
+            }
+
+            // check to make sure we aren't overlapping a char (that doesn't match)
+            // and get the count of intersections
+            intersections = 0
+            for (let r = row, i = 0; r < row + word.length; r++, i++) {
+                let result = this.canPlaceCharAt(word.charAt(i, 1), r, col)
+                if (result === false) return false
+                intersections += result
+            }
+        } else {
+            throw 'Invalid Direction'
+        }
+        return intersections
+    }
+
+    public randomDirection() {
+        return Math.floor(Math.random() * 2) ? 'across' : 'down'
+    }
+
+    public findPositionForWord(word: any) {
+        // check the charIndex for every letter, and see if we can put it there in a direction
+        let bests: object[] = []
+        for (let i = 0; i < word.length; i++) {
+            const possible_locations_on_grid = this.charIndex[word.charAt(i)]
+            if (!possible_locations_on_grid) continue
+            for (let j = 0; j < possible_locations_on_grid.length; j++) {
+                const point = possible_locations_on_grid[j]
+                const r = point['row']
+                const c = point['col']
+                // the c - i, and r - i here compensate for the offset of character in the word
+                const intersections_across = this.canPlaceWordAt(
+                    word,
+                    r,
+                    c - i,
+                    'across'
+                )
+                const intersections_down = this.canPlaceWordAt(
+                    word,
+                    r - i,
+                    c,
+                    'down'
+                )
+
+                if (intersections_across !== false) {
+                    const objectAcross = {
+                        intersections: intersections_across,
+                        row: r,
+                        col: c - i,
+                        direction: 'across',
+                    }
+                    bests.push(objectAcross)
+                }
+                if (intersections_down !== false) {
+                    const objectDown = {
+                        intersections: intersections_down,
+                        row: r - i,
+                        col: c,
+                        direction: 'down',
+                    }
+                    bests.push(objectDown)
+                }
+            }
+        }
+
+        if (bests.length === 0) return false
+
+        // find a good random position
+        return bests[Math.floor(Math.random() * bests.length)]
+    }
+
+    public clear() {
+        for (let r = 0; r < this.grid.length; r++) {
+            for (let c = 0; c < this.grid[r].length; c++) {
+                this.grid[r][c] = null
+            }
+        }
+        this.charIndex = {}
+    }
+}
+
+class CrosswordUtils {
+    public static PATH_TO_PNGS_OF_NUMBERS: string = 'numbers/'
+
+    public static toHtml(grid: any, show_answers: any) {
+        if (grid === null) return
+        const html: Array<string> = []
+        html.push("<table class='crossword'>")
+        let label = 1
+        for (let r = 0; r < grid.length; r++) {
+            html.push('<tr>')
+            for (let c = 0; c < grid[r].length; c++) {
+                const cell = grid[r][c]
+                let isStartOfWord = false
+                let css_class, char
+                if (cell === null) {
+                    char = '&nbsp;'
+                    css_class = 'no-border'
+                } else {
+                    char = cell['char']
+                    css_class = ''
+                    isStartOfWord =
+                        (cell.across && cell.across.isStartOfWord) ||
+                        (cell.down && cell.down.isStartOfWord)
+                }
+
+                if (isStartOfWord) {
+                    const img_url =
+                        this.PATH_TO_PNGS_OF_NUMBERS + label.toString() + '.png'
+                    html.push(
+                        "<td class='" +
+                            css_class +
+                            "' title='" +
+                            r +
+                            ', ' +
+                            c +
+                            "' style=\"background-image:url('" +
+                            img_url +
+                            '\')">'
+                    )
+                    label++
+                } else {
+                    html.push(
+                        "<td class='" +
+                            css_class +
+                            "' title='" +
+                            r +
+                            ', ' +
+                            c +
+                            "'>"
+                    )
+                }
+
+                if (show_answers) {
+                    html.push(char)
+                } else {
+                    html.push('&nbsp;')
+                }
+            }
+            html.push('</tr>')
+        }
+        html.push('</table>')
+        return html.join('\n')
+    }
+}
+
+export { Crossword, CrosswordUtils }

package/components/content/blocks/crosswordPuzzle/CrosswordClues.vue

@@ -0,0 +1,91 @@
+<template>
+    <v-row>
+        <v-col
+            cols="6"
+            v-if="down.length > 0"
+            :class="`crossword-clues__list crossword-clues__list--down`"
+        >
+            <h3 class="crossword-clues__list-title">
+                {{
+                    $t(`plugin.games.components.content.blocks.crossword.down`)
+                }}
+            </h3>
+            <v-list dense>
+                <v-list-item-group v-model="selectedItem">
+                    <v-list-item
+                        class="crossword-clues__list-item"
+                        v-for="word in down"
+                        :key="word.index"
+                        :value="word.index"
+                        @click="onClick(word)"
+                    >
+                        {{ word.position }}.
+                        {{ word.clue }}
+                    </v-list-item>
+                </v-list-item-group>
+            </v-list>
+        </v-col>
+        <v-col
+            cols="6"
+            v-if="across.length > 0"
+            :class="`crossword-clues__list crossword-clues__list--across`"
+        >
+            <h3 class="crossword-clues__list-title">
+                {{
+                    $t(
+                        `plugin.games.components.content.blocks.crossword.across`
+                    )
+                }}
+            </h3>
+            <v-list dense>
+                <v-list-item-group v-model="selectedItem">
+                    <v-list-item
+                        class="crossword-clues__list-item"
+                        v-for="word in across"
+                        :key="word.index"
+                        :value="word.index"
+                        @click="onClick(word)"
+                    >
+                        {{ word.position }}.
+                        {{ word.clue }}
+                    </v-list-item>
+                </v-list-item-group>
+            </v-list>
+        </v-col>
+    </v-row>
+</template>
+
+<script>
+export default {
+    name: 'CrosswordClues',
+    components: {},
+    props: {
+        down: {
+            type: Array,
+            required: false,
+            default: () => [],
+        },
+        across: {
+            type: Array,
+            required: false,
+            default: () => [],
+        },
+    },
+    data() {
+        return {
+            selectedItem: null,
+        }
+    },
+    methods: {
+        onClick(word) {
+            this.$emit('click', word)
+        },
+    },
+}
+</script>
+
+<style scoped>
+.crossword-clues__list-item {
+    padding: 4px;
+}
+</style>

package/components/content/blocks/crosswordPuzzle/CrosswordElements.ts

@@ -0,0 +1,38 @@
+class CrosswordCell {
+    public char!: string
+    public across!: any
+    public down!: any
+    constructor(letter: string) {
+        this.char = letter // the actual letter for the cell on the crossword
+        // If a word hits this cell going in the "across" direction, this will be a CrosswordCellNode
+        this.across = null
+        // If a word hits this cell going in the "down" direction, this will be a CrosswordCellNode
+        this.down = null
+    }
+}
+
+// You can tell if the Node is the start of a word (which is needed if you want to number the cells)
+// and what word and clue it corresponds to (using the index)
+class CrosswordCellNode {
+    public isStartOfWord!: any
+    public index!: any
+    public position = -1
+
+    constructor(isStartOfWord: any, index: any) {
+        this.isStartOfWord = isStartOfWord
+        this.index = index // use to map this node to its word or clue
+    }
+
+    // public functionName
+}
+
+class WordElement {
+    public word!: any
+    public index!: any
+    constructor(word: any, index: any) {
+        this.word = word // the actual word
+        this.index = index // use to map this node to its word or clue
+    }
+}
+
+export { CrosswordCell, CrosswordCellNode, WordElement }