
mixin worldDialog()
    el-dialog.x-dialog.x-world-dialog(:before-close="beforeDialogClose" @mousedown.native="dialogMouseDown" @mouseup.native="dialogMouseUp" ref="worldDialog" :visible.sync="worldDialog.visible" :show-close="false" width="770px")
        div(v-loading="worldDialog.loading")
            div(style="display:flex")
                el-popover(placement="right" width="500px" trigger="click")
                    img.x-link(slot="reference" v-lazy="worldDialog.ref.thumbnailImageUrl" style="flex:none;width:160px;height:120px;border-radius:12px")
                    img.x-link(v-lazy="worldDialog.ref.imageUrl" style="width:500px;height:375px" @click="showFullscreenImageDialog(worldDialog.ref.imageUrl)")
                div(style="flex:1;display:flex;align-items:center;margin-left:15px")
                    div(style="flex:1")
                        div
                            i.el-icon-s-home(v-show="API.currentUser.$homeLocation && API.currentUser.$homeLocation.worldId === worldDialog.id" style="margin-right:5px")
                            span.dialog-title(v-text="worldDialog.ref.name")
                        div(style="margin-top:5px")
                            span.x-link.x-grey(v-text="worldDialog.ref.authorName" @click="showUserDialog(worldDialog.ref.authorId)" style="font-family:monospace")
                        div
                            el-tag(v-if="worldDialog.ref.$isLabs" type="primary" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.labs') }}
                            el-tag(v-else-if="worldDialog.ref.releaseStatus === 'public'" type="success" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.public') }}
                            el-tag(v-else type="danger" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.private') }}
                            el-tag.x-tag-platform-pc(v-if="worldDialog.isPC" type="info" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") PC
                                span.x-grey(v-if="worldDialog.bundleSizes['standalonewindows']" style=";margin-left:5px;border-left:inherit;padding-left:5px") {{ worldDialog.bundleSizes['standalonewindows'].fileSize }}
                            el-tag.x-tag-platform-quest(v-if="worldDialog.isQuest" type="info" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") Android
                                span.x-grey(v-if="worldDialog.bundleSizes['android']" style="margin-left:5px;border-left:inherit;padding-left:5px") {{ worldDialog.bundleSizes['android'].fileSize }}
                            el-tag.x-tag-platform-ios(v-if="worldDialog.isIos" type="info" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") iOS
                                span.x-grey(v-if="worldDialog.bundleSizes['ios']" style="margin-left:5px;border-left:inherit;padding-left:5px") {{ worldDialog.bundleSizes['ios'].fileSize }}
                            el-tag(v-if="worldDialog.avatarScalingDisabled" type="warning" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.avatar_scaling_disabled') }}
                            el-tag(v-if="worldDialog.focusViewDisabled" type="warning" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.focus_view_disabled') }}
                            el-tag(v-if="worldDialog.stickersDisabled" type="warning" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.stickers_disabled') }}
                            el-tag(v-if="worldDialog.ref.unityPackageUrl" type="success" effect="plain" size="mini" style="margin-right:5px;margin-top:5px") {{ $t('dialog.world.tags.future_proofing') }}
                            el-tag.x-link(v-if="worldDialog.inCache" type="info" effect="plain" size="mini" style="margin-right:5px;margin-top:5px" @click="openFolderGeneric(worldDialog.cachePath)")
                                span(v-text="worldDialog.cacheSize")
                                |  {{ $t('dialog.world.tags.cache')}}
                            div
                                template(v-for="tag in worldDialog.ref.tags")
                                    el-tag(v-if="tag.startsWith('content_')" :key="tag" effect="plain" size="mini" style="margin-right:5px;margin-top:5px")
                                        template(v-if="tag === 'content_horror'") {{ $t('dialog.world.tags.content_horror') }}
                                        template(v-else-if="tag === 'content_gore'") {{ $t('dialog.world.tags.content_gore') }}
                                        template(v-else-if="tag === 'content_violence'") {{ $t('dialog.world.tags.content_violence') }}
                                        template(v-else-if="tag === 'content_adult'") {{ $t('dialog.world.tags.content_adult') }}
                                        template(v-else-if="tag === 'content_sex'") {{ $t('dialog.world.tags.content_sex') }}
                                        template(v-else) {{ tag.replace('content_', '') }}
                        div(style="margin-top:5px")
                            span(v-show="worldDialog.ref.name !== worldDialog.ref.description" v-text="worldDialog.ref.description" style="font-size:12px")
                    div(style="flex:none;margin-left:10px")
                        el-tooltip(v-if="worldDialog.inCache" placement="top" :content="$t('dialog.world.actions.delete_cache_tooltip')" :disabled="hideTooltips")
                            el-button(icon="el-icon-delete" circle @click="deleteVRChatCache(worldDialog.ref)" :disabled="isGameRunning && worldDialog.cacheLocked")
                        el-tooltip(v-if="worldDialog.isFavorite" placement="top" :content="$t('dialog.world.actions.favorites_tooltip')" :disabled="hideTooltips")
                            el-button(type="default" icon="el-icon-star-on" circle @click="worldDialogCommand('Add Favorite')" style="margin-left:5px")
                        el-tooltip(v-else placement="top" :content="$t('dialog.world.actions.favorites_tooltip')" :disabled="hideTooltips")
                            el-button(type="default" icon="el-icon-star-off" circle @click="worldDialogCommand('Add Favorite')" style="margin-left:5px")
                        el-dropdown(trigger="click" @command="worldDialogCommand" size="small" style="margin-left:5px")
                            el-button(type="default" icon="el-icon-more" circle)
                            el-dropdown-menu(#default="dropdown")
                                el-dropdown-item(icon="el-icon-refresh" command="Refresh") {{ $t('dialog.world.actions.refresh') }}
                                el-dropdown-item(icon="el-icon-s-flag" command="New Instance" divided) {{ $t('dialog.world.actions.new_instance') }}
                                el-dropdown-item(icon="el-icon-message" command="New Instance and Self Invite") {{ $t('dialog.world.actions.new_instance_and_self_invite') }}
                                el-dropdown-item(v-if="API.currentUser.$homeLocation && API.currentUser.$homeLocation.worldId === worldDialog.id" icon="el-icon-magic-stick" command="Reset Home" divided) {{ $t('dialog.world.actions.reset_home') }}
                                el-dropdown-item(v-else icon="el-icon-s-home" command="Make Home" divided) {{ $t('dialog.world.actions.make_home') }}
                                el-dropdown-item(icon="el-icon-tickets" command="Previous Instances") {{ $t('dialog.world.actions.show_previous_instances') }}
                                template(v-if="API.currentUser.id !== worldDialog.ref.authorId")
                                    el-dropdown-item(icon="el-icon-picture-outline" command="Previous Images") {{ $t('dialog.world.actions.show_previous_images') }}
                                    el-dropdown-item(:disabled="!worldDialog.hasPersistData" icon="el-icon-upload" command="Delete Persistent Data") {{ $t('dialog.world.actions.delete_persistent_data') }}
                                template(v-else)
                                    el-dropdown-item(icon="el-icon-edit" command="Rename") {{ $t('dialog.world.actions.rename') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change Description") {{ $t('dialog.world.actions.change_description') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change Capacity") {{ $t('dialog.world.actions.change_capacity') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change Recommended Capacity") {{ $t('dialog.world.actions.change_recommended_capacity') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change YouTube Preview") {{ $t('dialog.world.actions.change_preview') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change Tags") {{ $t('dialog.world.actions.change_tags') }}
                                    el-dropdown-item(icon="el-icon-edit" command="Change Allowed Domains") {{ $t('dialog.world.actions.change_allowed_video_player_domains') }}
                                    el-dropdown-item(icon="el-icon-picture-outline" command="Change Image") {{ $t('dialog.world.actions.change_image') }}
                                    el-dropdown-item(v-if="worldDialog.ref.unityPackageUrl" icon="el-icon-download" command="Download Unity Package") {{ $t('dialog.world.actions.download_package') }}
                                    el-dropdown-item(v-if="worldDialog.ref.tags.includes('system_approved') || worldDialog.ref.tags.includes('system_labs')" icon="el-icon-view" command="Unpublish" divided) {{ $t('dialog.world.actions.unpublish') }}
                                    el-dropdown-item(v-else icon="el-icon-view" command="Publish" divided) {{ $t('dialog.world.actions.publish_to_labs') }}
                                    el-dropdown-item(:disabled="!worldDialog.hasPersistData" icon="el-icon-upload" command="Delete Persistent Data") {{ $t('dialog.world.actions.delete_persistent_data') }}
                                    el-dropdown-item(icon="el-icon-delete" command="Delete" style="color:#F56C6C") {{ $t('dialog.world.actions.delete') }}
            el-tabs
                el-tab-pane(:label="$t('dialog.world.instances.header')")
                    div.
                        #[i.el-icon-user] {{ $t('dialog.world.instances.public_count', { count: worldDialog.ref.publicOccupants }) }}
                        #[i.el-icon-user-solid(style="margin-left:10px")] {{ $t('dialog.world.instances.private_count', { count: worldDialog.ref.privateOccupants })  }}
                        #[i.el-icon-check(style="margin-left:10px")] {{ $t('dialog.world.instances.capacity_count', { count: worldDialog.ref.recommendedCapacity, max: worldDialog.ref.capacity }) }}
                    div(v-for="room in worldDialog.rooms" :key="room.id")
                        div(style="margin:5px 0")
                            location-world(:locationobject="room.$location" :currentuserid="API.currentUser.id" :worlddialogshortname="worldDialog.$location.shortName")
                            el-tooltip(placement="top" :content="$t('dialog.world.instances.self_invite_tooltip')" :disabled="hideTooltips")
                                invite-yourself(:location="room.$location.tag" :shortname="room.$location.shortName" style="margin-left:5px")
                            el-tooltip(placement="top" :content="$t('dialog.world.instances.refresh_instance_info')" :disabled="hideTooltips")
                                el-button(@click="refreshInstancePlayerCount(room.tag)" size="mini" icon="el-icon-refresh" style="margin-left:5px" circle)
                            last-join(:location="room.$location.tag" :currentlocation="lastLocation.location")
                            instance-info(:location="room.tag" :instance="room.ref" :friendcount="room.friendCount" :updateelement="updateInstanceInfo")
                        .x-friend-list(style="margin:10px 0;max-height:unset" v-if="room.$location.userId || room.users.length")
                            .x-friend-item(v-if="room.$location.userId" @click="showUserDialog(room.$location.userId)" class="x-friend-item-border")
                                template(v-if="room.$location.user")
                                    .avatar(:class="userStatusClass(room.$location.user)")
                                        img(v-lazy="userImage(room.$location.user)")
                                    .detail
                                        span.name(v-text="room.$location.user.displayName" :style="{'color':room.$location.user.$userColour}")
                                        span.extra {{ $t('dialog.world.instances.instance_creator') }}
                                span(v-else v-text="room.$location.userId")
                            .x-friend-item(v-for="user in room.users" :key="user.id" @click="showUserDialog(user.id)" class="x-friend-item-border")
                                .avatar(:class="userStatusClass(user)")
                                    img(v-lazy="userImage(user)")
                                .detail
                                    span.name(v-text="user.displayName" :style="{'color':user.$userColour}")
                                    span.extra(v-if="user.location === 'traveling'")
                                        i.el-icon-loading(style="margin-right:5px")
                                        timer(:epoch="user.$travelingToTime")
                                    span.extra(v-else)
                                        timer(:epoch="user.$location_at")
                el-tab-pane(:label="$t('dialog.world.info.header')")
                    .x-friend-list(style="max-height:none")
                        .x-friend-item(style="width:100%;cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.memo') }}
                                el-input.extra(v-model="worldDialog.memo" @change="onWorldMemoChange" type="textarea" :rows="2" :autosize="{ minRows: 1, maxRows: 20 }" :placeholder="$t('dialog.world.info.memo_placeholder')" size="mini" resize="none")
                        div(style="width:100%;display:flex")
                            .x-friend-item(style="width:100%;cursor:default")
                                .detail
                                    span.name {{ $t('dialog.world.info.id') }}
                                    span.extra {{ worldDialog.id }}
                                        el-tooltip(placement="top" :content="$t('dialog.world.info.id_tooltip')" :disabled="hideTooltips")
                                            el-dropdown(trigger="click" @click.native.stop size="mini" style="margin-left:5px")
                                                el-button(type="default" icon="el-icon-s-order" size="mini" circle)
                                                el-dropdown-menu(#default="dropdown")
                                                    el-dropdown-item(@click.native="copyWorldId(worldDialog.id)") {{ $t('dialog.world.info.copy_id') }}
                                                    el-dropdown-item(@click.native="copyWorldUrl(worldDialog.id)") {{ $t('dialog.world.info.copy_url') }}
                                                    el-dropdown-item(@click.native="copyWorldName(worldDialog.ref.name)") {{ $t('dialog.world.info.copy_name') }}
                            .x-friend-item(v-if="worldDialog.ref.previewYoutubeId" style="width:350px" @click="openExternalLink(`https://www.youtube.com/watch?v=${worldDialog.ref.previewYoutubeId}`)")
                                .detail
                                    span.name {{ $t('dialog.world.info.youtube_preview') }}
                                    span.extra https://www.youtube.com/watch?v={{ worldDialog.ref.previewYoutubeId }}
                        .x-friend-item(style="width:100%;cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.author_tags') }}
                                span.extra(v-if="worldDialog.ref.tags?.filter(tag => tag.startsWith('author_tag')).length > 0") {{ worldDialog.ref.tags.filter(tag => tag.startsWith('author_tag')).map(tag => tag.replace('author_tag_', '')).join(', ') }}
                                span.extra(v-else) -
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.players') }}
                                span.extra {{ worldDialog.ref.occupants | commaNumber }}
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.favorites') }}
                                span.extra {{ worldDialog.ref.favorites | commaNumber }}
                                    | #[template(v-if="worldDialog.ref.favorites > 0 && worldDialog.ref.visits > 0")  ({{ Math.round(((worldDialog.ref.favorites - worldDialog.ref.visits) / worldDialog.ref.visits * 100 + 100) * 100) / 100 }}%)]
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.visits') }}
                                span.extra {{ worldDialog.ref.visits | commaNumber }}
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.capacity') }}
                                span.extra {{ worldDialog.ref.recommendedCapacity | commaNumber }} ({{ worldDialog.ref.capacity | commaNumber }})
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.created_at') }}
                                span.extra {{ worldDialog.ref.created_at | formatDate('long') }}
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.last_updated') }}
                                span.extra(v-if="worldDialog.lastUpdated") {{ worldDialog.lastUpdated | formatDate('long') }}
                                span.extra(v-else) {{ worldDialog.ref.updated_at | formatDate('long') }}
                        .x-friend-item(v-if="worldDialog.ref.labsPublicationDate !== 'none'" style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.labs_publication_date') }}
                                span.extra {{ worldDialog.ref.labsPublicationDate | formatDate('long') }}
                        .x-friend-item(v-if="worldDialog.ref.publicationDate !== 'none'" style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.publication_date') }}
                                    el-tooltip(v-if="worldDialog.ref.publicationDate && worldDialog.ref.publicationDate !== 'none' && worldDialog.ref.labsPublicationDate && worldDialog.ref.labsPublicationDate !== 'none'" placement="top" style="margin-left:5px")
                                        template(#content)
                                            span {{ $t('dialog.world.info.time_in_labs') }} {{ timeToText(new Date(worldDialog.ref.publicationDate) - new Date(worldDialog.ref.labsPublicationDate)) }}
                                        i.el-icon-arrow-down
                                span.extra {{ worldDialog.ref.publicationDate | formatDate('long') }}
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.version') }}
                                span.extra(v-text="worldDialog.ref.version")
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.heat') }}
                                span.extra {{ worldDialog.ref.heat | commaNumber }} {{ '🔥'.repeat(worldDialog.ref.heat) }}
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.popularity') }}
                                span.extra {{ worldDialog.ref.popularity | commaNumber }} {{ '💖'.repeat(worldDialog.ref.popularity) }}
                        .x-friend-item(style="width:100%;cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.platform') }}
                                span.extra(v-text="worldDialogPlatform")
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.last_visited') }}
                                    el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.world.info.accuracy_notice')")
                                        i.el-icon-warning
                                span.extra {{ worldDialog.lastVisit | formatDate('long') }}
                        .x-friend-item(@click="showPreviousInstancesWorldDialog(worldDialog.ref)")
                            .detail
                                span.name {{ $t('dialog.world.info.visit_count') }}
                                    el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.world.info.accuracy_notice')")
                                        i.el-icon-warning
                                span.extra(v-text="worldDialog.visitCount")
                        .x-friend-item(style="cursor:default")
                            .detail
                                span.name {{ $t('dialog.world.info.time_spent') }}
                                    el-tooltip(v-if="!hideTooltips" placement="top" style="margin-left:5px" :content="$t('dialog.world.info.accuracy_notice')")
                                        i.el-icon-warning
                                span.extra(v-if="worldDialog.timeSpent === 0") -
                                span.extra(v-else) {{ timeToText(worldDialog.timeSpent) }}
                el-tab-pane(:label="$t('dialog.world.json.header')")
                    el-button(type="default" @click="refreshWorldDialogTreeData()" size="mini" icon="el-icon-refresh" circle)
                    el-button(type="default" @click="downloadAndSaveJson(worldDialog.id, worldDialog.ref)" size="mini" icon="el-icon-download" circle style="margin-left:5px")
                    el-tree(:data="worldDialog.treeData" style="margin-top:5px;font-size:12px")
                        template(#default="scope")
                            span
                                span(v-text="scope.data.key" style="font-weight:bold;margin-right:5px")
                                span(v-if="!scope.data.children" v-text="scope.data.value")

    //- dialog: change Allowed Video Player Domains
    el-dialog.x-dialog(:before-close="beforeDialogClose" @mousedown.native="dialogMouseDown" @mouseup.native="dialogMouseUp" ref="worldAllowedDomainsDialog" :visible.sync="worldAllowedDomainsDialog.visible" :title="$t('dialog.allowed_video_player_domains.header')" width="600px")
        div(v-loading="bioDialog.loading")
            el-input(v-for="(domain, index) in worldAllowedDomainsDialog.urlList" :key="index" :value="domain" v-model="worldAllowedDomainsDialog.urlList[index]" size="small" style="margin-top:5px")
                el-button(slot="append" icon="el-icon-delete" @click="worldAllowedDomainsDialog.urlList.splice(index, 1)")
            el-button(@click="worldAllowedDomainsDialog.urlList.push('')" size="mini" style="margin-top:5px") {{ $t('dialog.allowed_video_player_domains.add_domain') }}
        template(#footer)
            el-button(type="primary" size="small" :disabled="!worldAllowedDomainsDialog.worldId" @click="saveWorldAllowedDomains") {{ $t('dialog.allowed_video_player_domains.save') }}