mirror of https://github.com/FreeTubeApp/FreeTube
Fix mini player, make consistent wording and visual fixes
This commit is contained in:
parent
0969992228
commit
24d56ecabf
|
@ -45,7 +45,7 @@
|
|||
<ul>
|
||||
<li v-on:click='subscriptions'><i class="fas fa-rss"></i> Subscriptions</li>
|
||||
<li v-on:click='popular'><i class="fas fa-users"></i> Most Popular</li>
|
||||
<li v-on:click='saved'><i class="fas fa-star"></i> Saved</li>
|
||||
<li v-on:click='saved'><i class="fas fa-star"></i> Favorites</li>
|
||||
<li v-on:click='history'><i class="fas fa-history"></i> History</li>
|
||||
</ul>
|
||||
<hr />
|
||||
|
|
|
@ -78,9 +78,12 @@ let init = function () {
|
|||
const template = [{
|
||||
label: 'File',
|
||||
submenu: [{
|
||||
role: 'quit'
|
||||
}]
|
||||
},
|
||||
label: 'Open New Window',
|
||||
click () { init() }
|
||||
},
|
||||
{role: 'quit'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Edit',
|
||||
submenu: [{
|
||||
|
@ -180,4 +183,4 @@ let active = function () {
|
|||
*/
|
||||
app.on('ready', init);
|
||||
app.on('window-all-closed', allWindowsClosed);
|
||||
app.on('activate', active);
|
||||
app.on('activate', active);
|
||||
|
|
|
@ -41,10 +41,10 @@ function playVideo(videoId) {
|
|||
// Change the save button icon and text depending on if the user has saved the video or not.
|
||||
checkSavedVideo.then((results) => {
|
||||
if (results === false) {
|
||||
playerView.savedText = 'SAVE';
|
||||
playerView.savedText = 'FAVORITE';
|
||||
playerView.savedIconType = 'far unsaved';
|
||||
} else {
|
||||
playerView.savedText = 'SAVED';
|
||||
playerView.savedText = 'FAVORITED';
|
||||
playerView.savedIconType = 'fas saved';
|
||||
}
|
||||
});
|
||||
|
@ -190,38 +190,40 @@ function playVideo(videoId) {
|
|||
*
|
||||
* @return {Void}
|
||||
*/
|
||||
function openMiniPlayer() {
|
||||
let lastTime;
|
||||
let videoHtml;
|
||||
function openMiniPlayer() {
|
||||
let lastTime;
|
||||
let videoHtml;
|
||||
|
||||
// Grabs whatever the HTML is for the current video player. Done this way to grab
|
||||
// the HTML5 player (with varying qualities) as well as the YouTube embeded player.
|
||||
if ($('.videoPlayer').length > 0) {
|
||||
$('.videoPlayer').get(0).pause();
|
||||
lastTime = $('.videoPlayer').get(0).currentTime;
|
||||
videoHtml = $('.videoPlayer').get(0).outerHTML;
|
||||
} else {
|
||||
videoHtml = $('iframe').get(0).outerHTML;
|
||||
}
|
||||
// Grabs whatever the HTML is for the current video player. Done this way to grab
|
||||
// the HTML5 player (with varying qualities) as well as the YouTube embeded player.
|
||||
if ($('.videoPlayer').length > 0) {
|
||||
$('.videoPlayer').get(0).pause();
|
||||
lastTime = $('.videoPlayer').get(0).currentTime;
|
||||
videoHtml = $('.videoPlayer').get(0).outerHTML;
|
||||
} else {
|
||||
videoHtml = $('iframe').get(0).outerHTML;
|
||||
}
|
||||
|
||||
// Create a new browser window.
|
||||
const BrowserWindow = electron.remote.BrowserWindow;
|
||||
// Create a new browser window.
|
||||
const BrowserWindow = electron.remote.BrowserWindow;
|
||||
|
||||
let miniPlayer = new BrowserWindow({
|
||||
width: 1200,
|
||||
height: 710
|
||||
});
|
||||
let miniPlayer = new BrowserWindow({
|
||||
width: 1200,
|
||||
height: 710
|
||||
});
|
||||
|
||||
// Use the miniPlayer.html template.
|
||||
$.get('templates/miniPlayer.html', (template) => {
|
||||
mustache.parse(template);
|
||||
const rendered = mustache.render(template, {
|
||||
videoHtml: videoHtml,
|
||||
videoThumbnail: playerView.thumbnail,
|
||||
startTime: lastTime,
|
||||
});
|
||||
});
|
||||
}
|
||||
// Use the miniPlayer.html template.
|
||||
$.get('templates/miniPlayer.html', (template) => {
|
||||
mustache.parse(template);
|
||||
const rendered = mustache.render(template, {
|
||||
videoHtml: videoHtml,
|
||||
videoThumbnail: playerView.thumbnail,
|
||||
startTime: lastTime,
|
||||
});
|
||||
// Render the template to the new browser window.
|
||||
miniPlayer.loadURL("data:text/html;charset=utf-8," + encodeURI(rendered));
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Change the quality of the current video.
|
||||
|
|
|
@ -76,11 +76,11 @@ function toggleSavedVideo(videoId) {
|
|||
|
||||
checkIfSaved.then((results) => {
|
||||
if (results === false) {
|
||||
playerView.savedText = 'SAVED';
|
||||
playerView.savedText = 'FAVORITED';
|
||||
playerView.savedIconType = 'fas saved';
|
||||
addSavedVideo(videoId);
|
||||
} else {
|
||||
playerView.savedText = 'SAVE';
|
||||
playerView.savedText = 'FAVORITE';
|
||||
playerView.savedIconType = 'far unsaved';
|
||||
removeSavedVideo(videoId);
|
||||
}
|
||||
|
|
|
@ -73,7 +73,7 @@ let sideNavBar = new Vue({
|
|||
popular: (event) => {
|
||||
hideViews();
|
||||
if (loadingView.seen !== false){
|
||||
loadingView.seen === false;
|
||||
loadingView.seen = false;
|
||||
}
|
||||
if(popularView.videoList.length === 0){
|
||||
loadingView.seen = true;
|
||||
|
@ -86,20 +86,20 @@ let sideNavBar = new Vue({
|
|||
saved: (event) => {
|
||||
hideViews();
|
||||
if (loadingView.seen !== false){
|
||||
loadingView.seen === false;
|
||||
loadingView.seen = false;
|
||||
}
|
||||
if(savedView.videoList.length === 0){
|
||||
loadingView.seen = true;
|
||||
}
|
||||
headerView.seen = true;
|
||||
headerView.title = 'Saved Videos';
|
||||
headerView.title = 'Favorited Videos';
|
||||
savedView.seen = true;
|
||||
showSavedVideos();
|
||||
},
|
||||
history: (event) => {
|
||||
hideViews();
|
||||
if (loadingView.seen !== false){
|
||||
loadingView.seen === false;
|
||||
loadingView.seen = false;
|
||||
}
|
||||
if(historyView.videoList.length === 0){
|
||||
loadingView.seen = true;
|
||||
|
@ -112,7 +112,7 @@ let sideNavBar = new Vue({
|
|||
settings: (event) => {
|
||||
hideViews();
|
||||
if (loadingView.seen !== false){
|
||||
loadingView.seen === false;
|
||||
loadingView.seen = false;
|
||||
}
|
||||
settingsView.seen = true;
|
||||
updateSettingsView();
|
||||
|
@ -120,7 +120,7 @@ let sideNavBar = new Vue({
|
|||
about: (event) => {
|
||||
hideViews();
|
||||
if (loadingView.seen !== false){
|
||||
loadingView.seen === false;
|
||||
loadingView.seen = false;
|
||||
}
|
||||
aboutView.seen = true;
|
||||
}
|
||||
|
@ -152,7 +152,7 @@ let subscriptionView = new Vue({
|
|||
goToChannel(channelId);
|
||||
},
|
||||
toggleSave: (videoId) => {
|
||||
addSavedVideo(videoId);
|
||||
toggleSavedVideo(videoId);
|
||||
},
|
||||
copy: (site, videoId) => {
|
||||
const url = 'https://' + site + '/watch?v=' + videoId;
|
||||
|
|
|
@ -90,6 +90,7 @@ function search(nextPageToken = '') {
|
|||
});
|
||||
|
||||
searchView.nextPageToken = data.nextPageToken;
|
||||
loadingView.seen = false;
|
||||
})
|
||||
}
|
||||
|
||||
|
@ -374,9 +375,11 @@ function parseSearchText(url = '') {
|
|||
let urlSplit = input.split('/');
|
||||
if (match) {
|
||||
ft.log('Video found');
|
||||
loadingView.seen = true;
|
||||
playVideo(match[2]);
|
||||
} else if (urlSplit[3] == 'channel') {
|
||||
ft.log('channel found');
|
||||
loadingView.seen = true;
|
||||
goToChannel(urlSplit[4]);
|
||||
} else if (urlSplit[3] == 'user') {
|
||||
ft.log('user found');
|
||||
|
@ -387,10 +390,12 @@ function parseSearchText(url = '') {
|
|||
}, (data) => {
|
||||
ft.log('Channel Data: ', data.items[0].id);
|
||||
let channelID = data.items[0].id;
|
||||
loadingView.seen = true;
|
||||
goToChannel(channelID);
|
||||
});
|
||||
} else {
|
||||
ft.log('Video not found');
|
||||
loadingView.seen = true;
|
||||
search();
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue