From d55fcce6a03471938d66fedf035464b38d5f42c0 Mon Sep 17 00:00:00 2001 From: ozhozh Date: Tue, 15 Jun 2010 16:09:25 +0000 Subject: [PATCH] - Move common js utils in common.js - Add notify bar jquery plugin for prettier feedback git-svn-id: http://yourls.googlecode.com/svn/trunk@407 12232710-3e20-11de-b438-597f59cd7555 --- css/style.css | 36 ++++++++++++++ includes/functions-html.php | 2 + js/common.js | 60 +++++++++++++++++++++++ js/insert.js | 67 ++----------------------- js/jquery.notifybar.js | 97 +++++++++++++++++++++++++++++++++++++ 5 files changed, 198 insertions(+), 64 deletions(-) create mode 100644 js/common.js create mode 100644 js/jquery.notifybar.js diff --git a/css/style.css b/css/style.css index 9e5a733..e383537 100644 --- a/css/style.css +++ b/css/style.css @@ -260,4 +260,40 @@ a.bookmarklet:hover { width:70%; margin-left:15%; padding-left:10px; +} + + +.jquery-notify-bar { + width:100%; + position:fixed; + top:0; + left:0; + z-index:32768; + background-color:#efefef; + font-size:18px; + color:#000; + text-align:center; + font-family: Arial, Verdana, sans-serif; + padding:20px 0px; + border-bottom:1px solid #bbb; + filter:alpha(opacity=92); + -moz-opacity:0.92; + -khtml-opacity:0.92; + opacity:0.92; + -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.5); + -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); + text-shadow: 0 1px 1px rgba(0,0,0,0.1); +} +.jquery-notify-bar.error ,.jquery-notify-bar.fail { + color:#f00; + background-color:#fdd; +} +.jquery-notify-bar.success { + color:#060; + background-color:#99FF55; +} +.notify-bar-close { + position:absolute; + left:95%; + font-size:11px; } \ No newline at end of file diff --git a/includes/functions-html.php b/includes/functions-html.php index 03b5e40..566fa28 100644 --- a/includes/functions-html.php +++ b/includes/functions-html.php @@ -67,6 +67,8 @@ function yourls_html_head( $context = 'index' ) { + + diff --git a/js/common.js b/js/common.js new file mode 100644 index 0000000..9e094ad --- /dev/null +++ b/js/common.js @@ -0,0 +1,60 @@ +// Change an element text an revert in a smooth pulse. el is an element id like '#copybox h2' +function html_pulse( el, newtext ){ + var oldtext = $(el).html(); + // Fast pulse to "Copied" and revert + $(el).fadeTo( + "normal", + 0.01, + function(){ + $(el) + .html( newtext ) + .css('opacity', 1) + .fadeTo( + "slow", 1, // this fades from 1 to 1: just a 'sleep(1)' actually + function(){ + $(el).fadeTo("normal", 0.01, function(){$(el).html( oldtext ).css('opacity', 1)}); + } + ); + } + ); + + +} + +// Update feedback message +function feedback(msg, type) { + $.notifyBar({ + html: ''+msg+'', + delay: 2000, + animationSpeed: "normal", + cls: type + }); + return true; +} + +// Unused for now +function logout() { + $.ajax({ + type: "POST", + url: "index_ajax.php", + data: {mode:'logout'}, + success: function() { + window.parent.location.href = window.parent.location.href; + } + }); +} + +// Begin the spinning animation & disable a button +function add_loading(el) { + $(el).attr("disabled", "disabled").addClass('disabled').addClass('loading'); +} + +// End spinning animation +function end_loading(el) { + $(el).removeClass('loading'); +} + +// Un-disable an element +function end_disable(el) { + $(el).removeAttr("disabled").removeClass('disabled'); +} diff --git a/js/insert.js b/js/insert.js index 39b7828..ce77bb6 100644 --- a/js/insert.js +++ b/js/insert.js @@ -31,16 +31,17 @@ function add() { reset_url(); increment(); } - feedback(data.message, data.status); $('#copylink').val( data.shorturl ); $('#origlink').attr( 'href', data.url.url ).html( data.url.url ); $('#statlink').attr( 'href', data.shorturl+'+' ).html( data.shorturl+'+' ); $('#tweet_body').val( data.shorturl ).keypress(); $('#shareboxes').slideDown(); - + end_loading("#add-button"); end_disable("#add-button"); + + feedback(data.message, data.status); } ); } @@ -122,33 +123,6 @@ function edit_save(id) { ); } -// Unused for now since HTTP Auth sucks donkeys. -function logout() { - $.ajax({ - type: "POST", - url: "index_ajax.php", - data: {mode:'logout'}, - success: function() { - window.parent.location.href = window.parent.location.href; - } - }); -} - -// Begin the spinning animation & disable a button -function add_loading(el) { - $(el).attr("disabled", "disabled").addClass('disabled').addClass('loading'); -} - -// End spinning animation -function end_loading(el) { - $(el).removeClass('loading'); -} - -// Un-disable an element -function end_disable(el) { - $(el).removeAttr("disabled").removeClass('disabled'); -} - // Prettify table with odd & even rows function zebra_table() { $("#tblUrl tbody tr:even").removeClass('odd').addClass('even'); @@ -156,17 +130,6 @@ function zebra_table() { $('#tblUrl tbody').trigger("update"); } -// Update feedback message -function feedback(msg, type) { - var span = (type == 'fail') ? '' : '' ; - var delay = (type == 'fail') ? 2500 : 1000 ; - $('#feedback').html(span + msg + '').fadeIn(200,function(){ - $(this).animate({'opacity':1}, delay, function() { - $(this).fadeOut(800); - }) - }); -} - // Ready to add another URL function reset_url() { $('#add-url').val('http://').focus(); @@ -187,27 +150,3 @@ function decrement() { }); } -// Change an element text an revert in a smooth pulse. el is an element id like '#copybox h2' -function html_pulse( el, newtext ){ - var oldtext = $(el).html(); - // Fast pulse to "Copied" and revert - $(el).fadeTo( - "normal", - 0.01, - function(){ - $(el) - .html( newtext ) - .css('opacity', 1) - .fadeTo( - "slow", 1, // this fades from 1 to 1: just a 'sleep(1)' actually - function(){ - $(el).fadeTo("normal", 0.01, function(){$(el).html( oldtext ).css('opacity', 1)}); - } - ); - } - ); - - -} - - diff --git a/js/jquery.notifybar.js b/js/jquery.notifybar.js new file mode 100644 index 0000000..b504407 --- /dev/null +++ b/js/jquery.notifybar.js @@ -0,0 +1,97 @@ +/* +* Notify Bar - jQuery plugin +* +* Copyright (c) 2009-2010 Dmitri Smirnov +* +* Licensed under the MIT license: +* http://www.opensource.org/licenses/mit-license.php +* +* Version: 1.2.2 +* +* Project home: +* http://www.dmitri.me/blog/notify-bar +*/ + +/** +* param Object +*/ +jQuery.notifyBar = function(settings) { + + (function($) { + + var bar = notifyBarNS = {}; + notifyBarNS.shown = false; + + if( !settings) { + settings = {}; + } + // HTML inside bar + notifyBarNS.html = settings.html || "Your message here"; + + //How long bar will be delayed, doesn't count animation time. + notifyBarNS.delay = settings.delay || 2000; + + //How long notifyBarNS bar will be slided up and down + notifyBarNS.animationSpeed = settings.animationSpeed || 200; + + //Use own jquery object usually DIV, or use default + notifyBarNS.jqObject = settings.jqObject; + + //Set up own class + notifyBarNS.cls = settings.cls || ""; + + //close button + notifyBarNS.close = settings.close || false; + + if( notifyBarNS.jqObject) { + bar = notifyBarNS.jqObject; + notifyBarNS.html = bar.html(); + } else { + bar = jQuery("
") + .addClass("jquery-notify-bar") + .addClass(notifyBarNS.cls) + .attr("id", "__notifyBar"); + } + + bar.html(notifyBarNS.html).hide(); + var id = bar.attr("id"); + switch (notifyBarNS.animationSpeed) { + case "slow": + asTime = 600; + break; + case "normal": + asTime = 400; + break; + case "fast": + asTime = 200; + break; + default: + asTime = notifyBarNS.animationSpeed; + } + if( bar != 'object'); { + jQuery("body").prepend(bar); + } + + // Style close button in CSS file + if( notifyBarNS.close) { + bar.append(jQuery("Close [X]")); + jQuery(".notify-bar-close").click(function() { + if( bar.attr("id") == "__notifyBar") { + jQuery("#" + id).slideUp(asTime, function() { jQuery("#" + id).remove() }); + } else { + jQuery("#" + id).slideUp(asTime); + } + return false; + }); + } + + bar.slideDown(asTime); + + // If taken from DOM dot not remove just hide + if( bar.attr("id") == "__notifyBar") { + setTimeout("jQuery('#" + id + "').slideUp(" + asTime +", function() {jQuery('#" + id + "').remove()});", notifyBarNS.delay + asTime); + } else { + setTimeout("jQuery('#" + id + "').slideUp(" + asTime +", function() {jQuery('#" + id + "')});", notifyBarNS.delay + asTime); + } + +})(jQuery) }; \ No newline at end of file -- 2.45.0