The toastr's discuss from codeseven

Combine the 2 css files into 1 file

Add position class: toast-center

👍

Full Bar Notification

We recently have started using toastr due to the simple nature of calling it versus other javascript notifications. One fallback that was causing me to look at other options was the ability to display messages across the top or bottom of the screen as a full bar. I think toastr is very user friendly as a simple corner notification, but for some apps my users will want a notification that says "Stop!" and not a simple corner notification.

A component.json for Bower would be great

It would be wonderful to have toastr in the Bower database.

Text extends past screen when using full width

Wrapping text extends off the right when using full width (top or bottom). Tested in Chrome and IE10.

Trying to use toastr

Sorry for simple question.

I included toastr.js, toastr.cs and toastr.-responsive.css
This works:
toastr.info("Hello world");

But this doesn't work. And I don't get any error in browser console.
toastr.options.positionClass = "toast-top-full-width"; toastr.info("Hello world");

What would be the cause ?

Associate toast with a dom Node

It would be great if I could have a toast appear on any container that I would set rather than just the body tag at large

URL on click

Can we have an option to set the url when a notification is clicked? Instead of just closing it.

Responsive sizes

Bootstrap currently uses other ranges for responsiveness.
I think the following sizes should be used to get messages resized at the same time with the rest of the layout:
@media all and (min-width: 241px) and (max-width: 319px) ...
@media all and (min-width: 320px) and (max-width: 479px) ...
@media all and (min-width: 480px) and (max-width: 767px) ...
@media all and (min-width: 768px) ...

Update docs/demo site

Update docs/demo site with new features introduced in 1.0.3.

onclick handler for custom logic on toast click
more..?

Can you please share sample code ?

Can you please share sample code ? for the different types of notification shown in the demo page ?

Responsive css references should be removed

In the readme file, there still has a reference to the responsive stylesheets, althought they are now included in the main CSS file.

default close button option

hi,
great library, but can we have a default close button in the corner of a toaster so when user click it closes the toaster instance ?

thanks in advanced

Retain semver, but not in file name

bad experiment

Submit to cdnjs

http://cdnjs.com/
https://github.com/cdnjs/cdnjs

Easier way to use ToastR options

Per my conversation with John, it would be nice if you can set up the object that contains the various options and have that be received as an argument in the Toastr call so a) it can apply to only one toast, and b) you can do it inline with the call and have less code. It's still handy to have it apply to all toasts if you leave it out as an argument.

Prevent infinite mouseenter mouseleave

add this function on click event to prevent infinite "mouseenter mouseleave" loop.
(after hover at line 123)

            $toastElement.hover(stickAround, fadeAway)

            $toastElement.click(function() {
                $(this).off('mouseenter mouseleave');
                fadeAway();
            })

Please use Git tags in repo for versions

We're using Bower to pull down the source.

If you could use tags in your repo, this would help us out a lot to control versioning.

You can go back and retroactively tag SHAs... for instance 51855e9 should be 1.1.1, etc.

Thanks!

Not working.

From nuget, I install into a fresh MVC 3 project jQuery 1.9.1, then toastr 1.2.1 using the nuget package manager.

The following html file:

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <meta charset="utf-8"/>
    <link href="Content/toastr.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="Scripts/toastr.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            toastr.options = { debug: true };
            toastr.info("Hello? Is This thing on?");
            toastr.success("Anything");
            toastr.error("Nada.");
        });
    </script>
</head>
<body>

</body>
</html>

shows nothing in Google Chrome v 25.0.1364.97 m nor IE 9 on Windows 7.

If I uninstall toastr 1.2.1 and Install-Package toastr -Version 1.1.4.2 it works just dandy.

With 1.2.1 I get nothing - the debug messages print, but don't seem to contain anything useful.

Thanks!

All Sticky Option

Currently, hovering over a node only makes the notification that you are hovering over sticky. I spent a couple of hours trying to write an option that would cause hovering over a notification to keep all displayed notifications sticky but I don't have a real good feel for how to do this.

I not exactly comfortable in JavaScript, and my attempts failed. I made a little bit of progress. I was able to make all the notifications not fade out when hovering one, all notifications fade out when hovering stops, but there were a lot of bugs that I couldn't work out after a while.

So, I figured I would throw it up here in case someone else wants to take a crack at the idea.

Some of the systems I use may have multiple notifications pop-up at once and the user doesn't have time to read them all before they start disappearing. I could set them to click to remove, but they don't want the extra clicks. Neither do they want longer timeouts for messages that they aren't interested in. So, hover over one to keep all on the screen seems an appropriate feature (and has been used by the system in the past).

If someone wants to give me tips on how to go about it, I would be more than happy to take another crack at it.

Option to use Font Awesome icons

It would be nice if there was a way to optionally pass in your own icon, or better yet, pass in a Font Awesome icon.

Great library though, thanks!

