User:Kaldari/nerdalert.js

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

( function( $, mw ) {
$alert = '<div id="mw-echo-sliding-alert">';
$alert += '<div id="mw-echo-floating-head" style="position: absolute; bottom: 0; left: 18px;"><img src="//upload.wikimedia.org/wikipedia/meta/f/ff/Brandon-pop-up-small.png"/></div>';
$alert += '<div id="mw-echo-close-box" style="float: right; margin: 13px 13px 0 2px; cursor: pointer;"><img src="//upload.wikimedia.org/wikipedia/meta/0/0f/Large_close_button_2.png"/></div>';
$alert += '<div id="mw-echo-alert-text">Hey nerd! Read your <a href="#" id="mw-echo-talk-link">messages</a>! (<a href="#" id="mw-echo-talk-diff-link">view changes</a>)</div>';
$alert += '</div>';
$(document).ready(function() {
	$( '.usermessage' ).hide(); // just in case
	var newMsgRevisionId = mw.config.get( 'wgUserNewMsgRevisionId' );
	if ( newMsgRevisionId ) {
		var userName = mw.config.get( 'wgUserName' );
		var talkLink = '/wiki/User_talk:' + userName + '?redirect=no';
		var diffLink = '/w/index.php?title=User_talk:' + userName + '&oldid=' + newMsgRevisionId + '&diff=cur';
		$( 'body' ).append( $alert );
		$( '#mw-echo-close-box' ).click( function( e ) {
			$( '#mw-echo-sliding-alert' ).hide();
			e.preventDefault();
		} );
		$( 'a#mw-echo-talk-link' ).attr( 'href', talkLink );
		$( 'a#mw-echo-talk-diff-link' ).attr( 'href', diffLink );
		$( '#mw-echo-sliding-alert' ).css( {
			'position': 'fixed',
			'bottom': '-183px', 
			'left': 0,
			'z-index': 99,
			'height': '48px',
			'width': '100%',
			'padding': 0,
			'background-image': 'url("//upload.wikimedia.org/wikipedia/meta/5/5e/Orange-background.png")',
			'background-repeat': 'no-repeat',
			'background-color': '#FFCE7B',
			'border': '1px solid #FFA500',
			'border-bottom': 'none'
		} );
		$( '#mw-echo-alert-text' ).css( {
			'margin-left': '140px',
			'font-size': '16px',
			'font-weight': 'bold',
			'font-family': 'sans-serif',
			'line-height': '48px'
		} );
		// Add more padding at the bottom of the page
		$( 'div#footer' ).css( 'padding-bottom', '134px' );
		$( '#mw-panel' ).css( 'padding-bottom', '134px' );
		// Show the alert
		$( '#mw-echo-sliding-alert' ).delay( 1000 ).animate( {'bottom': '+=183px' }, 'slow' );
	}
} );
} )( jQuery, mediaWiki );