{"version":3,"sources":["webpack:///./src/views/Peer.vue?7d90","webpack:///src/views/Peer.vue","webpack:///./src/views/Peer.vue?f12a","webpack:///./src/views/Peer.vue","webpack:///./src/views/Peer.vue?5bf9"],"names":["render","_vm","this","_h","$createElement","_c","_self","_v","_s","myPeerId","directives","name","rawName","value","expression","domProps","on","$event","target","composing","remotePeerId","staticClass","sendMessage","_l","message","index","key","staticRenderFns","data","created","myPeer","console","log","id","self","conn","messages","push","computed","methods","connect","send","newMessage","filters","component"],"mappings":"yHAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,IAAI,CAACJ,EAAIM,GAAG,gBAAgBN,EAAIO,GAAGP,EAAIQ,aAAaJ,EAAG,MAAMA,EAAG,IAAI,CAACJ,EAAIM,GAAG,oBAAoBF,EAAG,QAAQ,CAACK,WAAW,CAAC,CAACC,KAAK,QAAQC,QAAQ,UAAUC,MAAOZ,EAAgB,aAAEa,WAAW,iBAAiBC,SAAS,CAAC,MAASd,EAAgB,cAAGe,GAAG,CAAC,MAAQ,SAASC,GAAWA,EAAOC,OAAOC,YAAqBlB,EAAImB,aAAaH,EAAOC,OAAOL,aAAYR,EAAG,MAAMA,EAAG,MAAM,CAACgB,YAAY,sBAAsB,CAAChB,EAAG,KAAK,CAACJ,EAAIM,GAAG,kBAAkBF,EAAG,MAAM,CAACW,GAAG,CAAC,MAAQ,SAASC,GAAQ,OAAOhB,EAAIqB,iBAAiB,CAACrB,EAAIM,GAAG,YAAYF,EAAG,MAAM,CAACgB,YAAY,sBAAsB,CAAChB,EAAG,KAAK,CAACJ,EAAIM,GAAG,uBAAuBF,EAAG,KAAK,CAACgB,YAAY,cAAcpB,EAAIsB,GAAItB,EAAY,UAAE,SAASuB,EAAQC,GAAO,OAAOpB,EAAG,KAAK,CAACqB,IAAID,EAAMJ,YAAY,mBAAmB,CAACpB,EAAIM,GAAG,aAAaN,EAAIO,GAAGgB,GAAS,UAAS,QACr4BG,EAAkB,G,qBC+BtB,GACEC,KAAM,WAAR,OACA,gBACA,cACA,WACA,YACA,YACA,YACA,kBAEEC,QAVF,WAUA,WACI3B,KAAK4B,OAAS,IAAI,EAAtB,EACI5B,KAAK4B,OAAOd,GAAG,QAAQ,SAA3B,GACMe,QAAQC,IAAI,2CACZD,QAAQC,IAAI,kBAAoBC,GAChC,EAAN,WACM,EAAN,iBAEI,IAAIC,EAAOhC,KACXA,KAAK4B,OAAOd,GAAG,cAAc,SAAjC,GACMmB,EAAKnB,GAAG,QAAQ,SAAtB,GAEQkB,EAAKE,SAASC,KAAKT,UAIzBU,SAAU,GACVC,QAAS,CACPjB,YADJ,WAEM,IAAN,GACQW,GAAI/B,KAAKO,SACTe,QAAS,MAEPW,EAAOjC,KAAK4B,OAAOU,QAAQtC,KAAKkB,cACpCe,EAAKM,KAAKC,GAEVP,EAAKnB,GAAG,QAAQ,WACde,QAAQC,IAAI,aAEZG,EAAKM,KAAK,YAIhBE,QAAS,IC3EmU,I,wBCQ1UC,EAAY,eACd,EACA5C,EACA2B,GACA,EACA,KACA,WACA,MAIa,aAAAiB,E,kECnBf","file":"js/chunk-a9ad5b4c.a3fe5943.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('p',[_vm._v(\"My Peer Id : \"+_vm._s(_vm.myPeerId))]),_c('hr'),_c('p',[_vm._v(\" Remote Peer Id \"),_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.remotePeerId),expression:\"remotePeerId\"}],domProps:{\"value\":(_vm.remotePeerId)},on:{\"input\":function($event){if($event.target.composing){ return; }_vm.remotePeerId=$event.target.value}}})]),_c('hr'),_c('div',{staticClass:\"col-xs-12 col-sm-6\"},[_c('h3',[_vm._v(\"Send Message\")]),_c('div',{on:{\"click\":function($event){return _vm.sendMessage()}}},[_vm._v(\"send\")])]),_c('div',{staticClass:\"col-xs-12 col-sm-6\"},[_c('h3',[_vm._v(\"Received Messages\")]),_c('ul',{staticClass:\"list-group\"},_vm._l((_vm.messages),function(message,index){return _c('li',{key:index,staticClass:\"list-group-item\"},[_vm._v(\" Message: \"+_vm._s(message)+\" \")])}),0)])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <p>My Peer Id : {{ myPeerId }}</p>\n    <hr />\n    <p>\n      Remote Peer Id\n      <input v-model=\"remotePeerId\" />\n    </p>\n    <hr />\n    <div class=\"col-xs-12 col-sm-6\">\n      <h3>Send Message</h3>\n      <div @click=\"sendMessage()\">send</div>\n    </div>\n    <div class=\"col-xs-12 col-sm-6\">\n      <h3>Received Messages</h3>\n      <ul class=\"list-group\">\n        <li\n          class=\"list-group-item\"\n          v-for=\"(message, index) in messages\"\n          :key=\"index\"\n        >\n          Message: {{ message }}\n        </li>\n      </ul>\n    </div>\n  </div>\n</template>\n\n<script>\n// import Card from \"../components/Cards/Event.vue\";\nimport Peer from \"peerjs\";\n\nexport default {\n  data: () => ({\n    connection: null,\n    connecting: true,\n    message: \"\",\n    messages: [],\n    myPeer: null,\n    myPeerId: \"\",\n    remotePeerId: \"\",\n  }),\n  created() {\n    this.myPeer = new Peer();\n    this.myPeer.on(\"open\", (id) => {\n      console.log(\"Connected at PeerJS server with success\");\n      console.log(\"My peer ID is: \" + id);\n      this.myPeerId = id;\n      this.connecting = false;\n    });\n    var self = this;\n    this.myPeer.on(\"connection\", function(conn) {\n      conn.on(\"data\", function(data) {\n        // Will print 'hi!'\n        self.messages.push(data);\n      });\n    });\n  },\n  computed: {},\n  methods: {\n    sendMessage() {\n      const newMessage = {\n        id: this.myPeerId,\n        message: \"hi\",\n      };\n      var conn = this.myPeer.connect(this.remotePeerId);\n      conn.send(newMessage);\n      // on open will be launch when you successfully connect to PeerServer\n      conn.on(\"open\", function() {\n        console.log(\"connected\");\n        // here you have conn.id;\n        conn.send(\"hi!\");\n      });\n    },\n  },\n  filters: {},\n};\n</script>\n\n<!-- Add \"scoped\" attribute to limit CSS to this component only -->\n<style scoped lang=\"scss\">\nh3 {\n  text-decoration: underline;\n}\n.highlight {\n  background: white;\n  @apply p-8 mb-6 border mx-auto;\n  width: 80%;\n  max-width: 600px;\n  h1.title {\n    @apply text-3xl mt-0 mb-0;\n  }\n}\nh2 {\n  text-decoration: underline;\n  @apply px-3;\n}\n.hooper:focus {\n  outline: none;\n}\n.text {\n  text-align: left;\n  width: 65%;\n  margin: 0 auto;\n}\n.select {\n  @apply py-4 px-3  border-b;\n  transition: all 0.1s ease;\n  &:hover {\n    cursor: pointer;\n    background: rgba(0, 0, 0, 0.01);\n  }\n  &.active {\n    background: rgba(0, 0, 0, 0.02);\n    @apply font-bold;\n  }\n}\n.welcome {\n  width: 80%;\n  @apply mx-auto px-2 border-b;\n}\n.hooper {\n  width: 100%;\n}\n.cards_row {\n  @apply p-20;\n  width: 100%;\n  margin: 0 auto;\n  background: #fff;\n}\n.distrikt {\n  .card_large {\n    .card_header.has_image {\n      height: 500px;\n      background-position: 50% 50% !important;\n      .card_info {\n        h3 {\n          @apply mb-5;\n        }\n        p {\n          @apply text-lg leading-normal;\n        }\n      }\n    }\n  }\n}\n.card_large {\n  @apply shadow-lg bg-white p-7 border;\n  p {\n    width: 75%;\n  }\n  .card_play {\n    padding-left: 40px;\n    @apply font-normal text-left pl-16 leading-tight pr-4 py-4 border-t border-b;\n    width: 50%;\n    margin: 20px auto 0;\n  }\n  .regen {\n    background: url(\"data:image/svg+xml,%3Csvg width='68' height='96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M59.7.5c4.2 0 7.6 3.4 7.6 7.7v79.7c0 4.3-3.5 7.7-7.7 7.7H8.3a7.7 7.7 0 0 1-7.7-7.7V8.2C.6 3.9 4.1.5 8.3.5Zm-26.1 31a16 16 0 1 0 0 32 16 16 0 0 0 0-32Zm.03 3.15c.33-.28.84-.03.84.4v2.88c5.1.38 9.24 4.54 9.54 9.64a10.34 10.34 0 0 1-20.63 1.32.62.62 0 0 1 .63-.69h2.35c.33 0 .6.26.63.59a6.74 6.74 0 0 0 13.38.17 6.73 6.73 0 0 0-5.9-7.42v2.78c0 .43-.5.68-.84.4l-5.85-4.62a.53.53 0 0 1 0-.8Z' fill='green' fill-rule='nonzero'/%3E%3C/svg%3E\")\n      no-repeat 24px center #fafafa;\n    background-size: 25px;\n  }\n  .single_use {\n    background: url(\"data:image/svg+xml,%3Csvg width='68' height='96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M59.7.5c4.2 0 7.6 3.4 7.6 7.7v79.7c0 4.3-3.5 7.7-7.7 7.7H8.3a7.7 7.7 0 0 1-7.7-7.7V8.2C.6 3.9 4.1.5 8.3.5Zm-26.1 31a16 16 0 1 0 0 32 16 16 0 0 0 0-32Zm.1 8.5 1 .1c.1.1.3.3.3.5l.1 1V47l.1 6.4h2.7v.1l.2.7c0 .3-.1.4-.2.5l-.6.2H29v-.2l-.2-.7c0-.2 0-.4.2-.5l.5-.1h2l.1-.1V45.1a24.3 24.3 0 0 0-.2-2.3c0-.2-.2-.3-.4-.4h-2v-.2l-.2-.6c0-.5.7-1 2-1.2 1.3-.3 2.2-.4 2.8-.4Z' fill='orangered' fill-rule='nonzero'/%3E%3C/svg%3E\")\n      no-repeat 24px center #fafafa;\n    background-size: 25px;\n  }\n  .quote {\n    width: 75%;\n    @apply mx-auto text-xl pb-6 border-b mt-8;\n    font-family: \"EB Garamond\", serif;\n    font-weight: light;\n  }\n  .gameplay {\n    @apply text-xl pt-5 mx-auto;\n    font-family: \"EB Garamond\", serif;\n    font-weight: light;\n  }\n  .card_header {\n    width: 100%;\n    height: auto;\n    @apply flex items-end  bg-cover rounded;\n    background-position: 10% 100% !important;\n    background-color: #fafafa !important;\n    background-size: cover !important;\n    background-repeat: no-repeat !important;\n    p {\n      font-family: \"EB Garamond\", serif;\n    }\n    .card_info {\n      width: 80%;\n      height: 100%;\n      @apply py-8 pl-10 pr-0 mx-auto text-center;\n      text-decoration: none;\n      color: black;\n      font-family: \"EB Garamond\", serif;\n      backdrop-filter: blur(10px);\n\n      h3 {\n        @apply text-3xl mb-2 border-b pb-3;\n        text-decoration: none;\n      }\n      p {\n        @apply pr-0 w-full text-xl;\n      }\n    }\n    &.has_image {\n      .card_info {\n        @apply text-left;\n        width: 40%;\n        margin: inherit;\n        color: white;\n        background: linear-gradient(\n          180deg,\n          rgba(0, 0, 0, 1) 0%,\n          rgba(0, 0, 0, 0) 100%\n        );\n        h3 {\n          @apply mr-10;\n        }\n        p {\n          @apply pr-8 text-base;\n        }\n      }\n    }\n  }\n}\n.sidebar {\n  @apply bg-gray-100 pt-4;\n}\nh1.title {\n  font-family: \"EB Garamond\", serif;\n  text-shadow: 0px -1px 0px white;\n  width: 80%;\n  @apply text-5xl mt-4 mb-4 mx-auto pb-4 border-gray-200;\n}\n.link {\n  &:hover {\n    cursor: pointer;\n  }\n}\n\n/* DivTable.com */\n.divTable {\n  display: table;\n  width: 100%;\n  @apply mx-auto;\n}\n.divTableRow {\n  display: table-row;\n}\n.divTableRow:hover {\n  cursor: pointer;\n  background: #efefef;\n}\n.divTableHeading {\n  background-color: #fff;\n  display: table-header-group;\n}\n.divTableCell,\n.divTableHead {\n  border: 0.5px solid #ddd;\n  display: table-cell;\n  padding: 15px 20px;\n  text-align: left;\n}\n.divTableHeading {\n  background-color: #eee;\n  display: table-header-group;\n  font-weight: bold;\n}\n.divTableFoot {\n  background-color: #eee;\n  display: table-footer-group;\n  font-weight: bold;\n}\n.divTableBody {\n  display: table-row-group;\n}\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Peer.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Peer.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Peer.vue?vue&type=template&id=3919e5f4&scoped=true&\"\nimport script from \"./Peer.vue?vue&type=script&lang=js&\"\nexport * from \"./Peer.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Peer.vue?vue&type=style&index=0&id=3919e5f4&scoped=true&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"3919e5f4\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Peer.vue?vue&type=style&index=0&id=3919e5f4&scoped=true&lang=scss&\""],"sourceRoot":""}