Compare commits
1 Commits
feature_ke
...
master
Author | SHA1 | Date |
---|---|---|
reddigriz | 3c26215da3 | 2 years ago |
Binary file not shown.
Before Width: | Height: | Size: 2.5 MiB |
@ -1,46 +0,0 @@
|
|||||||
{
|
|
||||||
"history": [
|
|
||||||
{
|
|
||||||
"id": 1,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": false,
|
|
||||||
"seen": false,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 2,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": true,
|
|
||||||
"seen": true,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 3,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": false,
|
|
||||||
"seen": true,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 4,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": true,
|
|
||||||
"seen": true,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 5,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": false,
|
|
||||||
"seen": false,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"id": 6,
|
|
||||||
"text": "🐱⛸️➡️?",
|
|
||||||
"is_user": true,
|
|
||||||
"seen": true,
|
|
||||||
"date": "22/09 12:12"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
@ -0,0 +1 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69" xmlns:v="https://vecta.io/nano"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg>
|
After Width: | Height: | Size: 308 B |
@ -0,0 +1,14 @@
|
|||||||
|
<template>
|
||||||
|
<div id="ChatHistory">
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {},
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped></style>
|
@ -0,0 +1,19 @@
|
|||||||
|
<script setup>
|
||||||
|
import Keyboard from "./Keyboard.vue";
|
||||||
|
import ChatHistory from "./ChatHistory.vue";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<ChatHistory />
|
||||||
|
<v-if="writeMessage" Keyboard />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped></style>
|
@ -1,32 +0,0 @@
|
|||||||
<template>
|
|
||||||
<header>
|
|
||||||
<div v-if="headerChat" id="header-chat">
|
|
||||||
<div class="chat-picture">
|
|
||||||
<figure>
|
|
||||||
<img src="chat-picture" alt="The chat picture" />
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
<div class="chat-name">
|
|
||||||
<h3>{{ chatName }}</h3>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<div id="header">
|
|
||||||
<p>Geografia</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
setup() {},
|
|
||||||
props: {
|
|
||||||
ChatPicture: { type: String, default: "" },
|
|
||||||
chatName: { type: String, default: "" },
|
|
||||||
headerChat: { type: Boolean, default: true },
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
@ -0,0 +1,17 @@
|
|||||||
|
<template>
|
||||||
|
<div class="msg-composition">
|
||||||
|
<KeyboardWord type="subject" />
|
||||||
|
<KeyboardWord type="object" />
|
||||||
|
<KeyboardWord type="verb" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import KeyboardWord from "./KeyboardWord.vue";
|
||||||
|
export default {
|
||||||
|
components: { KeyboardWord },
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped></style>
|
@ -0,0 +1,15 @@
|
|||||||
|
<template>
|
||||||
|
<div class="msg-composition">
|
||||||
|
<KeyboardWord />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import KeyboardWord from "./KeyboardWord.vue";
|
||||||
|
export default {
|
||||||
|
components: { KeyboardWord },
|
||||||
|
setup() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped></style>
|
@ -1,16 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="keyboard" @click="selectedWord('⛸️')">
|
|
||||||
<p>I'm writing hereee</p>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
methods: {
|
|
||||||
selectedWord(word) {
|
|
||||||
this.$emit("selectedWord", word);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped></style>
|
|
@ -1,15 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="keyboard-word">
|
|
||||||
<label for="word">
|
|
||||||
<input type="text" />
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
props: {},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
@ -1,38 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import Keyboard from "./Keyboard.vue";
|
|
||||||
import KeyboardWord from "./KeyboardWord.vue";
|
|
||||||
import PhraseType from "./PhraseType.vue";
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<button alt="Back" name="Back" @click="this.$emit('hideMessageHistory')">←</button>
|
|
||||||
<KeyboardWord ref="subject" />
|
|
||||||
<KeyboardWord ref="object" />
|
|
||||||
<KeyboardWord ref="verb" />
|
|
||||||
<PhraseType />
|
|
||||||
<button name="confirm" @click="confirm">OK?</button>
|
|
||||||
<Keyboard @selectedWord="selectedWord" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
methods: {
|
|
||||||
selectedWord(e) {
|
|
||||||
console.log("selectedWord", e);
|
|
||||||
},
|
|
||||||
confirm() {
|
|
||||||
var message = {
|
|
||||||
subject: this.$refs.subject.items,
|
|
||||||
object: this.$refs.object.items,
|
|
||||||
verb: this.$refs.verb.items,
|
|
||||||
tipo_frase: this.$refs.phraseType.items,
|
|
||||||
};
|
|
||||||
console.log(message);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
@ -1,33 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="phrase-type-selection" @click="popup = true">
|
|
||||||
<p>+|-|?-|?+</p>
|
|
||||||
</div>
|
|
||||||
<div class="popup" v-if="popup">
|
|
||||||
<button name="phrase-type" value="+" @click="selectedPhraseType('+')">
|
|
||||||
+
|
|
||||||
</button>
|
|
||||||
<button name="phrase-type" value="-" @click="selectedPhraseType('-')">
|
|
||||||
-
|
|
||||||
</button>
|
|
||||||
<button name="phrase-type" value="?-" @click="selectedPhraseType('?-')">
|
|
||||||
?-
|
|
||||||
</button>
|
|
||||||
<button name="phrase-type" value="?+" @click="selectedPhraseType('?+')">
|
|
||||||
?+
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return { phraseType: null, popup: false };
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
selectedPhraseType(phraseType) {
|
|
||||||
this.phraseType = phraseType;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped></style>
|
|
@ -1,31 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import ChatMsg from "./ChatMsg.vue";
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<!-- Modificare la proprieta' css z-index
|
|
||||||
per permettero lo scrolling e una dimensione fissa -->
|
|
||||||
|
|
||||||
<div id="ChatHistory">
|
|
||||||
<ChatMsg
|
|
||||||
v-for="message in $options.demo_messages.history"
|
|
||||||
:key="message.id"
|
|
||||||
:message-text="message.text"
|
|
||||||
:is-user="message.is_user"
|
|
||||||
:message-seen="message.seen"
|
|
||||||
:message-date="message.date"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import demo_messages_json from "@/assets/demo_messages.json";
|
|
||||||
export default {
|
|
||||||
demo_messages: demo_messages_json,
|
|
||||||
props: {
|
|
||||||
chatId: Number,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
@ -1,37 +0,0 @@
|
|||||||
<script setup>
|
|
||||||
import MessageComposition from "../keyboard/MessageComposition.vue";
|
|
||||||
import ChatHistory from "./ChatHistory.vue";
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<div>
|
|
||||||
<!-- Move this button in the header -->
|
|
||||||
<div id="chat-view" v-show="!writeMessage">
|
|
||||||
<button alt="Back" name="Back" @click="this.$emit('hideChat')">←</button>
|
|
||||||
<ChatHistory :chat-id="chatId" />
|
|
||||||
<button
|
|
||||||
alt="write message"
|
|
||||||
name="write-message"
|
|
||||||
@click="this.writeMessage = true"
|
|
||||||
>
|
|
||||||
+
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<MessageComposition
|
|
||||||
v-if="writeMessage"
|
|
||||||
:chat-id="chatId"
|
|
||||||
@hideMessageHistory="this.writeMessage = false"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return { writeMessage: false };
|
|
||||||
},
|
|
||||||
props: { chatId: Number },
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped></style>
|
|
@ -1,24 +0,0 @@
|
|||||||
/*
|
|
||||||
VueRouter inutile fino allo sviluppo dell'handler dei messaggi
|
|
||||||
e solo nel caso si voglia supportare l'uso di url nella versione web
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { createRouter, createWebHashHistory } from "vue-router";
|
|
||||||
|
|
||||||
2; // 1. Define route components.
|
|
||||||
const ChatList = { template: "./components/ChatList.vue" };
|
|
||||||
// const ChatView = { template: "./components/ChatView.vue" };
|
|
||||||
// const MessageComposition = { template: "./components/MessageComposition.vue" };
|
|
||||||
|
|
||||||
// 2. Define some routes
|
|
||||||
const routes = [
|
|
||||||
{ path: "/", component: ChatList },
|
|
||||||
// { path: "/chat_view", component: ChatView },
|
|
||||||
// { path: "/chat_view/write", component: MessageComposition },
|
|
||||||
];
|
|
||||||
|
|
||||||
// 3. Create the router instance and pass the `routes` option
|
|
||||||
export const router = createRouter({
|
|
||||||
history: createWebHashHistory(),
|
|
||||||
routes,
|
|
||||||
});
|
|
Loading…
Reference in New Issue