marcosesperon / messi Goto Github PK
View Code? Open in Web Editor NEWA simple message plugin for jQuery
Home Page: http://marcosesperon.es/apps/messi/
A simple message plugin for jQuery
Home Page: http://marcosesperon.es/apps/messi/
Hi,
Whenever I try to assign a css class to a certain button it is not working.
buttons: [
{id: 0, label: 'Cancel', val: 'Y', btnClass: 'bs1'},
{id: 1, label: 'Confirm', val: 'N', btnClass: 'bs2'}
]
This is the code generated by messi.js
Any ideas?
checked samples on your website, no response to taps.
Hi, Great script!
Took me a while to figure out NOT to put messi.js at the bottom of html script (before ) as it says in instructions.
Problem is this, I have a message popup before the user is taken to another page, I would expect the new page to load after the "Ok" button is clicked on the messi message box, but it's not happening that way, the new page loads right after the message is displayed.
Is this a bug, or am I doing something wrong?
This my code:
Any help would be appreciated,
Thank you.
close
I have added the below 3 line in head section(also kept the files in the folder):
<script src="messi.min.js"></script> <script src="css/jquery-2.1.4.min.js"></script>But if i want your pop up with custom button with the code:
new Messi('This is a message with Messi with custom buttons.', {title: 'Buttons', buttons: [{id: 0, label: 'Close', val: 'X'}]});
where do i have to add the code: new Messi()..., if i want to do it for a html button ? and how?
Slightly more guidelines would be useful for us beginners. Thanks in advance.
I found there is little problem at line 200
jQuery(window).unbind('resize', function () { this.resize(); }());
I think it should be correct like below:
jQuery(window).unbind('resize', function () { this.resize(); });
For the original code, I got an error (window object didn't have 'resize')
Please confirm.
Many thanks!
Hi,
I am trying to redirect the user to a new page after showing Messi alert.
$.ajax({
type: "POST",
url: "scorecalc.php",
data: {"w":JSON.stringify(sessionStorage)},
cache:false,
success: function(result)
{
a = new Messi(result, {title: 'Result',titleClass: 'info',buttons: [{id: 0, label: 'Close', val: 'X'}]});
window.location='test_dashboard.php';
}
});
The alert doesn't waits to be closed manually before redirecting it to the page.
If I remove the redirect line, alert waits for user interaction.
$.ajax({
type: "POST",
url: "scorecalc.php",
data: {"w":JSON.stringify(sessionStorage)},
cache:false,
success: function(result)
{
a = new Messi(result, {title: 'Result',titleClass: 'info',buttons: [{id: 0, label: 'Close', val: 'X'}]});
// window.location='test_dashboard.php';
}
});
I want the alert to wait, how should it happen ?
In IE, Yes and No button placed up and down. Not one in left, one in right. I think it is about CSS.
It's simple change the code to make possible send some information:
Messi.load(
'page.php',{
params: { param_1: 'value_1', param_2: 'value_2' }
}
);
On messi.js load function:
var request = {
data: options.params ,
.....
Thanks for the great library! One issue I am having is with dialogs with multiple buttons. The buttons are right next to each other, not spaced apart like in the demo versions you have on your site. It appears to be a Firefox problem (15.0.1 for Mac). Any suggestions on how to correct it?
Marcos,
I have a project that is using Messi for its dialogs and want to see continued development of this plugin.
If you are not going to continue developing this plugin—perhaps even if you are—consider creating a Messi organization here on Github. Then you could move this repo into that organization and give commit and/or admin rights to people who are dedicated to seeing the plugin grow and succeed.
I would be willing to help with this and I'm convinced that there would be others also willing.
options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});
should be
options = jQuery.extend({show: true, unload: true, params: {}}, options || {});
Can you add [, data] to load method? I want to sent the some parameters then I use load method()
such()
Messi.load('multi_upload.php', {'idProj': "11"},
{
title: 'Title',
titleClass: 'info',
width: '500px',
height: '310px',
buttons: [{
id: 0,
label: 'Close',
val: 'X'}]
});
this code breaks replace it with $(this).parent().data('value');
When viewed with Internet Explorer 11, when you click on a Messi link it displays:-
[object Object]
Any idea how you can make it work on this the latest version of IE? I am using Messi v1.3 and jQuery v2.0.3
I use load.messi to display a html file but if I specify 'height:' for the window the content is cut-off at the bottom, so I have to make it 'height: auto' and that throws my whole page out.
Scrolling the contents would be a nice addition :)
In IE (all version from 7 up to 10) the buttons (yes/no/cancel) appears one above the other and so I can view only the first and a little of the second, even in the on-line demo page.
I solved adding "display: -ms-flexbox;" in CSS .messi-actions {} and "-ms-flex: 1;" in .messi-actions .btnbox {}, it seems that "display:box" does't work for IE.
I add also width:100%; into .messi-actions {} for Firefox to display the buttons as in Chrome, IE and Opera.
I hope this is usefull.
Thank you.
P.S. : Very good work!!! I like it so much!!!
Hi,
I use this in my page:
Messi.load('aboutus.html', {title: 'About Us', titleClass: 'anim info', height: '450px', width: '400px', modal: true, padding: '10px'});
I have some css in 'aboutus.html' and it all seems to work well, except for background-color: which Messi ignores. Is there a way to change the background color of the message box?
CSS:
body{
background-color: #284352;
margin:0;
padding:0;
font:normal 16px/20px Ubuntu, sans-serif;
}
Thank you :)
Would be nice if you put a preloader to load function.
From this:
load: function(url, options) {
options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});
var request = {
url: url,
data: options.params,
dataType: 'html',
cache: false,
error: function (request, status, error) {
console.log(request.responseText);
},
success: function(html) {
//html = jQuery(html);
new Messi(html, options);
}
};
jQuery.ajax(request);
}
to this:
load: function(url, options) {
options = jQuery.extend(options || {}, {show: true, unload: true, params: {}});
var loadMessi = new Messi('<div class="messi-preloader"></div>', options);
var request = {
url: url,
data: options.params,
dataType: 'html',
cache: false,
error: function (request, status, error) {
console.log(request.responseText);
},
success: $.proxy(function(html) {
//html = jQuery(html);
$('.messi-preloader', this.messi).remove();
$('.messi-content', this.messi).append(html);
this.resize(); // resize with new content
}, loadMessi)
};
jQuery.ajax(request);
}
Hi,
I have
This works well, however I would like to use Messi.ask() to ask the user to confirm to continue. 'Yes' would display the div id="light" class="white_content" and 'No' would not.
Is this possible?
Many thanks :)
We at VersionEye are working hard to keep up the quality of the bower's registry.
We just finished our initial analysis of the quality of the Bower.io registry:
7530 - registered packages, 224 of them doesnt exists anymore;
We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).
Sadly, your library marcosesperon/Messi
is one of them.
Can you spare 15 minutes to help us to make Bower better?
Just add a new file bower.json
and change attributes.
{
"name": "marcosesperon/Messi",
"version": "1.0.0",
"main": "path/to/main.css",
"description": "please add it",
"license": "Eclipse",
"ignore": [
".jshintrc",
"**/*.txt"
],
"dependencies": {
"<dependency_name>": "<semantic_version>",
"<dependency_name>": "<Local_folder>",
"<dependency_name>": "<package>"
},
"devDependencies": {
"<test-framework-name>": "<version>"
}
}
Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.
NB! Please validate your bower.json with jsonlint before commiting your updates.
Thank you!
Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!
IE complains about the comma after the last parameter to Messi.prototype at Line 202. Also the close button remains permanently in position without displaying an X.
Version of IE used was 8.0.6001.18702
In IE (i'm testing on IE 9 - hate IE!) I get a strange behaviour with my modal view Messi.
I have a fixed header at the top of my website (100% width about 90px height), position fixed, z-index 1000. When the Messi dialogue should appear what I get is a flickering where my header panel, the overlay and the Messi dialogue box all flicker on and off together as in they appear and disappear rapidly. When the mouse is moved up over my header panel then everything settles and looks as it should do.
I wondered if it was competition for the z-index layer but your default is 99999 so can't be that. Any ideas?
Edit: I removed the modal:true setting to test it and no flickering. So definitely the modal causing this. Hope this helps.
I've placed a very basic login form within a messi button dialogue:
[code]
$(document).ready(function() {
new Messi('<form name="loginform" id="loginform" method="POST" action="login.php"><p><input name="username" type="text" id="username" size="30" maxlength="30" />Username</p><p><input name="password" type="password" id="password" size="30" maxlength="30" />Password</p></form>',
{title: 'Please Login...',buttons: [{id: 0, label: 'Login', val: 'login'}],callback: function(){ var login = document.getElementById("loginform"); login.submit(); }
});
});
[/code]
no matter what i try i cannot get the call back function to submit the form...
Delete this? :-D
Would be nice if you close the 'messi' when press esc key or click on the modal area.
After _this.modal =.......... add this code
_this.modal.bind('click', function() {
_this.hide();
});
$(document).keypress(function(event) {
if (event.keyCode == 27) {
_this.hide();
}
});
I have an Issue in IE (found in IE9)
If autoclose is used, IE complains about undefined variable
How to show Static Content in Model with it?
Hi,
I have two questions: how do I put a link in the message and how to put a line break?
Thanks in advance.
When I tried the example "Message with custom buttons (yes/no) and callback function", the alert message is "Your selection: Selection Undefined".
I downloaded Messi master from github and used messi.js. I think it is a bug.
Hi!
Like your app..thanks..
Small question:
I open an error message box like this:
new Messi(errorMessage, {title: 'Error', titleClass: 'error', buttons: [{id: 0, label: 'Close', val: 'X'}]});
And in Firefox (v. 25 or 28) the 'Close' button is placed on the left..but in IE, Chrome and Safari it is placed in the middle (like on your site screenshots)..
How can I place this button in the center in FF? )
Thank you!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.