Middle Position

You can position it on the left or the right, but I don't see any way to position the message in the centre of the page. Would it be possible to add this?

toast fades away immediately after a hover-off

I added a new feature to keep the toast around after hover-off for an extended 1 second (customizable). The option is called extendedTimeOut

Checkboxes in form could be nice?

I really like the form it allows to have in a toast and I was wondering if it would be hard to allow checkboxes and radio buttons since right now a simple click on a checkbox would dismiss the toast.

Limit the number of displayed toasts

and when you reach this limit, you may add the the subsequent toasts to a "queue"?

👍

Unable to show toast in a new position until all previous toasts disappear

toastr.info('a', null, {
  positionClass: 'toast-top-right'
});
toastr.info('a', null, {
  positionClass: 'toast-bottom-left'
})

Second toast is shown in top right position

Refactor functions to remove duplicate code.

Support for jQuery 1.4.4

This is a great plugin! Would it be possible to have toastr work with jQuery 1.4.4?
The reason being is I am using the Drupal 7 framework which forces developers to use 1.4.4.

After toasts clear no new toasts will be displayed

Can be seen on the demo page, if you display a toast and then either clear it or let it time out clicking on show toast will not display any new toasts.

Is it possible to have toast appear outside the browser window (near system tray on windows/notification area on Mac, etc)

Add option: Block user interface

👍

Group toasts by type

I noticed that at certain times the user finds it difficult to read a sequence of notifications, because they disappear quickly.

I suggest an option to group the toast by type (success, info, warning, error) showing the number of notifications that have the same type.

and then, when you dismiss a toast, the toast that is "behind" is displayed and the number of notifications decreased.

add close button

hi,
beautiful library,
but could we add a small close button on any corner so user can know that the notification can be closed ?

thanks in advanced.

Create toastr.getContainer function to provide access to the container

Helps for custom clear, empty, remove, position, etc.

How to make it show in the center position except "top, bottom, left, right"?

Maybe I missed something but anyone how to make the notification show in the center position except that "top, bottom, left, right"? Thanks a lot.

Update unit tests for clear function

remove comment from min file

"Tap to dismiss toast" closes toast when clicking in textbox

As seen in the demo at http://codeseven.github.com/toastr/, the "Tap to dismiss toast" option causes the toast to close when clicking in the textbox.

Reset fadeout on mouse over

It would be nice to emulate what Outlook popups do when the user hovers the mouse over it.

So you'd need to reset the timer, but if the fadeout has already begun, you'd need to fade back in, and reset the timer.

BTW, nice work guys.

Luc

New toastr follows right after clear() fades out together wish previews toastrs

Any way to clear() the existing toastr and not to let the new toastr disappear with existing ones?

e.g.

toastr.info('msg 1');
toastr.info('msg 2');
toastr.info('msg 3');
toastr.clear();
toastr.info('msg 4');

In this sequence, msg 4 fades out with preview 3 popups.

Close button for sticky toasts?

I've implemented toastr on a website but I'm finding that more than a few users are confused about how to close the toasts that do not disappear on their own.

I initialize them as such: {timeOut: 0, extendedTimeOut: 0} and while it works fine functionally, it doesn't convey to the user how to dismiss the toast.

So I was wondering if there could also be an option to show a small 'X' close button/text in the top right corner of the toast to help make it obvious that they have to click to close it?

toastr does not work in PhoneGap

Hey guys,

did you ever try to use toastr in PhoneGap...? It does not work (for me).
Any ideas?

Thanks.

BOM in files

Hi, is it necessary to save all files with BOM ? I notice problem in some automatic assets management libraries. I think you can safely remove it without any problem. Thanks

The optionsOveride paramater does not override options

Toasts are displayed with the values from the defaults object regardless of supplying an options object in the function calls.

Callback function on click of sticky notification.

I am using toastr to show notification...I want to call a function to update some details when the notification is closed(i.e clicked on the notification)..Is there any way to do it with toastr.

NuGet Package includes wrong version.

I setup toastr using the NuGet package and even though the package says 1.1.1, 1.0.3 is actually installed:

Use SemVer for next version

Communicating with ASP.Net back end

I read about this plug in in Visual Studio magazine and it looks awesome. I am pretty new to jQuery and am trying to fibure out how to communicate with my ASP.Net backend. Say, I have an update occuring on a page, how do I get the message (error or otherwise) from the c# code to the plug in and then trigger the display.

Sorry for the newbie question.

Long strings can go outside the toast

Potential fix:

.toast-message {
    word-wrap: break-word;
}

More Visual Options

I like the enhanced functionality of toastr (like .warning, etc) and if it could be more condensed like sticky js (http://thrivingkings.com/sticky/) I would be more likely to consider it.

codeseven / toastr Goto Github PK

toastr's Issues

Recommend Projects

Recommend Topics

Recommend Org