posodobitve
This commit is contained in:
@@ -7,107 +7,61 @@ class StoryScene extends Phaser.Scene {
|
||||
const width = this.cameras.main.width;
|
||||
const height = this.cameras.main.height;
|
||||
|
||||
// Dark background with gradient
|
||||
const bg = this.add.rectangle(0, 0, width, height, 0x0a0a0a);
|
||||
// Warm background (Stardew Valley style)
|
||||
const bg = this.add.rectangle(0, 0, width, height, 0x2d1b00);
|
||||
bg.setOrigin(0);
|
||||
|
||||
// GLOW EFFECT for title (multiple Text objects)
|
||||
const titleGlow1 = this.add.text(width / 2, 80, 'NOVAFARMA', {
|
||||
fontSize: '72px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#00ff41',
|
||||
fontStyle: 'bold'
|
||||
});
|
||||
titleGlow1.setOrigin(0.5);
|
||||
titleGlow1.setAlpha(0.3);
|
||||
titleGlow1.setScale(1.05);
|
||||
// Add subtle texture overlay
|
||||
const overlay = this.add.rectangle(0, 0, width, height, 0x000000, 0.3);
|
||||
overlay.setOrigin(0);
|
||||
|
||||
const titleGlow2 = this.add.text(width / 2, 80, 'NOVAFARMA', {
|
||||
fontSize: '72px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#00ff41',
|
||||
fontStyle: 'bold'
|
||||
});
|
||||
titleGlow2.setOrigin(0.5);
|
||||
titleGlow2.setAlpha(0.5);
|
||||
titleGlow2.setScale(1.02);
|
||||
// MAIN TITLE (horizontal, top center)
|
||||
const titleBg = this.add.rectangle(width / 2, 80, 480, 70, 0x4a3520, 0.9);
|
||||
titleBg.setStrokeStyle(3, 0xd4a574);
|
||||
|
||||
// Main title
|
||||
const title = this.add.text(width / 2, 80, 'NOVAFARMA', {
|
||||
fontSize: '72px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#00ff41',
|
||||
fontSize: '42px',
|
||||
fontFamily: 'Georgia, serif',
|
||||
color: '#f4e4c1',
|
||||
fontStyle: 'bold',
|
||||
stroke: '#003311',
|
||||
strokeThickness: 8
|
||||
stroke: '#2d1b00',
|
||||
strokeThickness: 4
|
||||
});
|
||||
title.setOrigin(0.5);
|
||||
|
||||
// Pulsing glow animation
|
||||
this.tweens.add({
|
||||
targets: [titleGlow1, titleGlow2],
|
||||
scaleX: 1.08,
|
||||
scaleY: 1.08,
|
||||
alpha: 0.6,
|
||||
duration: 2000,
|
||||
yoyo: true,
|
||||
repeat: -1,
|
||||
ease: 'Sine.easeInOut'
|
||||
});
|
||||
|
||||
// Subtle title bounce
|
||||
// Subtle glow
|
||||
this.tweens.add({
|
||||
targets: title,
|
||||
y: 75,
|
||||
duration: 3000,
|
||||
alpha: 0.9,
|
||||
yoyo: true,
|
||||
repeat: -1,
|
||||
duration: 2000,
|
||||
ease: 'Sine.easeInOut'
|
||||
});
|
||||
|
||||
// Subtitle
|
||||
const subtitle = this.add.text(width / 2, 150, '2084 - Survival Farm', {
|
||||
fontSize: '20px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#888888'
|
||||
const subtitle = this.add.text(width / 2, 120, '~ 2084 - Survival Farm ~', {
|
||||
fontSize: '14px',
|
||||
fontFamily: 'Georgia, serif',
|
||||
color: '#d4a574',
|
||||
fontStyle: 'italic'
|
||||
});
|
||||
subtitle.setOrigin(0.5);
|
||||
|
||||
// Accessibility Info Panel (Prominent)
|
||||
const accessibilityInfo = this.add.text(width / 2, 190,
|
||||
'♿ ACCESSIBILITY OPTIONS AVAILABLE BELOW ↓\nFor players with visual, motor, or cognitive needs',
|
||||
{
|
||||
fontSize: '14px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#44ff44',
|
||||
align: 'center',
|
||||
backgroundColor: '#1a1a2e',
|
||||
padding: { x: 15, y: 8 }
|
||||
}
|
||||
);
|
||||
accessibilityInfo.setOrigin(0.5);
|
||||
|
||||
// Pulsing animation for visibility
|
||||
this.tweens.add({
|
||||
targets: accessibilityInfo,
|
||||
alpha: 0.7,
|
||||
yoyo: true,
|
||||
repeat: -1,
|
||||
duration: 1500,
|
||||
ease: 'Sine.easeInOut'
|
||||
});
|
||||
|
||||
// Main Menu Buttons
|
||||
// Main Menu Buttons (center)
|
||||
this.createMainMenu(width, height);
|
||||
|
||||
// Language selector (bottom)
|
||||
// Accessibility icon (top-right)
|
||||
this.createAccessibilityIcon(width, height);
|
||||
|
||||
// Language selector with rotating globe (bottom-right)
|
||||
this.createLanguageSelector(width, height);
|
||||
|
||||
// Version info
|
||||
const version = this.add.text(10, height - 30, 'v0.9.0 ALPHA', {
|
||||
fontSize: '14px',
|
||||
color: '#444444',
|
||||
fontFamily: 'Courier New'
|
||||
color: '#6b4423',
|
||||
fontFamily: 'Georgia, serif'
|
||||
});
|
||||
}
|
||||
|
||||
@@ -115,111 +69,152 @@ class StoryScene extends Phaser.Scene {
|
||||
const buttons = [
|
||||
{
|
||||
label: '▶ NEW GAME',
|
||||
color: '#00ff41',
|
||||
action: () => this.startNewGame(),
|
||||
description: 'Start a new adventure'
|
||||
color: '#8fbc8f',
|
||||
action: () => this.startNewGame()
|
||||
},
|
||||
{
|
||||
label: '📁 LOAD GAME',
|
||||
color: '#4477ff',
|
||||
action: () => this.loadGame(),
|
||||
description: 'Continue your saved game'
|
||||
color: '#87ceeb',
|
||||
action: () => this.loadGame()
|
||||
},
|
||||
{
|
||||
label: '⚙️ SETTINGS',
|
||||
color: '#ffaa00',
|
||||
action: () => this.showSettings(),
|
||||
description: 'Graphics, audio, controls'
|
||||
},
|
||||
{
|
||||
label: '♿ ACCESSIBILITY',
|
||||
color: '#44ff44',
|
||||
action: () => this.showAccessibility(),
|
||||
description: 'Options for disabilities: Vision, Motor, Cognitive, Epilepsy'
|
||||
color: '#daa520',
|
||||
action: () => this.showSettings()
|
||||
},
|
||||
{
|
||||
label: '❌ EXIT',
|
||||
color: '#ff4444',
|
||||
action: () => this.exitGame(),
|
||||
description: 'Close the game'
|
||||
color: '#cd5c5c',
|
||||
action: () => this.exitGame()
|
||||
}
|
||||
];
|
||||
|
||||
const startY = 230;
|
||||
const spacing = 75;
|
||||
const startY = 170;
|
||||
const spacing = 58;
|
||||
|
||||
buttons.forEach((btn, index) => {
|
||||
const y = startY + (index * spacing);
|
||||
|
||||
// Button background
|
||||
const bg = this.add.rectangle(width / 2, y, 400, 60, 0x1a1a2e, 1);
|
||||
bg.setStrokeStyle(3, 0x00ff41);
|
||||
// Wooden button background (Stardew style)
|
||||
const bg = this.add.rectangle(width / 2, y, 280, 48, 0x6b4423, 1);
|
||||
bg.setStrokeStyle(2, 0xd4a574);
|
||||
|
||||
// Inner shadow effect
|
||||
const innerShadow = this.add.rectangle(width / 2, y + 2, 270, 38, 0x4a3520, 0.5);
|
||||
|
||||
// Button text
|
||||
const text = this.add.text(width / 2, y, btn.label, {
|
||||
fontSize: '28px',
|
||||
fontFamily: 'Courier New',
|
||||
fontSize: '20px',
|
||||
fontFamily: 'Georgia, serif',
|
||||
color: btn.color,
|
||||
fontStyle: 'bold'
|
||||
fontStyle: 'bold',
|
||||
stroke: '#2d1b00',
|
||||
strokeThickness: 3
|
||||
});
|
||||
text.setOrigin(0.5);
|
||||
|
||||
// Description text (hidden by default)
|
||||
const desc = this.add.text(width / 2, y + 40, btn.description, {
|
||||
fontSize: '12px',
|
||||
fontFamily: 'Courier New',
|
||||
color: '#888888',
|
||||
align: 'center'
|
||||
});
|
||||
desc.setOrigin(0.5);
|
||||
desc.setAlpha(0); // Hidden initially
|
||||
|
||||
// Make interactive
|
||||
bg.setInteractive({ useHandCursor: true });
|
||||
bg.on('pointerover', () => {
|
||||
bg.setFillStyle(0x2a2a4e);
|
||||
text.setScale(1.1);
|
||||
desc.setAlpha(1); // Show description
|
||||
bg.setFillStyle(0x8b5a3c);
|
||||
text.setScale(1.05);
|
||||
bg.setStrokeStyle(4, 0xf4e4c1);
|
||||
});
|
||||
bg.on('pointerout', () => {
|
||||
bg.setFillStyle(0x1a1a2e);
|
||||
bg.setFillStyle(0x6b4423);
|
||||
text.setScale(1.0);
|
||||
desc.setAlpha(0); // Hide description
|
||||
bg.setStrokeStyle(3, 0xd4a574);
|
||||
});
|
||||
bg.on('pointerdown', () => {
|
||||
// Flash effect
|
||||
// Press effect
|
||||
this.tweens.add({
|
||||
targets: bg,
|
||||
alpha: 0.5,
|
||||
yoyo: true,
|
||||
targets: [bg, text, innerShadow],
|
||||
y: y + 3,
|
||||
duration: 100,
|
||||
yoyo: true,
|
||||
onComplete: btn.action
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
createAccessibilityIcon(width, height) {
|
||||
// Accessibility icon (top-right) - Stardew style
|
||||
const iconBg = this.add.circle(width - 50, 40, 26, 0x6b4423);
|
||||
iconBg.setStrokeStyle(2, 0xd4a574);
|
||||
|
||||
const icon = this.add.text(width - 50, 40, '♿', {
|
||||
fontSize: '32px',
|
||||
color: '#8fbc8f'
|
||||
});
|
||||
icon.setOrigin(0.5);
|
||||
icon.setInteractive({ useHandCursor: true });
|
||||
|
||||
// Gentle pulse animation
|
||||
this.tweens.add({
|
||||
targets: [icon, iconBg],
|
||||
scale: 1.08,
|
||||
duration: 1500,
|
||||
yoyo: true,
|
||||
repeat: -1,
|
||||
ease: 'Sine.easeInOut'
|
||||
});
|
||||
|
||||
icon.on('pointerover', () => {
|
||||
icon.setScale(1.2);
|
||||
iconBg.setScale(1.2);
|
||||
iconBg.setFillStyle(0x8b5a3c);
|
||||
});
|
||||
icon.on('pointerout', () => {
|
||||
icon.setScale(1.0);
|
||||
iconBg.setScale(1.0);
|
||||
iconBg.setFillStyle(0x6b4423);
|
||||
});
|
||||
icon.on('pointerdown', () => {
|
||||
this.showAccessibility();
|
||||
});
|
||||
}
|
||||
|
||||
createLanguageSelector(width, height) {
|
||||
// Initialize localization
|
||||
if (!window.i18n) {
|
||||
window.i18n = new LocalizationSystem();
|
||||
}
|
||||
|
||||
// Globe button (bottom-right)
|
||||
const globeBtn = this.add.text(width - 80, height - 60, '🌍', {
|
||||
fontSize: '48px'
|
||||
// Wooden circle background for globe (Stardew style)
|
||||
const globeBg = this.add.circle(width - 60, height - 60, 30, 0x6b4423);
|
||||
globeBg.setStrokeStyle(2, 0xd4a574);
|
||||
|
||||
// Rotating globe button
|
||||
const globeBtn = this.add.text(width - 60, height - 60, '🌍', {
|
||||
fontSize: '42px'
|
||||
});
|
||||
globeBtn.setOrigin(0.5);
|
||||
globeBtn.setInteractive({ useHandCursor: true });
|
||||
|
||||
// Continuous rotation animation
|
||||
this.tweens.add({
|
||||
targets: globeBtn,
|
||||
angle: 360,
|
||||
duration: 8000,
|
||||
repeat: -1,
|
||||
ease: 'Linear'
|
||||
});
|
||||
|
||||
let langMenuOpen = false;
|
||||
let langMenu = null;
|
||||
|
||||
globeBtn.on('pointerover', () => {
|
||||
globeBtn.setScale(1.2);
|
||||
globeBtn.setScale(1.15);
|
||||
globeBg.setScale(1.15);
|
||||
globeBg.setFillStyle(0x8b5a3c);
|
||||
});
|
||||
globeBtn.on('pointerout', () => {
|
||||
if (!langMenuOpen) globeBtn.setScale(1.0);
|
||||
if (!langMenuOpen) {
|
||||
globeBtn.setScale(1.0);
|
||||
globeBg.setScale(1.0);
|
||||
globeBg.setFillStyle(0x6b4423);
|
||||
}
|
||||
});
|
||||
globeBtn.on('pointerdown', () => {
|
||||
if (langMenuOpen) {
|
||||
@@ -245,45 +240,55 @@ class StoryScene extends Phaser.Scene {
|
||||
const container = this.add.container(0, 0);
|
||||
|
||||
const languages = [
|
||||
{ code: 'slo', flag: '🇸🇮', name: 'SLO' },
|
||||
{ code: 'en', flag: '🇬🇧', name: 'ENG' },
|
||||
{ code: 'de', flag: '🇩🇪', name: 'DEU' },
|
||||
{ code: 'it', flag: '🇮🇹', name: 'ITA' },
|
||||
{ code: 'slo', flag: '🇸🇮', name: 'Slovenščina' },
|
||||
{ code: 'en', flag: '🇬🇧', name: 'English' },
|
||||
{ code: 'de', flag: '🇩🇪', name: 'Deutsch' },
|
||||
{ code: 'it', flag: '🇮🇹', name: 'Italiano' },
|
||||
{ code: 'cn', flag: '🇨🇳', name: '中文' }
|
||||
];
|
||||
|
||||
const menuX = width - 220;
|
||||
const menuX = width - 200;
|
||||
const menuY = height - 350;
|
||||
const menuW = 200;
|
||||
const menuH = 280;
|
||||
const menuW = 180;
|
||||
const menuH = 290;
|
||||
|
||||
// Panel background
|
||||
const panel = this.add.rectangle(menuX, menuY, menuW, menuH, 0x1a1a2e, 0.98);
|
||||
panel.setStrokeStyle(3, 0x00ff41);
|
||||
// Wooden panel background (Stardew style)
|
||||
const panel = this.add.rectangle(menuX, menuY, menuW, menuH, 0x6b4423, 0.98);
|
||||
panel.setStrokeStyle(4, 0xd4a574);
|
||||
container.add(panel);
|
||||
|
||||
// Title
|
||||
const title = this.add.text(menuX, menuY - 120, 'LANGUAGE', {
|
||||
fontSize: '18px',
|
||||
fontFamily: 'Georgia, serif',
|
||||
color: '#f4e4c1',
|
||||
fontStyle: 'bold'
|
||||
});
|
||||
title.setOrigin(0.5);
|
||||
container.add(title);
|
||||
|
||||
// Language buttons
|
||||
languages.forEach((lang, index) => {
|
||||
const btnY = menuY - 100 + (index * 55);
|
||||
const btnY = menuY - 90 + (index * 56);
|
||||
const isActive = window.i18n.getCurrentLanguage() === lang.code;
|
||||
|
||||
const btn = this.add.text(menuX, btnY, `${lang.flag} ${lang.name}`, {
|
||||
fontSize: '20px',
|
||||
fontFamily: 'Courier New',
|
||||
color: isActive ? '#00ff41' : '#ffffff',
|
||||
backgroundColor: isActive ? '#333333' : '#1a1a2e',
|
||||
padding: { x: 15, y: 8 }
|
||||
fontSize: '16px',
|
||||
fontFamily: 'Georgia, serif',
|
||||
color: isActive ? '#8fbc8f' : '#f4e4c1',
|
||||
backgroundColor: isActive ? '#4a3520' : '#6b4423',
|
||||
padding: { x: 12, y: 6 }
|
||||
});
|
||||
btn.setOrigin(0.5);
|
||||
btn.setInteractive({ useHandCursor: true });
|
||||
|
||||
btn.on('pointerover', () => {
|
||||
btn.setScale(1.05);
|
||||
if (!isActive) btn.setBackgroundColor('#2a2a4e');
|
||||
if (!isActive) btn.setBackgroundColor('#8b5a3c');
|
||||
});
|
||||
btn.on('pointerout', () => {
|
||||
btn.setScale(1.0);
|
||||
if (!isActive) btn.setBackgroundColor('#1a1a2e');
|
||||
if (!isActive) btn.setBackgroundColor('#6b4423');
|
||||
});
|
||||
btn.on('pointerdown', () => {
|
||||
window.i18n.setLanguage(lang.code);
|
||||
|
||||
Reference in New Issue
Block a user