feat: added wiki pages inside the app; todo: add a back button

This commit is contained in:
RemixDev 2020-11-07 15:11:41 +01:00
parent b6aec174ef
commit 49675d007d
No known key found for this signature in database
GPG key ID: B33962B465BDB51C
3 changed files with 168 additions and 36 deletions

File diff suppressed because one or more lines are too long

View file

@ -1,8 +1,49 @@
<template>
<div>
<h1 class="mb-8 text-5xl">{{ $t('settings.login.arl.question') }}</h1>
<p class="mb-2 text-base">
Deezer keeps track of login session by using a cookie called ARL.<br>
deemix uses that cookie to get the metadata that it needs to download the tracks from Deezer.<br>
ARLs last for 3 months, after that Deezer asks you to log in again. The same method is used in deemix<br>
Following one of the guides below you can get your own account ARL.
</p>
<p></p>
<h3 class="mt-6 text-3xl">Chrome (Easy way)</h3>
<ul class="mb-2 text-base">
<li>Open Chrome</li>
<li>Go to www.deezer.com and log into your account</li>
<li>Click on the little "lock" icon next the URL</li>
<li>Click on Cookies > deezer.com > cookies > arl</li>
<li>Select the string next to Content, and Copy</li>
<li>That's your ARL, now you can use it in the app</li>
</ul>
<h3 class="mt-6 text-3xl">Chrome</h3>
<ul class="mb-2 text-base">
<li>Open Chrome</li>
<li>Go to www.deezer.com and log into your account</li>
<li>After logging in press F12 to open up Developer Tools</li>
<li>Go under the Application tab (if you don't see it click the double arrow)</li>
<li>Open the cookie dropdown</li>
<li>Select www.deezer.com</li>
<li>Find the `arl` cookie (It should be 192 chars long) </li>
<li>That's your ARL, now you can use it in the app</li>
</ul>
<p class="mb-2 text-base">Here's a <a href="https://youtu.be/O6PRT47_yds" target="_blank">video guide</a></p>
<h3 class="mt-6 text-3xl">Firefox</h3>
<ul class="mb-2 text-base">
<li>Open Firefox</li>
<li>Go to www.deezer.com and log into your account</li>
<li>Afer logging in press F12 to open up Developer Tools</li>
<li>Go under the Storage tab (if you don't see it click the double arrow)</li>
<li>Open the cookie dropdown</li>
<li>Select www.deezer.com</li>
<li>Find the `arl` cookie (It should be 192 chars long)</li>
<li>Make sure only copy the value and not the entire cookie</li>
<li>That's your ARL, now you can use it in the app</li>
</ul>
</div>
</template>

View file

@ -1,6 +1,31 @@
<template>
<div>
<h1 class="mb-8 text-5xl">{{ $t('settings.spotify.question') }}</h1>
<p class="mb-2 text-base">
"Spotify Features" is a set of features that lets you convert Spotify tracks and albums links into Deezer ones.
If you provide a Spotify Playlist link the app will autmatically convert all the links of the tracks inside it into deezer tracks.
Enabling this set of features will let you see your public Spotify playlists in the favorites tab as well.
</p>
<p class="mb-2 text-base">For security reasons you will need to provide your own Client ID and Secret</p>
<h2 class="mt-6 text-3xl">How do I get my Client ID and Secret?</h2>
<p class="mb-2 text-base">Connect to <a href="https://developer.spotify.com/dashboard" target="_blank">Spotify for Developers's Dashboard</a> and login with your Spotify account.</p>
<p class="mb-2 text-base">
Click on "Create an App".<br>
<img src="https://i.imgur.com/YFz7rHj.png" alt="Create an App button on Spotify for Developers's Dashboard">
</p>
<p class="mb-2 text-base">
Fill out the "App name" and "App description" fields and check both checkboxes. Then click on the "Create" button.<br>
<img src="https://i.imgur.com/A9cvDkK.png" alt="Create an app form">
</p>
<p class="mb-2 text-base">
Now you can see the Client ID. If you click on "Show Client Secret" the client secret will be revealed.<br>
<img src="https://i.imgur.com/foEfIhO.png" alt="Screen of client ID and Secret">
</p>
<p class="mb-2 text-base">Now you can copy-paste those results in the appropriate fields in the settings.</p>
<h2 class="mt-6 text-3xl">How do I get my Spotify Username?</h2>
<p class="mb-2 text-base">You can get your Spotify Username from the <a href="https://www.spotify.com/it/account/overview/" target="_blank">Overview page on Spotify's Website</a>.</p>
</div>
</template>
@ -9,4 +34,4 @@ export default {}
</script>
<style>
</style>
</style>