userAuthAgent

why?

to connect the trippo user auth automaticly. that package manage registry, login, edit profile ect.

<template>
  <div class="app d-flex flex-column">
    <h1>parent</h1>
    <div id="userAuth">
        <button class="mr-2" @click="openLoginAndDie()">open instant Login in new window</button>
        <button class="mr-2" @click="logoutAndDie()">open instant Logout in new window</button>
        <br>
        <button class="mr-2" @click="openLogin()">open Login  in new window</button>


        <button class="mr-2" :disabled="!!user" @click="isInstantLoginIFrame =!isInstantLoginIFrame">Instant Login</button>
        <button class="mr-2" :disabled="!!!user" @click="isInstantLogoutIFrame =!isInstantLogoutIFrame">Instant Logout</button>
    </div>
    <iframe v-if="isInstantLoginIFrame && !user" :src="instantLoginUrl" class="login_iframe"></iframe>
    <iframe v-if="isInstantLogoutIFrame && user" :src="instantLogoutUrl" class="login_iframe"></iframe>
    <br />
    {{ user }}
  </div>
</template>

<script>
import authModule from "trippoclientauth";
import postRobot from "post-robot";
import { log } from 'util';

export default {
  name: "App",
  components: {},
  data() {
    return {
      isInstantLogoutIFrame:false,
      isInstantLoginIFrame:false,
      dialog: false,
      instantLogoutUrl: authModule.instantLogoutUrl,
      instantLoginUrl: authModule.instantLoginUrl,
      user: null,
      postRobot
    };
  },
  async mounted() {
    let o ={
    elCreateIn :'#userAuth',
    onUserRegistered : this.onUserRegistered,
    onUserLogedIn: this.onUserLogedIn,
    onUserLogedOut : this.onUserLogedOut,
    }
    authModule.init(o);
  },
  computed: {},
  methods: {
    logoutAndDie(){
        authModule.logoutAndDie()
    },
    openLogin(){
      authModule.loginAndDie()
    },
    openLoginAndDie(){
      authModule.loginAndDie()
    },
    onUserLogedIn(data) {
      this.user = data.user;
      this.isInstantLoginIFrame = false
    },

    onUserRegistered( data ) {
      console.log('onUserRegistered',data);
    },

    onUserLogedOut() {
      this.user =null;
      this.isInstantLogoutIFrame = false
    },

    async getMe() {
      this.user = await this.$store.dispatch("getMe");
    },

  }
};
</script>
<style lang="scss">
.app {
  height: 90vh;
  img {
    width: 600px;
    border-radius: 50%;
  }
  h1 {
  }
  .login_iframe {
    width: 500px;
    height: 400px;
  }
  .mr-2{
    margin: 5px;
  }
}
</style>

Compiles and hot-reloads for development

npm run serve