[VIDEO] NotificationBox component

[galdaka]

VIDEO: http://www.jadacosta.es/contents/scr...icationBox.swf

LIVE: http://www.jadacosta.es/newiu/

SCREENSHOT:
NotificationBox.png

CALL CODE EXAMPLE:

Ext.app.io.NotificationBox.msg({
  title: 'Error', 
  message: 'Error al cargar el menu izquierdo', 
  closable: false,  
  icon: 'img/error.png',  
  position: 'br', //tl, tr, bl or br  
  hPad: '1%', //Horizontal padding  
  vPad: '1%', //Vertical padding  
  width: '500px'
}); 

Regards.

[Nickname]

Nice extenstion! Looks very good.

We cannot see the source, but from the example call you provided, the Image is directly configured. Would be nice, if you can configure "iconCls" and use CSS classes for the icon.

The next question is: How do you style the notification box? I'm not familiar with the new UI theming system, but I can think of creating an "error UI" or "warning UI" and style the UI with SASS/Compass. Would enhance the flexibility.

But again, looks very very good

[galdaka]

Thanks Nick.

I create the required CSS dinamically.

You can put any icon by config (Max 48px x 48px).

Regards,

[scottmartin]

Is this something you plan to release in the near future, or?

Regards,
Scott.

[torres10]

Excellent job, Are you planning to share your code?

[tayfun.ozis.erikan]

Nice extension. Congratulations.
Thanks for sharing.

We wrote a smilar extjs 3.x extension for kebab project. (www.kebab-project.com)
If you want to use, you can look this link:
https://github.com/kebab-project/kebab-project/blob/master/web/assets/kebab/system/distributions/kebab-os/kernel/Notification-debug.js

CSS classes:

.notify-info {background-color:#fff !important;}
.notify-warning, .notify-critic {background-color:#ffb941 !important;    color:#fff;}
.notify-error, .notify-alert {background-color:#880000 !important;    color:#fff;}
.notify-notice {background-color:#006400 !important;    color:#fff;} 

See the action:
http://www.vimeo.com/27572892

Regards.

[timothy]

This looks fantastic. Super smooth, really clean.

Do you have an ETA on when it will be released?

[eirik.lorentsen]

Since there has been no reply here for a while i'm taking the liberty to promote my port/rewrite of the efattal version:
http://www.sencha.com/forum/showthread.php?t=145503

It has some improvements making it similar to this one in functionality, although not so much visually. Though that could be accomplished largely by css.

New features:

• Multiple managers and notifications stacks
  The static manager object is eliminated completely, allowing notifications to attach to different components using their x and y coordinates to slide in the notifications.
• All four corners of document/manager can be used: 'br', 'bl', 'tr', 'tl'.
• Both x and y axis can be used. Notifications can slide in sideways.
• When a notification is destroyed any notifications above it slide down automatically.
• Easy customization of css, animations, delays, spacings/padding etc.

[scottmartin]

Eirik,

Thanks for the post. This will be helpful.

I am not sure why the OP would post in this forum about a plugin that can not be downloaded nor respond to anyone about it. I will leave it at that.

Regards,
Scott.

[galdaka]

Added UI live example.