implement Gutenberg block to add liveticker without legacy shortcode

* implement react-based JS block
* refactor shortcode and widget to use the same syntax and classes
This commit is contained in:
2019-11-23 17:54:53 +01:00
parent e201d7c02f
commit 9ddcc41c6b
11 changed files with 168 additions and 16 deletions

View File

@ -1,7 +1,7 @@
/**
* Contructor of the scLiveticker object.
*
* @constructor
* @class
*/
function scLiveticker() {
}
@ -24,26 +24,38 @@ scLiveticker.init = function() {
// Get ticker elements.
scLiveticker.ticker = [].map.call(
document.querySelectorAll( 'ul.sclt-ticker-ajax' ),
document.querySelectorAll( 'div.wp-block-scliveticker-ticker.sclt-ajax' ),
function( elem ) {
var list = elem.querySelector( 'ul' );
if ( ! list ) {
list = document.createElement( 'ul' );
elem.appendChild( list );
}
return {
s: elem.getAttribute( 'data-sclt-ticker' ),
l: elem.getAttribute( 'data-sclt-limit' ),
t: elem.getAttribute( 'data-sclt-last' ),
e: elem,
e: list,
};
}
);
// Get widget elements.
scLiveticker.widgets = [].map.call(
document.querySelectorAll( 'ul.sclt-widget-ajax' ),
document.querySelectorAll( 'div.wp-widget-scliveticker-ticker.sclt-ajax' ),
function( elem ) {
var list = elem.querySelector( 'ul' );
if ( ! list ) {
list = document.createElement( 'ul' );
elem.appendChild( list );
}
return {
w: elem.getAttribute( 'data-sclt-ticker' ),
l: elem.getAttribute( 'data-sclt-limit' ),
t: elem.getAttribute( 'data-sclt-last' ),
e: elem,
e: list,
};
}
);
@ -132,7 +144,7 @@ scLiveticker.update = function() {
scLiveticker.updateHTML = function( t, u ) {
// Prepend HTML of new ticks.
t.e.innerHTML = u.h + t.e.innerHTML;
t.e.setAttribute( 'data-sclt-last', u.t );
t.e.parentNode.setAttribute( 'data-sclt-last', u.t );
// Remove tail, if limit is set.
if ( 0 < t.l ) {