Permalink
Browse files

Improve dismissable notices

* Make 'Dismiss' translatable.
* Rename `generic_essage` to `genericMessage`.
* Add `button-link` class for buttons that look like links.
* Make 'Dismiss' a button.
* Limit dismiss action to button to be able to copy error messages.
* Code styling.
  • Loading branch information...
ocean90 committed Oct 8, 2017
1 parent e65ed7c commit 761a905f3e9de3a21e815414d5d0dfa9af1e8384
Showing with 48 additions and 27 deletions.
  1. +18 −11 assets/css/style.css
  2. +23 −16 assets/js/common.js
  3. +7 −0 gp-includes/assets-loader.php
View
@@ -202,6 +202,23 @@ textarea {
width: 40em;
}
.button-link {
font-family: "Helvetica", "Arial", sans-serif;
color: #2F34B8;
line-height: 1.5em;
font-size: 14px;
margin: 0;
padding: 0;
box-shadow: none;
border: 0;
border-radius: 0;
background: none;
outline: none;
cursor: pointer;
text-align: left;
text-decoration: underline;
}
table.translations,
table.translation-sets,
table.glossary,
@@ -460,20 +477,10 @@ span.morethan90 {
padding: 1em;
display: none;
z-index: 1001;
cursor: default;
}
.gp-js-message-content {
float: left;
cursor: default;
}
.gp-js-message-dismiss {
float: right;
padding-left: 50px;
color: #2F34B8;
text-decoration: underline;
cursor: default;
color: #fff;
}
.gp-js-error, .error {
View
@@ -3,29 +3,35 @@ var $gp = function($) { return {
element: null,
init: function() {
$gp.notices.element = $('#gp-js-message');
$gp.notices.element.on( 'click', $gp.notices.clear );
$gp.notices.element.on( 'click', '.gp-js-message-dismiss', $gp.notices.clear );
},
error: function(message) {
$gp.notices.generic_message('gp-js-error', message, true);
error: function( message ) {
$gp.notices.genericMessage( 'gp-js-error', message, true );
},
notice: function(message) {
$gp.notices.generic_message('gp-js-notice', message, true);
notice: function( message ) {
$gp.notices.genericMessage( 'gp-js-notice', message, true );
},
success: function(message) {
$gp.notices.generic_message('gp-js-success', message, false);
$gp.notices.element.fadeOut(10000);
success: function( message ) {
$gp.notices.genericMessage( 'gp-js-success', message, false );
$gp.notices.element.fadeOut( 10000 );
},
clear: function(message) {
$gp.notices.element.html('').hide();
clear: function() {
$gp.notices.element.html( '' ).hide();
},
generic_message: function(css_class, message, dismiss) {
var dismiss_message = '';
genericMessage: function( cssClass, message, dismissable ) {
var dismissButton = '';
if ( true === dismiss ) {
dismiss_message = '<div id="gp-js-message-dismiss" class="gp-js-message-dismiss">Discard</div>';
// Stop and complete any running animations.
$gp.notices.element.stop( true, true );
if ( true === dismissable ) {
dismissButton = ' <button type="button" class="button-link gp-js-message-dismiss">' + $gp.l10n.dismiss + '</button>';
}
$gp.notices.element.removeClass().addClass('gp-js-message').addClass(css_class).html( '<div id="gp-js-message-content" class="gp-js-message-content">' + message + dismiss_message + '</div>');
$gp.notices.element.removeClass()
.addClass( 'gp-js-message' )
.addClass( cssClass )
.html( '<div id="gp-js-message-content" class="gp-js-message-content">' + message + dismissButton + '</div>' );
$gp.notices.center();
$gp.notices.element.show();
},
@@ -51,8 +57,9 @@ $gp.showhide = function($) { return function(link, container, options) {
var options = $.extend({}, defaults, options);
var $link = $(link);
var $container = $(container);
var registry;
if ( !$gp.showhide.registry[options.group] ) $gp.showhide.registry[options.group] = [];
var registry = $gp.showhide.registry[options.group];
registry = $gp.showhide.registry[options.group];
var show = function() {
for(var i = 0; i < registry.length; ++i) {
registry[i].hide();
@@ -34,6 +34,13 @@ function gp_register_default_scripts() {
// Register our standard scripts.
wp_register_script( 'tablesorter', $url . '/vendor/jquery.tablesorter' . $suffix, array( 'jquery' ), '2.17.8' );
wp_register_script( 'gp-common', $url . '/common' . $suffix, array( 'jquery' ), '20150430' );
wp_add_inline_script( 'gp-common', sprintf(
'$gp.l10n = %s',
wp_json_encode( array(
'dismiss' => __( 'Dismiss', 'glotpress' ),
) )
) );
wp_register_script( 'gp-editor', $url . '/editor' . $suffix, array( 'gp-common', 'jquery-ui-tooltip' ), '20170701' );
wp_register_script( 'gp-glossary', $url . '/glossary' . $suffix, array( 'gp-editor' ), '20160329' );
wp_register_script( 'gp-translations-page', $url . '/translations-page' . $suffix, array( 'gp-editor' ), '20150430' );

0 comments on commit 761a905

Please sign in to comment.