diff --git a/.bowerrc b/.bowerrc
deleted file mode 100644
index e01636872..000000000
--- a/.bowerrc
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "directory" : "app/Resources/static/lib",
- "json" : "bower.json"
-}
diff --git a/.eslintrc.json b/.eslintrc.json
index 976a9eb59..d6279c641 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -1,4 +1,4 @@
{
"extends": "airbnb",
- "installedESLint": true,
+ "parser": "babel-eslint"
}
diff --git a/.gitignore b/.gitignore
index fb51034e2..3b2dc462f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -48,4 +48,4 @@ composer.lock
app/Resources/static/lib/*
/bin
!/src/Wallabag/CoreBundle/Resources/public
-/src/Wallabag/CoreBundle/Resources/public/*
+/src/Wallabag/CoreBundle/Resources/public/*
\ No newline at end of file
diff --git a/.stylelintrc b/.stylelintrc
new file mode 100644
index 000000000..40db42c66
--- /dev/null
+++ b/.stylelintrc
@@ -0,0 +1,3 @@
+{
+ "extends": "stylelint-config-standard"
+}
diff --git a/Gruntfile.js b/Gruntfile.js
index 8dc5b83bd..86612dc4b 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -4,6 +4,7 @@ module.exports = function (grunt) {
grunt.initConfig({
appDir: 'app/Resources/static',
buildDir: 'web/bundles/wallabagcore',
+ modulesDir: 'node_modules',
postcss: {
material: {
@@ -41,27 +42,6 @@ module.exports = function (grunt) {
options: {
separator: ';',
},
- jsMaterial: {
- src: [
- '<%= appDir %>/themes/material/js/init.js',
- '<%= appDir %>/themes/_global/js/restoreScroll.js',
- 'node_modules/jquery.tinydot/src/jquery.tinydot.js',
- ],
- dest: '<%= buildDir %>/material.js',
- },
- jsBaggy: {
- src: [
- '<%= appDir %>/themes/baggy/js/init.js',
- '<%= appDir %>/themes/_global/js/restoreScroll.js',
- '<%= appDir %>/themes/baggy/js/autoClose.js',
- '<%= appDir %>/themes/baggy/js/autoCompleteTags.js',
- '<%= appDir %>/themes/baggy/js/closeMessage.js',
- '<%= appDir %>/themes/baggy/js/popupForm.js',
- // Save link is no more used for now
- // '<%= appDir %>/themes/baggy/js/saveLink.js',
- ],
- dest: '<%= buildDir %>/baggy.js',
- },
cssMaterial: {
src: [
'node_modules/materialize-css/bin/materialize.css',
@@ -77,8 +57,37 @@ module.exports = function (grunt) {
},
},
browserify: {
- '<%= buildDir %>/material.browser.js': ['<%= buildDir %>/material.js'],
- '<%= buildDir %>/baggy.browser.js': ['<%= buildDir %>/baggy.js'],
+ dist: {
+ files: {
+ '<%= buildDir %>/material.browser.js': ['<%= appDir %>/themes/material/js/init.js'],
+ '<%= buildDir %>/baggy.browser.js': ['<%= appDir %>/themes/baggy/js/init.js']
+ }
+ },
+ options: {
+ sourceType: "module",
+ transform: [
+ ["babelify", {
+ presets: ["es2015"]
+ }], ["browserify-shim", {
+ "jquery": {
+ "exports": "$"
+ },
+ "materialize": "materialize",
+ "jquery-ui": {
+ "depends": "jquery",
+ "exports": null
+ }
+ }]
+ ],
+ browserifyOptions: {
+ browser: {
+ "jQuery": "./node_modules/jquery/dist/jquery.js",
+ "jquery.tinydot": "./node_modules/jquery.tinydot/src/jquery.tinydot.js",
+ "jquery.ui": "./node_modules/jquery-ui-browserify/dist/jquery-ui.js"
+ }
+ }
+ }
+
},
uglify: {
material: {
@@ -103,13 +112,13 @@ module.exports = function (grunt) {
copy: {
pickerjs: {
expand: true,
- cwd: 'node_modules/pickadate/lib',
+ cwd: '<%= modulesDir %>/pickadate/lib',
src: 'picker.js',
dest: '<%= buildDir %>',
},
annotator: {
expand: true,
- cwd: 'node_modules/annotator/pkg',
+ cwd: '<%= modulesDir %>/annotator/pkg',
src: 'annotator.min.js',
dest: '<%= buildDir %>/themes/_global/js/',
},
@@ -120,14 +129,21 @@ module.exports = function (grunt) {
{
expand: true,
overwrite: true,
- cwd: '<%= appDir %>/lib/icomoon-bower/',
- src: 'fonts',
- dest: '<%= buildDir %>/themes/baggy/',
+ cwd: '<%= modulesDir %>/icomoon-free-npm/Font',
+ src: 'IcoMoon-Free.ttf',
+ dest: '<%= buildDir %>/themes/baggy/fonts/',
},
{
expand: true,
overwrite: true,
- cwd: '<%= appDir %>/lib/bower-pt-sans/fonts',
+ cwd: '<%= modulesDir %>/ptsans-npm-webfont/fonts',
+ src: '*',
+ dest: '<%= buildDir %>/themes/baggy/fonts/',
+ },
+ {
+ expand: true,
+ overwrite: true,
+ cwd: '<%= modulesDir %>/material-design-icons-iconfont/dist/fonts/',
src: '*',
dest: '<%= buildDir %>/themes/baggy/fonts/',
},
@@ -138,28 +154,28 @@ module.exports = function (grunt) {
{
expand: true,
overwrite: true,
- cwd: '<%= appDir %>/lib/icomoon-bower/',
- src: 'fonts',
- dest: '<%= buildDir %>/themes/material/',
+ cwd: '<%= modulesDir %>/icomoon-free-npm/Font',
+ src: 'IcoMoon-Free.ttf',
+ dest: '<%= buildDir %>/themes/material/fonts',
},
{
expand: true,
overwrite: true,
- cwd: 'node_modules/materialize-css/',
+ cwd: '<%= modulesDir %>/materialize-css/',
src: 'font',
dest: '<%= buildDir %>/themes/material',
},
{
expand: true,
overwrite: true,
- cwd: '<%= appDir %>/lib/roboto-fontface/fonts/',
+ cwd: '<%= modulesDir %>/roboto-fontface/fonts/Roboto',
src: '*',
- dest: '<%= buildDir %>/themes/material/fonts/roboto/',
+ dest: '<%= buildDir %>/themes/material/fonts/',
},
{
expand: true,
overwrite: true,
- cwd: '<%= appDir %>/lib/material-design-icons-iconfont/dist/fonts/',
+ cwd: '<%= modulesDir %>/material-design-icons-iconfont/dist/fonts/',
src: '*',
dest: '<%= buildDir %>/themes/material/fonts/',
},
@@ -199,7 +215,7 @@ module.exports = function (grunt) {
grunt.registerTask(
'js',
'Build and install js files',
- ['clean:js', 'copy:pickerjs', 'concat:jsMaterial', 'concat:jsBaggy', 'browserify', 'uglify']
+ ['clean:js', 'copy:pickerjs', 'browserify', 'uglify']
);
grunt.registerTask(
diff --git a/app/Resources/static/themes/_global/js/bookmarklet.js b/app/Resources/static/themes/_global/js/bookmarklet.js
index 2afdfc3cb..5174ff472 100644
--- a/app/Resources/static/themes/_global/js/bookmarklet.js
+++ b/app/Resources/static/themes/_global/js/bookmarklet.js
@@ -1,2 +1,6 @@
-top["bookmarklet-url@wallabag.org"]=""+""+""+"
"+"bag it!"+''+""+""+"';
diff --git a/app/Resources/static/themes/_global/js/restoreScroll.js b/app/Resources/static/themes/_global/js/restoreScroll.js
deleted file mode 100644
index 9c4d7e20b..000000000
--- a/app/Resources/static/themes/_global/js/restoreScroll.js
+++ /dev/null
@@ -1,25 +0,0 @@
-function supportsLocalStorage() {
- try {
- return 'localStorage' in window && window.localStorage !== null;
- } catch (e) {
- return false;
- }
-}
-
-function savePercent(id, percent) {
- if (!supportsLocalStorage()) { return false; }
- localStorage['wallabag.article.' + id + '.percent'] = percent;
- return true;
-}
-
-function retrievePercent(id) {
- if (!supportsLocalStorage()) { return false; }
-
- var bheight = $(document).height();
- var percent = localStorage['wallabag.article.' + id + '.percent'];
- var scroll = bheight * percent;
-
- $('html,body').animate({ scrollTop: scroll }, 'fast');
-
- return true;
-}
diff --git a/app/Resources/static/themes/_global/js/tools.js b/app/Resources/static/themes/_global/js/tools.js
new file mode 100644
index 000000000..ab30deb11
--- /dev/null
+++ b/app/Resources/static/themes/_global/js/tools.js
@@ -0,0 +1,50 @@
+const $ = require('jquery');
+
+function supportsLocalStorage() {
+ try {
+ return 'localStorage' in window && window.localStorage !== null;
+ } catch (e) {
+ return false;
+ }
+}
+
+function savePercent(id, percent) {
+ if (!supportsLocalStorage()) { return false; }
+ localStorage[`wallabag.article.${id}.percent`] = percent;
+ return true;
+}
+
+function retrievePercent(id) {
+ if (!supportsLocalStorage()) { return false; }
+
+ const bheight = $(document).height();
+ const percent = localStorage[`wallabag.article.${id}.percent`];
+ const scroll = bheight * percent;
+
+ $('html,body').animate({ scrollTop: scroll }, 'fast');
+
+ return true;
+}
+
+function initFilters() {
+ // no display if filters not available
+ if ($('div').is('#filters')) {
+ $('#button_filters').show();
+ $('.button-collapse-right').sideNav({ edge: 'right' });
+ $('#clear_form_filters').on('click', () => {
+ $('#filters input').val('');
+ $('#filters :checked').removeAttr('checked');
+ return false;
+ });
+ }
+}
+
+function initExport() {
+ // no display if export not available
+ if ($('div').is('#export')) {
+ $('#button_export').show();
+ $('.button-collapse-right').sideNav({ edge: 'right' });
+ }
+}
+
+export { savePercent, retrievePercent, initFilters, initExport };
diff --git a/app/Resources/static/themes/baggy/css/font.css b/app/Resources/static/themes/baggy/css/font.css
index cae7904a5..47edcb838 100755
--- a/app/Resources/static/themes/baggy/css/font.css
+++ b/app/Resources/static/themes/baggy/css/font.css
@@ -2,5 +2,5 @@
font-family: "PT Sans";
font-style: normal;
font-weight: 700;
- src: local("PT Sans Bold"), local("PTSans-Bold"), url("../fonts/pt_sans/regular/PTS55F.woff") format("woff");
+ src: local("PT Sans Bold"), local("PTSans-Bold"), url("../fonts/ptsansbold.woff") format("woff");
}
diff --git a/app/Resources/static/themes/baggy/css/main.css b/app/Resources/static/themes/baggy/css/main.css
index 7ffaa12ce..eeedd2774 100755
--- a/app/Resources/static/themes/baggy/css/main.css
+++ b/app/Resources/static/themes/baggy/css/main.css
@@ -481,9 +481,6 @@ footer a {
text-transform: none;
margin-bottom: 0;
line-height: 1.2;
- text-align: justify;
- -moz-text-align-last: center;
- text-align-last: center;
}
.entry h2::after {
@@ -735,12 +732,7 @@ a.add-to-wallabag-link-after::after {
@font-face {
font-family: icomoon;
- src: url("../fonts/icomoon.eot?-s0mcsx");
- src:
- url("../fonts/icomoon.eot?#iefix-s0mcsx") format("embedded-opentype"),
- url("../fonts/icomoon.woff?-s0mcsx") format("woff"),
- url("../fonts/icomoon.ttf?-s0mcsx") format("truetype"),
- url("../fonts/icomoon.svg?-s0mcsx#icomoon") format("svg");
+ src: url("../fonts/IcoMoon-Free.ttf");
font-weight: normal;
font-style: normal;
}
@@ -1071,7 +1063,7 @@ pre code {
font-family: "Courier New", Courier, monospace;
}
-#filter-form {
+#filters {
position: fixed;
width: 20%;
height: 100%;
@@ -1086,7 +1078,7 @@ pre code {
min-width: 300px;
}
-#filter-form form .filter-group {
+#filters form .filter-group {
margin: 5px;
}
@@ -1125,9 +1117,11 @@ pre code {
.entry {
width: 49%;
}
+
.entry:nth-child(3n+1) {
margin-left: 1.5%;
}
+
.entry:nth-child(2n+1) {
margin-left: 0;
}
@@ -1137,6 +1131,7 @@ pre code {
#article {
width: 80%;
}
+
.topPosF {
right: 2.5em;
}
@@ -1147,6 +1142,7 @@ pre code {
width: 100%;
margin-left: 0;
}
+
#display-mode {
display: none;
}
@@ -1197,7 +1193,6 @@ pre code {
height: auto;
top: 0.5em;
width: 75px;
- height: 75px;
margin-left: -37.5px;
}
@@ -1214,6 +1209,7 @@ pre code {
background-color: #999;
font-size: 1.2em;
}
+
.desktopHide:hover,
.desktopHide:focus {
background-color: #fff;
diff --git a/app/Resources/static/themes/baggy/css/ratatouille.css b/app/Resources/static/themes/baggy/css/ratatouille.css
index b5aeb54e4..a6167f344 100644
--- a/app/Resources/static/themes/baggy/css/ratatouille.css
+++ b/app/Resources/static/themes/baggy/css/ratatouille.css
@@ -63,7 +63,9 @@ pre {
max-width: 61.25em; /* 980px */
}
-table, img, figure {
+table,
+img,
+figure {
max-width: 100%;
height: auto;
}
diff --git a/app/Resources/static/themes/baggy/js/autoClose.js b/app/Resources/static/themes/baggy/js/autoClose.js
deleted file mode 100644
index b0dafab21..000000000
--- a/app/Resources/static/themes/baggy/js/autoClose.js
+++ /dev/null
@@ -1,8 +0,0 @@
-var $ = global.jquery = require('jquery');
-
-$(document).ready(function () {
- var currentUrl = window.location.href;
- if (currentUrl.match('&closewin=true')) {
- window.close();
- }
-});
diff --git a/app/Resources/static/themes/baggy/js/autoCompleteTags.js b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
index edd0a421e..f287ebfa9 100755
--- a/app/Resources/static/themes/baggy/js/autoCompleteTags.js
+++ b/app/Resources/static/themes/baggy/js/autoCompleteTags.js
@@ -1,46 +1,8 @@
-var $ = global.jquery = require('jquery');
+function split(val) {
+ return val.split(/,\s*/);
+}
+function extractLast(term) {
+ return split(term).pop();
+}
-jQuery(function ($) {
- function split(val) {
- return val.split(/,\s*/);
- }
- function extractLast(term) {
- return split(term).pop();
- }
-
-
- $('#value').bind('keydown', function (event) {
- if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) {
- event.preventDefault();
- }
- }).autocomplete({
- source: function (request, response) {
- $.getJSON('./?view=tags', {
- term: extractLast(request.term),
- //id: $(':hidden#entry_id').val()
- }, response);
- },
- search: function () {
- // custom minLength
- var term = extractLast(this.value);
- if (term.length < 1) {
- return false;
- }
- },
- focus: function () {
- // prevent value inserted on focus
- return false;
- },
- select: function (event, ui) {
- var terms = split(this.value);
- // remove the current input
- terms.pop();
- // add the selected item
- terms.push(ui.item.value);
- // add placeholder to get the comma-and-space at the end
- terms.push('');
- this.value = terms.join(', ');
- return false;
- },
- });
-});
+export { split, extractLast };
diff --git a/app/Resources/static/themes/baggy/js/closeMessage.js b/app/Resources/static/themes/baggy/js/closeMessage.js
deleted file mode 100644
index ae4b17912..000000000
--- a/app/Resources/static/themes/baggy/js/closeMessage.js
+++ /dev/null
@@ -1,19 +0,0 @@
-var $ = global.jquery = require('jquery');
-
-$(function () {
- //---------------------------------------------------------------------------
- // Show the close icon when the user hover over a message
- //---------------------------------------------------------------------------
- // $('.messages').on('mouseenter', function(){
- // $(this).find('a.closeMessage').stop(true, true).show();
- // }).on('mouseleave', function(){
- // $(this).find('a.closeMessage').stop(true, true).hide();
- // });
- //---------------------------------------------------------------------------
- // Close the message box when the user clicks the close icon
- //---------------------------------------------------------------------------
- $('a.closeMessage').on('click', function () {
- $(this).parents('div.messages').slideUp(300, function () { $(this).remove(); });
- return false;
- });
-});
diff --git a/app/Resources/static/themes/baggy/js/init.js b/app/Resources/static/themes/baggy/js/init.js
index d7d4b1661..8da9a859b 100755
--- a/app/Resources/static/themes/baggy/js/init.js
+++ b/app/Resources/static/themes/baggy/js/init.js
@@ -1,21 +1,25 @@
-var $ = global.jquery = require('jquery');
+const $ = global.jquery = require('jquery');
require('jquery.cookie');
-require('jquery-ui');
-var annotator = require('annotator');
+require('jquery-ui-browserify');
+const annotator = require('annotator');
+import { savePercent, retrievePercent } from '../../_global/js/tools.js';
+import { split, extractLast } from './autoCompleteTags.js';
+import { toggleSaveLinkForm } from './uiTools.js';
-$.fn.ready(function () {
- var $listmode = $('#listmode');
- var $listentries = $('#list-entries');
+$.fn.ready(() => {
+ const $listmode = $('#listmode');
+ const $listentries = $('#list-entries');
/* ==========================================================================
Menu
========================================================================== */
- $('#menu').click(function () {
+ $('#menu').click(() => {
$('#links').toggleClass('menu--open');
- if ($('#content').hasClass('opacity03')) {
- $('#content').removeClass('opacity03');
+ const content = $('#content');
+ if (content.hasClass('opacity03')) {
+ content.removeClass('opacity03');
}
});
@@ -23,8 +27,8 @@ $.fn.ready(function () {
List mode or Table Mode
========================================================================== */
- $listmode.click(function () {
- if (jquery.cookie('listmode') === 1) {
+ $listmode.click(() => {
+ if ($.cookie('listmode') === 1) {
// Cookie
$.removeCookie('listmode');
@@ -33,7 +37,7 @@ $.fn.ready(function () {
$listmode.addClass('listmode');
} else {
// Cookie
- jquery.cookie('listmode', 1, { expires: 365 });
+ $.cookie('listmode', 1, { expires: 365 });
$listentries.addClass('listmode');
$listmode.removeClass('listmode');
@@ -45,7 +49,7 @@ $.fn.ready(function () {
Cookie listmode
========================================================================== */
- if (jquery.cookie('listmode') === 1) {
+ if ($.cookie('listmode') === 1) {
$listentries.addClass('listmode');
$listmode.removeClass('listmode');
$listmode.addClass('tablemode');
@@ -56,43 +60,255 @@ $.fn.ready(function () {
========================================================================== */
- $('#nav-btn-add-tag').on('click', function () {
+ $('#nav-btn-add-tag').on('click', () => {
$('.nav-panel-add-tag').toggle(100);
$('.nav-panel-menu').addClass('hidden');
$('#tag_label').focus();
return false;
});
+ /**
+ * Filters & Export
+ */
+ // no display if filters not available
+ if ($('div').is('#filters')) {
+ $('#button_filters').show();
+ $('#clear_form_filters').on('click', () => {
+ $('#filters input').val('');
+ $('#filters :checked').removeAttr('checked');
+ return false;
+ });
+ }
+
/* ==========================================================================
Annotations & Remember position
========================================================================== */
- if ($('article').length) {
- var app = new annotator.App();
+ if ($('article').length) {
+ const app = new annotator.App();
- app.include(annotator.ui.main, {
- element: document.querySelector('article'),
- });
+ app.include(annotator.ui.main, {
+ element: document.querySelector('article'),
+ });
- var x = JSON.parse($('#annotationroutes').html());
- app.include(annotator.storage.http, x);
+ const x = JSON.parse($('#annotationroutes').html());
+ app.include(annotator.storage.http, x);
- app.start().then(function () {
- app.annotations.load({ entry: x.entryId });
- });
+ app.start().then(() => {
+ app.annotations.load({ entry: x.entryId });
+ });
- $(window).scroll(function (e) {
- var scrollTop = $(window).scrollTop();
- var docHeight = $(document).height();
- var scrollPercent = (scrollTop) / (docHeight);
- var scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
- savePercent(x.entryId, scrollPercentRounded);
- });
+ $(window).scroll(() => {
+ const scrollTop = $(window).scrollTop();
+ const docHeight = $(document).height();
+ const scrollPercent = (scrollTop) / (docHeight);
+ const scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
+ savePercent(x.entryId, scrollPercentRounded);
+ });
+ retrievePercent(x.entryId);
+
+ $(window).resize(() => {
retrievePercent(x.entryId);
+ });
+ }
- $(window).resize(function () {
- retrievePercent(x.entryId);
- });
+ /**
+ * Close window after adding entry if popup
+ */
+ const currentUrl = window.location.href;
+ if (currentUrl.match('&closewin=true')) {
+ window.close();
+ }
+
+ /**
+ * Tags autocomplete
+ */
+ /**
+ * Not working on v2
+ *
+
+ $('#value').bind('keydown', (event) => {
+ if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) {
+ event.preventDefault();
}
+ }).autocomplete({
+ source: function source(request, response) {
+ $.getJSON('./?view=tags', {
+ term: extractLast(request.term),
+ //id: $(':hidden#entry_id').val()
+ }, response);
+ },
+ search: function search() {
+ // custom minLength
+ const term = extractLast(this.value);
+ return term.length >= 1;
+ },
+ focus: function focus() {
+ // prevent value inserted on focus
+ return false;
+ },
+ select: function select(event, ui) {
+ const terms = split(this.value);
+ // remove the current input
+ terms.pop();
+ // add the selected item
+ terms.push(ui.item.value);
+ // add placeholder to get the comma-and-space at the end
+ terms.push('');
+ this.value = terms.join(', ');
+ return false;
+ },
+ });
+ */
+
+ //---------------------------------------------------------------------------
+ // Close the message box when the user clicks the close icon
+ //---------------------------------------------------------------------------
+ $('a.closeMessage').on('click', () => {
+ $(this).parents('div.messages').slideUp(300, () => { $(this).remove(); });
+ return false;
+ });
+
+ $('#search-form').hide();
+ $('#bagit-form').hide();
+ $('#filters').hide();
+ $('#download-form').hide();
+
+ //---------------------------------------------------------------------------
+ // Toggle the 'Search' popup in the sidebar
+ //---------------------------------------------------------------------------
+ function toggleSearch() {
+ $('#search-form').toggle();
+ $('#search').toggleClass('current');
+ $('#search').toggleClass('active-current');
+ $('#search-arrow').toggleClass('arrow-down');
+ if ($('#search').hasClass('current')) {
+ $('#content').addClass('opacity03');
+ } else {
+ $('#content').removeClass('opacity03');
+ }
+ }
+
+ //---------------------------------------------------------------------------
+ // Toggle the 'Filter' popup on entries list
+ //---------------------------------------------------------------------------
+ function toggleFilter() {
+ $('#filters').toggle();
+ }
+
+ //---------------------------------------------------------------------------
+ // Toggle the 'Download' popup on entries list
+ //---------------------------------------------------------------------------
+ function toggleDownload() {
+ $('#download-form').toggle();
+ }
+
+ //---------------------------------------------------------------------------
+ // Toggle the 'Save a Link' popup in the sidebar
+ //---------------------------------------------------------------------------
+ function toggleBagit() {
+ $('#bagit-form').toggle();
+ $('#bagit').toggleClass('current');
+ $('#bagit').toggleClass('active-current');
+ $('#bagit-arrow').toggleClass('arrow-down');
+ if ($('#bagit').hasClass('current')) {
+ $('#content').addClass('opacity03');
+ } else {
+ $('#content').removeClass('opacity03');
+ }
+ }
+
+ //---------------------------------------------------------------------------
+ // Close all #links popups in the sidebar
+ //---------------------------------------------------------------------------
+ function closePopups() {
+ $('#links .messages').hide();
+ $('#links > li > a').removeClass('active-current');
+ $('#links > li > a').removeClass('current');
+ $('[id$=-arrow]').removeClass('arrow-down');
+ $('#content').removeClass('opacity03');
+ }
+
+ $('#search').click(() => {
+ closePopups();
+ toggleSearch();
+ $('#searchfield').focus();
+ });
+
+ $('.filter-btn').click(() => {
+ closePopups();
+ toggleFilter();
+ });
+
+ $('.download-btn').click(() => {
+ closePopups();
+ toggleDownload();
+ });
+
+ $('#bagit').click(() => {
+ closePopups();
+ toggleBagit();
+ $('#plainurl').focus();
+ });
+
+ $('#search-form-close').click(() => {
+ toggleSearch();
+ });
+
+ $('#filter-form-close').click(() => {
+ toggleFilter();
+ });
+
+ $('#download-form-close').click(() => {
+ toggleDownload();
+ });
+
+ $('#bagit-form-close').click(() => {
+ toggleBagit();
+ });
+
+ const $bagitFormForm = $('#bagit-form-form');
+
+ /* ==========================================================================
+ bag it link and close button
+ ========================================================================== */
+
+ // send 'bag it link' form request via ajax
+ $bagitFormForm.submit((event) => {
+ $('body').css('cursor', 'wait');
+ $('#add-link-result').empty();
+
+ $.ajax({
+ type: $bagitFormForm.attr('method'),
+ url: $bagitFormForm.attr('action'),
+ data: $bagitFormForm.serialize(),
+ success: function success() {
+ $('#add-link-result').html('Done!');
+ $('#plainurl').val('');
+ $('#plainurl').blur('');
+ $('body').css('cursor', 'auto');
+ },
+ error: function error() {
+ $('#add-link-result').html('Failed!');
+ $('body').css('cursor', 'auto');
+ },
+ });
+
+ event.preventDefault();
+ });
+
+ /* ==========================================================================
+ Process all links inside an article
+ ========================================================================== */
+
+ $('article a[href^="http"]').after(
+ () => `'
+ );
+
+ $('.add-to-wallabag-link-after').click((event) => {
+ toggleSaveLinkForm($(this).attr('href'), event);
+ event.preventDefault();
+ });
});
diff --git a/app/Resources/static/themes/baggy/js/popupForm.js b/app/Resources/static/themes/baggy/js/popupForm.js
deleted file mode 100644
index 95ba60ee5..000000000
--- a/app/Resources/static/themes/baggy/js/popupForm.js
+++ /dev/null
@@ -1,101 +0,0 @@
-var $ = global.jquery = require('jquery');
-
-$(document).ready(function () {
- $('#search-form').hide();
- $('#bagit-form').hide();
- $('#filter-form').hide();
- $('#download-form').hide();
-
- //---------------------------------------------------------------------------
- // Toggle the 'Search' popup in the sidebar
- //---------------------------------------------------------------------------
- function toggleSearch() {
- $('#search-form').toggle();
- $('#search').toggleClass('current');
- $('#search').toggleClass('active-current');
- $('#search-arrow').toggleClass('arrow-down');
- if ($('#search').hasClass('current')) {
- $('#content').addClass('opacity03');
- } else {
- $('#content').removeClass('opacity03');
- }
- }
-
- //---------------------------------------------------------------------------
- // Toggle the 'Filter' popup on entries list
- //---------------------------------------------------------------------------
- function toggleFilter() {
- $('#filter-form').toggle();
- }
-
- //---------------------------------------------------------------------------
- // Toggle the 'Download' popup on entries list
- //---------------------------------------------------------------------------
- function toggleDownload() {
- $('#download-form').toggle();
- }
-
- //---------------------------------------------------------------------------
- // Toggle the 'Save a Link' popup in the sidebar
- //---------------------------------------------------------------------------
- function toggleBagit() {
- $('#bagit-form').toggle();
- $('#bagit').toggleClass('current');
- $('#bagit').toggleClass('active-current');
- $('#bagit-arrow').toggleClass('arrow-down');
- if ($('#bagit').hasClass('current')) {
- $('#content').addClass('opacity03');
- } else {
- $('#content').removeClass('opacity03');
- }
- }
-
- //---------------------------------------------------------------------------
- // Close all #links popups in the sidebar
- //---------------------------------------------------------------------------
- function closePopups() {
- $('#links .messages').hide();
- $('#links > li > a').removeClass('active-current');
- $('#links > li > a').removeClass('current');
- $('[id$=-arrow]').removeClass('arrow-down');
- $('#content').removeClass('opacity03');
- }
-
- $('#search').click(function () {
- closePopups();
- toggleSearch();
- $('#searchfield').focus();
- });
-
- $('.filter-btn').click(function () {
- closePopups();
- toggleFilter();
- });
-
- $('.download-btn').click(function () {
- closePopups();
- toggleDownload();
- });
-
- $('#bagit').click(function () {
- closePopups();
- toggleBagit();
- $('#plainurl').focus();
- });
-
- $('#search-form-close').click(function () {
- toggleSearch();
- });
-
- $('#filter-form-close').click(function () {
- toggleFilter();
- });
-
- $('#download-form-close').click(function () {
- toggleDownload();
- });
-
- $('#bagit-form-close').click(function () {
- toggleBagit();
- });
-});
diff --git a/app/Resources/static/themes/baggy/js/saveLink.js b/app/Resources/static/themes/baggy/js/saveLink.js
deleted file mode 100755
index 5c7208862..000000000
--- a/app/Resources/static/themes/baggy/js/saveLink.js
+++ /dev/null
@@ -1,75 +0,0 @@
-var $ = global.jquery = require('jquery');
-
-$.fn.ready(function () {
- var $bagit = $('#bagit');
- var $bagitForm = $('#bagit-form');
- var $bagitFormForm = $('#bagit-form-form');
-
- /* ==========================================================================
- bag it link and close button
- ========================================================================== */
-
- function toggleSaveLinkForm(url, event) {
- $('#add-link-result').empty();
-
- $bagit.toggleClass('active-current');
-
- // only if bag-it link is not presented on page
- if ($bagit.length === 0) {
- if (event !== 'undefined' && event) {
- $bagitForm.css({ position: 'absolute', top: event.pageY, left: event.pageX - 200 });
- } else {
- $bagitForm.css({ position: 'relative', top: 'auto', left: 'auto' });
- }
- }
-
- if ($('#search-form').length !== 0) {
- $('#search').removeClass('current');
- $('#search-arrow').removeClass('arrow-down');
- $('#search-form').hide();
- }
- $bagitForm.toggle();
- $('#content').toggleClass('opacity03');
- if (url !== 'undefined' && url) {
- $('#plainurl').val(url);
- }
- $('#plainurl').focus();
- }
-
- // send 'bag it link' form request via ajax
- $bagitFormForm.submit(function (event) {
- $('body').css('cursor', 'wait');
- $('#add-link-result').empty();
-
- $.ajax({
- type: $bagitFormForm.attr('method'),
- url: $bagitFormForm.attr('action'),
- data: $bagitFormForm.serialize(),
- success: function (data) {
- $('#add-link-result').html('Done!');
- $('#plainurl').val('');
- $('#plainurl').blur('');
- $('body').css('cursor', 'auto');
- },
- error: function (data) {
- $('#add-link-result').html('Failed!');
- $('body').css('cursor', 'auto');
- },
- });
-
- event.preventDefault();
- });
-
- /* ==========================================================================
- Process all links inside an article
- ========================================================================== */
-
- $('article a[href^="http"]').after(function () {
- return ' ';
- });
-
- $('.add-to-wallabag-link-after').click(function (event) {
- toggleSaveLinkForm($(this).attr('href'), event);
- event.preventDefault();
- });
-});
diff --git a/app/Resources/static/themes/baggy/js/uiTools.js b/app/Resources/static/themes/baggy/js/uiTools.js
new file mode 100644
index 000000000..900b27071
--- /dev/null
+++ b/app/Resources/static/themes/baggy/js/uiTools.js
@@ -0,0 +1,35 @@
+const $ = require('jquery');
+
+function toggleSaveLinkForm(url, event) {
+ $('#add-link-result').empty();
+
+ const $bagit = $('#bagit');
+ const $bagitForm = $('#bagit-form');
+
+ $bagit.toggleClass('active-current');
+
+ // only if bag-it link is not presented on page
+ if ($bagit.length === 0) {
+ if (event !== 'undefined' && event) {
+ $bagitForm.css({ position: 'absolute', top: event.pageY, left: event.pageX - 200 });
+ } else {
+ $bagitForm.css({ position: 'relative', top: 'auto', left: 'auto' });
+ }
+ }
+
+ const searchForm = $('#search-form');
+ const plainUrl = $('#plainurl');
+ if (searchForm.length !== 0) {
+ $('#search').removeClass('current');
+ $('#search-arrow').removeClass('arrow-down');
+ searchForm.hide();
+ }
+ $bagitForm.toggle();
+ $('#content').toggleClass('opacity03');
+ if (url !== 'undefined' && url) {
+ plainUrl.val(url);
+ }
+ plainUrl.focus();
+}
+
+export { toggleSaveLinkForm };
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css
index 005cc3020..00d7a8699 100755
--- a/app/Resources/static/themes/material/css/main.css
+++ b/app/Resources/static/themes/material/css/main.css
@@ -19,12 +19,7 @@
@font-face {
font-family: icomoon;
- src: url("../fonts/icomoon.eot");
- src:
- url("../fonts/icomoon.eot#iefix") format("embedded-opentype"),
- url("../fonts/icomoon.ttf") format("truetype"),
- url("../fonts/icomoon.woff") format("woff"),
- url("../fonts/icomoon.svg#icomoon") format("svg");
+ src: url("../fonts/IcoMoon-Free.ttf");
font-weight: normal;
font-style: normal;
}
@@ -174,7 +169,7 @@ div.pagination ul .next.disabled {
footer.page-footer {
margin-top: 10px;
- padding-top: 0px;
+ padding-top: 0;
}
footer .row {
@@ -257,8 +252,9 @@ nav input {
display: none;
}
-.input-field.nav-panel-add, .input-field.nav-panel-add form {
- height: 100%;
+.input-field.nav-panel-add,
+.input-field.nav-panel-add form {
+ height: 100%;
}
/* ==========================================================================
@@ -354,8 +350,9 @@ main ul.row {
max-height: 64px;
}
-.card .card-content i.right, .card .card-reveal i.right {
- margin-left: 0;
+.card .card-content i.right,
+.card .card-reveal i.right {
+ margin-left: 0;
}
.card .card-entry-labels {
@@ -527,30 +524,38 @@ main ul.row {
footer {
padding-left: 0;
}
+
nav,
main,
footer {
padding-left: 0;
}
+
.pagination {
width: auto;
}
+
.reader-mode {
width: 240px !important;
}
+
.reader-mode span {
opacity: 1;
}
+
.tabs {
display: inline-block;
height: auto;
}
+
.tab {
min-width: 100%;
}
+
.indicator {
display: none;
}
+
.pagination li.prev,
.pagination li.next {
width: auto;
@@ -568,38 +573,47 @@ main ul.row {
width: 25%;
margin-left: 0;
}
+
.row .col.l2 {
width: 33.33333%;
margin-left: 0;
}
+
.row .col.l3 {
width: 41.66667%;
margin-left: 0;
}
+
.row .col.l4 {
width: 50%;
margin-left: 0;
}
+
.row .col.l5 {
width: 58.33333%;
margin-left: 0;
}
+
.row .col.l6 {
width: 66.66667%;
margin-left: 0;
}
+
.row .col.l7 {
width: 75%;
margin-left: 0;
}
+
.row .col.l8 {
width: 83.33333%;
margin-left: 0;
}
+
.row .col.l9 {
width: 91.66667%;
margin-left: 0;
}
+
.row .col.l10 {
width: 100%;
margin-left: 0;
@@ -645,7 +659,7 @@ main ul.row {
}
.icon-link::before {
- content: "\e9cb";
+ content: "\e9cb";
}
footer [class^="icon-"],
@@ -676,5 +690,5 @@ div.settings div.file-field div {
}
.input-field label.active {
- font-size: 1rem;
+ font-size: 1rem;
}
diff --git a/app/Resources/static/themes/material/css/print.css b/app/Resources/static/themes/material/css/print.css
index 1eb96735a..98505aae0 100755
--- a/app/Resources/static/themes/material/css/print.css
+++ b/app/Resources/static/themes/material/css/print.css
@@ -28,10 +28,10 @@
.messages,
.entry + .results,
#slide-out,
- .progress, .hide-on-large-only,
+ .progress,
+ .hide-on-large-only,
#article > aside,
- #article .mbm a
- {
+ #article .mbm a {
display: none !important;
}
diff --git a/app/Resources/static/themes/material/js/init.js b/app/Resources/static/themes/material/js/init.js
index d6a87941e..18f7b40af 100755
--- a/app/Resources/static/themes/material/js/init.js
+++ b/app/Resources/static/themes/material/js/init.js
@@ -1,29 +1,10 @@
-var $ = require('jquery');
-require('materialize');
-var annotator = require('annotator');
+const $ = require('jquery');
+global.jQuery = $;
+require('materialize'); // eslint-disable-line
+const annotator = require('annotator');
+import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools.js';
-function initFilters() {
- // no display if filters not aviable
- if ($('div').is('#filters')) {
- $('#button_filters').show();
- $('.button-collapse-right').sideNav({ edge: 'right' });
- $('#clear_form_filters').on('click', function () {
- $('#filters input').val('');
- $('#filters :checked').removeAttr('checked');
- return false;
- });
- }
-}
-
-function initExport() {
- // no display if export not aviable
- if ($('div').is('#export')) {
- $('#button_export').show();
- $('.button-collapse-right').sideNav({ edge: 'right' });
- }
-}
-
-$(document).ready(function () {
+$(document).ready(() => {
// sideNav
$('.button-collapse').sideNav();
$('select').material_select();
@@ -40,13 +21,13 @@ $(document).ready(function () {
initFilters();
initExport();
- $('#nav-btn-add-tag').on('click', function () {
+ $('#nav-btn-add-tag').on('click', () => {
$('.nav-panel-add-tag').toggle(100);
$('.nav-panel-menu').addClass('hidden');
$('#tag_label').focus();
return false;
});
- $('#nav-btn-add').on('click', function () {
+ $('#nav-btn-add').on('click', () => {
$('.nav-panel-buttom').hide(100);
$('.nav-panel-add').show(100);
$('.nav-panels .action').hide(100);
@@ -55,7 +36,7 @@ $(document).ready(function () {
$('#entry_url').focus();
return false;
});
- $('#nav-btn-search').on('click', function () {
+ $('#nav-btn-search').on('click', () => {
$('.nav-panel-buttom').hide(100);
$('.nav-panel-search').show(100);
$('.nav-panels .action').hide(100);
@@ -64,7 +45,7 @@ $(document).ready(function () {
$('#searchfield').focus();
return false;
});
- $('.close').on('click', function () {
+ $('.close').on('click', () => {
$('.nav-panel-add').hide(100);
$('.nav-panel-search').hide(100);
$('.nav-panel-buttom').show(100);
@@ -73,12 +54,12 @@ $(document).ready(function () {
$('.nav-panels').css('background', 'transparent');
return false;
});
- $(window).scroll(function () {
- var s = $(window).scrollTop();
- var d = $(document).height();
- var c = $(window).height();
- var scrollPercent = (s / (d - c)) * 100;
- $('.progress .determinate').css('width', scrollPercent + '%');
+ $(window).scroll(() => {
+ const s = $(window).scrollTop();
+ const d = $(document).height();
+ const c = $(window).height();
+ const scrollPercent = (s / (d - c)) * 100;
+ $('.progress .determinate').css('width', `${scrollPercent}%`);
});
/* ==========================================================================
@@ -86,9 +67,8 @@ $(document).ready(function () {
========================================================================== */
if ($('article').length) {
- var app = new annotator.App();
- var x = JSON.parse($('#annotationroutes').html());
-
+ const app = new annotator.App();
+ const x = JSON.parse($('#annotationroutes').html());
app.include(annotator.ui.main, {
element: document.querySelector('article'),
@@ -96,21 +76,21 @@ $(document).ready(function () {
app.include(annotator.storage.http, x);
- app.start().then(function () {
+ app.start().then(() => {
app.annotations.load({ entry: x.entryId });
});
- $(window).scroll(function (e) {
- var scrollTop = $(window).scrollTop();
- var docHeight = $(document).height();
- var scrollPercent = (scrollTop) / (docHeight);
- var scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
+ $(window).scroll(() => {
+ const scrollTop = $(window).scrollTop();
+ const docHeight = $(document).height();
+ const scrollPercent = (scrollTop) / (docHeight);
+ const scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
savePercent(x.entryId, scrollPercentRounded);
});
retrievePercent(x.entryId);
- $(window).resize(function () {
+ $(window).resize(() => {
retrievePercent(x.entryId);
});
}
diff --git a/bower.json b/bower.json
deleted file mode 100644
index f2d2bd26e..000000000
--- a/bower.json
+++ /dev/null
@@ -1,39 +0,0 @@
-{
- "name": "wallabag",
- "version": "2.0.0-beta.1",
- "homepage": "https://github.com/wallabag/wallabag",
- "authors": [
- {
- "name": "Nicolas Lœuillet",
- "email": "nicolas@loeuillet.org",
- "homepage": "http://www.cdetc.fr",
- "role": "Developer"
- },
- {
- "name": "Thomas Citharel",
- "homepage": "http://tcit.fr",
- "role": "Developer"
- },
- {
- "name": "Jérémy Benoist",
- "homepage": "http://www.j0k3r.net",
- "role": "Developer"
- }
- ],
- "description": "wallabag is a self hostable application for saving web pages",
- "license": "MIT",
- "main": "bower.json",
- "ignore": [
- "**/.*",
- "node_modules",
- "bower_components",
- "test",
- "tests"
- ],
- "dependencies": {
- "icomoon-bower": "^0.1.0",
- "bower-pt-sans": "pt-sans#*",
- "roboto-fontface": "^0.4.5",
- "material-design-icons-iconfont": "^2.0.4"
- }
-}
diff --git a/install.sh b/install.sh
index a486e8a5b..29b343b29 100755
--- a/install.sh
+++ b/install.sh
@@ -5,12 +5,9 @@ if [[ $ASSETS == 'build' ]]; then
composer install --no-interaction --no-progress --prefer-dist -o
chmod ugo+x vendor/mouf/nodejs-installer/bin/local/npm
- echo "Downloading javascript librairies through npm..."
+ echo "Downloading librairies through npm..."
vendor/mouf/nodejs-installer/bin/local/npm install
- echo "Downloading fonts librairies through bower..."
- node_modules/bower/bin/bower install
-
echo "Concat, minify and installing assets..."
node_modules/grunt/bin/grunt
else
diff --git a/install_dev.sh b/install_dev.sh
index 81f871daf..61a4f6fd4 100755
--- a/install_dev.sh
+++ b/install_dev.sh
@@ -3,12 +3,9 @@
echo "Installing PHP dependencies (including dev) through Composer..."
composer install
-echo "Downloading javascript librairies through npm..."
+echo "Downloading librairies through npm..."
npm install
-echo "Downloading fonts librairies through bower..."
-bower install
-
echo "Concat, minify and installing assets..."
grunt
diff --git a/package.json b/package.json
index 39a10e9c9..21664f37e 100644
--- a/package.json
+++ b/package.json
@@ -10,7 +10,8 @@
"dependencies": {
"annotator": "git://github.com/wallabag/annotator.git#0f076c7d371ed25eb0793346f46982d90f2c4c85",
"autoprefixer": "^6.3.6",
- "bower": "^1.7.7",
+ "babel-preset-es2015": "^6.14.0",
+ "babelify": "^7.3.0",
"browserify": "^13.0.0",
"browserify-shim": "^3.8.12",
"cssnano": "^3.5.2",
@@ -25,17 +26,21 @@
"grunt-contrib-uglify": "^1.0.0",
"grunt-postcss": "^0.8.0",
"hammerjs": "^2.0.6",
- "jquery": "^2.2.1",
- "jquery-ui": "^1.10.5",
+ "icomoon-free-npm": "0.0.0",
+ "jquery": "^2.2.4",
+ "jquery-ui-browserify": "^1.11.0-pre-seelio",
"jquery.cookie": "^1.4.1",
"jquery.tinydot": "^0.2.1",
"load-grunt-tasks": "^3.4.1",
+ "material-design-icons-iconfont": "^3.0.0",
"materialize-css": "0.97.5",
"npm": "^3.8.3",
"pickadate": "^3.5.6",
"pixrem": "^3.0.0",
"postcss-cssnext": "^2.5.1",
"prismjs": "^1.4.1",
+ "ptsans-npm-webfont": "0.0.4",
+ "roboto-fontface": "^0.6.0",
"through": "^2.3.8"
},
"engines": {
@@ -47,9 +52,14 @@
"materialize": "./node_modules/materialize-css/bin/materialize.js"
},
"browserify-shim": {
- "jquery": "$",
- "jQuery": "jQuery",
- "materialize": "materialize"
+ "jquery": {
+ "exports": "$"
+ },
+ "materialize": "materialize",
+ "jquery-ui": {
+ "depends": "jquery",
+ "exports": null
+ }
},
"browserify": {
"transform": [
@@ -83,7 +93,10 @@
"url": "https://github.com/wallabag/wallabag/issues"
},
"devDependencies": {
- "eslint": "^2.11.1",
- "eslint-config-airbnb": "^9.0.1"
+ "babel-eslint": "^6.1.2",
+ "eslint": "^2.13.1",
+ "eslint-config-airbnb": "^9.0.1",
+ "stylelint": "^7.3.1",
+ "stylelint-config-standard": "^13.0.2"
}
}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig
index ffc5bec65..1c0430e8a 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entries.html.twig
@@ -67,7 +67,7 @@
{% if form is not null %}
-
+
{% endif %}
{% endblock %}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig
index bec4b70fb..be1e36476 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/baggy/Entry/entry.html.twig
@@ -82,22 +82,4 @@
"entryId": "{{ entry.id }}"
}
-
-
{% endblock %}
diff --git a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
index e889dea8c..01fde953e 100644
--- a/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
+++ b/src/Wallabag/CoreBundle/Resources/views/themes/material/Entry/entries.html.twig
@@ -66,7 +66,7 @@
{{ entry.content|striptags|slice(0, 300)|raw }}…
-
+
{% for tag in entry.tags %}
- {{ tag.label }}
{% endfor %}