Create a game that shows guest checking in and out of a hotel or calling the hotel or nature adventure attration with the correct customer service greetings and farewell.'s game

Click here for free DL of the app version that can save data.

No:36031

←

Prev Next

→

Create a game that shows guest checking in and out..ALL
Developer User16708｜Date and time 24/1/16 7:06:05
Build time 13.646 sec｜Game capacity 4.087KB｜

Script

Sure! Here's a simple game that simulates guests checking in and out of a hotel or calling a hotel/nature adventure attraction. It uses pictograms and includes customer service greetings and farewells. The game is implemented as a single HTML file, enclosed in script tags.

To run this game, save the HTML code into a file named `hotel-game.html`. You also need to have three image files, `emozi_all/game.png`, `emozi_all/pictogram.png`, and `emozi_all/pictogram.png`, in the same directory as the HTML file.

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

Click here for free DL of the app version that can save data.

```html
<!DOCTYPE html>
<html>
<head>
    <title>Hotel Game</title>
    <style>
        #game-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            font-size: 30px;
            margin-top: 100px;
        }
        
        .button {
            padding: 10px 20px;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            margin-top: 20px;
        }
        
        .guest {
            display: none;
            margin-top: 20px;
        }
        
        #call-hotel {
            font-size: 40px;
            align-self: flex-end;
            margin-right: 30px;
        }
        
        .farewell {
            font-size: 20px;
            margin-top: 50px;
        }
    </style>
</head>
<body>
<script>
    let guests = [
        {
            name: 'Peter',
            status: 'Checked-In'
        },
        {
            name: 'Sarah',
            status: 'Checked-In'
        },
        {
            name: 'John',
            status: 'Checked-Out'
        }
    ];
    
    let currentGuestIndex = 0;
    
    function checkIn() {
        const guestDiv = document.getElementById('guest-' + currentGuestIndex);
        guestDiv.innerHTML = `<img src="checkin-pictogram.png" alt="check-in"> Welcome, ${guests[currentGuestIndex].name}!`;
        guestDiv.style.display = 'block';
        currentGuestIndex++;
        
        if (currentGuestIndex >= guests.length) {
            document.getElementById('check-in-button').disabled = true;
        }
    }
    
    function checkOut() {
        const guestDiv = document.getElementById('guest-' + currentGuestIndex);
        guestDiv.innerHTML = `<img src="checkout-pictogram.png" alt="check-out"> Goodbye, ${guests[currentGuestIndex].name}!`;
        guestDiv.style.display = 'block';
        currentGuestIndex++;
        
        if (currentGuestIndex >= guests.length) {
            document.getElementById('check-out-button').disabled = true;
        }
    }
    
    function callHotel() {
        const guestDiv = document.getElementById('guest-' + currentGuestIndex);
        guestDiv.innerHTML = `<img src="phone-pictogram.png" alt="phone"> Hello, how can I help you?`;
        guestDiv.style.display = 'block';
        currentGuestIndex++;
        
        if (currentGuestIndex >= guests.length) {
            document.getElementById('call-hotel').disabled = true;
        }
    }
    
    function startGame() {
        document.getElementById('start-button').style.display = 'none';
        document.getElementById('game-container').style.display = 'block';
        document.getElementById('check-in-button').disabled = false;
        document.getElementById('check-out-button').disabled = false;
        document.getElementById('call-hotel').disabled = false;
    }
</script>

<div id="game-container" style="display: none;">
    <button id="check-in-button" class="button" onclick="checkIn()">Check-In</button>
    <button id="check-out-button" class="button" onclick="checkOut()">Check-Out</button>
    
    <button id="call-hotel" class="button" onclick="callHotel()">Call Hotel</button>
    
    <div id="guest-0" class="guest"></div>
    <div id="guest-1" class="guest"></div>
    <div id="guest-2" class="guest"></div>
    
    <button id="start-button" class="button" onclick="startGame()">Start</button>
</div>

To run this game, save the HTML code into a file named `hotel-game.html`. You also need to have three image files, `checkin-pictogram.png`, `checkout-pictogram.png`, and `phone-pictogram.png`, in the same directory as the HTML file.