38 lines
8.7 KiB
Vue
38 lines
8.7 KiB
Vue
<template>
|
|
<div class="p-grid p-p-6 p-flex-lg-row-reverse p-flex-column">
|
|
<div class="p-col-12 p-lg-6 p-text-center">
|
|
<span class="popcorn"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 867.10818 500.05662"><defs><clipPath id="a1708186-1525-433e-878d-7c35f03ac629" transform="translate(-166.44591 -199.97169)"><path d="M695.14831,283.9783l-6.77-16.49-90.27,37.06a11.15,11.15,0,0,0-6.91,10.31v97.53h17.83v-93.03Z" fill="none"/></clipPath><linearGradient id="feb2277d-7772-4d61-b1af-dc7db61f73e8" x1="916.58831" y1="601.91813" x2="916.58831" y2="667.79812" gradientTransform="matrix(1, 0, 0, -1, -166.44591, 702.02831)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-opacity="0.12"/><stop offset="0.55" stop-opacity="0.09"/><stop offset="1" stop-opacity="0.02"/></linearGradient></defs><title>movie_night</title><path d="M14.95531,192.03591H300.15287a14,14,0,0,1,14,14v22.23774a0,0,0,0,1,0,0H.95533a0,0,0,0,1,0,0V206.0359A14,14,0,0,1,14.95531,192.03591Z" fill="#3f3d56"/><path d="M461.18569,389.41919a12.84166,12.84166,0,0,0-4.13933.70477,7.75132,7.75132,0,0,0-15.27374,1.88364c0,.03871.00964.07457.01043.11312a13.30859,13.30859,0,0,0-2.85556.59165,7.794,7.794,0,0,0-3.83869-4.94648,12.98613,12.98613,0,0,0,5.60148-6.13088c6.33278-.103,11.436-4.68107,11.436-10.33468,0-5.71823-5.21489-10.35364-11.64784-10.35364a12.84177,12.84177,0,0,0-4.13934.70477,7.73969,7.73969,0,1,0-14.88067,4.20632c-.30949.21533-.59812.4572-.88739.69781a7.34987,7.34987,0,0,0-5.2931-1.76183,12.89142,12.89142,0,0,0-25.06384,4.01374,13.24765,13.24765,0,0,0-3.05478.60918,7.76417,7.76417,0,0,0-.44646-1.27745,9.72676,9.72676,0,0,0,3.2916-7.19254c0-5.71823-5.2149-10.35364-11.64784-10.35364a12.842,12.842,0,0,0-4.13934.70477,7.73969,7.73969,0,1,0-14.88067,4.20632,12.90859,12.90859,0,0,0-5.53212,10.01508c-.10949.09732-.23493.176-.33872.27932a9.2223,9.2223,0,0,0,.301-2.26344c0-5.71823-5.2149-10.35364-11.64784-10.35364a12.84172,12.84172,0,0,0-4.13934.70477,7.73969,7.73969,0,1,0-14.88067,4.20632,12.90822,12.90822,0,0,0,0,21.23873,7.05915,7.05915,0,0,0,0,4.64536,13.06918,13.06918,0,0,0-3.3115,3.34373,7.71691,7.71691,0,0,0-15.12049,1.30685,12.33158,12.33158,0,0,0-3.32777-1.34445A13.01113,13.01113,0,0,0,306.093,381.635c6.33279-.103,11.436-4.68107,11.436-10.33468,0-5.71823-5.2149-10.35364-11.64785-10.35364a12.84171,12.84171,0,0,0-4.13933.70477,7.73969,7.73969,0,1,0-14.88067,4.20632c-.166.11549-.31565.25135-.476.37426-.4038-.0376-.79639-.10853-1.21126-.10853a12.842,12.842,0,0,0-4.13934.70476c-.049-.19526-.12954-.37647-.19274-.56558a7.6278,7.6278,0,0,0-7.92637-9.23416,12.92962,12.92962,0,1,0-20.32085,14.40561,13.39192,13.39192,0,0,0-2.62095.57095A7.69523,7.69523,0,0,0,237.648,367.8419a12.10286,12.10286,0,0,0-9.41916-4.3068,12.84172,12.84172,0,0,0-4.13934.70477,7.73969,7.73969,0,1,0-14.88067,4.20632,12.91366,12.91366,0,0,0-5.56988,10.61936c0,.04013.01153.07694.01185.11691a10.73636,10.73636,0,0,0-5.4454.58786,7.73968,7.73968,0,1,0-14.88066,4.20632,12.889,12.889,0,0,0,10.1868,23.21749,12.89592,12.89592,0,0,0,24.36729,3.31039,12.8992,12.8992,0,0,0,23.50391-.397,12.87909,12.87909,0,0,0,4.45736-.86291,12.8957,12.8957,0,0,0,24.01514.86291,12.66149,12.66149,0,0,0,5.429-1.34334,12.88273,12.88273,0,0,0,23.04354-1.24507,13.04794,13.04794,0,0,0,2.06959-.2166,12.92926,12.92926,0,0,0,23.81451.2166,12.88231,12.88231,0,0,0,3.0077-.44362,12.61784,12.61784,0,0,0,14.01507-5.35218,12.93614,12.93614,0,0,0,24.39178,8.38421,12.66152,12.66152,0,0,0,5.429-1.34334,12.88273,12.88273,0,0,0,23.04354-1.24507,12.66149,12.66149,0,0,0,5.429-1.34334,12.8073,12.8073,0,0,0,19.18652,3.71879,12.887,12.887,0,0,0,23.0527,5.3457,12.85359,12.85359,0,0,0,19.63046-5.13274c6.33279-.103,11.436-4.68107,11.436-10.33468C472.83354,394.0546,467.61864,389.41919,461.18569,389.41919ZM229.8384,384.07712c-.01359.06241-.02307.12639-.03587.18927-.09447-.00348-.184-.024-.27947-.024a7.70783,7.70783,0,0,0-1.15328.11628c.021-.04661.05055-.08831.07093-.13523A12.88755,12.88755,0,0,0,229.8384,384.07712Zm108.14113-4.3068c-.03776-.15072-.10238-.28927-.14867-.43635a13.00467,13.00467,0,0,0,4.49986-5.46419,12.1173,12.1173,0,0,0,8.9994-4.075,7.78885,7.78885,0,0,0-.15182,1.50559,7.68,7.68,0,0,0,.39306,2.32268,12.98976,12.98976,0,0,0-4.81156,6.30782,12.70178,12.70178,0,0,0-8.78027-.16051Zm77.52384.96513c-.00522-.15862.01453-.32213.0041-.47964a7.72736,7.72736,0,0,0,.98646-.067,12.82884,12.82884,0,0,0,2.46581,4.56779c-.2444.06857-.5016.1098-.73952.19053A7.80593,7.80593,0,0,0,415.50337,380.73545Z" transform="translate(-166.44591 -199.97169)" fill="#f9a825"/><path d="M193.47491,404.94965a27.02565,27.02565,0,0,0-26.98872,28.47756l17.52738,241.02034a27.02449,27.02449,0,0,0,26.98871,25.58076H436.99772a27.02449,27.02449,0,0,0,26.98871-25.58076l17.52738-241.02034a27.02565,27.02565,0,0,0-26.98872-28.47756Z" transform="translate(-166.44591 -199.97169)" fill="#3f3d56"/><rect x="39.78147" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><rect x="83.78442" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><rect x="127.78738" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><rect x="171.79034" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><rect x="215.7933" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><rect x="259.79626" y="204.97796" width="15.53046" height="295.07866" fill="#6c63ff"/><path id="a971f948-84ae-4583-a462-a09341ab7c50" data-name="2572ddba-42e8-4159-9036-35cbff74dfb7" d="M695.14831,283.9783l-6.77-16.49-90.27,37.06a11.15,11.15,0,0,0-6.91,10.31v97.53h17.83v-93.03Z" transform="translate(-166.44591 -199.97169)" fill="#3f3d56"/><g clip-path="url(#a1708186-1525-433e-878d-7c35f03ac629)"><rect x="497.66242" y="49.59661" width="19.44" height="61.56999" fill="#6c63ff"/><rect x="466.88239" y="62.55662" width="19.44" height="61.57001" fill="#6c63ff"/><polygon points="456.342 115.217 442.572 119.267 436.902 53.647 456.342 53.647 456.342 115.217" fill="#6c63ff"/><rect x="406.1124" y="122.50663" width="61.57001" height="19.44" fill="#6c63ff"/><rect x="406.12238" y="149.24662" width="61.57001" height="19.44" fill="#6c63ff"/><rect x="406.1124" y="175.98661" width="61.57001" height="19.44" fill="#6c63ff"/></g><polygon points="497.662 500.057 378.572 500.057 349.402 208.387 523.592 208.387 497.662 500.057" fill="#3f3d56"/><rect x="337.25239" y="203.52662" width="199.29999" height="19.44" fill="#3f3d56"/><circle cx="739.31239" cy="67.17019" r="66.97999" fill="#3ad29f"/><polygon points="783.662 67.17 716.622 100.11 716.622 67.17 716.622 34.23 783.662 67.17" fill="url(#feb2277d-7772-4d61-b1af-dc7db61f73e8)"/><polygon points="779.632 67.17 720.642 96.16 720.642 67.17 720.642 38.18 779.632 67.17" fill="#fff"/><path d="M844.2583,274.83188a67,67,0,0,1,118.62-42.66,67,67,0,1,0-108.77,77.64A66.65991,66.65991,0,0,1,844.2583,274.83188Z" transform="translate(-166.44591 -199.97169)" fill="#fff" opacity="0.2" style="isolation:isolate"/><path d="M893.994,614.78026a2.94921,2.94921,0,0,0-2.94653,2.944v79.36a2.94921,2.94921,0,0,0,2.94653,2.944h136.61352a2.94921,2.94921,0,0,0,2.94653-2.944v-79.36a2.94921,2.94921,0,0,0-2.94653-2.944Z" transform="translate(-166.44591 -199.97169)" fill="#3f3d56"/><path d="M909.26082,621.77888a5.49446,5.49446,0,0,0-5.48809,5.48809v60.27462a5.49447,5.49447,0,0,0,5.48809,5.4881h106.08a5.49447,5.49447,0,0,0,5.4881-5.4881V627.267a5.49447,5.49447,0,0,0-5.4881-5.48809Z" transform="translate(-166.44591 -199.97169)" fill="#ff6584"/><rect x="657.92175" y="440.94978" width="71.16175" height="16.48258" fill="#3f3d56"/><path d="M700.53937,614.78026a2.94869,2.94869,0,0,0-2.944,2.944v79.36a2.94869,2.94869,0,0,0,2.944,2.944h136.616a2.94869,2.94869,0,0,0,2.944-2.944v-79.36a2.94869,2.94869,0,0,0-2.944-2.944Z" transform="translate(-166.44591 -199.97169)" fill="#3f3d56"/><path d="M715.80864,621.77888a5.495,5.495,0,0,0-5.49058,5.48809v60.27462a5.495,5.495,0,0,0,5.49058,5.4881H821.88611a5.495,5.495,0,0,0,5.49057-5.4881V627.267a5.495,5.495,0,0,0-5.49057-5.48809Z" transform="translate(-166.44591 -199.97169)" fill="#6c63ff"/></svg></span>
|
|
</div>
|
|
<div class="p-col-12 p-lg-6">
|
|
<h1 class=p-my-0>VCinema™</h1>
|
|
<p>Welcome to VCinema™, the web application designed to make collaborative video watching easy.</p>
|
|
<p>Videos are distributed peer-to-peer through WebRTC. This means means:</p>
|
|
<ul>
|
|
<li>Unlimited participants</li>
|
|
<li>Guaranteed encryption</li>
|
|
<li>No hosting requirements</li>
|
|
</ul>
|
|
<p>To get started, either <router-link to="/host">host</router-link> a screen, or <router-link to="/join">join</router-link> an existing one.</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
setup () {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
h1 {
|
|
font-size: 4em;
|
|
max-width: 100%;
|
|
}
|
|
span.popcorn svg {
|
|
width: 100%;
|
|
max-width: 500px;
|
|
}
|
|
</style>
|