-
-
-
- [[_gettext('Close')]]
-
-
-
+ .toast-close {
+ margin: 0;
+ float: right;
+ cursor: pointer;
+ }
+
+ .toast-message-holder {
+ background: rgba(255, 255, 255, 0.25);
+ }
+
+ .toast-message-holder.fixed {
+ position: fixed;
+ padding: 10px 0;
+ margin-left: 10px;
+ margin-right: 10px;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 100;
+ }
+ `;
+
+ static properties = {
+ toasts: {type: Array},
+ isFixed: {type: Boolean}
+ };
+
+ constructor() {
+ super();
+ this.toasts = [];
+ this.isFixed = false;
+ this._headerNode = null;
+ this._debouncedCalcBound = this._debouncedCalc.bind(this);
+ this._handleKeyupBound = this._handleKeyup.bind(this);
+ this._debounceTimeout = null;
+ }
+
+ get hasToasts() {
+ return this.toasts && this.toasts.length > 0;
+ }
+
+ connectedCallback() {
+ super.connectedCallback();
+ this._headerNode = document.querySelector('.header');
+ window.addEventListener('scroll', this._debouncedCalcBound);
+ window.addEventListener('resize', this._debouncedCalcBound);
+ window.addEventListener('keyup', this._handleKeyupBound);
+ this._debouncedCalc();
+ }
+
+ disconnectedCallback() {
+ super.disconnectedCallback();
+ window.removeEventListener('scroll', this._debouncedCalcBound);
+ window.removeEventListener('resize', this._debouncedCalcBound);
+ window.removeEventListener('keyup', this._handleKeyupBound);
+ if (this._debounceTimeout) {
+ clearTimeout(this._debounceTimeout);
+ }
+ }
+
+ updated(changedProperties) {
+ if (changedProperties.has('toasts')) {
+ $.Topic('/favicon/update').publish({count: this.toasts.length});
+ }
+ }
+
+ render() {
+ if (!this.hasToasts) {
+ return html``;
+ }
+
+ return html`
+
+ ${this.toasts.map((item, index) => html`
+
+
this.dismissNotification(index)}>
+ ${this._gettext('Close')}
-
- `
+
+
+ `)}
+
+ `;
+ }
+
+ _handleKeyup(event) {
+ if (event.key === 'Escape') {
+ this.dismissNotifications();
}
+ }
- static get properties() {
- return {
- toasts: {
- type: Array,
- value() {
- return []
- }
- },
- isFixed: {
- type: Boolean,
- value: false
- },
- hasToasts: {
- type: Boolean,
- computed: '_computeHasToasts(toasts.*)'
- },
- keyEventTarget: {
- type: Object,
- value() {
- return document.body;
- }
- }
- }
+ _debouncedCalc() {
+ if (this._debounceTimeout) {
+ clearTimeout(this._debounceTimeout);
}
+ this._debounceTimeout = setTimeout(() => {
+ this.toastInWindow();
+ }, 25);
+ }
- get keyBindings() {
- return {
- 'esc:keyup': '_hideOnEsc'
- }
+ toastInWindow() {
+ if (!this._headerNode) {
+ return true;
}
+ const headerHeight = this._headerNode.offsetHeight;
+ const scrollPosition = window.scrollY;
- static get observers() {
- return [
- '_changedToasts(toasts.splices)'
- ]
+ if (this.isFixed) {
+ this.isFixed = 1 <= scrollPosition;
+ } else {
+ this.isFixed = headerHeight <= scrollPosition;
}
+ }
- _hideOnEsc(event) {
- return this.dismissNotifications();
- }
-
- _computeHasToasts() {
- return this.toasts.length > 0;
- }
-
- _debouncedCalc() {
- // calculate once in a while
- this.debounce('debouncedCalc', this.toastInWindow, 25);
- }
-
- conditionalClass() {
- return this.isFixed ? 'fixed' : '';
- }
-
- toastInWindow() {
- if (!this._headerNode) {
- return true
- }
- var headerHeight = this._headerNode.offsetHeight;
- var scrollPosition = window.scrollY;
-
- if (this.isFixed) {
- this.isFixed = 1 <= scrollPosition;
- }
- else {
- this.isFixed = headerHeight <= scrollPosition;
- }
- }
-
- connectedCallback() {
- super.connectedCallback();
- this._headerNode = document.querySelector('.header', document);
- this.listen(window, 'scroll', '_debouncedCalc');
- this.listen(window, 'resize', '_debouncedCalc');
- this._debouncedCalc();
- }
-
- _changedToasts(newValue, oldValue) {
- $.Topic('/favicon/update').publish({count: this.toasts.length});
- }
-
- dismissNotification(e) {
- $.Topic('/favicon/update').publish({count: this.toasts.length - 1});
- var idx = e.target.parentNode.indexPos
- this.splice('toasts', idx, 1);
-
- }
-
- dismissNotifications() {
- $.Topic('/favicon/update').publish({count: 0});
- this.splice('toasts', 0);
- }
-
- handleNotification(data) {
- if (!templateContext.rhodecode_user.notification_status && !data.message.force) {
- // do not act if notifications are disabled
- return
- }
- this.push('toasts', {
- level: data.message.level,
- message: data.message.message
- });
- }
-
- _gettext(x){
- return _gettext(x)
+ dismissNotification(index) {
+ $.Topic('/favicon/update').publish({count: this.toasts.length - 1});
+ this.toasts = [
+ ...this.toasts.slice(0, index),
+ ...this.toasts.slice(index + 1)
+ ];
+ }
+
+ dismissNotifications() {
+ $.Topic('/favicon/update').publish({count: 0});
+ this.toasts = [];
+ }
+
+ handleNotification(data) {
+ if (!templateContext.rhodecode_user.notification_status && !data.message.force) {
+ return;
}
+ this.toasts = [...this.toasts, {
+ level: data.message.level,
+ message: data.message.message
+ }];
+ }
+ _gettext(x) {
+ return _gettext(x);
+ }
}
-customElements.define(RhodecodeToast.is, RhodecodeToast);
+customElements.define('rhodecode-toast', RhodecodeToast);
diff --git a/rhodecode/public/js/src/components/rhodecode-unsafe-html/rhodecode-unsafe-html.js b/rhodecode/public/js/src/components/rhodecode-unsafe-html/rhodecode-unsafe-html.js
index 7290a207..72223043 100644
--- a/rhodecode/public/js/src/components/rhodecode-unsafe-html/rhodecode-unsafe-html.js
+++ b/rhodecode/public/js/src/components/rhodecode-unsafe-html/rhodecode-unsafe-html.js
@@ -1,30 +1,24 @@
-import {PolymerElement, html} from '@polymer/polymer/polymer-element.js';
+import {LitElement, html} from 'lit';
-export class RhodecodeUnsafeHtml extends PolymerElement {
+export class RhodecodeUnsafeHtml extends LitElement {
+ static properties = {
+ text: {type: String}
+ };
- static get is() {
- return 'rhodecode-unsafe-html';
- }
-
- static get template() {
- return html`
-
-
- `;
- }
-
- static get properties() {
- return {
- text: {
- type: String,
- observer: '_handleText'
- }
- }
- }
-
- _handleText(newVal, oldVal) {
- this.innerHTML = this.text;
+ constructor() {
+ super();
+ this.text = '';
+ }
+
+ render() {
+ return html`
`;
+ }
+
+ updated(changedProperties) {
+ if (changedProperties.has('text')) {
+ this.innerHTML = this.text;
}
+ }
}
-customElements.define(RhodecodeUnsafeHtml.is, RhodecodeUnsafeHtml);
+customElements.define('rhodecode-unsafe-html', RhodecodeUnsafeHtml);
diff --git a/rhodecode/public/js/src/plugins/jquery.auto-grow-input.js b/rhodecode/public/js/src/plugins/jquery.auto-grow-input.js
index eaf23041..1d013f90 100644
--- a/rhodecode/public/js/src/plugins/jquery.auto-grow-input.js
+++ b/rhodecode/public/js/src/plugins/jquery.auto-grow-input.js
@@ -51,7 +51,7 @@
testSubject.insertAfter(input);
- $(this).bind('keyup keydown blur update', check);
+ $(this).on('keyup keydown blur update', check);
});
diff --git a/rhodecode/public/js/src/plugins/jquery.autocomplete.js b/rhodecode/public/js/src/plugins/jquery.autocomplete.js
index 82d11bdd..ec150ce0 100644
--- a/rhodecode/public/js/src/plugins/jquery.autocomplete.js
+++ b/rhodecode/public/js/src/plugins/jquery.autocomplete.js
@@ -215,7 +215,7 @@
$.extend(options, suppliedOptions);
- that.isLocal = $.isArray(options.lookup);
+ that.isLocal = Array.isArray(options.lookup);
if (that.isLocal) {
options.lookup = that.verifySuggestionsFormat(options.lookup);
@@ -525,14 +525,14 @@
if (that.isLocal) {
response = that.getSuggestionsLocal(query);
} else {
- if ($.isFunction(serviceUrl)) {
+ if (typeof serviceUrl === 'function') {
serviceUrl = serviceUrl.call(that.element, query);
}
var callParams = {};
//make an evaluated copy of params
$.each(params, function(index, value) {
- if($.isFunction(value)){
+ if(typeof value === 'function'){
callParams[index] = value();
}
else {
@@ -544,7 +544,7 @@
response = that.cachedResponse[cacheKey];
}
- if (response && $.isArray(response.suggestions)) {
+ if (response && Array.isArray(response.suggestions)) {
that.suggestions = response.suggestions;
that.suggest();
} else if (!that.isBadQuery(query)) {
@@ -658,7 +658,7 @@
container.children().first().addClass(classSelected);
}
- if ($.isFunction(beforeRender)) {
+ if (typeof beforeRender === 'function') {
beforeRender.call(that.element, container);
}
@@ -886,7 +886,7 @@
that.suggestions = [];
that.selection = suggestion;
- if ($.isFunction(onSelectCallback)) {
+ if (typeof onSelectCallback === 'function') {
onSelectCallback.call(this, that.element, suggestion, prevElem);
}
},
diff --git a/rhodecode/public/js/src/plugins/jquery.dataTables.js b/rhodecode/public/js/src/plugins/jquery.dataTables.js
index 0184b877..4b8d4e4a 100644
--- a/rhodecode/public/js/src/plugins/jquery.dataTables.js
+++ b/rhodecode/public/js/src/plugins/jquery.dataTables.js
@@ -251,7 +251,7 @@
var api = this.api( true );
/* Check if we want to add multiple rows or not */
- var rows = $.isArray(data) && ( $.isArray(data[0]) || $.isPlainObject(data[0]) ) ?
+ var rows = Array.isArray(data) && ( Array.isArray(data[0]) || $.isPlainObject(data[0]) ) ?
api.rows.add( data ) :
api.row.add( data );
@@ -337,7 +337,7 @@
* var oTable;
*
* // 'open' an information row when a row is clicked on
- * $('#example tbody tr').click( function () {
+ * $('#example tbody tr').on('click', function () {
* if ( oTable.fnIsOpen(this) ) {
* oTable.fnClose( this );
* } else {
@@ -489,7 +489,7 @@
* $(document).ready(function() {
* oTable = $('#example').dataTable();
*
- * oTable.$('tr').click( function () {
+ * oTable.$('tr').on('click', function () {
* var data = oTable.fnGetData( this );
* // ... do something with the array / object of data for the row
* } );
@@ -500,7 +500,7 @@
* $(document).ready(function() {
* oTable = $('#example').dataTable();
*
- * oTable.$('td').click( function () {
+ * oTable.$('td').on('click', function () {
* var sData = oTable.fnGetData( this );
* alert( 'The cell clicked on had the value of '+sData );
* } );
@@ -562,7 +562,7 @@
*
* @example
* $(document).ready(function() {
- * $('#example tbody td').click( function () {
+ * $('#example tbody td').on('click', function () {
* // Get the position of the current data from the node
* var aPos = oTable.fnGetPosition( this );
*
@@ -611,7 +611,7 @@
* var oTable;
*
* // 'open' an information row when a row is clicked on
- * $('#example tbody tr').click( function () {
+ * $('#example tbody tr').on('click', function () {
* if ( oTable.fnIsOpen(this) ) {
* oTable.fnClose( this );
* } else {
@@ -647,7 +647,7 @@
* var oTable;
*
* // 'open' an information row when a row is clicked on
- * $('#example tbody tr').click( function () {
+ * $('#example tbody tr').on('click', function () {
* if ( oTable.fnIsOpen(this) ) {
* oTable.fnClose( this );
* } else {
@@ -976,7 +976,7 @@
// If the length menu is given, but the init display length is not, use the length menu
if ( oInit.aLengthMenu && ! oInit.iDisplayLength )
{
- oInit.iDisplayLength = $.isArray( oInit.aLengthMenu[0] ) ?
+ oInit.iDisplayLength = Array.isArray( oInit.aLengthMenu[0] ) ?
oInit.aLengthMenu[0][0] : oInit.aLengthMenu[0];
}
@@ -1092,7 +1092,7 @@
if ( oInit.iDeferLoading !== null )
{
oSettings.bDeferLoading = true;
- var tmp = $.isArray( oInit.iDeferLoading );
+ var tmp = Array.isArray( oInit.iDeferLoading );
oSettings._iRecordsDisplay = tmp ? oInit.iDeferLoading[0] : oInit.iDeferLoading;
oSettings._iRecordsTotal = tmp ? oInit.iDeferLoading[1] : oInit.iDeferLoading;
}
@@ -1822,7 +1822,7 @@
// orderData can be given as an integer
var dataSort = init.aDataSort;
- if ( dataSort && ! $.isArray( dataSort ) ) {
+ if ( dataSort && ! Array.isArray( dataSort ) ) {
init.aDataSort = [ dataSort ];
}
}
@@ -2303,7 +2303,7 @@
def.targets :
def.aTargets;
- if ( ! $.isArray( aTargets ) )
+ if ( ! Array.isArray( aTargets ) )
{
aTargets = [ aTargets ];
}
@@ -2622,7 +2622,7 @@
innerSrc = a.join('.');
// Traverse each entry in the array getting the properties requested
- if ( $.isArray( data ) ) {
+ if ( Array.isArray( data ) ) {
for ( var j=0, jLen=data.length ; j
' )
.appendTo( container );
attach( inner, button );
diff --git a/rhodecode/public/js/src/plugins/jquery.debounce.js b/rhodecode/public/js/src/plugins/jquery.debounce.js
index b48dd39a..f428336d 100644
--- a/rhodecode/public/js/src/plugins/jquery.debounce.js
+++ b/rhodecode/public/js/src/plugins/jquery.debounce.js
@@ -93,13 +93,12 @@
//
// > var throttled = jQuery.throttle( delay, [ no_trailing, ] callback );
// >
- // > jQuery('selector').bind( 'someevent', throttled );
- // > jQuery('selector').unbind( 'someevent', throttled );
+ // > jQuery('selector').on( 'someevent', throttled );
+ // > jQuery('selector').off( 'someevent', throttled );
//
- // This also works in jQuery 1.4+:
//
- // > jQuery('selector').bind( 'someevent', jQuery.throttle( delay, [ no_trailing, ] callback ) );
- // > jQuery('selector').unbind( 'someevent', callback );
+ // > jQuery('selector').on( 'someevent', jQuery.throttle( delay, [ no_trailing, ] callback ) );
+ // > jQuery('selector').off( 'someevent', callback );
//
// Arguments:
//
@@ -217,13 +216,12 @@
//
// > var debounced = jQuery.debounce( delay, [ at_begin, ] callback );
// >
- // > jQuery('selector').bind( 'someevent', debounced );
- // > jQuery('selector').unbind( 'someevent', debounced );
+ // > jQuery('selector').on( 'someevent', debounced );
+ // > jQuery('selector').off( 'someevent', debounced );
//
- // This also works in jQuery 1.4+:
//
- // > jQuery('selector').bind( 'someevent', jQuery.debounce( delay, [ at_begin, ] callback ) );
- // > jQuery('selector').unbind( 'someevent', callback );
+ // > jQuery('selector').on( 'someevent', jQuery.debounce( delay, [ at_begin, ] callback ) );
+ // > jQuery('selector').off( 'someevent', callback );
//
// Arguments:
//
diff --git a/rhodecode/public/js/src/plugins/jquery.pjax.js b/rhodecode/public/js/src/plugins/jquery.pjax.js
index 8f9d2d53..f07aba1b 100644
--- a/rhodecode/public/js/src/plugins/jquery.pjax.js
+++ b/rhodecode/public/js/src/plugins/jquery.pjax.js
@@ -172,7 +172,7 @@ function handleSubmit(event, container, options) {
function pjax(options) {
options = $.extend(true, {}, $.ajaxSettings, pjax.defaults, options)
- if ($.isFunction(options.url)) {
+ if (typeof options.url === 'function') {
options.url = options.url()
}
@@ -187,7 +187,7 @@ function pjax(options) {
// Without adding this secret parameter, some browsers will often
// confuse the two.
if (!options.data) options.data = {}
- if ($.isArray(options.data)) {
+ if (Array.isArray(options.data)) {
options.data.push({name: '_pjax', value: context.selector})
} else {
options.data._pjax = context.selector
@@ -505,7 +505,7 @@ function onPjaxPopstate(event) {
//
// Returns nothing since it retriggers a hard form submission.
function fallbackPjax(options) {
- var url = $.isFunction(options.url) ? options.url() : options.url,
+ var url = typeof options.url === 'function' ? options.url() : options.url,
method = options.type ? options.type.toUpperCase() : 'GET'
var form = $('