profectus/Profectus-Demo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'template/main'

Browse source
This commit is contained in:
thepaperpilot 2022-03-20 14:06:47 -05:00
commit 2563ab7471
20 changed files with 672 additions and 610 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
CHANGELOG.md
View file

@ -6,6 +6,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [Unreleased]
## [0.1.4] - 2022-03-13
### Added
- You can now access this.on() from within a createLayer function (and other BaseLayer properties)
- Support for passing non-persistent refs to createResource
- dontMerge class to allow features to ignore mergeAdjacent
### Fixed
- Clickables would not merge adjacent
- onClick and onHold functions would not be bound to their object when being called
- Refs passed to a components style prop would be ignored
- Fixed z-index issue when stopping hovering over features with .can class
## [0.1.3] - 2022-03-11
### Added
- Milestone.complete

1111
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

10
package.json
View file

@ -1,6 +1,6 @@
{
"name": "profectus",
"version": "0.1.3",
"version": "0.1.4",
"private": true,
"scripts": {
"start": "vue-cli-service serve",
@ -26,10 +26,10 @@
"@rushstack/eslint-patch": "^1.1.0",
"@types/lodash.clonedeep": "^4.5.6",
"@vue/babel-plugin-jsx": "^1.1.1",
"@vue/cli-plugin-babel": "~5.0.0-rc.1",
"@vue/cli-plugin-eslint": "~5.0.0-rc.1",
"@vue/cli-plugin-typescript": "~5.0.0-rc.1",
"@vue/cli-service": "~5.0.0-rc.1",
"@vue/cli-plugin-babel": "^5.0.3",
"@vue/cli-plugin-eslint": "^5.0.3",
"@vue/cli-plugin-typescript": "^5.0.3",
"@vue/cli-service": "^5.0.3",
"@vue/compiler-sfc": "^3.2.26",
"@vue/eslint-config-prettier": "^7.0.0",
"@vue/eslint-config-typescript": "^10.0.0",

3
src/components/common/features.css
View file

@ -7,6 +7,8 @@
margin: var(--feature-margin);
box-sizing: border-box;
color: var(--feature-foreground);
z-index: 0;
transition: all 0.5s, z-index 0s 0.5s;
}
.can,
@ -20,6 +22,7 @@
transform: scale(1.15, 1.15);
box-shadow: 0 0 20px var(--points);
z-index: 1;
transition: all 0.5s, z-index 0s;
}
.locked,

28
src/components/common/table.css
View file

