tonyair/silverstripe-cms
1
0
Fork 0
mirror of https://github.com/silverstripe/silverstripe-cms synced 2024-10-22 06:05:56 +00:00
Code Issues Projects Releases Wiki Activity

API CHANGE Changed <p id=statusMessage> to <div class=notice-wrap> in LeftAndMain_right.ss and subclasses

Browse Source 
ENHANCEMENT Using external jquery.notice library to handle status message updates in the CMS

git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@92696 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Ingo Schommer 2009-11-21 03:14:36 +00:00
parent 42a5de8536
commit 8b8867ba76
10 changed files with 162 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
code/LeftAndMain.php
View File

@ -213,6 +213,7 @@ class LeftAndMain extends Controller {
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/behaviour/behaviour.js'); Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/behaviour/behaviour.js');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-livequery/jquery.livequery.js'); Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-livequery/jquery.livequery.js');
Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-cookie/jquery.cookie.js'); Requirements::javascript(SAPPHIRE_DIR . '/thirdparty/jquery-cookie/jquery.cookie.js');
Requirements::javascript(CMS_DIR . '/thirdparty/jquery-notice/jquery.notice.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/jquery-ondemand/jquery.ondemand.js'); Requirements::javascript(SAPPHIRE_DIR . '/javascript/jquery-ondemand/jquery.ondemand.js');
Requirements::javascript(CMS_DIR . '/javascript/jquery-changetracker/lib/jquery.changetracker.js'); Requirements::javascript(CMS_DIR . '/javascript/jquery-changetracker/lib/jquery.changetracker.js');
Requirements::javascript(SAPPHIRE_DIR . '/javascript/prototype_improvements.js'); Requirements::javascript(SAPPHIRE_DIR . '/javascript/prototype_improvements.js');

46
css/cms_right.css
View File

