We Keep Coding

Creating user options / configuration for a jQuery plugin

I don't know how to write a jQuery plugin BUT I had some funny ideas and developed some kind of "workaround" regardless my lack of skills :D I tried to Google a lot, but I can't realize the correct search string to find what I'm looking for.
Now, my plugin is "working" but I was wondering if somebody can enlighten me to make it look "better", with a properly written code.
You'll probably laugh after I show you what I've done so far , but please, take in mind I'm newbie and I'm just experimenting.
http://jsfiddle.net/Frondor/9za22/
In that jsfiddle you can see I didn't know how to handle "options" for calling dynamic content by the plugin like
var settings = $.extend({
icono: "/images/icon_69.png",
nombre: "Custom name"
}, options );
(Although I don't know what this code does xD But I think that plugins' options should look like these)
but instead of that, I've used an <i></i> (HTML) element as "options holder" with data-attributes in which my script is "looking" for options in order to show another HTML element (let's call it an "alert") which contains dynamic content depending on the data stored in the attributes previously configured inside the <i></i> tag.
If there is not any <i> tag in the page, then no "alert" will be shown.
So
I was wondering if someone can give me a hand to write this "plugin" properly xD With options like this kind of plugin does.
Thanks in advance!

Can The Preview Pane in the MarkdownDeep Markdown Editor be Disabled?

I'm working on an ASP.NET MVC project which uses the MarkdownDeep Editor to add a rich editor on top of a basic markdown input textbox (very similar to the Stackoverflow editor window).
Generally it works great. However, in certain scenarios, I would like to disable the preview window. This is automatically generated below the textarea by MDD. Can this be disabled?
Just to be clear, I know I can use CSS to hide the preview. But on some devices it's slow and makes typing painful. I want to entirely turn off that feature. I don't see anything in the docs other than how to customize the preview.
Any ideas?

In the docs it specifically mentions that it is recommended that you have the div preview already in your document because it will be created if it isn't found and consequently, could could a visible page refresh if any re-layout has to occur.
Note: the associated divs are all optional and if missing, the plugin will create them. However... you might experience the page jumping around during load if you do this. ie: it's recommended to explicitly include them.
Thus from the sounds of this, and that there doesn't appear to be any option to turn it off in the API page I would say no, it's not possible.

I am a little confused here: if you don't want the preview, use a regular text area instead of mdd_editor... So, under the scenarios where you don't need the previews, instantiate a plain vanilla editor. What am I missing here?

I know this is old, but I was looking for something else on mdd. I recently had this same requirement.
Just comment out the code
// Update the DOM
if (this.m_divHtml)
this.m_divHtml.innerHTML=output;
in MarkdownDeepEditor.js

Simple lightbox feedback form? Included screenshot

