diff --git a/RELEASE.md b/RELEASE.md
index de55270..344adcd 100644
--- a/RELEASE.md
+++ b/RELEASE.md
@@ -1,5 +1,5 @@
-## v0.3.13 - in progress - updated 2023-05-21
+## v0.3.14 - in progress - updated 2023-12-16
### platform
* [done] improve API integration with galaxies [v0.3.1]
* [done] document multiverse API integration [starpeace-server-multiverse-api]
@@ -32,9 +32,9 @@
* [done] bookmarks manage and performance fixes [v0.3.11]
* [done] tycoon details API [v0.3.12]
* [done] fixed galaxy and research menu bugs [v0.3.13]
-* [in progress] building inspect API [v0.3.13]
-* [in progress] improve auth and remember me token and error handling
-* [pending] player, building, and planet event handling
+* [done] building inspect API [v0.3.13]
+* [done] player and building event handling [v0.3.13]
+* [in progress] admin API [v0.3.14]
### assets
* [done] finish initial language translation for assets [v0.3.1]
@@ -47,6 +47,7 @@
* [done] building sign assets [v0.3.5]
* [done] headquarters requirements for research per seal [v0.3.5]
* [done] fixing building foundation configurations [v0.3.6]
+* [in progress] fix blur in created sprite spreets [v0.3.14]
### gameplay
* [done] update UI and menus for better concept of universes and galaxies [v0.3.1]
@@ -69,6 +70,7 @@
* [done] onscreen building text rendering on selection [v0.3.10]
* [done] construction descriptions for commerce, real estate, and services [v0.3.10]
* [done] tycoon details menu [v0.3.12]
-* [in progress] building inspect menu [v0.3.13]
-* [pending] city-specific ribbon ticker updates
-* [pending] integrate player and planet events with news ticker
+* [done] building inspect menu [v0.3.13]
+* [done] selected building text for IFEL buildings [v0.3.13]
+* [done] cashflow and construction included in selected building text [v0.3.13]
+* [done] integrate building events with news ticker [v0.3.13]
diff --git a/ROADMAP.md b/ROADMAP.md
index eea3b8a..4ef0590 100644
--- a/ROADMAP.md
+++ b/ROADMAP.md
@@ -4,6 +4,7 @@ Some of the tentative future features and rough planned version are outlined bel
## v0.5
### platform
+* [pending] improve auth and remember me token and error handling
* [pending] minimum distance between buildings (statue and tower)
* [pending] manage city zones API integration
* [pending] follow tycoon support
@@ -19,6 +20,9 @@ Some of the tentative future features and rough planned version are outlined bel
* [pending] tycoon company rename and disolve API
* [pending] tycoon initial suppliers and IFEL products API
* [pending] tycoon strategy API
+* [pending] inspect menu trade settings
+* [pending] fix construction hover image z-order
+* [pending] improve building metadata and details events in inspect menu
### assets
* [pending] car assets
@@ -26,6 +30,7 @@ Some of the tentative future features and rough planned version are outlined bel
* [pending] dedicated research buildings per category and seal
### gameplay
+* [pending] city-specific ribbon ticker updates
* [pending] building stage support (timber, movies, farms)
* [pending] limit seals unless required level or nobility
* [pending] road proximity building construction rules
@@ -51,15 +56,13 @@ Some of the tentative future features and rough planned version are outlined bel
* [pending] building negative-income tinting rendering
* [pending] fixed table headers (inspect menus)
* [pending] mayor townhall management (min wage)
-* [pending] building connect action support
* [pending] planet capital and president politics inspect menu
* [pending] improve townhall population label translations in inspect menu
* [pending] improve products select in inspect menu (control and shift clicking)
* [pending] construction descriptions for civics
* [pending] add prestige to construction descriptions
-* [pending] selected building text for warehouses
-* [pending] selected building text for IFEL buildings
-* [pending] cashflow and status included in selected building text
* [pending] footer menu company scroll support
* [pending] tycoon details loans apply and repay
* [pending] tycoon details corporation and company P&L
+* [pending] advanced status included in selected building text
+* [pending] selected building text for warehouses
diff --git a/assets/stylesheets/starpeace-bulma.sass b/assets/stylesheets/starpeace-bulma.sass
index 8bc77d6..6438c6b 100644
--- a/assets/stylesheets/starpeace-bulma.sass
+++ b/assets/stylesheets/starpeace-bulma.sass
@@ -1,4 +1,13 @@
+@import 'bulma/sass/utilities/_all'
+@import 'bulma/sass/base/_all'
+@import 'bulma/sass/elements/_all'
+@import 'bulma/sass/form/_all'
+@import 'bulma/sass/components/_all'
+@import 'bulma/sass/grid/_all'
+@import 'bulma/sass/helpers/_all'
+@import 'bulma/sass/layout/_all'
+
@import '~/assets/stylesheets/starpeace-variables'
html
@@ -68,7 +77,7 @@ html
&:before,
&:after
- content: ""
+ content: ''
position: absolute
background-image: -webkit-linear-gradient($sp-card-border-top, $sp-card-border-bottom)
background-image: -moz-linear-gradient($sp-card-border-top, $sp-card-border-bottom)
@@ -176,7 +185,7 @@ html
&:before,
&:after
- content: ""
+ content: ''
position: absolute
bottom: 0
top: 0
diff --git a/assets/stylesheets/starpeace-inspect.sass b/assets/stylesheets/starpeace-inspect.sass
index d818d1d..5bbea20 100644
--- a/assets/stylesheets/starpeace-inspect.sass
+++ b/assets/stylesheets/starpeace-inspect.sass
@@ -10,18 +10,33 @@
top: calc(40% - 4rem)
width: 8rem
+.loading-image-inline
+ background-size: 1.25rem
+ height: 1.25rem
+ width: 1.25rem
+
.sp-slider
- display: inline-flex
+ display: flex
+
+ input[type="range" i]
+ accent-color: $sp-primary
+ color: $sp-primary
+ width: 100%
span
margin-left: .5rem
.basic-table
+ tr
+ &:not(:last-child)
+ th,
+ td
+ border-bottom: 1px solid $sp-dark-bg
+
th,
td
- border-bottom: 1px solid $sp-dark-bg
vertical-align: middle
&:not(:first-child)
@@ -75,16 +90,23 @@
border-bottom-color: $sp-dark-bg
color: #fff
+ &:not(:first-child)
+ a
+ border-left: 1px solid $sp-dark-bg
+ border-right: 1px solid $sp-dark-bg
+
a
border-bottom-color: $sp-primary-bg
color: $sp-primary
letter-spacing: .05rem
+ padding: .5rem 1.5rem
text-transform: uppercase
&:active,
&:hover
background-color: $sp-primary-bg
border-bottom-color: $sp-primary-bg
+ border-color: $sp-primary-bg
color: #fff
.inspect-body
@@ -93,13 +115,38 @@
position: relative
overflow: hidden
- .column
- &.extra-padding-left
- padding-left: 2rem
-
- &.extra-padding-right
- padding-right: 2rem
-
.button
letter-spacing: .1rem
text-transform: uppercase
+
+.sp-sub-tabs
+ direction: rtl
+ overflow-y: auto
+
+ .sp-tabs-menu
+ direction: ltr
+
+ ul
+ flex-direction: column
+
+ li
+ display: flex
+ justify-content: flex-end
+ text-align: right
+
+ a
+ border-radius: 0
+ color: $sp-primary
+ letter-spacing: .05rem
+ text-transform: uppercase
+
+ &:hover
+ color: $sp-light
+
+ &:active
+ color: lighten($sp-light, 10%)
+
+ &.is-active
+ a
+ background-color: $sp-dark-bg
+ color: #fff
\ No newline at end of file
diff --git a/assets/stylesheets/starpeace.sass b/assets/stylesheets/starpeace.sass
index f753340..43dad29 100644
--- a/assets/stylesheets/starpeace.sass
+++ b/assets/stylesheets/starpeace.sass
@@ -95,6 +95,26 @@ h3
border-radius: 9999em
box-shadow: rgba(255, 255, 255, 0.25) 0 0 1px 0 inset
+.sp-select
+ &::after
+ border-color: $sp-primary !important
+
+ select
+ background-color: $sp-dark-bg
+ border: 1px solid $sp-dark
+ color: $sp-light
+ outline: none !important
+
+ &:focus,
+ &:hover
+ outline: none !important
+ border: 1px solid $sp-dark
+
+ option
+ background-color: $sp-dark-bg
+ color: $sp-primary
+
+
.sp-profile
.profile-container
padding-bottom: 150%
@@ -123,11 +143,29 @@ h3
color: darken($sp-primary, 5%)
font-size: .7rem
letter-spacing: 0.05rem
+ position: relative
text-transform: uppercase
+
.sp-kv-value
color: #ddd
font-size: 1.1rem
margin-left: .5rem
+ position: relative
+
+ &.centered
+ vertical-align: middle
+
+
+.sp-has-dark-background
+ background-color: $sp-dark-bg
+
+
+.sp-notification
+ &.is-warning
+ background-color: $sp-light-bg
+ color: #FFF
+
+
// remove border around research tree component
.vis-network
diff --git a/buildspec.yml b/buildspec.yml
index c0e3a75..cd715b5 100644
--- a/buildspec.yml
+++ b/buildspec.yml
@@ -7,7 +7,6 @@ phases:
commands:
- echo Entered the install phase...
- npm update -g npm
- - npm install -g grunt-cli
pre_build:
commands:
diff --git a/components/application-desktop.vue b/components/application-desktop.vue
index 851b305..72c71ac 100644
--- a/components/application-desktop.vue
+++ b/components/application-desktop.vue
@@ -24,7 +24,7 @@ client-only
menu-help(v-show="is_menu_visible('help')" :client_state='client_state')
menu-rankings-main-menu(v-show="is_menu_visible('rankings')" :ajax_state='ajax_state' :client_state='client_state')
menu-release-notes(v-show="is_menu_visible('release_notes')" :client_state='client_state')
- menu-research-main-menu(v-show="is_menu_visible('research')" :ajax_state='ajax_state' :client_state='client_state')
+ menu-research-main-menu(v-show="is_menu_visible('research')" :client-state='client_state')
menu-galaxy-menu(v-show="is_menu_visible('galaxy')" :ajax_state='ajax_state' :client_state='client_state')
menu-town-search-main-menu(v-show="is_menu_visible('town_search')" :client_state='client_state')
menu-tycoon-details-main-menu(v-show="is_menu_visible('tycoon')" :client_state='client_state')
@@ -37,7 +37,7 @@ client-only
toolbar-overlay(:client_state='client_state')
toolbar-minimap(:client_state='client_state')
toolbar-ribbon(:client_state='client_state')
- toolbar-inspect(:ajax_state='ajax_state' :client_state='client_state')
+ toolbar-inspect(:client-state='client_state')
toolbar-menubar(:ajax_state='ajax_state' :client_state='client_state')
toolbar-details(:ajax_state='ajax_state' :client_state='client_state')
@@ -48,7 +48,7 @@ client-only
+
+
diff --git a/components/menu/construction/industry-category-controls.vue b/components/menu/construction/industry-category-controls.vue
new file mode 100644
index 0000000..2d21502
--- /dev/null
+++ b/components/menu/construction/industry-category-controls.vue
@@ -0,0 +1,100 @@
+
+aside.sp-menu-overall.sp-scrollbar
+ .tile.is-ancestor
+ .tile.is-6.is-vertical.is-parent
+ .tile.is-child(v-for='categoryId in lhsCategories')
+ a.construction-toggle(@click.stop.prevent='selectCategoryId(categoryId)' :class="{'disabled': !companyBuildingsByCategoryId[categoryId]}")
+ misc-industry-category-icon(:category='categoryId')
+ span.toggle-label {{ $industryCategoryLabel(categoryId) }}
+ .disabled-overlay
+
+ .tile.is-6.is-vertical.is-parent
+ .tile.is-child(v-for='categoryId in rhsCategories')
+ a.construction-toggle(@click.stop.prevent='selectCategoryId(categoryId)' :class="{'disabled': !companyBuildingsByCategoryId[categoryId]}")
+ misc-industry-category-icon(:category='categoryId')
+ span.toggle-label {{ $industryCategoryLabel(categoryId) }}
+ .disabled-overlay
+
+
+
+
+
diff --git a/components/menu/construction/main-menu.vue b/components/menu/construction/main-menu.vue
index cc2d93d..3d85b00 100644
--- a/components/menu/construction/main-menu.vue
+++ b/components/menu/construction/main-menu.vue
@@ -5,236 +5,210 @@
.card-header-icon.card-close(@click.stop.prevent="client_state.menu.toggle_menu('construction')")
font-awesome-icon(:icon="['fas', 'times']")
- .card-content.sp-menu-background.overall-container
- .field.filter-input-container
- .control.has-icons-left.is-expanded
- input.input(type="text", placeholder="Filter")
- span.icon.is-left
- font-awesome-icon(:icon="['fas', 'search-location']")
- nav.breadcrumb.is-medium.menu-breadcrumb
- ul
- li(:class='root_breadcrumb_class')
- a(@click.stop.prevent='select_root_breadcrumb')
- template(v-if='company_seal_id')
- span.icon.is-small
- misc-company-seal-icon.company-seal(:seal_id="company_seal_id")
- span {{company_seal_name}}
- template(v-else-if='true')
- span.icon.is-small
- font-awesome-icon.tycoon-icon(:icon="['fas', 'user-secret']")
- span {{$translate('identity.visitor')}}
- template(v-if='selected_menu_industry_category_id')
- li.is-active
- a.construction-breadcrumb-item
- span {{text_for_category(selected_menu_industry_category_id)}}
+ .card-content.sp-menu-background.overall-container
#construction-image-pending(ref="pendingContainer")
#construction-image-webgl-container(ref="previewContainer")
- aside.sp-menu-category.sp-scrollbar(v-if="has_selected_menu_category")
- template(v-for="info in sort_buildings(buildings_for_company_by_category[selected_menu_industry_category_id])")
- a.is-building-item(@click.stop.prevent="toggle_building(info)" :class="{'active': selected_building_id == info.id}")
- misc-industry-type-icon(:industry_type="info.industry_type_id" small)
- span.is-building-label {{building_name(info)}}
- .construction-disabled(v-show="!can_construct_building(info)")
-
- a.construct-action(@click.stop.prevent="select_building(info)" :disabled='!can_construct_building(info)')
- .tile.is-ancestor.is-item-details(v-show="selected_building_id == info.id")
- .tile.is-parent.is-vertical
- .tile.is-parent.is-item-details-top
- article.tile.is-child.is-7(:ref="'previewItem.' + info.id")
- article.tile.is-child
- .building-cost
- misc-money-text(:value='building_cost(info.id)', no_styling=true, as_thousands=true)
- .building-size {{building_size(info)}}m²
- .tile.is-parent.is-item-details-bottom
- article.tile.is-child
- .building-description {{building_description(info)}}
- .building-research(v-show="info.required_invention_ids.length")
- span.research-label {{$translate('ui.menu.construction.requires')}}:
- template(v-for='id,index in info.required_invention_ids')
- template(v-if='is_invention_completed(id)')
- span.research-completed {{invention_name(id)}}
- template(v-else)
- a.research-pending(@click.stop.prevent='select_invention(id)') {{invention_name(id)}}
- span.research-separator(v-if="index < info.required_invention_ids.length - 1") {{separator_label_for_index(index, info.required_invention_ids.length)}}
- button.button.is-fullwidth.is-starpeace.construct-button(@click.stop.prevent="select_building(info)", :disabled='!can_construct_building(info)') {{$translate('ui.menu.construction.construct_building')}}
-
- aside.sp-menu-overall.sp-scrollbar(v-else)
- .tile.is-ancestor.construction-items
- .tile.is-6.is-vertical.is-parent
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('SERVICE')" :class="{'disabled': !category_has_buildings('SERVICE')}")
- misc-industry-category-icon(category='SERVICE')
- span.toggle-label {{text_for_category('SERVICE')}}
- .disabled-overlay
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('INDUSTRY')" :class="{'disabled': !category_has_buildings('INDUSTRY')}")
- misc-industry-category-icon(category='INDUSTRY')
- span.toggle-label {{text_for_category('INDUSTRY')}}
- .disabled-overlay
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('LOGISTICS')" :class="{'disabled': !category_has_buildings('LOGISTICS')}")
- misc-industry-category-icon(category='LOGISTICS')
- span.toggle-label {{text_for_category('LOGISTICS')}}
- .disabled-overlay
- .tile.is-6.is-vertical.is-parent
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('CIVIC')" :class="{'disabled': !category_has_buildings('CIVIC')}")
- misc-industry-category-icon(category='CIVIC')
- span.toggle-label {{text_for_category('CIVIC')}}
- .disabled-overlay
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('COMMERCE')" :class="{'disabled': !category_has_buildings('COMMERCE')}")
- misc-industry-category-icon(category='COMMERCE')
- span.toggle-label {{text_for_category('COMMERCE')}}
- .disabled-overlay
- .tile.is-child
- a.construction-toggle(@click.stop.prevent="select_category('REAL_ESTATE')" :class="{'disabled': !category_has_buildings('REAL_ESTATE')}")
- misc-industry-category-icon(category='REAL_ESTATE')
- span.toggle-label {{text_for_category('REAL_ESTATE')}}
- .disabled-overlay
-
- #no-company-modal.modal-background(v-show='has_no_company')
+ template(v-if='isTycoon && companyId && !company || companyPromise')
+ .sp-loading.is-flex.is-align-items-center.is-justify-content-center
+ img.starpeace-logo
+
+ template(v-else)
+ .field.filter-input-container
+ .control.has-icons-left.is-expanded
+ input.input(type="text", placeholder="Filter")
+ span.icon.is-left
+ font-awesome-icon(:icon="['fas', 'search-location']")
+ nav.breadcrumb.is-medium.menu-breadcrumb
+ ul
+ li(:class="{'is-active': !selectedIndustryCategoryId}")
+ a(@click.stop.prevent='selectRootBreadcrumb')
+ template(v-if='companySealId')
+ span.icon.is-small
+ misc-company-seal-icon.company-seal(:seal_id="companySealId")
+ span {{ $companySealShortLabel(companySealId) }}
+ template(v-else)
+ span.icon.is-small
+ font-awesome-icon.tycoon-icon(:icon="['fas', 'user-secret']")
+ span {{$translate('identity.visitor')}}
+
+ template(v-if='selectedIndustryCategoryId')
+ li.is-active
+ a.construction-breadcrumb-item
+ span {{ $industryCategoryLabel(selectedIndustryCategoryId) }}
+
+ template(v-if="selectedIndustryCategoryId")
+ menu-construction-industry-category-construct(
+ :client-state='client_state'
+ :company='company'
+ :company-buildings-by-category-id='companyBuildingsByCategoryId'
+ :selected-industry-category-id='selectedIndustryCategoryId'
+ @select='selectDefinitionId'
+ )
+
+ template(v-else)
+ menu-construction-industry-category-controls(
+ :client-state='client_state'
+ :company='company'
+ :company-buildings-by-category-id='companyBuildingsByCategoryId'
+ @select='selectCategoryId'
+ )
+
+ #no-company-modal.modal-background(v-if='hasNoCompany')
.content
span {{$translate('ui.menu.construction.company_required.label')}}
- a(@click.stop.prevent='toggle_form_company_menu') {{$translate('ui.menu.construction.company_required.action')}}
+ a(@click.stop.prevent='toggleFormCompanyMenu') {{$translate('ui.menu.construction.company_required.action')}}
@@ -242,6 +216,18 @@ export default {
diff --git a/components/menu/research/details.vue b/components/menu/research/details.vue
index a87e5e9..e7252c7 100644
--- a/components/menu/research/details.vue
+++ b/components/menu/research/details.vue
@@ -1,116 +1,160 @@
.research-container
- .invention-details(v-if="selected_invention != null")
- .invention-selected-details
- .invention-name {{$translate(invention_name)}}
- .invention-description {{$translate(invention_description)}}
+ .is-flex.is-flex-direction-column.p-3.invention-details(v-if='selectedInvention')
+ .is-flex-grow-0.invention-selected-details
+ .invention-name
+ span(v-if='selectedInvention') {{ $translate(selectedInvention.name) }}
+ .invention-description
+ span(v-if='selectedInvention') {{ $translate(selectedInvention.description) }}
.invention-cost
- span.sp-kv-key {{$translate('ui.menu.research.cost.label')}}:
- span.cost-value {{invention_cost}}
- .invention-level(v-if="invention_level_label != null")
- span.sp-kv-key {{$translate('ui.menu.research.level.label')}}:
- span.level-value {{$translate(invention_level_label)}}
+ span.sp-kv-key {{ $translate('ui.menu.research.cost.label') }}:
+ span.cost-value {{ $format_money(inventionCost) }}
+ .invention-level(v-if='inventionLevel && inventionLevel.label')
+ span.sp-kv-key {{ $translate('ui.menu.research.level.label') }}:
+ span.level-value {{ $translate(inventionLevel.label) }}
.invention-requires.is-flex
- span.sp-kv-key.mt-2 {{$translate('ui.menu.research.requires.label')}}:
+ span.sp-kv-key.mt-2 {{ $translate('ui.menu.research.requires.label') }}:
span.is-inline-flex.is-flex-direction-column.ml-3
- span.none-value(v-if="invention_requires.length == 0") {{$translate('ui.menu.research.none.label')}}
+ span.none-value(v-if="inventionRequires.length == 0") {{ $translate('ui.menu.research.none.label') }}
ul.inventions
- li(v-for='option in sort_inventions(invention_requires)')
- a(@click.stop.prevent="select_invention(option.id)") {{$translate(option.name)}}
+ li(v-for='option in inventionRequires')
+ a(@click.stop.prevent='selectInvention(option.id)') {{ $translate(option.name) }}
.invention-allows.is-flex
- span.sp-kv-key.mt-2 {{$translate('ui.menu.research.allows.label')}}:
+ span.sp-kv-key.mt-2 {{ $translate('ui.menu.research.allows.label') }}:
span.is-inline-flex.is-flex-direction-column.ml-3
- span.none-value(v-if="invention_allows.length == 0") {{$translate('ui.menu.research.none.label')}}
+ span.none-value(v-if="inventionAllows.length == 0") {{ $translate('ui.menu.research.none.label') }}
ul.inventions
- li(v-for='option in sort_inventions(invention_allows).slice(0, 3)')
- a(@click.stop.prevent="select_invention(option.id)") {{$translate(option.name)}}
- li(v-if='invention_allows.length > 5') {{invention_allows.length - 3}} {{$translate('ui.menu.research.others.label')}}
- li(v-else-if='invention_allows.length > 4') 1 {{$translate('ui.menu.research.other.label')}}
-
- .invention-properties.inverse-card(v-if='invention_properties.length')
- ul.inventions
- li(v-for='option in invention_properties')
- span.property-label(:class='option.class') {{option.type}}:
- span.property-value(:class='option.class') {{option.text_parts[0]}}{{option.text_parts[1]}}{{option.text_parts[2]}}
- div.is-clearfix
-
- .actions-container(v-if="invention_status != 'NONE'")
+ li(v-for='option in inventionAllowsTruncated')
+ a(@click.stop.prevent='selectInvention(option.id)') {{ $translate(option.name) }}
+ li(v-if='inventionAllows.length > 5') {{ inventionAllows.length - 3 }} {{ $translate('ui.menu.research.others.label') }}
+ li(v-else-if='inventionAllows.length > 4') 1 {{ $translate('ui.menu.research.other.label') }}
+
+ .is-flex-grow-1.mt-2.inverse-card.sp-scrollbar.p-3.invention-properties(v-if='inventionProperties.length')
+ ul.inventions
+ li(v-for='option in inventionProperties')
+ span.property-label(:class='option.class') {{ option.type }}:
+ span.property-value(:class='option.class') {{ option.text_parts[0] }}{{ option.text_parts[1] }}{{ option.text_parts[2] }}
+ div.is-clearfix
+
+ .is-flex-grow-0.mt-2.actions-container(v-if="inventionStatus != 'NONE'")
.action-row.invention-status
span.sp-kv-key {{$translate('ui.menu.research.status.label')}}:
- span.invention-status-value.available(v-if="invention_status == 'AVAILABLE'") {{$translate('ui.menu.research.details.status.available')}}
- span.invention-status-value.blocked(v-else-if="invention_status == 'AVAILABLE_BUILDING'") {{$translate(first_allowing_building_name)}} {{$translate('ui.menu.research.details.status.building_required')}}
- span.invention-status-value.blocked(v-else-if="invention_status == 'AVAILABLE_LEVEL'") {{$translate('ui.menu.research.details.status.level_required')}}
- span.invention-status-value.blocked(v-else-if="invention_status == 'AVAILABLE_BLOCKED'") {{$translate('ui.menu.research.details.status.dependencies_required')}}
- span.invention-status-value.pending(v-else-if="invention_status == 'PENDING'")
- span(v-if="selected_invention_active") {{$translate('ui.menu.research.details.status.in_progress')}}
- span(v-else-if="selected_invention_pending") {{$translate('ui.menu.research.details.status.queued')}}
- span(v-if="selected_invention_progress > 0 && selected_invention_progress < 100")
+ span.invention-status-value.available(v-if="inventionStatus == 'AVAILABLE'") {{ $translate('ui.menu.research.details.status.available') }}
+ span.invention-status-value.blocked(v-else-if="inventionStatus == 'AVAILABLE_BUILDING'") {{ $translate(first_allowing_building_name) }} {{ $translate('ui.menu.research.details.status.building_required') }}
+ span.invention-status-value.blocked(v-else-if="inventionStatus == 'AVAILABLE_LEVEL'") {{ $translate('ui.menu.research.details.status.level_required') }}
+ span.invention-status-value.blocked(v-else-if="inventionStatus == 'AVAILABLE_BLOCKED'") {{ $translate('ui.menu.research.details.status.dependencies_required') }}
+ span.invention-status-value.pending(v-else-if="inventionStatus == 'PENDING'")
+ span(v-if="selectedInventionActive") {{ $translate('ui.menu.research.details.status.in_progress') }}
+ span(v-else-if="selectedInventionPending") {{ $translate('ui.menu.research.details.status.queued') }}
+ span(v-if="selectedInventionProgress > 0 && !(selectedInventionProgress >= 100)")
|
- | - {{selected_invention_progress}}%
- span.invention-status-value.completed(v-else-if="invention_status == 'COMPLETED' || invention_status == 'COMPLETED_SUPPORT'") {{$translate('ui.menu.research.details.status.completed')}}
+ | - {{selectedInventionProgress}}%
+ span.invention-status-value.completed(v-else-if="inventionStatus == 'COMPLETED' || inventionStatus == 'COMPLETED_SUPPORT'") {{ $translate('ui.menu.research.details.status.completed') }}
.action-row
- button.button.is-fullwidth.is-starpeace(v-if="invention_status == 'AVAILABLE'" @click.stop.prevent='queue_invention' :disabled='actions_disabled') {{$translate('ui.menu.research.actions.start.label')}}
- button.button.is-fullwidth.is-starpeace(v-else-if="invention_status == 'AVAILABLE_BUILDING' || invention_status == 'AVAILABLE_LEVEL' || invention_status == 'AVAILABLE_BLOCKED'", disabled=true) {{$translate('ui.menu.research.actions.start.label')}}
- button.button.is-fullwidth.is-starpeace(v-else-if="invention_status == 'PENDING'" @click.stop.prevent='sell_invention' :disabled='actions_disabled') {{$translate('ui.menu.research.actions.cancel.label')}}
- button.button.is-fullwidth.is-starpeace(v-else-if="invention_status == 'COMPLETED'" @click.stop.prevent='sell_invention' :disabled='actions_disabled') {{$translate('ui.menu.research.actions.sell.label')}}
- button.button.is-fullwidth.is-starpeace(v-else-if="invention_status == 'COMPLETED_SUPPORT'" disabled=true) {{$translate('ui.menu.research.actions.sell.label')}}
+ button.button.is-fullwidth.is-starpeace(v-if="inventionStatus == 'AVAILABLE'" @click.stop.prevent='queueInvention' :disabled='actionsDisabled') {{ $translate('ui.menu.research.actions.start.label') }}
+ button.button.is-fullwidth.is-starpeace(v-else-if="inventionStatus == 'AVAILABLE_BUILDING' || inventionStatus == 'AVAILABLE_LEVEL' || inventionStatus == 'AVAILABLE_BLOCKED'" disabled) {{ $translate('ui.menu.research.actions.start.label') }}
+ button.button.is-fullwidth.is-starpeace(v-else-if="inventionStatus == 'PENDING'" @click.stop.prevent='sellInvention' :disabled='actionsDisabled') {{ $translate('ui.menu.research.actions.cancel.label') }}
+ button.button.is-fullwidth.is-starpeace(v-else-if="inventionStatus == 'COMPLETED'" @click.stop.prevent='sellInvention' :disabled='actionsDisabled') {{ $translate('ui.menu.research.actions.sell.label') }}
+ button.button.is-fullwidth.is-starpeace(v-else-if="inventionStatus == 'COMPLETED_SUPPORT'" disabled) {{ $translate('ui.menu.research.actions.sell.label') }}
+
+
diff --git a/components/misc/resource-price-slider.vue b/components/misc/resource-price-slider.vue
new file mode 100644
index 0000000..6c4863a
--- /dev/null
+++ b/components/misc/resource-price-slider.vue
@@ -0,0 +1,78 @@
+
+.sp-slider
+ input(
+ type='range'
+ :list='markerValues.length ? listId : undefined'
+ :min='min'
+ :max='max'
+ :step='step'
+ :disabled='!!disabled'
+ v-model='priceBasisPoints'
+ @change.stop="$emit('change', asPrice(priceBasisPoints))"
+ )
+
+ template(v-if='markerValues.length')
+ datalist(:id='listId')
+ option(v-for='value in markerValues' :value='value')
+
+
+
+
+
diff --git a/components/misc/system-message-panel.vue b/components/misc/system-message-panel.vue
index b77bc4f..0300209 100644
--- a/components/misc/system-message-panel.vue
+++ b/components/misc/system-message-panel.vue
@@ -7,8 +7,7 @@
diff --git a/components/toolbar/inspect/shared/tab-history.vue b/components/toolbar/inspect/shared/tab-history.vue
new file mode 100644
index 0000000..0049bf1
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-history.vue
@@ -0,0 +1,47 @@
+
+.columns.is-marginless.history-tab
+ .column.is-narrow.is-paddingless.p-4
+ span.is-italic {{ $translate('toolbar.inspect.history.label.pending') }}
+
+
+
+
+
+
diff --git a/components/toolbar/inspect/shared/tab-jobs.vue b/components/toolbar/inspect/shared/tab-jobs.vue
index 06d73bc..d8a7c23 100644
--- a/components/toolbar/inspect/shared/tab-jobs.vue
+++ b/components/toolbar/inspect/shared/tab-jobs.vue
@@ -1,183 +1,96 @@
.jobs-tab.columns.is-marginless
- .column.is-narrow.is-paddingless
+ .column.is-narrow.is-paddingless.p-3
table.basic-table
thead
tr
th
- th.has-text-right.sp-kv-key(v-for='typeId in laborResourceIds') {{resourceTypeLabel(typeId)}}
+ th.has-text-right.sp-kv-key(v-for='job in jobs') {{ $resourceTypeLabel(job.resourceId) }}
tbody
tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.vacancies')}}
- td.has-text-right.sp-kv-value(v-for='typeId in laborResourceIds')
+ td.sp-kv-key {{$translate('toolbar.inspect.jobs.label.workers')}}
+ td.has-text-right.sp-kv-value(v-for='job in jobs') {{job.mostRecentVelocity}} / {{job.maxVelocity}}
tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.spending_power')}}
- td.has-text-right.sp-kv-value(v-for='typeId in laborResourceIds')
+ td.sp-kv-key {{$translate('toolbar.inspect.jobs.label.quality')}}
+ td.has-text-right.sp-kv-value(v-for='job in jobs') {{$formatPercent(0)}}
tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.average_wage')}}
- td.has-text-right.sp-kv-value(v-for='typeId in laborResourceIds')
- tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.minimum_wage')}}
- td.has-text-right.sp-kv-value(v-for='typeId in laborResourceIds')
- .sp-slider
- input(type='range' min='0' max='200' value='100' disabled)
- span {{$format_percent(0)}}
+ td.sp-kv-key {{$translate('toolbar.inspect.jobs.label.salary')}}
+ td.has-text-right.sp-kv-value(v-for='job in jobs')
+ div
+ span {{$format_money(job.price)}}
+ span.ml-1 ({{ $formatPercent(job.price, $resourceTypePrice(job.resourceId)) }})
+ misc-resource-price-slider(
+ :markers='[0, 100, 250]'
+ :min='0'
+ :max='250'
+ :resource-id='job.resourceId'
+ :price='job.price'
+ :disabled='!canManage'
+ @update='updateSalary(job.resourceId, $event)'
+ @change='debouncedUpdateBuildingSalary(building.id, job.resourceId, $event)'
+ )
diff --git a/components/toolbar/inspect/shared/tab-management.vue b/components/toolbar/inspect/shared/tab-management.vue
new file mode 100644
index 0000000..b7f53dc
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-management.vue
@@ -0,0 +1,296 @@
+
+.columns.is-marginless.management-tab
+ .column.is-narrow.is-paddingless.p-3.mr-3.column-allow-clone(v-if='manageOptionsBuilding.length')
+ .is-flex.is-flex-direction-row
+ misc-toggle-option(:disabled='!canManage' :value='buildingDetails.allowIncomingSettings' @toggle='toggleAllowIncoming')
+ span.ml-2.toggle-label(:class="{'selected-toggle': buildingDetails.allowIncomingSettings, 'is-clickable': canManage, 'is-disabled': !canManage}" @click.stop.prevent='toggleAllowIncoming') {{ $translate('toolbar.inspect.management.label.incoming') }}
+
+ div.mt-5
+ span(v-if='buildingDetails.allowIncomingSettings') {{ $translate('toolbar.inspect.management.label.incoming.allow') }}
+ span(v-else) {{ $translate('toolbar.inspect.management.label.incoming.block') }}
+
+
+ .column.is-narrow.is-paddingless.is-flex.is-flex-direction-row.p-3.mr-5.column-clone(v-if='manageOptionsBuilding.length')
+ .is-relative.is-flex.is-flex-direction-column.is-clipped
+ .is-flex-grow-0.sp-kv-key.mb-2 {{ $translate('toolbar.inspect.management.label.clone') }}:
+
+ .is-flex-grow-1.is-relative.pr-2.sp-scrollbar.clone-options
+ .is-flex.is-flex-direction-row(v-for='option in manageOptionsAll')
+ misc-toggle-option(:disabled='!canManage' :value='cloneOptions[option.id]' @toggle='toggleCloneOption(option.id)')
+ span.ml-2.toggle-label(:class="{'selected-toggle': cloneOptions[option.id], 'is-clickable': canManage, 'is-disabled': !canManage}" @click.stop.prevent='toggleCloneOption(option.id)') {{ $translate(option.label) }}
+
+ div.ml-5.clone-action
+ button.button.is-fullwidth.is-starpeace(:disabled='!canClone' @click.stop.prevent='cloneSettings') {{ $translate('toolbar.inspect.management.action.clone') }}
+
+ .column.is-narrow.is-paddingless.is-flex.is-flex-direction-column.p-3
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.management.level') }}:
+ span.has-text-right.sp-kv-value {{ currentLevelDescription }}
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.management.level.pending') }}:
+ span.has-text-right.sp-kv-value {{ pendingLevels }}
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.management.level.next') }}:
+ span.has-text-right.sp-kv-value {{ $format_money(upgradeCost) }}
+
+ .is-flex.is-flex-direction-row.mt-3
+ button.button.is-fullwidth.is-starpeace(:disabled='!canUpgrade' @click.stop.prevent='addUpgrade') {{ $translate('toolbar.inspect.management.action.upgrade') }}
+ button.button.is-fullwidth.is-starpeace.ml-2(:disabled='!canDowngrade' @click.stop.prevent='addDowngrade') {{ $translate('toolbar.inspect.management.action.downgrade') }}
+
+
+
+
+
diff --git a/components/toolbar/inspect/shared/tab-products.vue b/components/toolbar/inspect/shared/tab-products.vue
index 0530116..b1ad5cf 100644
--- a/components/toolbar/inspect/shared/tab-products.vue
+++ b/components/toolbar/inspect/shared/tab-products.vue
@@ -1,33 +1,53 @@
-.products-tab.columns.is-marginless
- .column.is-narrow.is-paddingless.sp-scrollbar.products
- .product-tabs
+.columns.is-marginless.is-relative.is-clipped.products-tab
+ .column.is-narrow.is-paddingless.sp-scrollbar.sp-sub-tabs
+ .sp-tabs-menu
ul
template(v-for='product,index in sortedProducts')
- li(:class="{ 'is-active': productIndex == index }" @click.stop.prevent='productIndex = index')
- a.sp-kv-key {{resourceTypeLabel(product.resource_id)}}
-
- .column.connections
+ li(:class="{ 'is-active': productIndex == index }" @click.stop.prevent='selectProduct(index)')
+ a.sp-kv-key.py-2.px-3 {{ $resourceTypeLabel(product.resourceId) }}
+
+ .column.is-narrow.is-paddingless.px-3.py-1.is-flex.is-flex-direction-column.sp-has-dark-background
+ div.is-flex-grow-1(v-if='product')
+ div
+ span.sp-kv-key {{$translate('toolbar.inspect.products.label.price')}}:
+ span.sp-kv-value {{$format_money(product.price)}} ({{ $formatPercent(product.price, $resourceTypePrice(product.resourceId)) }})
+ misc-resource-price-slider(
+ :markers='[0, 100, 400]'
+ :min='0'
+ :max='400'
+ :resource-id='product.resourceId'
+ :price='product.price'
+ :disabled='!canManage'
+ @update='updatePrice(product.resourceId, $event)'
+ @change='debouncedUpdateBuildingPrice(building.id, product.resourceId, $event)'
+ )
+
+ div.mt-2
+ button.button.is-fullwidth.is-starpeace.disabled.mb-2(disabled) Offer
+ button.button.is-fullwidth.is-starpeace(disabled) Delete
+
+ .column.connections.p-1
.connection-information(v-if='product')
- span.sp-kv-key {{$translate('toolbar.inspect.products.label.price')}}:
- span.sp-kv-value {{$format_percent(priceRatio)}} ({{$format_money(product.price)}})
- span.sp-kv-key {{$translate('toolbar.inspect.products.label.last_value')}}:
- span.sp-kv-value {{$format_number(product.total_velocity)}} {{resourceTypeLabel(product.resource_id)}}
- span.sp-kv-key {{$translate('toolbar.inspect.products.label.quality')}}:
- span.sp-kv-value {{$format_percent(product.quality)}}
+ span.sp-kv-key {{ $translate('toolbar.inspect.products.label.last_value') }}:
+ span.sp-kv-value {{ $format_number(product.mostRecentVelocity) }} {{ $resourceTypeUnitLabel(product.resourceId) }}
+ span.sp-kv-key {{ $translate('toolbar.inspect.products.label.quality') }}:
+ span.sp-kv-value {{ $formatPercent(product.mostRecentTotalQuality, product.mostRecentVelocity) }}
.connection-details.sp-scrollbar
table
thead
tr
- th.sp-kv-key {{$translate('toolbar.inspect.products.label.customer')}}
- th.sp-kv-key {{$translate('toolbar.inspect.products.label.company')}}
- th.has-text-right.sp-kv-key {{$translate('toolbar.inspect.products.label.sales')}}
- th.has-text-right.sp-kv-key {{$translate('toolbar.inspect.products.label.transport_cost')}}
+ th.column-validity
+ th.sp-kv-key {{ $translate('toolbar.inspect.products.label.customer') }}
+ th.sp-kv-key {{ $translate('toolbar.inspect.products.label.company') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.products.label.sales') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.products.label.transport_cost') }}
tbody
template(v-if='!connections.length')
tr.is-empty
- td(colspan=4) {{$translate('ui.misc.none')}}
+ td(colspan=5) {{$translate('ui.misc.none')}}
+
template(v-else v-for='connection,index in connections')
tr(:class="{ 'is-active': selectedIndices[index] }" @click.stop.prevent='clickConnection(connection, index)')
td.sp-kv-value
@@ -36,70 +56,139 @@
font-awesome-icon(:icon="['fas', 'check']")
template(v-else)
font-awesome-icon(:icon="['fas', 'times']")
- | {{connection.sink_building_name}}
- td.sp-kv-value {{connection.sink_company_name}}
- td.has-text-right.sp-kv-value {{$format_number(connection.velocity)}}
- td.has-text-right.sp-kv-value {{$format_money(connection.transport_cost)}}
+ td.sp-kv-value
+ span(v-if='connection.sinkBuildingName') {{ connection.sinkBuildingName }}
+ span(v-else-if='connection.sinkBuildingDefinitionId') {{ buildingName(connection.sinkBuildingDefinitionId) }}
+ td.sp-kv-value {{ connection.sinkCompanyName }}
+ td.has-text-right.sp-kv-value {{ $format_number(connection.mostRecentVelocity) }}
+ td.has-text-right.sp-kv-value {{ $format_money(connection.mostRecentTransportCost) }}
+
+
diff --git a/components/toolbar/inspect/shared/tab-services.vue b/components/toolbar/inspect/shared/tab-services.vue
new file mode 100644
index 0000000..11bacb8
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-services.vue
@@ -0,0 +1,147 @@
+
+.columns.is-marginless.is-relative.is-clipped.services-tab
+ .column.is-narrow.is-paddingless.sp-scrollbar.sp-sub-tabs
+ .sp-tabs-menu
+ ul
+ template(v-for='service,index in sortedServices')
+ li(:class="{ 'is-active': serviceIndex == index }" @click.stop.prevent='selectService(index)')
+ a.sp-kv-key.py-2.px-3 {{ $resourceTypeLabel(service.resourceId) }}
+
+ .column.is-paddingless.px-3.py-1.is-flex.is-flex-direction-column.sp-has-dark-background
+ div.is-flex-grow-1(v-if='service')
+ div.is-inline-flex.is-flex-direction-column
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.services.label.requesting') }}:
+ span.sp-kv-value {{ service.requestedVelocity }} {{ $resourceTypeUnitLabel(service.resourceId) }}
+ .sp-slider
+ input(
+ type='range'
+ list='requested-markers'
+ step='any'
+ min='0'
+ :max='serviceMaxVelocity'
+ :disabled='!canManage'
+ v-model='serviceRequestedVelocity'
+ @change='debouncedUpdateBuildingServices(building.id, service.resourceId, serviceRequestedVelocity)'
+ )
+ datalist(id='requested-markers')
+ option(v-for='marker in serviceRequestedMarkers' :value='marker')
+
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.services.label.receiving') }}:
+ span.sp-kv-value {{ service.mostRecentVelocity }} {{ $resourceTypeUnitLabel(service.resourceId) }}
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.services.label.ratio') }}:
+ span.sp-kv-value {{ $formatPercent(service.mostRecentVelocity, service.requestedVelocity) }}
+
+
+
+
+
+
diff --git a/components/toolbar/inspect/shared/tab-storage.vue b/components/toolbar/inspect/shared/tab-storage.vue
new file mode 100644
index 0000000..6b23761
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-storage.vue
@@ -0,0 +1,128 @@
+
+.column.is-narrow.is-paddingless.is-clipped.is-flex.is-flex-direction-column.storages-tab
+ .is-flex-grow-0.sp-kv-key.mb-2 {{ $translate('Wares') }}:
+
+ .is-flex-grow-1.is-relative.pr-2.sp-scrollbar.storage-options
+ .is-flex.is-flex-direction-row.storage-option(v-for='option in storageResourceOptions')
+ misc-toggle-option(:value='resourceOptions[option.id]' @toggle='toggleResourceOption(option.id)')
+ span.ml-2.is-clickable(:class="{'selected-toggle': resourceOptions[option.id] }" @click.stop.prevent='toggleResourceOption(option.id)') {{ option.label }}
+
+
+
+
+
diff --git a/components/toolbar/inspect/shared/tab-store-products.vue b/components/toolbar/inspect/shared/tab-store-products.vue
new file mode 100644
index 0000000..117086f
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-store-products.vue
@@ -0,0 +1,194 @@
+
+.columns.is-marginless.is-relative.is-clipped.products-tab
+ .column.is-narrow.is-paddingless.sp-scrollbar.sp-sub-tabs
+ .sp-tabs-menu
+ ul
+ template(v-for='product,index in sortedProducts')
+ li(:class="{ 'is-active': productIndex == index }" @click.stop.prevent='selectProduct(index)')
+ a.sp-kv-key.py-2.px-3 {{$resourceTypeLabel(product.resourceId)}}
+
+ .column.is-paddingless.px-3.py-1.sp-has-dark-background.price-settings
+ .is-flex.is-flex-direction-column(v-if='product')
+ div
+ span.sp-kv-key {{ $translate('toolbar.inspect.products.label.local_demand') }}:
+ span.sp-kv-value {{ $formatPercent(productDemandRatio) }}
+ div
+ span.sp-kv-key Supply:
+ span.sp-kv-value {{ $formatPercent(productSupplyRatio) }}
+ div
+ span.sp-kv-key {{$translate('toolbar.inspect.products.label.price')}}:
+ span.sp-kv-value {{$format_money(product.price)}} ({{ $formatPercent(product.price, $resourceTypePrice(product.resourceId)) }})
+ misc-resource-price-slider(
+ :markers='[0, 300, 500]'
+ :min='0'
+ :max='500'
+ :resource-id='product.resourceId'
+ :price='product.price'
+ :disabled='!canManage'
+ @update='updatePrice(product.resourceId, $event)'
+ @change='debouncedUpdateBuildingPrice(building.id, product.resourceId, $event)'
+ )
+
+
+
+
+
diff --git a/components/toolbar/inspect/shared/tab-supplies.vue b/components/toolbar/inspect/shared/tab-supplies.vue
new file mode 100644
index 0000000..bd435c4
--- /dev/null
+++ b/components/toolbar/inspect/shared/tab-supplies.vue
@@ -0,0 +1,328 @@
+
+.columns.is-marginless.is-relative.is-clipped.supplies-tab
+ .column.is-narrow.is-paddingless.sp-scrollbar.sp-sub-tabs
+ .sp-tabs-menu
+ ul
+ template(v-for='supply,index in sortedSupplies')
+ li(:class="{ 'is-active': supplyIndex == index }" @click.stop.prevent='selectSupply(index)')
+ a.sp-kv-key.py-2.px-3 {{$resourceTypeLabel(supply.resourceId)}}
+
+ .column.is-narrow.is-paddingless.px-3.py-1.is-flex.is-flex-direction-column.sp-has-dark-background.price-settings
+ div.is-flex-grow-1(v-if='supply')
+ div.is-flex.is-flex-direction-row.is-align-items-baseline
+ span.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.max_price') }}:
+ div.sp-kv-value.price-value {{ $format_money(supply.maxPrice) }} ({{ $formatPercent(supply.maxPrice, $resourceTypePrice(supply.resourceId)) }})
+ misc-resource-price-slider(
+ :markers='[0, 100, 400]'
+ :min='0'
+ :max='400'
+ :resource-id='supply.resourceId'
+ :price='supply.maxPrice'
+ :disabled='!canManage'
+ @update='updateMaxPrice(supply.resourceId, $event)'
+ @change='debouncedUpdateBuildingMaxPrice(building.id, supply.resourceId, $event)'
+ )
+ div.mt-1
+ span.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.min_quality') }}:
+ span.sp-kv-value {{ $formatPercent(supply.minQuality) }}
+ misc-percent-slider(
+ :markers='[0, 50, 100]'
+ :min='0'
+ :max='100'
+ :percent='supply.minQuality'
+ :disabled='!canManage'
+ @update='updateMinQuality(supply.resourceId, $event)'
+ @change='debouncedUpdateBuildingMinQuality(building.id, supply.resourceId, $event)'
+ )
+ .is-flex.is-flex-direction-row.mt-2
+ button.button.is-fullwidth.is-starpeace.disabled(disabled) {{ $translate('toolbar.inspect.supplies.action.hire') }}
+ button.button.is-fullwidth.is-starpeace.ml-2(disabled) {{ $translate('toolbar.inspect.supplies.action.modify') }}
+
+
+ .column.connections.p-1
+ .connection-information(v-if='supply')
+ span.sp-kv-key.ml-2 {{ $translate('toolbar.inspect.supplies.label.last_value') }}:
+ span.sp-kv-value {{ $format_number(supply.mostRecentVelocity) }} {{ $resourceTypeUnitLabel(supply.resourceId) }}
+ span.sp-kv-key.ml-5 {{ $translate('toolbar.inspect.supplies.label.price') }}:
+ span.sp-kv-value {{ $format_money(supply.mostRecentPrice) }} ({{ $formatPercent(supply.mostRecentPrice, $resourceTypePrice(supply.resourceId)) }})
+ span.sp-kv-key.ml-5 {{ $translate('toolbar.inspect.supplies.label.quality') }}:
+ span.sp-kv-value {{ $formatPercent(supply.mostRecentTotalQuality, supply.mostRecentVelocity) }}
+
+ .connection-details.sp-scrollbar
+ table
+ thead
+ tr
+ th.column-validity
+ th.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.facility') }}
+ th.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.company') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.price') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.last_value') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.quality') }}
+ th.has-text-right.sp-kv-key {{ $translate('toolbar.inspect.supplies.label.transport_cost') }}
+ tbody
+ template(v-if='!connections.length')
+ tr.is-empty
+ td(colspan=7) {{$translate('ui.misc.none')}}
+
+ template(v-else v-for='connection,index in connections')
+ tr(:class="{ 'is-active': selectedIndices[index] }" @click.stop.prevent='clickConnection(connection, index)')
+ td.sp-kv-value
+ span.validity-icon
+ template(v-if='connection.valid')
+ font-awesome-icon(:icon="['fas', 'check']")
+ template(v-else)
+ font-awesome-icon(:icon="['fas', 'times']")
+ td.sp-kv-value
+ span(v-if='connection.sourceBuildingName') {{ connection.sourceBuildingName }}
+ span(v-else-if='connection.sourceBuildingDefinitionId') {{ buildingName(connection.sourceBuildingDefinitionId) }}
+ td.sp-kv-value {{ connection.sourceCompanyName }}
+ td.has-text-right.sp-kv-value {{ $format_money(connection.mostRecentPrice) }}
+ td.has-text-right.sp-kv-value {{ $format_number(connection.mostRecentVelocity) }}
+ td.has-text-right.sp-kv-value {{ $formatPercent(connection.mostRecentQuality) }}
+ td.has-text-right.sp-kv-value {{ $format_money(connection.mostRecentTransportCost) }}
+
+
+
+
+
+
diff --git a/components/toolbar/inspect/tab-headquarters-research.vue b/components/toolbar/inspect/tab-headquarters-research.vue
new file mode 100644
index 0000000..d77e690
--- /dev/null
+++ b/components/toolbar/inspect/tab-headquarters-research.vue
@@ -0,0 +1,45 @@
+
+.jobs-tab.columns.is-marginless
+ .column.is-narrow.is-paddingless.p-4
+ button.button.is-starpeace(:disabled='!canManage' @click.stop.prevent='showResearch') Show Research
+
+
+
+
+
+
diff --git a/components/toolbar/inspect/toolbar-inspect-building.vue b/components/toolbar/inspect/toolbar-inspect-building.vue
index 4e21718..bd5940a 100644
--- a/components/toolbar/inspect/toolbar-inspect-building.vue
+++ b/components/toolbar/inspect/toolbar-inspect-building.vue
@@ -2,35 +2,198 @@
.inspect-details
.inspect-tabs.tabs.is-small.is-marginless
ul
- template(v-for='tab,index in tabs')
- li(:class="{ 'is-active': index == tab_index }" @click.stop.prevent='tab_index = index')
+ template(v-for='tab in tabs')
+ li(:class="{ 'is-active': tab.id == tabId }" @click.stop.prevent='tabId = tab.id')
a
- span {{tab}}
+ span {{ $translate(tab.label) }}
- .inspect-body.is-marginless
+ .inspect-body.columns.is-marginless
+ template(v-if="tabId == 'general'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-general(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :building-details='buildingDetails'
+ @refresh-details="$emit('refresh-details')"
+ )
+
+ template(v-if="tabId == 'research'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-tab-headquarters-research(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ )
+
+ template(v-else-if="tabId == 'operations' || tabId == 'supplies'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-supplies(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :supplies='buildingDetails.inputs'
+ )
+
+ template(v-else-if="tabId == 'products'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-products(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :products='buildingDetails.outputs'
+ )
+
+ template(v-else-if="tabId == 'services'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-services(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :services='buildingDetails.services'
+ )
+
+ template(v-else-if="tabId == 'jobs'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-jobs(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :jobs='buildingDetails.labors'
+ )
+
+ template(v-else-if="tabId == 'management'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-management(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ :building-details='buildingDetails'
+ @refresh-details="$emit('refresh-details')"
+ )
+
+ template(v-else-if="tabId == 'history'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-history(
+ :client-state='clientState'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ )
@@ -38,5 +201,4 @@ export default {
diff --git a/components/toolbar/inspect/toolbar-inspect-portal.vue b/components/toolbar/inspect/toolbar-inspect-portal.vue
index e89dd21..6f6fa46 100644
--- a/components/toolbar/inspect/toolbar-inspect-portal.vue
+++ b/components/toolbar/inspect/toolbar-inspect-portal.vue
@@ -2,36 +2,51 @@
.inspect-details
.inspect-tabs.tabs.is-small.is-marginless
ul
- template(v-for='tab,index in tabs')
- li(:class="{ 'is-active': index == tab_index }" @click.stop.prevent='tab_index = index')
+ template(v-for='tab in tabs')
+ li(:class="{ 'is-active': tab.id == tabId }" @click.stop.prevent='tabId = tab.id')
a
- span {{tab}}
+ span {{ $translate(tab.label) }}
.inspect-body.is-marginless
+ template(v-if="tabId == 'general'")
+ .column.is-paddingless.is-relative.is-clipped.p-4
+ span.is-italic {{ message }}
@@ -40,4 +55,6 @@ export default {
@import '~/assets/stylesheets/starpeace-variables'
@import '~/assets/stylesheets/starpeace-inspect'
+.inspect-body
+ color: $sp-primary
diff --git a/components/toolbar/inspect/toolbar-inspect-townhall.vue b/components/toolbar/inspect/toolbar-inspect-townhall.vue
index 61b9af5..1a040f4 100644
--- a/components/toolbar/inspect/toolbar-inspect-townhall.vue
+++ b/components/toolbar/inspect/toolbar-inspect-townhall.vue
@@ -6,33 +6,23 @@
template(v-else)
.inspect-tabs.tabs.is-small.is-marginless
ul
- li(:class="{ 'is-active': tab_index == 0 }" @click.stop.prevent='tab_index = 0')
- a {{$translate('toolbar.inspect.common.tabs.general')}}
- li(:class="{ 'is-active': tab_index == 1 }" @click.stop.prevent='tab_index = 1')
- a {{$translate('toolbar.inspect.townhall.tabs.commerce')}}
- li(:class="{ 'is-active': tab_index == 2 }" @click.stop.prevent='tab_index = 2')
- a {{$translate('toolbar.inspect.townhall.tabs.taxes')}}
- li(:class="{ 'is-active': tab_index == 3 }" @click.stop.prevent='tab_index = 3')
- a {{$translate('toolbar.inspect.townhall.tabs.employment')}}
- li(:class="{ 'is-active': tab_index == 4 }" @click.stop.prevent='tab_index = 4')
- a {{$translate('toolbar.inspect.townhall.tabs.housing')}}
- li(:class="{ 'is-active': tab_index == 5 }" @click.stop.prevent='tab_index = 5')
- a {{$translate('toolbar.inspect.common.tabs.jobs')}}
+ li(v-for='tab in tabs' :class="{ 'is-active': tabId == tab.id }" @click.stop.prevent='tabId = tab.id')
+ a {{$translate(tab.label)}}
.inspect-body.columns.is-marginless
- template(v-if='tab_index == 0')
+ template(v-if="tabId == 'general'")
.column.is-narrow.sp-scrollbar.service-levels
table.basic-table.condensed
thead
tr
th.sp-kv-key {{$translate('ui.menu.town_search.panel.details.qol.label')}}
- th.has-text-right.sp-kv-value {{$format_percent(.9)}}
+ th.has-text-right.sp-kv-value {{$formatPercent(qol)}}
tbody
tr(v-for='level in service_levels')
- td.sp-kv-key {{label_for_type(level.type)}}
- td.has-text-right.sp-kv-value {{$format_percent(level.value)}}
+ td.sp-kv-key {{labelForServiceTypeId(level.typeId)}}
+ td.has-text-right.sp-kv-value {{$formatPercent(level.value)}}
- .column.is-narrow.extra-padding-left.extra-padding-right.politics
+ .column.is-narrow.px-5.politics
div
span.sp-kv-key {{$translate('ui.menu.politics.details.mayor.label')}}:
span.sp-kv-value
@@ -42,7 +32,7 @@
template(v-if='mayor')
div
span.sp-kv-key {{$translate('ui.menu.politics.details.overall_rating.label')}}:
- span.sp-kv-value {{$format_percent(mayor_overall_rating)}}
+ span.sp-kv-value {{$formatPercent(mayor_overall_rating)}}
div
span.sp-kv-key {{$translate('ui.menu.politics.details.terms.label')}}:
span.sp-kv-value {{mayor.terms}}
@@ -53,12 +43,12 @@
a.button.is-fullwidth.is-starpeace(@click.stop.prevent='show_politics') {{$translate('ui.menu.town_search.panel.action.show_politics')}}
- .column.is-narrow.extra-padding-left.population
+ .column.is-narrow.pl-5.population
table.basic-table
thead
tr
th
- th.has-text-right.sp-kv-key(v-for='population in populations') {{population.type}}
+ th.has-text-right.sp-kv-key(v-for='population in populations') {{ resourceTypeLabel(population.resourceId) }}
tbody
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.population')}}
@@ -70,7 +60,7 @@
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.homelessness')}}
td.has-text-right.sp-kv-value(v-for='population in populations') {{format_homelessness(population)}}
- template(v-else-if='tab_index == 1')
+ template(v-else-if="tabId == 'commerce'")
.column.sp-scrollbar.commerce
table.basic-table.sp-striped.sp-solid-header.sp-sticky-header
thead
@@ -85,17 +75,17 @@
th.has-text-right.sp-kv-key {{$translate('toolbar.inspect.townhall.label.quality')}}
tbody
tr(v-for='commerce in commerces')
- td.sp-kv-value {{industry_type_label(commerce.industry_type_id)}}
+ td.sp-kv-value {{industryTypeLabel(commerce.industryTypeId)}}
td.has-text-right.sp-kv-value {{commerce.demand.toLocaleString()}}
td.has-text-right.sp-kv-value {{commerce.supply.toLocaleString()}}
td.has-text-right.sp-kv-value {{commerce.capacity.toLocaleString()}}
- td.has-text-right.sp-kv-value {{$format_percent(commerce.ratio)}}
- td.has-text-right.sp-kv-value {{$format_money(commerce.ifel_price)}}
- td.has-text-right.sp-kv-value {{$format_money(commerce.average_price)}} ({{$format_percent(commerce.ifel_price > 0 ? commerce.average_price / commerce.ifel_price : 0)}})
- td.has-text-right.sp-kv-value {{$format_percent(commerce.quality)}}
+ td.has-text-right.sp-kv-value {{$formatPercent(commerce.ratio)}}
+ td.has-text-right.sp-kv-value {{$format_money(commerce.ifelPrice)}}
+ td.has-text-right.sp-kv-value {{$format_money(commerce.average_price)}} ({{$formatPercent(commerce.averagePrice, commerce.ifelPrice)}})
+ td.has-text-right.sp-kv-value {{$formatPercent(commerce.quality)}}
- template(v-else-if='tab_index == 2')
+ template(v-else-if="tabId == 'taxes'")
.column.sp-scrollbar.taxes
table.basic-table.sp-striped.sp-solid-header.sp-sticky-header
thead
@@ -105,136 +95,231 @@
th.has-text-right.sp-kv-key {{$translate('toolbar.inspect.townhall.label.last_year')}}
tbody
tr(v-for='tax in taxes')
- td.sp-kv-value {{industry_category_label(tax.industry_category_id)}} - {{industry_type_label(tax.industry_type_id)}}
- td.has-text-right.sp-kv-value {{$format_percent(tax.tax_rate)}}
- td.has-text-right.sp-kv-value {{$format_money(tax.last_year)}}
+ td.sp-kv-value {{industryCategoryLabel(tax.industryCategoryId)}} - {{industryTypeLabel(tax.industryTypeId)}}
+ td.has-text-right.sp-kv-value {{$formatPercent(tax.taxRate)}}
+ td.has-text-right.sp-kv-value {{$format_money(tax.lastYear)}}
- template(v-else-if='tab_index == 3')
+ template(v-else-if="tabId == 'employment'")
.column.is-narrow.employment
+ datalist(id='wage-markers')
+ option(value=0)
+ option(value=100)
+ option(value=250)
table.basic-table
thead
tr
th
- th.has-text-right.sp-kv-key(v-for='employment in employments') {{employment.type}}
+ th.has-text-right.sp-kv-key(v-for='employment in employments') {{ resourceTypeLabel(employment.resourceId) }}
tbody
+ tr
+ td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.total')}}
+ td.has-text-right.sp-kv-value(v-for='employment in employments') {{ employment.total }}
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.vacancies')}}
- td.has-text-right.sp-kv-value(v-for='employment in employments') {{employment.vacancies}}
+ td.has-text-right.sp-kv-value(v-for='employment in employments') {{ employment.vacancies }}
tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.spending_power')}}
- td.has-text-right.sp-kv-value(v-for='employment in employments') {{$format_percent(employment.spending_power)}}
+ td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.spending_power') }}
+ td.has-text-right.sp-kv-value(v-for='employment in employments') {{ $formatPercent(employment.spendingPower) }}
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.average_wage')}}
- td.has-text-right.sp-kv-value(v-for='employment in employments') {{$format_percent(employment.average_wage)}}
+ td.has-text-right.sp-kv-value(v-for='employment in employments') {{ $formatPercent(employment.averageWage) }}
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.minimum_wage')}}
td.has-text-right.sp-kv-value(v-for='employment in employments')
.sp-slider
- input(type='range' min='0' max='200' value='100' disabled)
- span {{$format_percent(employment.minimum_wage)}}
+ input(type='range' list='wage-markers' min='0' max='250' value='100' disabled)
+ span {{$formatPercent(employment.minimum_wage)}}
- template(v-else-if='tab_index == 4')
+ template(v-else-if="tabId == 'housing'")
.column.is-narrow.housing
table.basic-table
thead
tr
th
- th.has-text-right.sp-kv-key(v-for='housing in housings') {{housing.type}}
+ th.has-text-right.sp-kv-key(v-for='housing in housings') {{ resourceTypeLabel(housing.resourceId) }}
tbody
+ tr
+ td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.total')}}
+ td.has-text-right.sp-kv-value(v-for='housing in housings') {{ housing.total }}
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.vacancies')}}
- td.has-text-right.sp-kv-value(v-for='housing in housings') {{housing.vacancies}}
+ td.has-text-right.sp-kv-value(v-for='housing in housings') {{ housing.vacancies }}
tr
- td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.average_rent')}}
- td.has-text-right.sp-kv-value(v-for='housing in housings') {{$format_percent(housing.average_rent)}}
+ td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.average_rent') }}
+ td.has-text-right.sp-kv-value(v-for='housing in housings') {{ $formatPercent(housing.averageRent) }}
tr
td.sp-kv-key {{$translate('toolbar.inspect.townhall.label.quality_index')}}
- td.has-text-right.sp-kv-value(v-for='housing in housings') {{$format_percent(housing.quality_index)}}
+ td.has-text-right.sp-kv-value(v-for='housing in housings') {{ $formatPercent(housing.qualityIndex) }}
+
+ template(v-else-if="tabId == 'jobs'")
+ .column.is-paddingless.is-relative.is-clipped
+ toolbar-inspect-shared-tab-jobs(
+ :client-state='clientState'
+ :jobs='jobs'
+ :building='building'
+ :definition='definition'
+ :simulation='simulation'
+ )
@@ -154,9 +126,4 @@ export default {
diff --git a/components/toolbar/toolbar-details.vue b/components/toolbar/toolbar-details.vue
index 7760079..fda3a8c 100644
--- a/components/toolbar/toolbar-details.vue
+++ b/components/toolbar/toolbar-details.vue
@@ -1,6 +1,8 @@
#toolbar-details.columns.is-marginless.is-paddingless(v-show='is_ready' v-cloak=true :oncontextmenu="'return ' + !$config.public.disableRightClick")
- .column.column-news-ticker {{ ticker_message }}
+ .column.column-news-ticker
+ span.is-clickable(v-if='tickerHasTarget' @click.stop.prevent='jumpTickerTarget') {{ ticker_message }}
+ span(v-else) {{ ticker_message }}
.column.column-tycoon-details
#corporation-details.level.is-mobile
.level-left.content.corporation-panel
@@ -26,7 +28,7 @@
span.company-name {{client_state.name_for_company_id(company.id)}}
.company-building-count
font-awesome-icon(:icon="['far', 'building']")
- span.count {{building_count_for_company_id(company.id)}}
+ span.count {{ building_count_for_company_id(company.id) }}
p.company-cashflow
| (
misc-money-text(:value='company_cashflow(company.id)')
@@ -40,7 +42,7 @@
@@ -112,6 +129,10 @@ export default {
max-width: 24rem
padding: .5rem
+ .is-clickable
+ &:hover
+ text-decoration: underline
+
#corporation-details
align-items: stretch
diff --git a/components/toolbar/toolbar-inspect.vue b/components/toolbar/toolbar-inspect.vue
index 6020c2a..76c746a 100644
--- a/components/toolbar/toolbar-inspect.vue
+++ b/components/toolbar/toolbar-inspect.vue
@@ -1,58 +1,193 @@
-.inspect-container(v-show='show_inspect' :oncontextmenu="'return ' + !$config.public.disableRightClick")
-
+.inspect-container(v-show='isVisible' :oncontextmenu="'return ' + !$config.public.disableRightClick")
.inspect-preview.is-marginless
#inspect-image-webgl-container(ref='previewContainer')
- template(v-if='!building_type')
- .loading-container
+ template(v-if='!isVisible || isLoading || !buildingType')
+ .column
img.loading-image.starpeace-logo.logo-loading
- template(v-else-if="building_type == 'PORTAL'")
- toolbar-inspect-portal(:client-state='client_state' :key='selected_building_id')
-
- template(v-else-if="building_type == 'TOWNHALL'")
- toolbar-inspect-townhall(:client-state='client_state' :key='selected_building_id')
-
- template(v-else-if="building_type == 'TRADECENTER'")
- toolbar-inspect-trade-center(
- :key='selected_building_id'
- :client-state='client_state'
- :building='selected_building'
- :definition='selected_building_definition'
- :simulation='selected_building_simulation'
- )
-
template(v-else)
- toolbar-inspect-building(:client-state='client_state' :key='selected_building_id')
+ template(v-if="buildingTypeInspectType == 'PORTAL'")
+ toolbar-inspect-portal(:client-state='clientState' :key='selectedBuildingId' :building='selectedBuilding')
+
+ template(v-else-if="buildingTypeInspectType == 'TOWNHALL'")
+ toolbar-inspect-townhall(
+ :key='selectedBuildingId'
+ :client-state='clientState'
+ :building='selectedBuilding'
+ :definition='selectedBuildingDefinition'
+ :simulation='selectedBuildingSimulation'
+ :building-details='buildingDetails'
+ )
+
+ template(v-else-if="buildingTypeInspectType == 'TRADECENTER'")
+ toolbar-inspect-trade-center(
+ :key='selectedBuildingId'
+ :client-state='clientState'
+ :building='selectedBuilding'
+ :definition='selectedBuildingDefinition'
+ :simulation='selectedBuildingSimulation'
+ :building-details='buildingDetails'
+ )
+
+ template(v-else)
+ toolbar-inspect-building(
+ :key='selectedBuildingId'
+ :client-state='clientState'
+ :building='selectedBuilding'
+ :definition='selectedBuildingDefinition'
+ :simulation='selectedBuildingSimulation'
+ :building-details='buildingDetails'
+ @refresh-details='refreshBuildingDetails'
+ )
@@ -84,18 +219,13 @@ export default {
top: 0
width: 100%
-.loading-container
- grid-column: start-details / end-details
- grid-row: 1 / 2
- position: relative
-
- .loading-image
- background-size: 8rem
- height: 8rem
- left: calc(50% - 4rem)
- margin: 1rem 0
- position: absolute
- top: calc(40% - 4rem)
- width: 8rem
+.loading-image
+ background-size: 8rem
+ height: 8rem
+ left: calc(50% - 4rem)
+ margin: 1rem 0
+ position: absolute
+ top: calc(40% - 4rem)
+ width: 8rem
diff --git a/components/toolbar/toolbar-menubar.vue b/components/toolbar/toolbar-menubar.vue
index 11f29a0..950ebea 100644
--- a/components/toolbar/toolbar-menubar.vue
+++ b/components/toolbar/toolbar-menubar.vue
@@ -40,7 +40,7 @@
| {{$translate('identity.visitor')}}
span.column-tycoon-buildings
- span.count 0 / 0
+ span.count {{ buildingCount }} / {{ maxBuildingCount }}
font-awesome-icon(:icon="['far', 'building']")
.column-notification-icons.level
@@ -49,13 +49,13 @@
template(v-if='show_game_music')
.level-item.game-music(:class='game_music_class')
- font-awesome-icon(:icon="['fas', 'play']" v-show='!game_music_playing' @click.stop.prevent='music_state.toggle_music()')
- font-awesome-icon(:icon="['fas', 'pause']" v-show='game_music_playing' @click.stop.prevent='music_state.toggle_music()')
+ font-awesome-icon(:icon="['fas', 'play']" v-show='!game_music_playing' @click.stop.prevent='music_state.toggleMusic()')
+ font-awesome-icon(:icon="['fas', 'pause']" v-show='game_music_playing' @click.stop.prevent='music_state.toggleMusic()')
.level-item.game-music-next(:class='game_music_volume_class')
- font-awesome-icon(:icon="['fas', 'fast-forward']" @click.stop.prevent='music_state.next_song()')
+ font-awesome-icon(:icon="['fas', 'fast-forward']" @click.stop.prevent='music_state.nextSong()')
.level-item.game-music-volume(:class='game_music_volume_class')
- font-awesome-icon(:icon="['fas', 'volume-up']" v-show='music_state.game_music_volume' @click.stop.prevent='music_state.toggle_volume()')
- font-awesome-icon(:icon="['fas', 'volume-off']" v-show='!music_state.game_music_volume' @click.stop.prevent='music_state.toggle_volume()')
+ font-awesome-icon(:icon="['fas', 'volume-up']" v-show='music_state.gameMusicVolume' @click.stop.prevent='music_state.toggleVolume()')
+ font-awesome-icon(:icon="['fas', 'volume-off']" v-show='!music_state.gameMusicVolume' @click.stop.prevent='music_state.toggleVolume()')
.level-item.notification-mail(:class="{'has-unread':unread_mail.length>0}" @click.stop.prevent='toggle_mail()')
font-awesome-icon(:icon="['far', 'envelope']")
@@ -67,7 +67,7 @@