speakid-build-a-sentence

Magic Sentence Game - Interactive word building game for SPEAKID platform

Установка

npm install speakid-build-a-sentence

Использование

Базовое использование

import Game from 'speakid-build-a-sentence';

function GamePage() {
  return (
    <div style={{ width: '100%', height: '100vh' }}>
      <Game />
    </div>
  );
}

Использование с baseURL (для SPEAKID)

import Game from 'speakid-build-a-sentence';

function GamePage() {
  // Используем window.origin для автоматического определения окружения (тест/прод)
  // Компонент автоматически добавит /logo.svg к переданному baseURL
  const baseURL = window.origin + "/browser/speakid/games/magic%20sentence";
  
  return (
    <div style={{ width: '100%', height: '100vh' }}>
      <Game baseURL={baseURL} />
    </div>
  );
}

Примечание:

• Логотип должен быть загружен в MinIO по пути: speakid/games/magic sentence/logo.svg
• Использование window.origin обеспечивает работу на тесте и проде автоматически
• На тесте: http://185.235.128.176:9001/browser/speakid/games%2Fmagic%20sentence%2Flogo.svg
• На проде: {prod-domain}/browser/speakid/games%2Fmagic%20sentence%2Flogo.svg
• Компонент автоматически добавит /logo.svg к переданному baseURL
• URL с %20 (URL-encoded пробел) работает корректно
• Логотип позиционируется: position: absolute, top: 16px, left: 16px, zIndex: 30

Дополнительные опции

import Game from 'speakid-build-a-sentence';

// С кастомным логотипом (полный URL)
<Game logoUrl={window.origin + "/browser/speakid/games/magic%20sentence/logo.svg"} />

// Без логотипа
<Game showLogo={false} />

// С baseURL для изображений из MinIO (автоматически для теста и прода)
<Game baseURL={window.origin + "/browser/speakid/games/magic%20sentence"} />

Требования

• React >= 18.2.0
• React DOM >= 18.2.0
• Webpack (CRA совместимый)