@ -34,57 +34,57 @@
margin: 10px 0;
}
.row.mergeAdjacent > .feature,
.row.mergeAdjacent > .tooltip-container > .feature {
.row.mergeAdjacent > .feature:not(.dontMerge),
.row.mergeAdjacent > .tooltip-container > .feature:not(.dontMerge) {
margin-left: 0;
margin-right: 0;
border-radius: 0;
}
.row.mergeAdjacent > .feature:first-child,
.row.mergeAdjacent > .tooltip-container:first-child > .feature {
.row.mergeAdjacent > .feature:not(.dontMerge):first-child,
.row.mergeAdjacent > .tooltip-container:first-child > .feature:not(.dontMerge) {
border-radius: var(--border-radius) 0 0 var(--border-radius);
}
.row.mergeAdjacent > .feature:last-child,
.row.mergeAdjacent > .tooltip-container:last-child > .feature {
.row.mergeAdjacent > .feature:not(.dontMerge):last-child,
.row.mergeAdjacent > .tooltip-container:last-child > .feature:not(.dontMerge) {
border-radius: 0 var(--border-radius) var(--border-radius) 0;
}
.row.mergeAdjacent > .feature:first-child:last-child,
.row.mergeAdjacent > .tooltip-container:first-child:last-child > .feature {
.row.mergeAdjacent > .feature:not(.dontMerge):first-child:last-child,
.row.mergeAdjacent > .tooltip-container:first-child:last-child > .feature:not(.dontMerge) {
border-radius: var(--border-radius);
}
/*
TODO how to implement mergeAdjacent for grids?
.row.mergeAdjacent + .row.mergeAdjacent > .feature {
.row.mergeAdjacent + .row.mergeAdjacent > .feature:not(.dontMerge) {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
*/
.col.mergeAdjacent .feature {
.col.mergeAdjacent .feature:not(.dontMerge) {
margin-top: 0;
margin-bottom: 0;
border-radius: 0;
}
.col.mergeAdjacent .feature:first-child {
.col.mergeAdjacent .feature:not(.dontMerge):first-child {
border-radius: var(--border-radius) var(--border-radius) 0 0;
}
.col.mergeAdjacent .feature:last-child {
.col.mergeAdjacent .feature:not(.dontMerge):last-child {
border-radius: 0 0 var(--border-radius) var(--border-radius);
}
.col.mergeAdjacent .feature:first-child:last-child {
.col.mergeAdjacent .feature:not(.dontMerge):first-child:last-child {
border-radius: var(--border-radius);
}
/*
TODO how to implement mergeAdjacent for grids?
.col.mergeAdjacent + .col.mergeAdjacent > .feature {
.col.mergeAdjacent + .col.mergeAdjacent > .feature:not(.dontMerge) {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}

2
src/features/achievements/achievement.tsx
View file

@ -91,7 +91,7 @@ export function createAchievement<T extends AchievementOptions>(
achievement[GatherProps] = function (this: GenericAchievement) {
const { visibility, display, earned, image, style, classes, mark, id } = this;
return { visibility, display, earned, image, style, classes, mark, id };
return { visibility, display, earned, image, style: unref(style), classes, mark, id };
};
if (achievement.shouldEarn) {

3
src/features/bars/bar.ts
View file

@ -18,6 +18,7 @@ import {
ProcessedComputable
} from "util/computed";
import { createLazyProxy } from "util/proxies";
import { unref } from "vue";
export const BarType = Symbol("Bar");
@ -124,7 +125,7 @@ export function createBar<T extends BarOptions>(optionsFunc: () => T & ThisType<
direction,
display,
visibility,
style,
style: unref(style),
classes,
borderStyle,
textStyle,

2
src/features/boards/board.ts
View file

@ -316,7 +316,7 @@ export function createBoard<T extends BoardOptions>(
visibility,
width,
height,
style,
style: unref(style),
classes,
links,
selectedAction,

23
src/features/buyable.tsx
View file

@ -162,12 +162,11 @@ export function createBuyable<T extends BuyableOptions>(
buyable.display = jsx(() => {
// TODO once processComputable types correctly, remove this "as X"
const currDisplay = unref(display) as BuyableDisplay;
if (
currDisplay != null &&
!isCoercableComponent(currDisplay) &&
buyable.cost != null &&
buyable.resource != null
) {
if (isCoercableComponent(currDisplay)) {
const CurrDisplay = coerceComponent(currDisplay);
return <CurrDisplay />;
}
if (currDisplay != null && buyable.cost != null && buyable.resource != null) {
const genericBuyable = buyable as GenericBuyable;
const Title = coerceComponent(currDisplay.title || "", "h3");
const Description = coerceComponent(currDisplay.description);
@ -226,7 +225,17 @@ export function createBuyable<T extends BuyableOptions>(
buyable[GatherProps] = function (this: GenericBuyable) {
const { display, visibility, style, classes, onClick, canClick, small, mark, id } =
this;
return { display, visibility, style, classes, onClick, canClick, small, mark, id };
return {
display,
visibility,
style: unref(style),
classes,
onClick,
canClick,
small,
mark,
id
};
};
return buyable as unknown as Buyable<T>;

2
src/features/challenges/challenge.tsx
View file

@ -247,7 +247,7 @@ export function createChallenge<T extends ChallengeOptions>(
canComplete,
display,
visibility,
style,
style: unref(style),
classes,
completed,
canStart,

49
src/features/clickables/Clickable.vue
View file

@ -1,31 +1,30 @@
<template>
<div
<button
v-if="unref(visibility) !== Visibility.None"
:style="{ visibility: unref(visibility) === Visibility.Hidden ? 'hidden' : undefined }"
:style="[
{ visibility: unref(visibility) === Visibility.Hidden ? 'hidden' : undefined },
unref(style) ?? []
]"
@click="onClick"
@mousedown="start"
@mouseleave="stop"
@mouseup="stop"
@touchstart="start"
@touchend="stop"
@touchcancel="stop"
:class="{
feature: true,
clickable: true,
can: unref(canClick),
locked: !unref(canClick),
small,
...unref(classes)
}"
>
<button
:style="unref(style)"
@click="onClick"
@mousedown="start"
@mouseleave="stop"
@mouseup="stop"
@touchstart="start"
@touchend="stop"
@touchcancel="stop"
:class="{
feature: true,
clickable: true,
can: unref(canClick),
locked: !unref(canClick),
small,
...unref(classes)
}"
>
<component v-if="unref(comp)" :is="unref(comp)" />
<MarkNode :mark="unref(mark)" />
<LinkNode :id="id" />
</button>
</div>
<component v-if="unref(comp)" :is="unref(comp)" />
<MarkNode :mark="unref(mark)" />
<LinkNode :id="id" />
</button>
</template>
<script lang="tsx">

6
src/features/clickables/clickable.ts
View file

@ -87,7 +87,7 @@ export function createClickable<T extends ClickableOptions>(
processComputable(clickable as T, "display");
if (clickable.onClick) {
const onClick = clickable.onClick;
const onClick = clickable.onClick.bind(clickable);
clickable.onClick = function () {
if (unref(clickable.canClick)) {
onClick();
@ -95,7 +95,7 @@ export function createClickable<T extends ClickableOptions>(
};
}
if (clickable.onHold) {
const onHold = clickable.onHold;
const onHold = clickable.onHold.bind(clickable);
clickable.onHold = function () {
if (unref(clickable.canClick)) {
onHold();
@ -119,7 +119,7 @@ export function createClickable<T extends ClickableOptions>(
return {
display,
visibility,
style,
style: unref(style),
classes,
onClick,
onHold,

4
src/features/grids/grid.ts
View file

@ -279,7 +279,7 @@ export function createGrid<T extends GridOptions>(
processComputable(grid as T, "getDisplay");
if (grid.onClick) {
const onClick = grid.onClick;
const onClick = grid.onClick.bind(grid);
grid.onClick = function (id, state) {
if (unref((grid as GenericGrid).cells[id].canClick)) {
onClick(id, state);
@ -287,7 +287,7 @@ export function createGrid<T extends GridOptions>(
};
}
if (grid.onHold) {
const onHold = grid.onHold;
const onHold = grid.onHold.bind(grid);
grid.onHold = function (id, state) {
if (unref((grid as GenericGrid).cells[id].canClick)) {
onHold(id, state);

4
src/features/infoboxes/infobox.ts
View file

@ -17,7 +17,7 @@ import {
ProcessedComputable
} from "util/computed";
import { createLazyProxy } from "util/proxies";
import { Ref } from "vue";
import { Ref, unref } from "vue";
import { Persistent, makePersistent, PersistentState } from "game/persistence";
export const InfoboxType = Symbol("Infobox");
@ -103,7 +103,7 @@ export function createInfobox<T extends InfoboxOptions>(
title,
color,
collapsed,
style,
style: unref(style),
titleStyle,
bodyStyle,
classes,

2
src/features/milestones/milestone.tsx
View file

@ -134,7 +134,7 @@ export function createMilestone<T extends MilestoneOptions>(
milestone[GatherProps] = function (this: GenericMilestone) {
const { visibility, display, style, classes, earned, id } = this;
return { visibility, display, style, classes, earned, id };
return { visibility, display, style: unref(style), classes, earned, id };
};
if (milestone.shouldEarn) {

6
src/features/resources/resource.ts
View file

@ -1,5 +1,5 @@
import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
import { computed, ComputedRef, ref, Ref, watch } from "vue";
import { computed, ComputedRef, isRef, ref, Ref, watch } from "vue";
import { globalBus } from "game/events";
import { State, persistent } from "game/persistence";
@ -15,7 +15,9 @@ export function createResource<T extends State>(
precision = 0,
small = undefined
): Resource<T> {
const resource: Partial<Resource<T>> = persistent(defaultValue);
const resource: Partial<Resource<T>> = isRef(defaultValue)
? defaultValue
: persistent(defaultValue);
resource.displayName = displayName;
resource.precision = precision;
resource.small = small;

2
src/features/tabs/tabFamily.ts
View file

@ -145,7 +145,7 @@ export function createTabFamily<T extends TabFamilyOptions>(
tabFamily[GatherProps] = function (this: GenericTabFamily) {
const { visibility, activeTab, selected, tabs, style, classes } = this;
return { visibility, activeTab, selected, tabs, style, classes };
return { visibility, activeTab, selected, tabs, style: unref(style), classes };
};
// This is necessary because board.types is different from T and TabFamily

4
src/features/trees/tree.ts
View file

@ -101,7 +101,7 @@ export function createTreeNode<T extends TreeNodeOptions>(
processComputable(treeNode as T, "mark");
if (treeNode.onClick) {
const onClick = treeNode.onClick;
const onClick = treeNode.onClick.bind(treeNode);
treeNode.onClick = function () {
if (unref(treeNode.canClick)) {
onClick();
@ -109,7 +109,7 @@ export function createTreeNode<T extends TreeNodeOptions>(
};
}
if (treeNode.onHold) {
const onHold = treeNode.onHold;
const onHold = treeNode.onHold.bind(treeNode);
treeNode.onHold = function () {
if (unref(treeNode.canClick)) {
onHold();

2
src/features/upgrades/upgrade.ts
View file

@ -154,7 +154,7 @@ export function createUpgrade<T extends UpgradeOptions>(
return {
display,
visibility,
style,
style: unref(style),
classes,
resource,
cost,

8
src/game/layers.tsx
View file

@ -89,15 +89,19 @@ export type GenericLayer = Replace<
}
>;
export function createLayer<T extends LayerOptions>(optionsFunc: () => T): Layer<T> {
export function createLayer<T extends LayerOptions>(
optionsFunc: (() => T) & ThisType<BaseLayer>
): Layer<T> {
return createLazyProxy(() => {
const layer = optionsFunc() as T & Partial<BaseLayer>;
const layer = {} as T & Partial<BaseLayer>;
const emitter = (layer.emitter = createNanoEvents<LayerEvents>());
layer.on = emitter.on.bind(emitter);
layer.emit = emitter.emit.bind(emitter);
layer.minimized = persistent(false);
Object.assign(layer, optionsFunc.call(layer));
processComputable(layer as T, "color");
processComputable(layer as T, "display");
processComputable(layer as T, "name");