Commit ce57ad59 authored by yPhil's avatar yPhil
Browse files

Tab: .ui-tab#new-group:hover

parent cbade3b4
......@@ -9,6 +9,11 @@
--ui-color-oct: #2b2b2b;
--ui-color-title-one: #ff4136;
--ui-color-console-bg: #002b36;
--ui-color-message-normal: #268bd2;
--ui-color-message-error: #dc322f;
--ui-color-message-success: #859900;
--ui-color-message-warning: #b58900;
--ui-color-rss: #f26522;
......@@ -143,29 +148,38 @@ div.dialog {
#console {
display: flex;
flex-direction: column-reverse;
overflow: hidden;
overflow-y: scroll;
height: 100px;
max-height: 100px;
font-size: 8pt;
font-size: 7pt;
font-family: monospace;
width: 100%;
border-radius: 3px;
padding: .2em;
color: green;
background-color: black;
border: 1px solid black;
color: var(--ui-color-message-normal);
background-color: var(--ui-color-oct);
border: 1px solid var(--ui-color-console);
}
#console > div > span.prompt {
margin-right: 3px;
font-weight: 900;
color: var(--ui-color-pri);
}
#console div.normal {
color: var(--ui-color-message-normal);
}
#console div.error {
color: var(--ui-color-danger);
color: var(--ui-color-message-error);
}
#console div.success {
color: var(--ui-color-success);
color: var(--ui-color-message-success);
}
#console div.warning {
color: var(--ui-color-warning);
color: var(--ui-color-message-warning);
}
kbd.key {
......@@ -216,13 +230,20 @@ a:active {
padding: 0;
}
/* a.ui-button:nth-child(1) */
.ui-tab#new-group {
width: 40px;
}
.ui-tab#new-group {
background-color: var(--color-qua);
}
.ui-tab.ui-state-default {
background: var(--color-non);
border-right: 1px solid var(--color-sep) !important;
}
.ui-tab#new-group:hover,
.ui-tab.ui-state-hover {
background: var(--color-sep);
}
......@@ -263,16 +284,6 @@ a:active {
background: none;
}
#new-group {
width: 40px;
}
#new-group a:link {
color: var(--color-pri);
background-color: var(--color-qua);
font-size: 1em;
}
i.item-icon {
float: right;
margin: .2em;
......
......@@ -135,7 +135,7 @@ PTL.col = {
$colButtons.append($srcNewButton);
PTL.tab.saveTabs();
// PTL.tab.saveTabs();
return $column;
}
......
......@@ -8,220 +8,216 @@ var PTL = (function() {
language: 'en',
start : function() {
PTL.utilities.console(PTL.tr('Pétrolette starting up'));
$('nav#top-menu')
.load('/static/templates/menu.html div#topnav', null);
$('nav#side-menu')
.load('/static/templates/menu.html div#side-menu', function () {
var $menu = $('nav#side-menu'),
$overlay = $('#overlay'),
$sourceCodeButton = $('button#sourceCode'),
$importButton = $("button#fileImport"),
$fileImportInput = $("input#fileImport"),
$saveButton = $('#saveTabs'),
$langMenu = $('select#language'),
$slider = $('div#gallerySpeedSlider'),
$spinner = $('#gallerySpeedSpinner');
var $menu = $(this),
$overlay = $('#overlay'),
$sourceCodeButton = $('button#sourceCode'),
$importButton = $("button#fileImport"),
$fileImportInput = $("input#fileImport"),
$saveButton = $('#saveTabs'),
$langMenu = $('select#language'),
$slider = $('div#gallerySpeedSlider'),
$spinner = $('#gallerySpeedSpinner');
PTL.sync.attachWidget();
PTL.sync.attachWidget();
$('button').button();
$('button').button();
$('h3.rs-small-headline, h1.rs-big-headline').text(PTL.tr('Connection to storage'));
$('span.rs-sub-headline').text(PTL.tr('To synchronize the sources across devices'));
$('div.rs-sign-in-error').text(PTL.tr('To synchronize the sources across devices'));
$('h3.rs-small-headline, h1.rs-big-headline').text(PTL.tr('Connection to storage'));
$('span.rs-sub-headline').text(PTL.tr('To synchronize the sources across devices'));
$('div.rs-sign-in-error').text(PTL.tr('To synchronize the sources across devices'));
$('input.rs-connect')
.val(PTL.tr('Synchronize'))
.button();
$('input.rs-connect')
.val(PTL.tr('Synchronize'))
.button();
$('a.rs-help').text(PTL.tr('More info'));
$('a.rs-help').text(PTL.tr('More info'));
$('body').on('click','#menuButton', function() {
PTL.sideMenu('toggle');
});
$('body').on('click','#menuButton', function() {
PTL.sideMenu('toggle');
});
$('body').on('click','.help-button', function() {
PTL.dialog.help();
});
$('body').on('click','.help-button', function() {
PTL.dialog.help();
});
$('body').on('click','.new-source-button', function() {
$('body').on('click','.new-source-button', function() {
var $column;
var $column;
console.log('this: (%s)', $(this).attr('class'));
console.log('this: (%s)', $(this).attr('class'));
if ($(this).hasClass('button-column')) {
$column = $(this).parent().parent();
} else {
$column = $($('.ui-tabs-active')
.find('a')
.attr('href'))
.find('.column').first();
}
if ($(this).hasClass('button-column')) {
$column = $(this).parent().parent();
} else {
$column = $($('.ui-tabs-active')
.find('a')
.attr('href'))
.find('.column').first();
}
PTL.sideMenu('close');
PTL.src.add($column, 'New Feed', 'mixed', 8, true);
});
PTL.sideMenu('close');
PTL.src.add($column, 'New Feed', 'mixed', 8, true);
});
$sourceCodeButton.click(function(event) {
event.preventDefault();
window.open('https://framagit.org/yphil/petrolette');
});
$sourceCodeButton.click(function(event) {
event.preventDefault();
window.open('https://framagit.org/yphil/petrolette');
});
$overlay.click(function() {
PTL.sideMenu('close');
});
$overlay.click(function() {
PTL.sideMenu('close');
});
$(document).keydown(function(event) {
if (event.keyCode === $.ui.keyCode.ESCAPE) {
$('.column' ).sortable('cancel');
}
});
$(document).keydown(function(event) {
if (event.keyCode === $.ui.keyCode.ESCAPE) {
$('.column' ).sortable('cancel');
}
});
var $widget = $('#remotestorage-widget');
var $widget = $('#remotestorage-widget');
var $readMore = $('<a>')
.attr('class', 'rs-help')
.attr('href', 'https:remotestorage.io/')
.text(PTL.tr('Read more.'));
var $readMore = $('<a>')
.attr('class', 'rs-help')
.attr('href', 'https:remotestorage.io/')
.text(PTL.tr('Read more.'));
$widget.find('.rs-short-desc').text(PTL.tr('Pétrolette allows you to sync data with a storage of your choice ; '))
.append($readMore);
$widget.find('.rs-short-desc').text(PTL.tr('Pétrolette allows you to sync data with a storage of your choice ; '))
.append($readMore);
var $fuckingButton = $widget.find('.rs-choose-rs');
var $fuckingButton = $widget.find('.rs-choose-rs');
$fuckingButton.css('border-color', '#f00');
$fuckingButton.css('border-color', '#f00');
$fuckingButton.click(function (event) {
event.preventDefault();
});
$fuckingButton.click(function (event) {
event.preventDefault();
});
PTL.utilities.translate();
PTL.utilities.translate();
$langMenu.val(PTL.prefs.readConfig('lang')).prop('selected', true);
$langMenu.val(PTL.prefs.readConfig('lang')).prop('selected', true);
$langMenu.change(function() {
var selectedLang = $(this).val();
PTL.language = selectedLang;
PTL.prefs.writeConfig('lang', selectedLang);
PTL.utilities.translate();
});
$langMenu.change(function() {
var selectedLang = $(this).val();
PTL.language = selectedLang;
PTL.prefs.writeConfig('lang', selectedLang);
PTL.utilities.translate();
});
$importButton.click(function () {
$("input#fileImport").click();
return false;
});
$importButton.click(function () {
$("input#fileImport").click();
return false;
});
$saveButton.click(function () {
PTL.prefs.exportConfig(PTL.tab.list(), 'petrolette.conf');
return false;
});
$saveButton.click(function () {
PTL.prefs.exportConfig(PTL.tab.list(), 'petrolette.conf');
return false;
});
$(".checkboxradio").checkboxradio({
icon: false
});
$(".checkboxradio").checkboxradio({
icon: false
});
$(this).find('input#' + PTL.prefs.readConfig('theme')).prop("checked", true)
.checkboxradio('refresh');
$(this).find('input#' + PTL.prefs.readConfig('theme')).prop("checked", true)
.checkboxradio('refresh');
$('.themeSwitcher').change(function() {
$('.themeSwitcher').change(function() {
$("#theme").attr({href : '/static/css/themes/' + $(this).attr('value') + '.css'});
$("#theme").attr({href : '/static/css/themes/' + $(this).attr('value') + '.css'});
PTL.prefs.writeConfig('theme', $(this).attr('value'));
PTL.prefs.writeConfig('theme', $(this).attr('value'));
});
});
var gallerySlideshowSpeed = PTL.prefs.readConfig('gallerySlideshowSpeed');
var gallerySlideTransition = PTL.prefs.readConfig('gallerySlideTransition');
var gallerySlideshowSpeed = PTL.prefs.readConfig('gallerySlideshowSpeed');
var gallerySlideTransition = PTL.prefs.readConfig('gallerySlideTransition');
// $.fancybox.defaults.thumbs.autoStart = true;
$.fancybox.defaults.transitionEffect = gallerySlideTransition;
$.fancybox.defaults.slideShow.speed = gallerySlideshowSpeed;
// $.fancybox.defaults.thumbs.autoStart = true;
$.fancybox.defaults.transitionEffect = gallerySlideTransition;
$.fancybox.defaults.slideShow.speed = gallerySlideshowSpeed;
$menu.find('select#gallerySlideTransition').change(function() {
$.fancybox.defaults.transitionEffect = $(this).val();
PTL.prefs.writeConfig('gallerySlideTransition', $(this).val());
});
$menu.find('select#gallerySlideTransition').change(function() {
$.fancybox.defaults.transitionEffect = $(this).val();
PTL.prefs.writeConfig('gallerySlideTransition', $(this).val());
});
$menu.find('select#gallerySlideTransition').val(gallerySlideTransition);
$menu.find('select#gallerySlideTransition').val(gallerySlideTransition);
if (PTL.prefs.readConfig('tabDropActivate') === 'true')
$('input#tabDropActivate').prop('checked', true).checkboxradio('refresh');
else
$('input#tabDropActivate').prop('checked', false).checkboxradio('refresh');
if (PTL.prefs.readConfig('tabDropActivate') === 'true')
$('input#tabDropActivate').prop('checked', true).checkboxradio('refresh');
else
$('input#tabDropActivate').prop('checked', false).checkboxradio('refresh');
$('input#tabDropActivate').change(function() {
PTL.prefs.writeConfig('tabDropActivate', $(this).prop('checked'));
});
$('input#tabDropActivate').change(function() {
PTL.prefs.writeConfig('tabDropActivate', $(this).prop('checked'));
});
$spinner.spinner({
min: 0.5,
max: 10000,
step: 0.5,
classes: {
"ui-spinner": "shrink ui-corner-all",
"ui-spinner-down": "ui-corner-br",
"ui-spinner-up": "ui-corner-tr"
$spinner.spinner({
min: 0.5,
max: 10000,
step: 0.5,
classes: {
"ui-spinner": "shrink ui-corner-all",
"ui-spinner-down": "ui-corner-br",
"ui-spinner-up": "ui-corner-tr"
}
});
$spinner.spinner('value', PTL.utilities.milliToSecs(gallerySlideshowSpeed));
$spinner.on( 'spinstop', function() {
$slider.slider( 'option', 'value', $(this).val() * 1000);
$('.ui-slider-handle').text(PTL.utilities.milliToSecs($(this).val() * 1000) + 's');
});
$slider.slider({
classes: {
"ui-slider": "grow ui-corner-all",
"ui-slider-handle": "ui-corner-all",
"ui-slider-range": "ui-corner-all ui-widget-header"
},
value: gallerySlideshowSpeed,
min: 500,
max: 10000,
step: 500,
create: function() {
$(this).find('.ui-slider-handle').text(PTL.utilities.milliToSecs(gallerySlideshowSpeed) + 's');
},
slide: function(event, ui) {
// $('#gallerySlideshowSpeedValue').text(ui.value + 'ms');
$spinner.val(PTL.utilities.milliToSecs(ui.value));
$(this).find('.ui-slider-handle').text(PTL.utilities.milliToSecs(ui.value) + 's');
},
change: function(event, ui) {
PTL.prefs.writeConfig('gallerySlideshowSpeed', ui.value);
$('#tabs').find("[data-fancybox]").fancybox({
slideShow: {
speed: ui.value
}
});
}
});
$spinner.spinner('value', PTL.utilities.milliToSecs(gallerySlideshowSpeed));
$fileImportInput.change(function(evt) {
var f = evt.target.files[0],
reader = new FileReader();
$spinner.on( 'spinstop', function() {
$slider.slider( 'option', 'value', $(this).val() * 1000);
$('.ui-slider-handle').text(PTL.utilities.milliToSecs($(this).val() * 1000) + 's');
});
$slider.slider({
classes: {
"ui-slider": "grow ui-corner-all",
"ui-slider-handle": "ui-corner-all",
"ui-slider-range": "ui-corner-all ui-widget-header"
},
value: gallerySlideshowSpeed,
min: 500,
max: 10000,
step: 500,
create: function() {
$(this).find('.ui-slider-handle').text(PTL.utilities.milliToSecs(gallerySlideshowSpeed) + 's');
},
slide: function(event, ui) {
// $('#gallerySlideshowSpeedValue').text(ui.value + 'ms');
$spinner.val(PTL.utilities.milliToSecs(ui.value));
$(this).find('.ui-slider-handle').text(PTL.utilities.milliToSecs(ui.value) + 's');
},
change: function(event, ui) {
PTL.prefs.writeConfig('gallerySlideshowSpeed', ui.value);
$('#tabs').find("[data-fancybox]").fancybox({
slideShow: {
speed: ui.value
}
});
reader.onload = (function() {
return function(e) {
if (PTL.utilities.isPTLStruct(e.target.result)) {
PTL.tab.empty();
// PTL.tab.populate(JSON.parse(e.target.result), true);
}
});
$fileImportInput.change(function(evt) {
var f = evt.target.files[0],
reader = new FileReader();
reader.onload = (function() {
return function(e) {
if (PTL.utilities.isPTLStruct(e.target.result)) {
PTL.tab.empty();
// PTL.tab.populate(JSON.parse(e.target.result), true);
}
};
})(f);
reader.readAsText(f);
});
};
})(f);
});
reader.readAsText(f);
});
},
sideMenu: function(action) {
......
......@@ -106,7 +106,7 @@ PTL.prefs = (function() {
$('div#logo-title i').addClass('writing');
if (key === 'tabs') {
if (key === 'sources') {
localStorage.setItem('writeTime', Date.now());
}
......
......@@ -102,7 +102,8 @@ PTL.sync = (function() {
console.info('Pétrolette | ' + PTL.tr('Remote file validation OK'));
return PTL.tab.populate(JSON.parse(data));
// return
PTL.tab.populate(JSON.parse(data));
} else {
......@@ -114,11 +115,9 @@ PTL.sync = (function() {
})
.catch((err) => {
// console.log('sources in sync: ', JSON.parse(PTL.prefs.readConfig('sources')));
PTL.utilities.console(PTL.tr('Remote file validation NOT OK (error [%1]) now reading from browser cache', err), 'error');
console.warn('Pétrolette | ' + PTL.tr('Remote file validation NOT OK (error [%1]) now reading from browser cache', err));
PTL.tab.populate(JSON.parse(PTL.prefs.readConfig('sources')));
// PTL.tab.populate(JSON.parse(PTL.prefs.readConfig('tabs')));
});
......
......@@ -74,18 +74,20 @@ PTL.tab = {
},
saveTabs:function() {
var sources = PTL.tab.list();
// console.log('sources : (%s)', JSON.stringify(sources));
console.log('sources LIST : (%s)', JSON.stringify(sources));
PTL.prefs.writeConfig('sources', JSON.stringify(sources));
PTL.sync.writeSync(JSON.stringify(sources));
// PTL.sync.writeSync(JSON.stringify(sources));
},
populate:function(sources) {
// console.log('sources: (%s)', sources);
console.log('sources: (%s)', sources);
var nbOfSources = 0,
var nbOfGroups = 0,
nbOfSources = 0,
progress = PTL.utilities.buildProgress();
sources.forEach(function(group) {
nbOfGroups++;
$.each(group.columns, function(k, v) {
$.each(v, function() {
nbOfSources++;
......@@ -93,6 +95,10 @@ PTL.tab = {
});
});
console.log('nbOfGroups, nbOfSources: (%s) %s', nbOfGroups, nbOfSources);
PTL.utilities.console(PTL.tr('Found %1 groups containing %2 sources', nbOfGroups, nbOfSources), 'ok');
progress.init(nbOfSources);
sources.forEach(function(group) {
......@@ -130,11 +136,13 @@ PTL.tab = {
empty:function() {
$('div#tabs ul li').remove();
$('div#tabs div').remove();
$('#noSourcesButton').fadeIn('slow');
PTL.tab.makeNewTabButton($('div#tabs'));
// $('#noSourcesButton').fadeIn('slow');
// PTL.tab.makeNewTabButton($('div#tabs'));
},
newTab:function($tabs, name, columns, progress) {
console.log('columns: (%s)', columns);
$('#noSourcesButton').fadeOut('fast');
$('#new-group').removeClass('invisible');
......@@ -229,13 +237,15 @@ PTL.tab = {
$tabs.tabs('refresh');
$tabs.tabs( "option", "active", 0);
$('#ui-id-1').focus();
// $('#ui-id-1').focus();
},
list:function(type) {
var $groupNodes = $('#tab-names > li.tab-name'),
groups = [];
console.log('$groupNodes in: (%s)', $groupNodes.length);
$groupNodes.each(function() {
var group = {},
......@@ -269,6 +279,8 @@ PTL.tab = {
groups.push