<template>
    <v-app-bar color="primary" scroll-behavior="collapse" scroll-threshold="50" :height="100" image="/static/bck-1.webp">
        <!-- <v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer"></v-app-bar-nav-icon> -->
        <template v-slot:prepend>
            <router-link to="/manage">
                <v-avatar class="ml-4 mr-3" size="66" rounded="0">
                    <v-img src="/logo.webp" alt="ProNature Logo"></v-img>
                </v-avatar>
            </router-link>
        </template>
        <v-app-bar-title>
            <router-link to="/manage">{{ l.workshop }}</router-link>
        </v-app-bar-title>
        <template v-slot:append>
            <v-menu>
                <template v-slot:activator="{ props }">
                    <v-btn icon="mdi-plus" variant="text" v-bind="props"></v-btn>
                </template>
                <v-list>
                    <v-list-item to="/manage/game-objects/add">{{ l.createGameObject }}</v-list-item>
                    <v-list-item to="/manage/scenarios/add">{{ l.createScenario }}</v-list-item>
                    <v-list-item to="/manage/games/add">{{ l.createGame }}</v-list-item>
                </v-list>
            </v-menu>
            <CommonHeader></CommonHeader>
            <v-btn to="/" icon="mdi-controller" v-tooltip="l.playground" variant="flat" color="primary"></v-btn>
        </template>
    </v-app-bar>

    <v-navigation-drawer class="bg-secondary" expand-on-hover rail>
        <v-divider></v-divider>
        <v-list nav>
            <v-list-item prepend-icon="mdi-database" to="/manage/game-objects/list" :title="l.gameObjects">
                <template v-slot:append>
                    <v-btn icon="mdi-plus" variant="text" to="/manage/game-objects/add"></v-btn>
                </template>
            </v-list-item>
            <v-list-item prepend-icon="mdi-receipt-text-edit-outline" to="/manage/scenarios/list" :title="l.gameScenarios">
                <template v-slot:append>
                    <v-btn icon="mdi-plus" variant="text" to="/manage/scenarios/add"></v-btn>
                </template>
            </v-list-item>
            <!-- <v-list-item prepend-icon="mdi-cogs" :title="l.gameRules"></v-list-item> -->
            <!-- <v-divider></v-divider> -->
            <v-list-item prepend-icon="mdi-controller" :title="l.games" to="/manage/games/list">
                <template v-slot:append>
                    <v-btn icon="mdi-plus" variant="text" to="/manage/games/add"></v-btn>
                </template>
            </v-list-item>
            <v-list-item prepend-icon="mdi-cog-play" :title="l.preview" to="/manage/preview/list"></v-list-item>
        </v-list>
        <v-divider></v-divider>
    </v-navigation-drawer>
</template>

<script>
</script>