Mirrors/talemate
1
0
Fork 0
mirror of https://github.com/vegu-ai/talemate.git synced 2025-12-28 16:06:38 +01:00
Code Issues Packages Projects Releases Wiki Activity

Prep 0.18.0 (#58)

Browse Source 
* vuetify update
recent saves

* use placeholder instead of prefilling text

* fix scene loading when no coverage image is set

* improve summarize and pin response quality

* summarization use previous entries as informative context

* fixes #49: auto save indicator missleading

* regenerate with instructions

* allow resetting of state reinforcement

* creative tools: introduce new character
creative tools: introduce passive character as active character

* character creation adjustments

* no longer needed

* activate, deactivate characters (work in progress)

* worldstate manager show inactive characters

* allow setting of llm prompt template from ux
reorganize llm prompt template directory for easier local overriding
support a more sane way to write llm prompt templates

* determine prompt template from huggingface

* ignore user overrides

* fix issue with removing narrator messages

* summarization agent config for prev entry inclusion
agent config attribute notes

* client code clean up to allow modularity of clients + generic openai compatible api client

* more client cleanup

* remove debug msg, step size for ctx upped to 1024

* wip on stepped history summarization

* summarization prompt fixes

* include time message for hisory context pushed in scene.context_history

* add / remove characters toggle narration of via ctrl

* fix pydantic namespace warning
fix client emit after reconfig

* set memory ids on character detail entries

* deal with chromadb race condition (maybe)

* activate / deactivate characters from creative editor
switch creative editor to edit characters through world state manager

* set 0.18.0

* relock dependencies

* openai client shortcut to set api key if not set

* set error_action to null

* if scene has just started provide intro for extra context in is_prsent and is_leaving queries

* nice error if determine template via huggingface doesn't work

* fix issue where regenerate would sometimes pick the wrong npc if there are multiple characters talking

* add new openai models

* default to gpt-4-turbo-preview
This commit is contained in:
veguAI
2024-01-26 12:42:21 +02:00
committed by GitHub
parent 0303a42699
commit 303ec2a139
155 changed files with 2883 additions and 781 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
talemate_frontend/package-lock.json generated
View File

@@ -12,7 +12,7 @@
"core-js": "^3.8.3",
"roboto-fontface": "*",
"vue": "^3.2.13",
"vuetify": "^3.3.11",
"vuetify": "^3.5.0",
"webfontloader": "^1.0.0"
},
"devDependencies": {
@@ -10442,9 +10442,9 @@
"dev": true
},
"node_modules/vuetify": {
"version": "3.3.14",
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.3.14.tgz",
"integrity": "sha512-5kGnahj/cX5989bV9XM432k/BJ11fRdJ3CCdISjo1auCz+rLEeLJdjMeqyCJVd0FZsWcE1Z8799s9sLdLM3Deg==",
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.5.0.tgz",
"integrity": "sha512-zpZFZoJE9c8QlHc8s9zowKzMUTjytdzz2PQpZPezVENm0Jp+KBi+KooZGxvj7l+YfeFdKOcSjht7nEptSSMPMg==",
"engines": {
"node": "^12.20 || >=14.13"
},
@@ -10454,10 +10454,10 @@
},
"peerDependencies": {
"typescript": ">=4.7",
"vite-plugin-vuetify": "^1.0.0-alpha.12",
"vue": "^3.2.0",
"vite-plugin-vuetify": ">=1.0.0-alpha.12",
"vue": "^3.3.0",
"vue-i18n": "^9.0.0",
"webpack-plugin-vuetify": "^2.0.0-alpha.11"
"webpack-plugin-vuetify": ">=2.0.0-alpha.11"
},
"peerDependenciesMeta": {
"typescript": {
@@ -19323,9 +19323,9 @@
"dev": true
},
"vuetify": {
"version": "3.3.14",
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.3.14.tgz",
"integrity": "sha512-5kGnahj/cX5989bV9XM432k/BJ11fRdJ3CCdISjo1auCz+rLEeLJdjMeqyCJVd0FZsWcE1Z8799s9sLdLM3Deg==",
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-3.5.0.tgz",
"integrity": "sha512-zpZFZoJE9c8QlHc8s9zowKzMUTjytdzz2PQpZPezVENm0Jp+KBi+KooZGxvj7l+YfeFdKOcSjht7nEptSSMPMg==",
"requires": {}
},
"watchpack": {

2
talemate_frontend/package.json
View File

@@ -12,7 +12,7 @@
"core-js": "^3.8.3",
"roboto-fontface": "*",
"vue": "^3.2.13",
"vuetify": "^3.3.11",
"vuetify": "^3.5.0",
"webfontloader": "^1.0.0"
},
"devDependencies": {

35
talemate_frontend/src/components/AIClient.vue
View File

@@ -14,6 +14,11 @@
<v-icon v-else color="green" size="14">mdi-checkbox-blank-circle</v-icon>
{{ client.name }}
</v-list-item-title>
<v-list-item-subtitle class="text-caption" v-if="client.data.error_action != null">
<v-btn class="mt-1 mb-1" variant="tonal" :prepend-icon="client.data.error_action.icon" size="x-small" color="warning" @click.stop="callErrorAction(client, client.data.error_action)">
{{ client.data.error_action.title }}
</v-btn>
</v-list-item-subtitle>
<v-list-item-subtitle class="text-caption">
{{ client.model_name }}
</v-list-item-subtitle>
@@ -27,7 +32,7 @@
v-model="client.max_token_length"
:min="1024"
:max="128000"
:step="512"
:step="1024"
@update:modelValue="saveClientDelayed(client)"
@click.stop
density="compact"
@@ -35,7 +40,7 @@
</div>
<v-list-item-subtitle class="text-center">
<v-tooltip text="No LLM prompt template for this model. Using default. Templates can be added in ./templates/llm-prompt" v-if="client.status === 'idle' && client.data && !client.data.has_prompt_template" max-width="200">
<v-tooltip text="No LLM prompt template for this model. Using default. Templates can be added in ./templates/llm-prompt" v-if="client.status === 'idle' && client.data && !client.data.has_prompt_template && client.data.meta.requires_prompt_template" max-width="200">
<template v-slot:activator="{ props }">
<v-icon x-size="14" class="mr-1" v-bind="props" color="orange">mdi-alert</v-icon>
</template>
@@ -64,7 +69,7 @@
</v-list>
<ClientModal :dialog="state.dialog" :formTitle="state.formTitle" @save="saveClient" @error="propagateError" @update:dialog="updateDialog"></ClientModal>
<v-alert type="warning" variant="tonal" v-if="state.clients.length === 0">You have no LLM clients configured. Add one.</v-alert>
<v-btn @click="openModal" prepend-icon="mdi-plus-box">Add client</v-btn>
<v-btn @click="openModal" elevation="0" prepend-icon="mdi-plus-box">Add client</v-btn>
</div>
</template>
@@ -85,7 +90,7 @@ export default {
currentClient: {
name: '',
type: '',
apiUrl: '',
api_url: '',
model_name: '',
max_token_length: 4096,
data: {
@@ -107,7 +112,19 @@ export default {
state: this.state
};
},
emits: [
'clients-updated',
'client-assigned',
'open-app-config',
],
methods: {
callErrorAction(client, action) {
if(action.action_name === 'openAppConfig') {
this.$emit('open-app-config', ...action.arguments);
}
},
configurationRequired() {
if(this.state.clients.length === 0) {
return true;
@@ -129,7 +146,7 @@ export default {
this.state.currentClient = {
name: 'TextGenWebUI',
type: 'textgenwebui',
apiUrl: 'http://localhost:5000',
api_url: 'http://localhost:5000',
model_name: '',
max_token_length: 4096,
data: {
@@ -201,10 +218,12 @@ export default {
if (client && !client.dirty) {
// Update the model name of the client
client.model_name = data.model_name;
client.model = client.model_name;
client.type = data.message;
client.status = data.status;
client.max_token_length = data.max_token_length;
client.apiUrl = data.apiUrl;
client.api_url = data.api_url;
client.api_key = data.api_key;
client.data = data.data;
} else if(!client) {
console.log("Adding new client", data);
@@ -212,10 +231,12 @@ export default {
this.state.clients.push({
name: data.name,
model_name: data.model_name,
model: data.model_name,
type: data.message,
status: data.status,
max_token_length: data.max_token_length,
apiUrl: data.apiUrl,
api_url: data.api_url,
api_key: data.api_key,
data: data.data,
});
// sort the clients by name

14
talemate_frontend/src/components/AgentModal.vue
View File

@@ -35,11 +35,15 @@
</div>
<div v-for="(action_config, config_key) in agent.data.actions[key].config" :key="config_key">
<div v-if="action.enabled">
<!-- render config widgets based on action_config.type (int, str, bool, float) -->
<v-text-field v-if="action_config.type === 'text' && action_config.choices === null" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" density="compact" @update:modelValue="save(true)"></v-text-field>
<v-autocomplete v-else-if="action_config.type === 'text' && action_config.choices !== null" v-model="action.config[config_key].value" :items="action_config.choices" :label="action_config.label" :hint="action_config.description" density="compact" item-title="label" item-value="value" @update:modelValue="save(false)"></v-autocomplete>
<v-slider v-if="action_config.type === 'number' && action_config.step !== null" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" :min="action_config.min" :max="action_config.max" :step="action_config.step" density="compact" thumb-label @update:modelValue="save(true)"></v-slider>
<v-checkbox v-if="action_config.type === 'bool'" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" density="compact" @update:modelValue="save(false)"></v-checkbox>
<!-- render config widgets based on action_config.type (int, str, bool, float) -->
<v-text-field v-if="action_config.type === 'text' && action_config.choices === null" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" density="compact" @update:modelValue="save(true)"></v-text-field>
<v-autocomplete v-else-if="action_config.type === 'text' && action_config.choices !== null" v-model="action.config[config_key].value" :items="action_config.choices" :label="action_config.label" :hint="action_config.description" density="compact" item-title="label" item-value="value" @update:modelValue="save(false)"></v-autocomplete>
<v-slider v-if="action_config.type === 'number' && action_config.step !== null" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" :min="action_config.min" :max="action_config.max" :step="action_config.step" density="compact" thumb-label @update:modelValue="save(true)"></v-slider>
<v-checkbox v-if="action_config.type === 'bool'" v-model="action.config[config_key].value" :label="action_config.label" :hint="action_config.description" density="compact" @update:modelValue="save(false)"></v-checkbox>
<v-alert v-if="action_config.note != null" variant="outlined" density="compact" color="grey-darken-1" icon="mdi-information">
{{ action_config.note }}
</v-alert>
</div>
</div>
</v-card-text>

9
talemate_frontend/src/components/AppConfig.vue
View File

@@ -264,10 +264,15 @@ export default {
inject: ['getWebsocket', 'registerMessageHandler', 'setWaitingForInput', 'requestSceneAssets', 'requestAppConfig'],
methods: {
show() {
show(tab, page) {
this.requestAppConfig();
this.dialog = true;
if(tab) {
this.tab = tab;
if(page) {
this[tab + 'PageSelected'] = page;
}
}
},
exit() {
this.dialog = false

13
talemate_frontend/src/components/CharacterCreator.vue
View File

@@ -19,7 +19,7 @@
</v-row>
<v-combobox :items="content_context
" label="Content Context" v-model="scenario_context"></v-combobox>
<v-textarea label="Character prompt" v-model="character_prompt"></v-textarea>
<v-textarea label="Character prompt" v-model="character_prompt" :placeholder="character_prompt_placeholder"></v-textarea>
</v-card-text>
</v-card>
</template>
@@ -175,11 +175,7 @@
</template>
<script>
import { VStepper } from 'vuetify/labs/VStepper'
export default {
components: {
VStepper,
},
name: 'CharacterCreator',
data() {
return {
@@ -194,9 +190,9 @@ export default {
'Add to World',
],
content_context: [
"a fun and engaging slice of life story aimed at an adult audience.",
"a fun and engaging slice of life story",
],
scenario_context: "a fun and engaging slice of life story aimed at an adult audience.",
scenario_context: "a fun and engaging slice of life story",
templates: ["human"],
selected_template: "human",
base_attributes: {},
@@ -210,7 +206,8 @@ export default {
notification_text: '',
is_player_character: false,
use_spice: 0.1,
character_prompt: 'A 19-year-old boy who just did something embarrassing in front of his crush.',
character_prompt: '',
character_prompt_placeholder: 'A short description of the character you want to generate.',
character: null,
description: "",
generating: false,

7
talemate_frontend/src/components/CharacterMessage.vue
View File

@@ -1,5 +1,10 @@
<template>
<v-alert variant="text" closable type="info" icon="mdi-chat-outline" elevation="0" density="compact" @click:close="deleteMessage()" @mouseover="hovered=true" @mouseleave="hovered=false">
<v-alert variant="text" type="info" icon="mdi-chat-outline" elevation="0" density="compact" @mouseover="hovered=true" @mouseleave="hovered=false">
<template v-slot:close>
<v-btn size="x-small" icon @click="deleteMessage">
<v-icon>mdi-close</v-icon>
</v-btn>
</template>
<v-alert-title :style="{ color: color }" class="text-subtitle-1">
{{ character }}
</v-alert-title>

154
talemate_frontend/src/components/ClientModal.vue
View File

@@ -1,5 +1,5 @@
<template>
<v-dialog v-model="localDialog" persistent max-width="600px">
<v-dialog v-model="localDialog" max-width="800px">
<v-card>
<v-card-title>
<v-icon>mdi-network-outline</v-icon>
@@ -9,31 +9,46 @@
<v-container>
<v-row>
<v-col cols="6">
<v-select v-model="client.type" :disabled="!typeEditable()" :items="['openai', 'textgenwebui', 'lmstudio']" label="Client Type" @update:model-value="resetToDefaults"></v-select>
<v-select v-model="client.type" :disabled="!typeEditable()" :items="clientChoices" label="Client Type" @update:model-value="resetToDefaults"></v-select>
</v-col>
<v-col cols="6">
<v-text-field v-model="client.name" label="Client Name"></v-text-field>
</v-col>
</v-row>
<v-row v-if="clientMeta().experimental">
<v-col cols="12">
<v-alert type="warning" variant="text" density="compact" icon="mdi-flask" outlined>{{ clientMeta().experimental }}</v-alert>
</v-col>
</v-row>
<v-row>
<v-col cols="12">
<v-text-field v-model="client.apiUrl" v-if="isLocalApiClient(client)" label="API URL"></v-text-field>
<v-select v-model="client.model" v-if="client.type === 'openai'" :items="['gpt-4-1106-preview', 'gpt-4', 'gpt-3.5-turbo', 'gpt-3.5-turbo-16k']" label="Model"></v-select>
<v-row>
<v-col :cols="clientMeta().enable_api_auth ? 7 : 12">
<v-text-field v-model="client.api_url" v-if="requiresAPIUrl(client)" label="API URL"></v-text-field>
</v-col>
<v-col cols="5">
<v-text-field type="password" v-model="client.api_key" v-if="requiresAPIUrl(client) && clientMeta().enable_api_auth" label="API Key"></v-text-field>
</v-col>
</v-row>
<v-select v-model="client.model" v-if="clientMeta().manual_model && clientMeta().manual_model_choices" :items="clientMeta().manual_model_choices" label="Model"></v-select>
<v-text-field v-model="client.model_name" v-else-if="clientMeta().manual_model" label="Manually specify model name" hint="It looks like we're unable to retrieve the model name automatically. The model name is used to match the appropriate prompt template. This is likely only important if you're locally serving a model."></v-text-field>
</v-col>
</v-row>
<v-row>
<v-col cols="4">
<v-text-field v-model="client.max_token_length" v-if="isLocalApiClient(client)" type="number" label="Context Length"></v-text-field>
<v-text-field v-model="client.max_token_length" v-if="requiresAPIUrl(client)" type="number" label="Context Length"></v-text-field>
</v-col>
<v-col cols="8" v-if="!typeEditable() && client.data && client.data.prompt_template_example !== null">
<v-col cols="8" v-if="!typeEditable() && client.data && client.data.prompt_template_example !== null && client.model_name && clientMeta().requires_prompt_template">
<v-combobox ref="promptTemplateComboBox" label="Prompt Template" v-model="client.data.template_file" @update:model-value="setPromptTemplate" :items="promptTemplates"></v-combobox>
<v-card elevation="3" :color="(client.data.has_prompt_template ? 'primary' : 'warning')" variant="tonal">
<v-card-title>Prompt Template</v-card-title>
<v-card-text>
<div class="text-caption" v-if="!client.data.has_prompt_template">No matching LLM prompt template found. Using default.</div>
<pre>{{ client.data.prompt_template_example }}</pre>
</v-card-text>
<v-card-actions>
<v-btn @click.stop="determineBestTemplate" prepend-icon="mdi-web-box">Determine via HuggingFace</v-btn>
</v-card-actions>
</v-card>
</v-col>
@@ -55,30 +70,19 @@ export default {
dialog: Boolean,
formTitle: String
},
inject: ['state'],
inject: [
'state',
'getWebsocket',
'registerMessageHandler',
],
data() {
return {
promptTemplates: [],
clientTypes: [],
clientChoices: [],
localDialog: this.state.dialog,
client: { ...this.state.currentClient },
defaultValuesByCLientType: {
// when client type is changed in the modal, these values will be used
// to populate the form
'textgenwebui': {
apiUrl: 'http://localhost:5000',
max_token_length: 4096,
name_prefix: 'TextGenWebUI',
},
'openai': {
model: 'gpt-4-1106-preview',
name_prefix: 'OpenAI',
max_token_length: 16384,
},
'lmstudio': {
apiUrl: 'http://localhost:1234',
max_token_length: 4096,
name_prefix: 'LMStudio',
}
}
defaultValuesByCLientType: {}
};
},
watch: {
@@ -86,6 +90,10 @@ export default {
immediate: true,
handler(newVal) {
this.localDialog = newVal;
if (newVal) {
this.requestClientTypes();
this.requestStdTemplates();
}
}
},
'state.currentClient': {
@@ -103,13 +111,13 @@ export default {
const defaults = this.defaultValuesByCLientType[this.client.type];
if (defaults) {
this.client.model = defaults.model || '';
this.client.apiUrl = defaults.apiUrl || '';
this.client.api_url = defaults.api_url || '';
this.client.max_token_length = defaults.max_token_length || 4096;
// loop and build name from prefix, checking against current clients
let name = defaults.name_prefix;
let name = this.clientTypes[this.client.type].name_prefix;
let i = 2;
while (this.state.clients.find(c => c.name === name)) {
name = `${defaults.name_prefix} ${i}`;
name = `${name} ${i}`;
i++;
}
this.client.name = name;
@@ -141,12 +149,90 @@ export default {
return;
}
if(this.clientMeta().manual_model && !this.clientMeta().manual_model_choices) {
this.client.model = this.client.model_name;
}
this.$emit('save', this.client); // Emit save event with client object
this.close();
},
isLocalApiClient(client) {
return client.type === 'textgenwebui' || client.type === 'lmstudio';
clientMeta() {
if(!Object.keys(this.clientTypes).length)
return {defaults:{}};
if(!this.clientTypes[this.client.type])
return {defaults:{}};
return this.clientTypes[this.client.type];
},
requiresAPIUrl() {
return this.clientMeta().defaults.api_url != null;
},
requestStdTemplates() {
this.getWebsocket().send(JSON.stringify({
type: 'config',
action: 'request_std_llm_templates',
data: {}
}));
},
requestClientTypes() {
this.getWebsocket().send(JSON.stringify({
type: 'config',
action: 'request_client_types',
data: {}
}));
},
determineBestTemplate() {
this.getWebsocket().send(JSON.stringify({
type: 'config',
action: 'determine_llm_template',
data: {
model: this.client.model_name,
}
}));
},
setPromptTemplate() {
this.getWebsocket().send(JSON.stringify({
type: 'config',
action: 'set_llm_template',
data: {
template_file: this.client.data.template_file,
model: this.client.model_name,
}
}));
this.$refs.promptTemplateComboBox.blur();
},
handleMessage(data) {
if (data.type === 'config' && data.action === 'set_llm_template_complete') {
this.client.data.has_prompt_template = data.data.has_prompt_template;
this.client.data.prompt_template_example = data.data.prompt_template_example;
this.client.data.template_file = data.data.template_file;
} else if (data.type === 'config' && data.action === 'std_llm_templates') {
console.log("Got std templates", data.data.templates);
this.promptTemplates = data.data.templates;
} else if (data.type === 'config' && data.action === 'client_types') {
console.log("Got client types", data.data);
this.clientTypes = data.data;
// build clientChoices from clientTypes
// build defaults from clientTypes[type].defaults
this.clientChoices = [];
for (let client_type in this.clientTypes) {
this.clientChoices.push({
title: this.clientTypes[client_type].title,
value: client_type,
});
this.defaultValuesByCLientType[client_type] = this.clientTypes[client_type].defaults;
}
}
}
}
},
created() {
this.registerMessageHandler(this.handleMessage);
},
}
</script>

9
talemate_frontend/src/components/CreativeEditor.vue
View File

@@ -1,5 +1,5 @@
<template>
<CreativeMenu ref="menu"/>
<CreativeMenu ref="menu" @open-world-state-manager="onOpenWorldStateManager"/>
<CharacterCreator ref="characterCreator"/>
<CharacterImporter ref="characterImporter"/>
<SceneCreator ref="sceneCreator"/>
@@ -40,7 +40,14 @@ export default {
'setWaitingForInput',
],
emits: [
'open-world-state-manager',
],
methods: {
onOpenWorldStateManager(tab, sub1, sub2, sub3) {
this.$emit('open-world-state-manager', tab, sub1, sub2, sub3);
},
handleMessage(data) {
if(data.type === 'world_state') {
console.log("world_state");

63
talemate_frontend/src/components/CreativeMenu.vue
View File

@@ -5,35 +5,77 @@
</v-list-subheader>
<div ref="charactersContainer">
<v-list>
<v-list density="compact">
<!-- active characters -->
<v-list-item density="compact" v-for="(character,index) in scene.characters" :key="index">
<v-list-item-title>
{{ character.name }}
</v-list-item-title>
<div class="text-center mt-1 mb-1">
<v-tooltip text="Remove">
<v-tooltip text="Permanently Delete">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" color="red" icon="mdi-account-cancel" @click.stop="removeCharacterFromScene(character.name)"></v-btn>
</template>
</v-tooltip>
<v-tooltip text="Edit character">
<v-tooltip text="Deactivate">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" icon="mdi-account-edit" @click.stop="openCharacterCreatorForCharacter(character.name)"></v-btn>
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" color="secondary" icon="mdi-exit-run" @click.stop="getWebsocket().send(JSON.stringify({type: 'interact', text: '!char_d:'+character.name+':no'}))"></v-btn>
</template>
</v-tooltip>
<v-tooltip v-if="false" text="Character sheet">
<v-tooltip text="Edit character">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" icon="mdi-account-details"></v-btn>
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" icon="mdi-account-edit" @click.stop="openWorldStateManager('characters',character.name, 'description')"></v-btn>
</template>
</v-tooltip>
<v-tooltip text="Open character template in character creator" v-if="character.base_attributes._template">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" icon="mdi-badge-account-outline" @click.stop="openCharacterCreatorForCharacter(character.name)"></v-btn>
</template>
</v-tooltip>
</div>
<v-divider></v-divider>
</v-list-item>
<!-- inactive characters -->
<v-list-item v-for="(character_name, index) in scene.inactive_characters" density="compact" :key="index">
<v-list-item-title class="text-grey-darken-1">
{{ character_name }}
</v-list-item-title>
<div class="text-center mt-1 mb-1">
<v-tooltip text="Permanently Delete">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" color="red" icon="mdi-account-cancel" @click.stop="removeCharacterFromScene(character_name)"></v-btn>
</template>
</v-tooltip>
<v-tooltip text="Activate (call to scene)">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" color="secondary" icon="mdi-human-greeting" @click.stop="getWebsocket().send(JSON.stringify({type: 'interact', text: '!char_a:'+character_name+':no'}))"></v-btn>
</template>
</v-tooltip>
<v-tooltip text="Edit character">
<template v-slot:activator="{ props }">
<v-btn size="x-small" class="mr-1" v-bind="props" variant="tonal" density="comfortable" rounded="sm" icon="mdi-account-edit" @click.stop="openWorldStateManager('characters',character_name, 'description')"></v-btn>
</template>
</v-tooltip>
</div>
<v-divider></v-divider>
</v-list-item>
<!-- add / import character -->
<v-list-item>
<v-tooltip text="Add character">
<template v-slot:activator="{ props }">
@@ -92,6 +134,9 @@ export default {
'openCharacterImporter',
'openSceneCreator',
],
emits: [
'open-world-state-manager',
],
methods: {
toggle() {
this.expanded = !this.expanded;
@@ -99,7 +144,7 @@ export default {
removeCharacterFromScene(character) {
let confirm = window.confirm(`Are you sure you want to remove ${character} from the scene?`);
let confirm = window.confirm(`Are you sure you want to remove ${character} from the game?`);
if(!confirm) {
return;
@@ -111,6 +156,10 @@ export default {
}));
},
openWorldStateManager(tab, sub1, sub2, sub3) {
this.$emit('open-world-state-manager', tab, sub1, sub2, sub3);
},
handleMessage(data) {
if(data.type === 'scene_status' && data.status === 'started') {
this.scene = data.data;

172
talemate_frontend/src/components/IntroRecentScenes.vue Normal file
View File

@@ -0,0 +1,172 @@
<template>
<v-card flat variant="text" v-if="hasRecentScenes()">
<v-card-title>
Recent Saves
</v-card-title>
<v-card-subtitle>
Continue your story
</v-card-subtitle>
<!--
horizontal scroll from config.recent_scenes.scenes
if sceneLoadingAvailable, clicking the scene should load it
scene object has the following properties:
- name
- path (path to load)
- filename (filename to display, sans extension)
- cover_image (cover image to request - asset id)
- date (date to display, iso format)
-->
<v-card-text v-if="config != null">
<div class="tiles">
<div class="tile" v-for="(scene, index) in recentScenes()" :key="index">
<v-card density="compact" elevation="7" @click="loadScene(scene)" color="primary" variant="outlined">
<v-card-title>
{{ scene.name }}
</v-card-title>
<v-card-subtitle>
{{ scene.filename }}
</v-card-subtitle>
<v-card-text>
<div class="cover-image-placeholder">
<v-img cover v-if="scene.cover_image != null && coverImages[scene.cover_image.id] != null" :src="getCoverImageSrc(scene.cover_image.id)"></v-img>
</div>
<p class="text-caption text-center text-grey-lighten-1">{{ prettyDate(scene.date) }}</p>
</v-card-text>
</v-card>
</div>
</div>
</v-card-text>
</v-card>
</template>
<script>
export default {
name: 'IntroRecentScenes',
props: {
sceneLoadingAvailable: Boolean,
config: Object,
},
inject: ['requestAssets', 'getWebsocket', 'registerMessageHandler'],
data() {
return {
coverImages: {},
}
},
emits: ['request-scene-load'],
watch: {
config(newVal) {
if(newVal != null) {
this.requestCoverImages();
}
}
},
methods: {
hasRecentScenes() {
return this.config != null && this.config.recent_scenes != null && this.config.recent_scenes.scenes != null && this.config.recent_scenes.scenes.length > 0;
},
prettyDate(date) {
// 2024-01-20T03:35:00.109492
let d = new Date(date);
return d.toLocaleString();
},
requestCoverImages() {
if(this.config.recent_scenes != null) {
if(this.config.recent_scenes.scenes != null) {
let coverImageIds = [];
for(let scene of this.config.recent_scenes.scenes) {
if(scene.cover_image != null) {
coverImageIds.push({
"path": scene.path,
"id": scene.cover_image.id,
"media_type": scene.cover_image.media_type,
"file_type": scene.cover_image.file_type,
});
}
}
this.requestAssets(coverImageIds);
}
}
},
loadScene(scene) {
this.$emit("request-scene-load", scene.path)
},
recentScenes() {
if(!this.config.recent_scenes) {
return [];
}
return this.config.recent_scenes.scenes;
},
getCachedCoverImage(assetId) {
if(this.coverImages[assetId]) {
return this.coverImages[assetId];
} else {
return null;
}
},
getCoverImageSrc(assetId) {
if(this.coverImages[assetId]) {
return 'data:'+this.coverImages[assetId].mediaType+';base64, '+this.coverImages[assetId].base64;
} else {
return null;
}
},
handleMessage(data) {
if(data.type === 'assets') {
console.log("ASSEsTS", data.assets)
for(let id in data.assets) {
let asset = data.assets[id];
this.coverImages[id] = {
base64: asset.base64,
mediaType: asset.mediaType,
};
}
console.log("assets", this.coverImages, data)
}
},
},
created() {
this.registerMessageHandler(this.handleMessage);
},
}
</script>
<style scoped>
.cover-image-placeholder {
position: relative;
height: 275px;
width: 100%;
background-color: transparent;
background-image: url('/src/assets/logo-13.1-backdrop.png');
background-repeat: no-repeat;
background-position: center;
background-size: cover;
overflow: hidden;
}
/* flud flex tiles with fixed width */
.tiles {
display: flex;
flex-wrap: wrap;
justify-content: left;
overflow: hidden;
}
.tile {
flex: 0 0 275px;
margin: 10px;
}
</style>

61
talemate_frontend/src/components/IntroView.vue Normal file
View File

@@ -0,0 +1,61 @@
<template>
<v-row>
<v-col cols="12" v-if="sceneLoadingAvailable">
<IntroRecentScenes :config="config" :scene-loading-available="sceneLoadingAvailable" @request-scene-load="requestSceneLoad"/>
</v-col>
</v-row>
<v-row v-if="false">
<v-col cols="4">
<!-- Welcome / Recent changes / Version INFO-->
<v-card>
<v-card-title>
What's new?
</v-card-title>
<v-card-subtitle>version {{ version }}</v-card-subtitle>
<v-card-text>
<v-list dense>
<v-list-item v-for="(item, index) in changelog" :key="index">
{{ item }}
</v-list-item>
</v-list>
</v-card-text>
</v-card>
</v-col>
</v-row>
</template>
<script>
import IntroRecentScenes from './IntroRecentScenes.vue';
export default {
name: 'IntroView',
components: {
IntroRecentScenes
},
props: {
version: String,
sceneLoadingAvailable: Boolean,
config: Object,
},
emits: ['request-scene-load'],
data() {
return {
changelog: [
"This screen was added",
"Item 2",
"Item 3",
"Item 4",
]
}
},
methods: {
requestSceneLoad(scene) {
this.$emit('request-scene-load', scene);
}
}
}
</script>

7
talemate_frontend/src/components/LoadScene.vue
View File

@@ -165,6 +165,13 @@ export default {
this.sceneInput = '';
}
},
loadJsonSceneFromPath(path) {
this.loading = true;
this.$emit("loading", true)
this.getWebsocket().send(JSON.stringify({ type: 'load_scene', file_path: path }));
},
handleMessage(data) {
// Handle app configuration
if (data.type === 'app_config') {

8
talemate_frontend/src/components/NarratorMessage.vue
View File

@@ -1,6 +1,10 @@
<template>
<v-alert variant="text" :closable="message_id !== null" type="info" icon="mdi-script-text-outline" elevation="0" density="compact" @click:close="deleteMessage()" @mouseover="hovered=true" @mouseleave="hovered=false">
<v-alert variant="text" type="info" icon="mdi-script-text-outline" elevation="0" density="compact" @mouseover="hovered=true" @mouseleave="hovered=false">
<template v-slot:close>
<v-btn size="x-small" icon @click="deleteMessage">
<v-icon>mdi-close</v-icon>
</v-btn>
</template>
<div class="narrator-message">
<v-textarea ref="textarea" v-if="editing" v-model="editing_text" @keydown.enter.prevent="submitEdit()" @blur="cancelEdit()" @keydown.escape.prevent="cancelEdit()">
</v-textarea>

8
talemate_frontend/src/components/SceneMessages.vue
View File

@@ -144,13 +144,13 @@ export default {
// find message where type == "character" and id == data.id
// remove that message from the array
let newMessages = [];
for (i = 0; i < this.messages.length; i++) {
if (this.messages[i].id == data.id) {
this.messages.splice(i, 1);
break;
if (this.messages[i].id != data.id) {
newMessages.push(this.messages[i]);
}
}
this.messages = newMessages;
return
}

237
talemate_frontend/src/components/SceneTools.vue
View File

@@ -4,12 +4,17 @@
<v-spacer></v-spacer>
<!-- quick settings as v-chips -->
<v-chip size="x-small" v-for="(option, index) in quickSettings" :key="index" @click="toggleQuickSetting(option.value)"
:color="option.status() ? 'success' : 'grey'"
:color="option.status() === true ? 'success' : 'grey'"
:disabled="isInputDisabled()" class="ma-1">
<v-icon class="mr-1">{{ option.icon }}</v-icon>
{{ option.title }}
<v-icon class="ml-1" v-if="option.status()">mdi-check-circle-outline</v-icon>
<v-icon class="ml-1" v-else>mdi-circle-outline</v-icon>
<v-icon class="ml-1" v-if="option.status() === true">mdi-check-circle-outline</v-icon>
<v-icon class="ml-1" v-else-if="option.status() === false">mdi-circle-outline</v-icon>
<v-tooltip v-else :text="option.status()">
<template v-slot:activator="{ props }">
<v-icon class="ml-1" v-bind="props" color="orange">mdi-alert-outline</v-icon>
</template>
</v-tooltip>
</v-chip>
</v-sheet>
@@ -30,20 +35,24 @@
<v-tooltip v-if="isEnvironment('scene')" :disabled="isInputDisabled()" location="top"
text="Redo most recent AI message">
:text="'Redo most recent AI message.\n[Ctrl: Provide instructions, +Alt: Rewrite]'"
class="pre-wrap"
max-width="300px">
<template v-slot:activator="{ props }">
<v-btn class="hotkey" v-bind="props" :disabled="isInputDisabled()"
@click="sendHotButtonMessage('!rerun')" color="primary" icon>
@click="rerun" color="primary" icon>
<v-icon>mdi-refresh</v-icon>
</v-btn>
</template>
</v-tooltip>
<v-tooltip v-if="isEnvironment('scene')" :disabled="isInputDisabled()" location="top"
text="Redo most recent AI message (Nuke Option - use this to attempt to break out of repetition)">
:text="'Redo most recent AI message (Nuke Option - use this to attempt to break out of repetition) \n[Ctrl: Provide instructions, +Alt: Rewrite]'"
class="pre-wrap"
max-width="300px">
<template v-slot:activator="{ props }">
<v-btn class="hotkey" v-bind="props" :disabled="isInputDisabled()"
@click="sendHotButtonMessage('!rerun:0.5')" color="primary" icon>
@click="rerunNuke" color="primary" icon>
<v-icon>mdi-nuke</v-icon>
</v-btn>
</template>
@@ -221,6 +230,68 @@
</v-list>
</v-menu>
<!-- creative / game mode toggle -->
<v-menu v-if="isEnvironment('scene')">
<template v-slot:activator="{ props }">
<v-btn class="hotkey mx-3" v-bind="props" :disabled="isInputDisabled()" color="primary" icon>
<v-icon>mdi-puzzle-edit</v-icon>
<v-icon v-if="potentialNewCharactersExist()" class="btn-notification" color="warning">mdi-human-greeting</v-icon>
</v-btn>
</template>
<v-list>
<v-list-subheader>Creative Tools</v-list-subheader>
<!-- deactivate active characters -->
<v-list-item v-for="(character, index) in deactivatableCharacters" :key="index"
@click="deactivateCharacter($event, character)">
<template v-slot:prepend>
<v-icon color="secondary">mdi-exit-run</v-icon>
</template>
<v-list-item-title>Take out of scene: {{ character }}<v-chip variant="text" color="info" class="ml-1" size="x-small">Ctrl: no narration</v-chip></v-list-item-title>
<v-list-item-subtitle>Make {{ character }} a passive character.</v-list-item-subtitle>
</v-list-item>
<!-- reactivate inactive characters -->
<v-list-item v-for="(character, index) in inactiveCharacters" :key="index"
@click="activateCharacter($event, character)">
<template v-slot:prepend>
<v-icon color="secondary">mdi-human-greeting</v-icon>
</template>
<v-list-item-title>Call into scene: {{ character }}<v-chip variant="text" color="info" class="ml-1" size="x-small">Ctrl: no narration</v-chip></v-list-item-title>
<v-list-item-subtitle>Make {{ character }} an active character.</v-list-item-subtitle>
</v-list-item>
<!-- persist passive characters -->
<v-list-item v-for="(character, index) in potentialNewCharacters()" :key="index"
@click="introduceCharacter($event, character)">
<template v-slot:prepend>
<v-icon color="warning">mdi-human-greeting</v-icon>
</template>
<v-list-item-title>Introduce {{ character }}<v-chip variant="text" color="info" class="ml-1" size="x-small">Ctrl: no narration</v-chip></v-list-item-title>
<v-list-item-subtitle>Make {{ character }} an active character.</v-list-item-subtitle>
</v-list-item>
<!-- static tools -->
<v-list-item v-for="(option, index) in creativeGameMenu" :key="index"
@click="sendHotButtonMessage('!' + option.value)"
:prepend-icon="option.icon">
<v-list-item-title>{{ option.title }}</v-list-item-title>
<v-list-item-subtitle>{{ option.description }}</v-list-item-subtitle>
</v-list-item>
</v-list>
</v-menu>
<v-tooltip v-else-if="isEnvironment('creative')" :disabled="isInputDisabled()" location="top" text="Switch to game mode">
<template v-slot:activator="{ props }">
<v-btn class="hotkey mx-3" v-bind="props" :disabled="isInputDisabled()"
@click="sendHotButtonMessage('!setenv_scene')" color="primary" icon>
<v-icon>mdi-gamepad-square</v-icon>
</v-btn>
</template>
</v-tooltip>
<!-- save menu -->
<v-menu>
@@ -240,26 +311,6 @@
</v-list>
</v-menu>
<!-- creative / game mode toggle -->
<v-tooltip v-if="isEnvironment('scene')" :disabled="isInputDisabled()" location="top" text="Switch to creative mode">
<template v-slot:activator="{ props }">
<v-btn class="hotkey mx-3" v-bind="props" :disabled="isInputDisabled()"
@click="sendHotButtonMessage('!setenv_creative')" color="primary" icon>
<v-icon>mdi-palette-outline</v-icon>
</v-btn>
</template>
</v-tooltip>
<v-tooltip v-else-if="isEnvironment('creative')" :disabled="isInputDisabled()" location="top" text="Switch to game mode">
<template v-slot:activator="{ props }">
<v-btn class="hotkey mx-3" v-bind="props" :disabled="isInputDisabled()"
@click="sendHotButtonMessage('!setenv_scene')" color="primary" icon>
<v-icon>mdi-gamepad-square</v-icon>
</v-btn>
</template>
</v-tooltip>
</v-card-actions>
</v-card>
@@ -273,16 +324,35 @@
export default {
name: 'SceneTools',
props: {
passiveCharacters: Array,
inactiveCharacters: Array,
activeCharacters: Array,
playerCharacterName: String,
},
computed: {
deactivatableCharacters: function() {
// this.activeCharacters without playerCharacterName
let characters = [];
for (let character of this.activeCharacters) {
if (character !== this.playerCharacterName) {
characters.push(character);
}
}
return characters;
}
},
data() {
return {
commandActive: false,
commandName: null,
autoSave: true,
autoProgress: true,
canAutoSave: false,
npc_characters: [],
quickSettings: [
{"value": "toggleAutoSave", "title": "Auto Save", "icon": "mdi-content-save", "description": "Automatically save after each game-loop", "status": () => { return this.autoSave; }},
{"value": "toggleAutoSave", "title": "Auto Save", "icon": "mdi-content-save", "description": "Automatically save after each game-loop", "status": () => { return this.canAutoSave ? this.autoSave : "Manually save scene for auto-save to be available"; }},
{"value": "toggleAutoProgress", "title": "Auto Progress", "icon": "mdi-robot", "description": "AI automatically progresses after player turn.", "status": () => { return this.autoProgress }},
],
@@ -303,6 +373,11 @@ export default {
{"value": "ai_dialogue", "title": "Talk", "icon": "mdi-comment-text-outline", "description": "Generate dialogue"},
],
creativeGameMenu: [
{"value": "pc:prompt", "title": "Introduce new character (Directed)", "icon": "mdi-account-plus", "description": "Generate a new active character, based on prompt."},
{"value": "setenv_creative", "title": "Creative Mode", "icon": "mdi-puzzle-edit", "description": "Switch to creative mode (very early experimental version)"},
],
advanceTimeOptions: [
{"value" : "P10Y", "title": "10 years"},
{"value" : "P5Y", "title": "5 years"},
@@ -341,14 +416,63 @@ export default {
'getTrackedWorldState',
'getPlayerCharacterName',
'formatWorldStateTemplateString',
'characterSheet',
],
computed:{
},
emits: [
'open-world-state-manager',
],
methods: {
potentialNewCharacters() {
// return all entries in passiveCharacters that dont exist in
// inactiveCharacters
let newCharacters = [];
for (let character of this.passiveCharacters) {
if (!this.inactiveCharacters.includes(character)) {
newCharacters.push(character);
}
}
return newCharacters;
},
activateCharacter(ev, name) {
let modifyNoNarration = ev.ctrlKey;
if(!modifyNoNarration) {
this.sendHotButtonMessage('!char_a:' + name);
} else {
this.sendHotButtonMessage('!char_a:' + name + ':no');
}
},
deactivateCharacter(ev, name) {
let modifyNoNarration = ev.ctrlKey;
if(!modifyNoNarration) {
this.sendHotButtonMessage('!char_d:' + name);
} else {
this.sendHotButtonMessage('!char_d:' + name + ':no');
}
},
introduceCharacter(ev, name) {
let modifyNoNarration = ev.ctrlKey;
if(!modifyNoNarration) {
this.sendHotButtonMessage('!persist_character:' + name);
} else {
this.sendHotButtonMessage('!persist_character:' + name + ':no');
}
},
potentialNewCharactersExist() {
return this.potentialNewCharacters().length > 0;
},
passiveCharactersExist() {
return this.passiveCharacters.length > 0;
},
passiveCharacterExists(name) {
return this.passiveCharacters.includes(name);
},
isEnvironment(typ) {
return this.scene().environment == typ;
@@ -464,6 +588,38 @@ export default {
this.getWebsocket().send(JSON.stringify({ type: 'interact', text: '!ws' }));
},
rerun(event) {
console.log("EVENT", event)
// if ctrl is pressed use directed rerun
let withDirection = event.ctrlKey;
let method = event.altKey || event.metaKey ? "edit" : "replace";
let command = "!rerun";
if(withDirection)
command += "_directed";
command += ":0.0:"+method;
// if alt is pressed
this.sendHotButtonMessage(command)
},
rerunNuke(event) {
// if ctrl is pressed use directed rerun
let withDirection = event.ctrlKey;
let method = event.altKey || event.metaKey ? "edit" : "replace";
let command = "!rerun";
if(withDirection)
command += "_directed";
// 0.5 nuke adjustment
command += ":0.5:"+method;
this.sendHotButtonMessage(command)
},
handleMessage(data) {
if (data.type === "command_status") {
@@ -475,6 +631,7 @@ export default {
this.commandName = null;
}
} else if (data.type === "scene_status") {
this.canAutoSave = data.data.can_auto_save;
this.autoSave = data.data.auto_save;
this.autoProgress = data.data.auto_progress;
console.log({autoSave: this.autoSave, autoProgress: this.autoProgress});
@@ -492,7 +649,8 @@ export default {
}
}
},
},
mounted() {
console.log("Websocket", this.getWebsocket()); // Check if websocket is available
@@ -518,4 +676,21 @@ export default {
align-items: center;
margin-right: 20px;
}
.pre-wrap {
white-space: pre-wrap;
}
.btn-notification {
position: absolute;
top: 0px;
right: 0px;
font-size: 15px;
border-radius: 50%;
width: 20px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
}
</style>

42
talemate_frontend/src/components/TalemateApp.vue
View File

@@ -17,10 +17,9 @@
<!-- <GameOptions v-if="sceneActive" ref="gameOptions" /> -->
<v-divider></v-divider>
<CoverImage v-if="sceneActive" ref="coverImage" />
<WorldState v-if="sceneActive" ref="worldState" />
<WorldState v-if="sceneActive" ref="worldState" @passive-characters="(characters) => { passiveCharacters = characters }" />
</div>
<CreativeEditor v-if="sceneActive" ref="creativeEditor" />
<CreativeEditor v-if="sceneActive" ref="creativeEditor" @open-world-state-manager="onOpenWorldStateManager" />
</v-list>
</v-navigation-drawer>
@@ -38,7 +37,7 @@
<v-list-subheader class="text-uppercase"><v-icon>mdi-network-outline</v-icon>
Clients</v-list-subheader>
<v-list-item>
<AIClient ref="aiClient" @save="saveClients" @error="uxErrorHandler" @clients-updated="saveClients" @client-assigned="saveAgents"></AIClient>
<AIClient ref="aiClient" @save="saveClients" @error="uxErrorHandler" @clients-updated="saveClients" @client-assigned="saveAgents" @open-app-config="openAppConfig"></AIClient>
</v-list-item>
<v-divider></v-divider>
<v-list-subheader class="text-uppercase"><v-icon>mdi-transit-connection-variant</v-icon> Agents</v-list-subheader>
@@ -120,7 +119,12 @@
<div style="flex-shrink: 0;" v-if="sceneActive">
<SceneTools @open-world-state-manager="onOpenWorldStateManager"/>
<SceneTools
@open-world-state-manager="onOpenWorldStateManager"
:playerCharacterName="getPlayerCharacterName()"
:passiveCharacters="passiveCharacters"
:inactiveCharacters="inactiveCharacters"
:activeCharacters="activeCharacters" />
<CharacterSheet ref="characterSheet" />
<SceneHistory ref="sceneHistory" />
@@ -141,6 +145,13 @@
</template>
</v-text-field>
</div>
<IntroView v-else
@request-scene-load="(path) => { $refs.loadScene.loadJsonSceneFromPath(path); }"
:version="version"
:scene-loading-available="!configurationRequired() && connected"
:config="appConfig" />
</v-container>
</v-main>
@@ -169,6 +180,8 @@ import DebugTools from './DebugTools.vue';
import AudioQueue from './AudioQueue.vue';
import StatusNotification from './StatusNotification.vue';
import IntroView from './IntroView.vue';
export default {
components: {
AIClient,
@@ -186,6 +199,7 @@ export default {
DebugTools,
AudioQueue,
StatusNotification,
IntroView,
},
name: 'TalemateApp',
data() {
@@ -209,6 +223,9 @@ export default {
inputHint: 'Enter your text...',
messageInput: '',
reconnectInterval: 3000,
passiveCharacters: [],
inactiveCharacters: [],
activeCharacters: [],
messageHandlers: [],
scene: {},
appConfig: {},
@@ -238,6 +255,7 @@ export default {
getClients: () => this.getClients(),
getAgents: () => this.getAgents(),
requestSceneAssets: (asset_ids) => this.requestSceneAssets(asset_ids),
requestAssets: (assets) => this.requestAssets(assets),
openCharacterSheet: (characterName) => this.openCharacterSheet(characterName),
characterSheet: () => this.$refs.characterSheet,
creativeEditor: () => this.$refs.creativeEditor,
@@ -305,6 +323,7 @@ export default {
if (data.id === 'scene.loaded') {
this.loading = false;
this.sceneActive = true;
this.requestAppConfig();
}
if(data.status == 'error') {
this.errorNotification = true;
@@ -325,6 +344,10 @@ export default {
player_character_name: data.data.player_character_name,
}
this.sceneActive = true;
this.inactiveCharacters = data.data.inactive_characters;
// data.data.characters is a list of all active characters in the scene
// collect character.name into list of active characters
this.activeCharacters = data.data.characters.map((character) => character.name);
return;
}
@@ -399,6 +422,9 @@ export default {
requestSceneAssets(asset_ids) {
this.websocket.send(JSON.stringify({ type: 'request_scene_assets', asset_ids: asset_ids }));
},
requestAssets(assets) {
this.websocket.send(JSON.stringify({ type: 'request_assets', assets: assets }));
},
setNavigation(navigation) {
if (navigation == "game")
this.sceneDrawer = true;
@@ -463,8 +489,8 @@ export default {
onOpenWorldStateManager(tab, sub1, sub2, sub3) {
this.$refs.worldState.openWorldStateManager(tab, sub1, sub2, sub3);
},
openAppConfig() {
this.$refs.appConfig.show();
openAppConfig(tab, page) {
this.$refs.appConfig.show(tab, page);
},
uxErrorHandler(error) {
this.errorNotification = true;
@@ -522,7 +548,7 @@ export default {
if (this.inputHint != this.scene.player_character_name+":") {
return 'warning';
} else {
return 'purple-lighten-3';
return 'deep-purple-lighten-2';
}
}
return null;

16
talemate_frontend/src/components/WorldState.vue
View File

@@ -228,6 +228,10 @@ export default {
'formatWorldStateTemplateString',
],
emits: [
'passive-characters',
],
methods: {
onResize() {
this.worldStateMaxHeight = this.availableHeight();
@@ -257,8 +261,18 @@ export default {
}
},
openWorldStateManager(tab, sub1, sub2, sub3) {
console.log("OPENING WORLDSTATE MANAGER", tab, sub1, sub2, sub3)
this.$refs.worldStateManager.show(tab, sub1, sub2, sub3);
},
passiveCharacters() {
let characters = [];
for(let character in this.characters) {
if(!this.characterSheet().characterExists(character)) {
characters.push(character);
}
}
this.$emit('passive-characters', characters);
},
lookAtCharacter(name) {
this.getWebsocket().send(JSON.stringify({
type: 'interact',
@@ -356,6 +370,8 @@ export default {
}
}
this.passiveCharacters();
//this.onResize()
} else if (data.type == "scene_status") {
this.sceneTime = data.data.scene_time;

22
talemate_frontend/src/components/WorldStateManager.vue
View File

@@ -266,7 +266,7 @@
</v-col>
<v-col cols="8">
<div v-if="selectedCharacterStateReinforcer">
<v-textarea rows="3" auto-grow max-rows="15" :label="selectedCharacterStateReinforcer" v-model="characterDetails.reinforcements[selectedCharacterStateReinforcer].answer" @update:modelValue="queueUpdateCharacterStateReinforcement(selectedCharacterStateReinforcer)" :color="characterStateReinforcerDirty ? 'info' : ''"></v-textarea>
<v-textarea rows="5" auto-grow max-rows="15" :label="selectedCharacterStateReinforcer" v-model="characterDetails.reinforcements[selectedCharacterStateReinforcer].answer" @update:modelValue="queueUpdateCharacterStateReinforcement(selectedCharacterStateReinforcer)" :color="characterStateReinforcerDirty ? 'info' : ''"></v-textarea>
<v-row>
<v-col cols="6">
@@ -303,10 +303,20 @@
</v-btn>
</div>
</v-col>
<v-col cols="6" class="text-right">
<v-col cols="6" class="text-right flex">
<v-btn rounded="sm" prepend-icon="mdi-refresh" @click.stop="runCharacterStateReinforcement(selectedCharacterStateReinforcer)" color="primary" variant="text">
Refresh State
</v-btn>
<v-tooltip text="Removes all previously generated reinforcements for this state and then regenerates it">
<template v-slot:activator="{ props }">
<v-btn v-if="resetCharacterStateReinforcerConfirm === true" v-bind="props" rounded="sm" prepend-icon="mdi-backup-restore" @click.stop="runCharacterStateReinforcement(selectedCharacterStateReinforcer, true)" color="warning" variant="text">
Confirm Reset State
</v-btn>
<v-btn v-else v-bind="props" rounded="sm" prepend-icon="mdi-backup-restore" @click.stop="resetCharacterStateReinforcerConfirm=true" color="warning" variant="text">
Reset State
</v-btn>
</template>
</v-tooltip>
</v-col>
</v-row>
</div>
@@ -655,6 +665,7 @@ export default {
removeCharacterAttributeConfirm: false,
removeCharacterDetailConfirm: false,
removeCharacterStateReinforcerConfirm: false,
resetCharacterStateReinforcerConfirm: false,
characterAttributeSearch: null,
characterDetailSearch: null,
@@ -833,6 +844,7 @@ export default {
this.newCharacterDetailValue = null;
this.removeCharacterAttributeConfirm = false;
this.removeCharacterDetailConfirm = false;
this.resetCharacterStateReinforcerConfirm = false;
this.characterAttributeSearch = null;
this.characterDetailSearch = null;
this.newCharacterStateReinforcerInterval = 10;
@@ -1141,14 +1153,18 @@ export default {
this.selectedCharacterStateReinforcer = Object.keys(this.characterDetails.reinforcements)[0];
},
runCharacterStateReinforcement(name) {
runCharacterStateReinforcement(name, reset) {
this.isBusy = true;
this.getWebsocket().send(JSON.stringify({
type: 'world_state_manager',
action: 'run_character_detail_reinforcement',
name: this.selectedCharacter,
question: name,
reset: reset || false,
}));
this.resetCharacterStateReinforcerConfirm = false;
},
// character description

18
talemate_frontend/src/components/WorldStateManagerWorld.vue
View File

@@ -216,6 +216,16 @@
</v-btn>
</span>
<v-spacer></v-spacer>
<v-tooltip text="Removes all previously generated reinforcements for this state and then regenerates it">
<template v-slot:activator="{ props }">
<v-btn v-if="resetStateReinforcerConfirm === true" v-bind="props" rounded="sm" prepend-icon="mdi-backup-restore" @click.stop="runStateReinforcement(true)" color="warning" variant="text">
Confirm Reset State
</v-btn>
<v-btn v-else v-bind="props" rounded="sm" prepend-icon="mdi-backup-restore" @click.stop="resetStateReinforcerConfirm=true" color="warning" variant="text">
Reset State
</v-btn>
</template>
</v-tooltip>
<v-btn rounded="sm" prepend-icon="mdi-refresh" @click.stop="runStateReinforcement()" color="primary" variant="text">
Refresh State
</v-btn>
@@ -251,6 +261,7 @@ export default {
saveEntryTimeout: null,
deleteConfirm: false,
deferedNavigation: null,
resetStateReinforcerConfirm: false,
dirty: false,
busy: false,
baseEntry: {
@@ -487,13 +498,16 @@ export default {
}));
},
runStateReinforcement() {
runStateReinforcement(reset) {
this.busy=true;
this.getWebsocket().send(JSON.stringify({
type: 'world_state_manager',
action: 'run_world_state_reinforcement',
question: this.state.question
question: this.state.question,
reset: reset || false,
}));
this.resetStateReinforcerConfirm = false;
},
requestWorld: function () {

10
talemate_frontend/src/plugins/vuetify.js
View File

@@ -4,9 +4,17 @@ import 'vuetify/styles'
// Vuetify
import { createVuetify } from 'vuetify'
import colors from 'vuetify/util/colors'
export default createVuetify({
theme : {
defaultTheme: 'dark'
defaultTheme: 'dark',
themes: {
dark: {
colors: {
primary: colors.deepPurple.lighten2,
}
}
}
}
})