@ -333,37 +333,57 @@
font-style: italic; font-style: italic;
} }
/** /**
* Status Messages * Status Messages
*/ */
#statusMessage { .notice-wrap {
position: absolute; position: absolute;
z-index: 500; z-index: 500;
bottom: 4px; bottom: 4px;
left: 10px; left: 10px;
text-align: left; z-index: 9999;
width: auto;
}
* html .notice-wrap {
position: absolute;
}
.notice-item {
display: block;
position: relative;
width: auto;
background: #f4f3eb;
border: 1px solid #a9a67d;
margin-top: 6px;
padding: 2px 20px 2px 20px; padding: 2px 20px 2px 20px;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
color: #660;
background: #f4f3eb;
border: 1px solid #a9a67d;
margin: 0 !important;
line-height: 1.5; line-height: 1.5;
} }
#statusMessage.good {
padding: 2px 20px 2px 40px; .notice-item-close {
position: absolute;
font-family: Arial;
font-size: 12px;
font-weight: bold;
right: 6px;
top: 6px;
cursor: pointer;
}
.notice-wrap .good {
padding-left: 40px;
color: #060; color: #060;
background: #E2F9E3 url(../images/alert-good.gif) 7px 50% no-repeat; background: #E2F9E3 url(../images/alert-good.gif) 7px 50% no-repeat;
border: 1px solid #8dd38d; border: 1px solid #8dd38d;
} }
#statusMessage.bad { .notice-wrap .bad {
padding: 2px 20px 2px 40px; padding-left: 40px;
border-color: #ff8e8e;
color: #c80700; color: #c80700;
background: #ffe9e9 url(../images/alert-bad.gif) 7px 50% no-repeat; background: #ffe9e9 url(../images/alert-bad.gif) 7px 50% no-repeat;
max-height: 300px; border: 1px solid #ff8e8e;
overflow: auto;
} }
/** /**

133
javascript/LeftAndMain.js
View File

@ -278,135 +278,12 @@
})(jQuery); })(jQuery);
// Backwards compatibility
var statusMessage = function(text, type) {
jQuery.noticeAdd({text: text, type: type});
// Event.observe(window, 'beforeunload', LeftAndMain_window_unload);
/**
* Unlock the locked status message.
* Show a queued message, if one exists
*/
function unlockStatusMessage() {
statusMessage.locked = false;
if(statusMessage.queued) {
statusMessage(
statusMessage.queued.msg,
statusMessage.queued.type,
statusMessage.queued.showNetworkActivity);
statusMessage.queued = null;
}
} }
var errorMessage = function(text) {
/** jQuery.noticeAdd({text: text, type: 'error'});
* Behaviour of the statuts message.
*/
Behaviour.register({
'#statusMessage' : {
showMessage : function(message, type, waitTime, clearManually) {
if(this.fadeTimer) {
clearTimeout(this.fadeTimer);
this.fadeTimer = null;
}
if(this.currentEffect) {
this.currentEffect.cancel();
this.currentEffect = null;
}
this.innerHTML = message;
this.className = type;
Element.setOpacity(this, 1);
//this.style.position = 'absolute';
this.style.display = '';
this.style.visibility = '';
if(!clearManually) {
this.fade(0.5,waitTime ? waitTime : 5);
}
},
clearMessage : function(waitTime) {
this.fade(0.5, waitTime);
},
fade: function(fadeTime, waitTime) {
if(!fadeTime) fadeTime = 0.5;
// Wait a bit before fading
if(waitTime) {
this.fadeTimer = setTimeout((function() {
this.fade(fadeTime);
}).bind(this), waitTime * 1000);
// Fade straight away
} else {
this.currentEffect = new Effect.Opacity(this,
{ duration: 0.5,
transition: Effect.Transitions.linear,
from: 1.0, to: 0.0,
afterFinish : this.afterFade.bind(this) });
}
},
afterFade : function() {
this.style.visibility = 'hidden';
this.style.display = 'none';
this.innerHTML = '';
}
}
});
/**
* Show a status message.
*
* @param msg String
* @param type String (optional) can be 'good' or 'bad'
* @param clearManually boolean Don't automatically fade message.
* @param container custom #statusMessage element to show message.
*/
function statusMessage(msg, type, clearManually, container) {
var statusMessageEl = $('statusMessage');
if(container != null) statusMessageEl = container;
if(statusMessageEl) {
if(msg) {
statusMessageEl.showMessage(msg, type, msg.length / 10, clearManually);
} else {
statusMessageEl.clearMessage();
}
}
}
function clearStatusMessage() {
$('statusMessage').clearMessage();
}
/**
* Called when something goes wrong
*/
function errorMessage(msg, fullMessage) {
// Show complex error for developers in the console
if(fullMessage) {
// Get the message from an Ajax response object
try {
if(typeof fullMessage == 'object') fullMessage = fullMessage.status + '//' + fullMessage.responseText;
} catch(er) {
fullMessage = "";
}
console.error(fullMessage);
}
msg = msg.replace(/\n/g,'<br>');
$('statusMessage').showMessage(msg,'bad');
} }
function ajaxErrorHandler(response) { function ajaxErrorHandler(response) {

2
templates/Includes/CommentAdmin_right.ss
View File

@ -9,4 +9,4 @@
</form> </form>
<% end_if %> <% end_if %>
<p id="statusMessage" style="visibility:hidden"></p> <div class="notice-wrap"></div>

2
templates/Includes/LeftAndMain_right.ss
View File

@ -12,4 +12,4 @@
</form> </form>
<% end_if %> <% end_if %>
<div id="statusMessage"></div> <div class="notice-wrap"></div>

2
templates/Includes/ReportAdmin_right.ss
View File

@ -6,4 +6,4 @@
</form> </form>
<% end_if %> <% end_if %>
<p id="statusMessage" style="visibility:hidden"></p> <div class="notice-wrap"></div>

2
templates/Includes/SecurityAdmin_right.ss
View File

@ -9,4 +9,4 @@
</form> </form>
<% end_if %> <% end_if %>
<p id="statusMessage" style="visibility:hidden"></p> <div class="notice-wrap"></div>

8
thirdparty/jquery-notice/.piston.yml vendored Normal file
View File

@ -0,0 +1,8 @@
---
format: 1
handler:
piston:remote-revision: 14
piston:uuid: c0f28f7c-efbc-11dd-aa46-671127399dce
lock: false
repository_url: http://jquery-notice.googlecode.com/svn/trunk/
repository_class: Piston::Svn::Repository

36
thirdparty/jquery-notice/jquery.notice.css vendored Normal file
View File

@ -0,0 +1,36 @@
.notice-wrap {
position: fixed;
top: 20px;
right: 20px;
width: 250px;
z-index: 9999;
}
* html .notice-wrap {
position: absolute;
}
.notice-item {
height: 60px;
background: #333;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
color: #eee;
padding: 6px 6px 0 6px;
font-family: lucida Grande;
font-size: 11px;
border: 2px solid #999;
display: block;
position: relative;
margin: 0 0 12px 0;
}
.notice-item-close {
position: absolute;
font-family: Arial;
font-size: 12px;
font-weight: bold;
right: 6px;
top: 6px;
cursor: pointer;
}

73
thirdparty/jquery-notice/jquery.notice.js vendored Normal file
View File

@ -0,0 +1,73 @@
/**
* jQuery.noticeAdd() and jQuery.noticeRemove()
* These functions create and remove growl-like notices
*
* Copyright (c) 2009 Tim Benniks
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*
* @author Tim Benniks <tim@timbenniks.com>
* @copyright 2009 timbenniks.com
* @version $Id: jquery.notice.js 1 2009-01-24 12:24:18Z timbenniks $
**/
(function(jQuery)
{
jQuery.extend({
noticeAdd: function(options)
{
var defaults = {
inEffect: {opacity: 'show'}, // in effect
inEffectDuration: 600, // in effect duration in miliseconds
stayTime: 3000, // time in miliseconds before the item has to disappear
text: '', // content of the item
stay: false, // should the notice item stay or not?
type: 'notice' // could also be error, succes
}
// declare varaibles
var options, noticeWrapAll, noticeItemOuter, noticeItemInner, noticeItemClose;
options = jQuery.extend({}, defaults, options);
noticeWrapAll = (!jQuery('.notice-wrap').length) ? jQuery('<div></div>').addClass('notice-wrap').appendTo('body') : jQuery('.notice-wrap');
noticeItemOuter = jQuery('<div></div>').addClass('notice-item-wrapper');
noticeItemInner = jQuery('<div></div>').hide().addClass('notice-item ' + options.type).appendTo(noticeWrapAll).html('<p>'+options.text+'</p>').animate(options.inEffect, options.inEffectDuration).wrap(noticeItemOuter);
noticeItemClose = jQuery('<div></div>').addClass('notice-item-close').prependTo(noticeItemInner).html('x').click(function() { jQuery.noticeRemove(noticeItemInner) });
if(!options.stay)
{
setTimeout(function()
{
jQuery.noticeRemove(noticeItemInner);
},
options.stayTime);
}
},
noticeRemove: function(obj)
{
obj.animate({opacity: '0'}, 600, function()
{
obj.parent().animate({height: '0px'}, 300, function()
{
obj.parent().remove();
});
});
}
});
})(jQuery);