mirror of
				https://github.com/TeamPiped/Piped.git
				synced 2024-08-14 23:57:27 +00:00 
			
		
		
		
	Remove all direct localStorage calls.
Also: make instance changes active instantly without needing a reload.
This commit is contained in:
		
							parent
							
								
									fc9fd65a8d
								
							
						
					
					
						commit
						e3b53723a1
					
				
					 9 changed files with 30 additions and 33 deletions
				
			
		| 
						 | 
				
			
			@ -1,3 +0,0 @@
 | 
			
		|||
export default {
 | 
			
		||||
    BASE_URL: localStorage.getItem("instance") || "https://pipedapi.kavin.rocks",
 | 
			
		||||
};
 | 
			
		||||
| 
						 | 
				
			
			@ -21,7 +21,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
import ErrorHandler from "@/components/ErrorHandler.vue";
 | 
			
		||||
import VideoItem from "@/components/VideoItem.vue";
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -40,10 +39,7 @@ export default {
 | 
			
		|||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
        async fetchChannel() {
 | 
			
		||||
            const url = 
 | 
			
		||||
                Constants.BASE_URL + "/" 
 | 
			
		||||
                + this.$route.params.path + "/" 
 | 
			
		||||
                + this.$route.params.channelId
 | 
			
		||||
            const url = this.apiUrl() + "/" + this.$route.params.path + "/" + this.$route.params.channelId;
 | 
			
		||||
            return await this.fetchJson(url);
 | 
			
		||||
        },
 | 
			
		||||
        async getChannelData() {
 | 
			
		||||
| 
						 | 
				
			
			@ -57,7 +53,7 @@ export default {
 | 
			
		|||
            if (this.loading || !this.channel || !this.channel.nextpage) return;
 | 
			
		||||
            if (window.innerHeight + window.scrollY >= document.body.offsetHeight - window.innerHeight) {
 | 
			
		||||
                this.loading = true;
 | 
			
		||||
                this.fetchJson(Constants.BASE_URL + "/nextpage/channel/" + this.channel.id, {
 | 
			
		||||
                this.fetchJson(this.apiUrl() + "/nextpage/channel/" + this.channel.id, {
 | 
			
		||||
                    nextpage: this.channel.nextpage,
 | 
			
		||||
                }).then(json => {
 | 
			
		||||
                    this.channel.relatedStreams.concat(json.relatedStreams);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -23,9 +23,8 @@ export default {
 | 
			
		|||
        selectedAutoPlay: Boolean,
 | 
			
		||||
    },
 | 
			
		||||
    computed: {
 | 
			
		||||
        shouldAutoPlay: () => {
 | 
			
		||||
            const value = localStorage.getItem("playerAutoPlay");
 | 
			
		||||
            return value === null || value === "true";
 | 
			
		||||
        shouldAutoPlay: _this => {
 | 
			
		||||
            return _this.getPreferenceBoolean("playerAutoPlay", true);
 | 
			
		||||
        },
 | 
			
		||||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
| 
						 | 
				
			
			@ -80,7 +79,7 @@ export default {
 | 
			
		|||
 | 
			
		||||
                        localPlayer.configure(
 | 
			
		||||
                            "streaming.bufferingGoal",
 | 
			
		||||
                            Math.max(Number(localStorage.getItem("bufferGoal")), 10),
 | 
			
		||||
                            Math.max(this.getPreferenceNumber("bufferGoal", 10), 10),
 | 
			
		||||
                        );
 | 
			
		||||
 | 
			
		||||
                        this.setPlayerAttrs(localPlayer, videoEl, uri, shaka);
 | 
			
		||||
| 
						 | 
				
			
			@ -106,7 +105,7 @@ export default {
 | 
			
		|||
                });
 | 
			
		||||
 | 
			
		||||
                videoEl.addEventListener("volumechange", () => {
 | 
			
		||||
                    if (localStorage) localStorage.setItem("volume", videoEl.volume);
 | 
			
		||||
                    this.setPreference("volume", videoEl.volume);
 | 
			
		||||
                });
 | 
			
		||||
 | 
			
		||||
                videoEl.addEventListener("ended", () => {
 | 
			
		||||
| 
						 | 
				
			
			@ -155,7 +154,7 @@ export default {
 | 
			
		|||
            const disableVideo = this.getPreferenceBoolean("listen", false) && !this.video.livestream;
 | 
			
		||||
            this.player.configure("manifest.disableVideo", disableVideo);
 | 
			
		||||
 | 
			
		||||
            const quality = Number(localStorage.getItem("quality"));
 | 
			
		||||
            const quality = this.getPreferenceNumber("quality", 0);
 | 
			
		||||
            const qualityConds = quality > 0 && (this.video.audioStreams.length > 0 || this.video.livestream);
 | 
			
		||||
            if (qualityConds) this.player.configure("abr.enabled", false);
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -186,7 +185,7 @@ export default {
 | 
			
		|||
                        subtitle.name,
 | 
			
		||||
                    );
 | 
			
		||||
                });
 | 
			
		||||
                if (localStorage) videoEl.volume = localStorage.getItem("volume") || 1;
 | 
			
		||||
                videoEl.volume = this.getPreferenceNumber("volume", 1);
 | 
			
		||||
            });
 | 
			
		||||
        },
 | 
			
		||||
    },
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -31,7 +31,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
import ErrorHandler from "@/components/ErrorHandler.vue";
 | 
			
		||||
import VideoItem from "@/components/VideoItem.vue";
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -50,7 +49,7 @@ export default {
 | 
			
		|||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
        async fetchPlaylist() {
 | 
			
		||||
            return await await this.fetchJson(Constants.BASE_URL + "/playlists/" + this.$route.query.list);
 | 
			
		||||
            return await await this.fetchJson(this.apiUrl() + "/playlists/" + this.$route.query.list);
 | 
			
		||||
        },
 | 
			
		||||
        async getPlaylistData() {
 | 
			
		||||
            this.fetchPlaylist()
 | 
			
		||||
| 
						 | 
				
			
			@ -61,7 +60,7 @@ export default {
 | 
			
		|||
            if (this.loading || !this.playlist || !this.playlist.nextpage) return;
 | 
			
		||||
            if (window.innerHeight + window.scrollY >= document.body.offsetHeight - window.innerHeight) {
 | 
			
		||||
                this.loading = true;
 | 
			
		||||
                this.fetchJson(Constants.BASE_URL + "/nextpage/playlists/" + this.$route.query.list, {
 | 
			
		||||
                this.fetchJson(this.apiUrl() + "/nextpage/playlists/" + this.$route.query.list, {
 | 
			
		||||
                    nextpage: this.playlist.nextpage,
 | 
			
		||||
                }).then(json => {
 | 
			
		||||
                    this.playlist.relatedStreams.concat(json.relatedStreams);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -67,8 +67,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
    data() {
 | 
			
		||||
        return {
 | 
			
		||||
| 
						 | 
				
			
			@ -100,7 +98,7 @@ export default {
 | 
			
		|||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
        async fetchResults() {
 | 
			
		||||
            return await await this.fetchJson(Constants.BASE_URL + "/search", {
 | 
			
		||||
            return await await this.fetchJson(this.apiUrl() + "/search", {
 | 
			
		||||
                q: this.$route.query.search_query,
 | 
			
		||||
                filter: this.selectedFilter,
 | 
			
		||||
            });
 | 
			
		||||
| 
						 | 
				
			
			@ -113,7 +111,7 @@ export default {
 | 
			
		|||
            if (this.loading || !this.results || !this.results.nextpage) return;
 | 
			
		||||
            if (window.innerHeight + window.scrollY >= document.body.offsetHeight - window.innerHeight) {
 | 
			
		||||
                this.loading = true;
 | 
			
		||||
                this.fetchJson(Constants.BASE_URL + "/nextpage/search", {
 | 
			
		||||
                this.fetchJson(this.apiUrl() + "/nextpage/search", {
 | 
			
		||||
                    nextpage: this.results.nextpage,
 | 
			
		||||
                    q: this.$route.query.search_query,
 | 
			
		||||
                    filter: this.selectedFilter,
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -19,8 +19,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
    props: {
 | 
			
		||||
        searchText: String,
 | 
			
		||||
| 
						 | 
				
			
			@ -52,7 +50,7 @@ export default {
 | 
			
		|||
            }
 | 
			
		||||
        },
 | 
			
		||||
        async refreshSuggestions() {
 | 
			
		||||
            this.searchSuggestions = await this.fetchJson(Constants.BASE_URL + "/suggestions", {
 | 
			
		||||
            this.searchSuggestions = await this.fetchJson(this.apiUrl() + "/suggestions", {
 | 
			
		||||
                query: this.searchText,
 | 
			
		||||
            });
 | 
			
		||||
            this.searchSuggestions.unshift(this.searchText);
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -16,7 +16,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
import VideoItem from "@/components/VideoItem.vue";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
| 
						 | 
				
			
			@ -34,7 +33,7 @@ export default {
 | 
			
		|||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
        async fetchTrending(region) {
 | 
			
		||||
            return await this.fetchJson(Constants.BASE_URL + "/trending", {
 | 
			
		||||
            return await this.fetchJson(this.apiUrl() + "/trending", {
 | 
			
		||||
                region: region || "US",
 | 
			
		||||
            });
 | 
			
		||||
        },
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -106,7 +106,6 @@
 | 
			
		|||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import Constants from "@/Constants.js";
 | 
			
		||||
import Player from "@/components/Player.vue";
 | 
			
		||||
import VideoItem from "@/components/VideoItem.vue";
 | 
			
		||||
import ErrorHandler from "@/components/ErrorHandler.vue";
 | 
			
		||||
| 
						 | 
				
			
			@ -145,10 +144,10 @@ export default {
 | 
			
		|||
    },
 | 
			
		||||
    methods: {
 | 
			
		||||
        fetchVideo() {
 | 
			
		||||
            return this.fetchJson(Constants.BASE_URL + "/streams/" + this.getVideoId());
 | 
			
		||||
            return this.fetchJson(this.apiUrl() + "/streams/" + this.getVideoId());
 | 
			
		||||
        },
 | 
			
		||||
        async fetchSponsors() {
 | 
			
		||||
            return await this.fetchJson(Constants.BASE_URL + "/sponsors/" + this.getVideoId(), {
 | 
			
		||||
            return await this.fetchJson(this.apiUrl() + "/sponsors/" + this.getVideoId(), {
 | 
			
		||||
                category:
 | 
			
		||||
                    '["' +
 | 
			
		||||
                    this.getPreferenceString("selectedSkip", "sponsor,interaction,selfpromo,music_offtopic").replaceAll(
 | 
			
		||||
| 
						 | 
				
			
			@ -159,7 +158,7 @@ export default {
 | 
			
		|||
            });
 | 
			
		||||
        },
 | 
			
		||||
        fetchComments() {
 | 
			
		||||
            return this.fetchJson(Constants.BASE_URL + "/comments/" + this.getVideoId());
 | 
			
		||||
            return this.fetchJson(this.apiUrl() + "/comments/" + this.getVideoId());
 | 
			
		||||
        },
 | 
			
		||||
        onChange() {
 | 
			
		||||
            this.setPreference("autoplay", this.selectedAutoPlay);
 | 
			
		||||
| 
						 | 
				
			
			@ -195,7 +194,7 @@ export default {
 | 
			
		|||
            if (this.loading || !this.comments || !this.comments.nextpage) return;
 | 
			
		||||
            if (window.innerHeight + window.scrollY >= this.$refs.comments.offsetHeight - window.innerHeight) {
 | 
			
		||||
                this.loading = true;
 | 
			
		||||
                this.fetchJson(Constants.BASE_URL + "/nextpage/comments/" + this.getVideoId(), {
 | 
			
		||||
                this.fetchJson(this.apiUrl() + "/nextpage/comments/" + this.getVideoId(), {
 | 
			
		||||
                    url: this.comments.nextpage,
 | 
			
		||||
                }).then(json => {
 | 
			
		||||
                    this.comments.nextpage = json.nextpage;
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										12
									
								
								src/main.js
									
										
									
									
									
								
							
							
						
						
									
										12
									
								
								src/main.js
									
										
									
									
									
								
							| 
						 | 
				
			
			@ -115,6 +115,18 @@ const mixin = {
 | 
			
		|||
                return value;
 | 
			
		||||
            } else return defaultVal;
 | 
			
		||||
        },
 | 
			
		||||
        getPreferenceNumber(key, defaultVal) {
 | 
			
		||||
            var value;
 | 
			
		||||
            if (
 | 
			
		||||
                (value = this.$route.query[key]) !== undefined ||
 | 
			
		||||
                (localStorage && (value = localStorage.getItem(key)) !== null)
 | 
			
		||||
            ) {
 | 
			
		||||
                return Number(value);
 | 
			
		||||
            } else return defaultVal;
 | 
			
		||||
        },
 | 
			
		||||
        apiUrl() {
 | 
			
		||||
            return this.getPreferenceString("instance", "https://pipedapi.kavin.rocks");
 | 
			
		||||
        },
 | 
			
		||||
    },
 | 
			
		||||
    computed: {
 | 
			
		||||
        backgroundColor() {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue