me/mime-chat
Watch
1
0
Fork
You've already forked mime-chat
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge remote-tracking branch 'origin/main' into main

Browse source
This commit is contained in:
Enrique Hernandez 2021-02-17 13:25:37 -06:00
commit 69a9dacb90
34 changed files with 874 additions and 799 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/views/home.vue
View file

@ -1,17 +1,32 @@
<template>
<HomeComponent />
<svg
id="messenger"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<MessageView />
<TextAudioInput />
</svg>
</template>
<script lang="ts">
import MessageView from "@/components/messageView/index.vue";
import TextAudioInput from "@/components/taInput/index.vue";
import { defineComponent } from "vue";
import HomeComponent from "@/components/home/index.vue";
export default defineComponent({
name: "Home",
components: { HomeComponent },
name: "Messenger",
components: { MessageView, TextAudioInput },
});
</script>
<style lang="scss" scoped>
#messenger {
width: 350px;
height: 500px;
background-color: #e6e6e6;
box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.3);
// border-radius: 20px;
}
</style>

10
src/views/login.vue
View file

@ -18,10 +18,9 @@
<label for="checkbox">Remember Me</label>
<!-- submit button; position: fixed -->
<button class="button" @click="submit">Submit</button>
<button class="button" @click.prevent="submit">Submit</button>
<!-- back to login button: position: fixed -->
<button class="button2" @click="switchView">Create an account</button>
</form>
</template>
@ -45,9 +44,9 @@ export default defineComponent({
const email = ref("");
const password = ref("");
const rememberMe = ref(false);
const rememberMe = ref(true);
const { data, invoke } = useIpc('auth-user');
const { data, invoke } = useIpc('auth-session');
const submit = async () => {
const payload = {
@ -57,8 +56,7 @@ export default defineComponent({
};
try {
await invoke(payload);
console.log('testing incoke', data.value)
setToken(data.value, rememberMe.value);
setToken(data.value);
router.push({ name: "home" });
} catch(e){
console.log('Error loging in.')

78
src/views/register.vue
View file

@ -6,42 +6,40 @@
</div>
<!-- username and password forms -->
<div id="registerBox">
<form id="registerBox" @submit.prevent="submit">
<!-- username -->
<input class="input" type="text" v-model="email" placeholder="email" />
<input class="input" type="text" v-model="email" placeholder="email" required/>
<!-- password -->
<input class="input" type="password" v-model="password" placeholder="Password" />
<input class="input" type="password" v-model="password" placeholder="Password" required/>
<!-- firstName -->
<input class="input" type="text" v-model="password2" placeholder="Re-enter password" />
</div>
<!-- re-enter passoword -->
<input class="input" type="password" v-model="password2" placeholder="Re-enter password" required/>
<!-- submit button; position: fixed -->
<button class="button" @click="submit">Submit</button>
<!-- submit button; position: fixed -->
<button class="button" type="submit">Submit</button>
</form>
<!-- back to login button: position: fixed -->
<button class="button2" @click="switchView">Back to login</button>
<button class="button2" @click.prevent="switchView">Back to login</button>
</div>
</template>
<script lang="ts">
import {
computed,
defineComponent,
onErrorCaptured,
reactive,
ref,
toRefs,
} from "vue";
import { useRouter } from "vue-router";
import { useIpc } from "@/modules/ipc";
import { useAuth } from "@/modules/auth";
interface RegisterPayload {
request?: string;
email?: string;
password?: string;
request: string;
email: string;
password: string;
}
export default defineComponent({
@ -49,25 +47,46 @@ export default defineComponent({
setup() {
const email = ref("");
const password = ref("");
const rememberMe = ref("");
const password2 = ref("");
const { invoke, data,} = useIpc("auth-user");
const { invoke, data,} = useIpc("auth-session");
const { setToken } = useAuth();
const router = useRouter();
const payload: RegisterPayload = {
request: "register",
email: email.value,
password: password.value,
};
const re = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
const passwordMatch = () => {
let match = false;
if (password.value == password2.value) {
match = true;
}
return match;
}
const validate = () => {
let valid = false;
if (re.test(email.value) && passwordMatch()) {
valid = true;
}
return valid;
}
const submit = async () => {
try {
await invoke(payload);
setToken(data.value, true);
router.push({ name: "home" });
} catch(e) {
console.log('Failed to register.')
const payload: RegisterPayload = {
request: "register",
email: email.value,
password: password.value,
};
if (validate()) {
try {
await invoke(payload);
setToken(data.value);
router.push({ name: "home" });
} catch(e) {
console.log('Failed to register.')
}
}
};
@ -78,6 +97,7 @@ export default defineComponent({
return {
email,
password,
password2,
switchView,
submit,
};

63
src/views/splash.vue
View file

@ -1,17 +1,72 @@
<template>
<SplashComponent />
<div id="splash">
<svg
xmlns="http://www.w3.org/2000/svg"
width="57.046"
height="52.759"
viewBox="0 0 57.046 52.759"
>
<g transform="translate(-4127 -507)">
<g transform="translate(3949 332.206)">
<g transform="translate(178 174.794)">
<g transform="translate(0 27.405)">
<circle
cx="12.677"
cy="12.677"
r="12.677"
transform="translate(0 0)"
fill="#383838"
/>
<circle
cx="12.677"
cy="12.677"
r="12.677"
transform="translate(31.692 0)"
fill="#383838"
/>
</g>
<circle
cx="12.677"
cy="12.677"
r="12.677"
transform="translate(15.822 0)"
fill="#383838"
/>
<path
d="M36.27,83.67"
transform="translate(-23.569 -43.588)"
fill="#ff0"
/>
</g>
</g>
</g>
</svg>
</div>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import SplashComponent from "@/components/splash/index.vue"
export default defineComponent({
name: "Splash",
components: { SplashComponent },
});
</script>
</script>
<style lang="scss" scoped>
#splash {
width: 350px;
height: 500px;
display: flex;
align-items: center;
justify-content: center;
background-color: #EBEBEB;
box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.3);
// border-radius: 20px;
}
</style>