There are so many lightboxes to choose from, I'm looking for a very lightweight one to use in an embedded javascript widget that would be a single domain name. I saw the perfect one on chainreactioncycles.com, it popped up out of nowhere so I took a screenshot:
I tried looking for info on it on the page source, but couldn't find anything that would let me trace where it came from... Would anybody know of one like this? Or exactly that one?
If not exactly like above, anything similar would be great too, keeping the following in mind:
Very small javascript download (animation not needed)
Self contained, not dependent on any libraries other than jquery (since I'm already using that anyway).
Works in major browsers
Close button (like GetSatisfaction or UserVoice)
Dims background
Avoids javascript namespace conflicts (or can easily be made to avoid them)
CSS styling of lightbox does not interfere with site styling
Have you used an existing lightbox scripts for this same purpose with similar requirements? Did you roll your own? Insights welcome!

What you are looking for is called a modal box.
Here is a list of them
... and here is a striking replica of what you are looking for

Check out Zoombox.. It sounds like what you're looking for... Simple to use... Allows custom content.. jQuery Module... From past experience it covers what you have outlined as requirements etc
http://www.grafikart.fr/zoombox will tell you all you need to know.

Un-obtrusive modal window in external site

Sorry for the title.....bit difficult to word what I really want to ask.
Some websites allow a user to copy and paste some widget for use with their own site. For example, getsatisfaction. Yes, those feedback icons that I hope most of you see in various places.
If you have a look at twitterfeed, on the left there will be a feedback icon, once clicked on a nice modal window comes up. the modal windows content is in an iframe to an external source.
I really like this, but my question is:
I could do the same by using some jQuery library for the modal window and then linking the modal content to a site on my page, but how do I stop this from becoming obtrusive to a sites other javascript files?
For example, let's say i'm using my js code and the relevant jquery code, and i've minified it into one file. The user adds my widget to their site. If they're using jQuery, how do I make sure my code isn't going to interfere with theirs?
Would the best way be to use a modal window library which is not very popular?
Thanks very much. Hope that makes sense!
EDIT: I could write my own modal window functionality code, but i'd much rather use a library which already does it.

You can dynamically load jQuery only if it is needed.
First check for the existance of the jQuery object. If not add the script tag.
There are some challenges to this, as there is no onload event when adding a script tag to a page, that works consistently accross browsers, so you will have to poll to see if it fully loaded, and only then run your code.
There is an article on how to do this:
http://www.squidoo.com/load-jQuery-dynamically
You may still have an issue if the user has a differnt version of the jquery library though, although you can probably get around this with some additional checks.

jQuery UI has very nice dialog components that should fit your purpose. Inside them you can instantiate an iframe. see:
http://elijahmanor.com/demos/jqueryuidialogiframe/index.html
If I understand all this correctly, the iframe content is a separate page, so there is no case where your javascript code in that page would interfere with the javascript of the calling page, but maybe I haven't understood that part correctly?
EDIT:
I think I understand what you meant, in that you want to package up the code that you will write that opens the modal window with the iframe. SO you want to make sure that this code does not interfere with existing jQuery code that the user is using.
I think this is a good use case for a jQuery plugin. This way the user of the page can use your function like any jQuery function, so less likelyhood of collisions

Ensure javascript badge / widget html is not changed

One of my clients wants to distribute a javascript widget that people can put on their websites. However he wants to ensure that the backlink is left intact (for SEO purposes and part of the price of using the widget). So the javascript he's going to distribute might look like this:
<script id="my-script" src="http://example.com/widget-script.js"></script>
<div style='font-size:10px'><a href='http://www.example.com/backlinkpage.html'>
Visit Exaxmple.com</a></div>
widget-script.js would display some html on the page. But what wew want to ensure is that some wiley webmaster doesn't strip out the back link. If they do we might display a message like "widget installed incorrectly" or something. Any ideas / thoughts.
Some code taken from this question.

There's no 100% way of preventing this, I'm afraid.
You could insert the link yourself with Javascript, but then it'd be for naught as far as PageRank goes.
You could give them the HTML with the link having an ID like mycompanybacklink and check with Javascript whether the element exists or not. If it doesn't, don't display the badge or whatever. If it does, you can verify that the link's href is your website and its text is what you want. You would have to edit the HTML you posted as sample so that the link comes before the script, not after. The element could still exist, however, but be blocked by some other element or simply hidden with CSS. You could then also do something akin to what jQuery does now with its :hidden selector: Instead of looking at the CSS property by itself (which is what a webmaster is most likely to try) you can just see whether the element itself or its parents take up any space in the document. I think this is done with offsetWidth and offsetHeight but I am not sure. Worth looking into, though....

If you wanted to ensure that the link is always there with the widget, you could just have it printed via JavaScript. However, I don't think search engines would pick it up as a backlink.
I think you're just going to have to trust that your users will act in good faith and show you the courtesy of not modifying/removing the link. You also need to accept that no matter what you do, a determined webmaster will be able to use your widget without displaying the link, and some inevitably won't, but they are likely to be in the minority (unless your backlink is just really intrusive or obnoxiously distracting).
Any JavaScript/HTML solution could simply be edited out by the webmaster. You'd have to make your widget in flash if you really want to prevent tampering.