Skip to content

Commit

Permalink
jquery plugin to setup wmd
Browse files Browse the repository at this point in the history
  • Loading branch information
anandology committed Dec 10, 2009
1 parent 8044e80 commit 3c7f2a8
Show file tree
Hide file tree
Showing 2 changed files with 62 additions and 152 deletions.
47 changes: 47 additions & 0 deletions jquery.wmd.js
@@ -0,0 +1,47 @@
/*
* jQuery wmd plugin.
*/

(function($) {
var counter = 0;

$.fn.wmd = function(_options) {
this.each(function() {
var defaults = {"preview": true};
var options = $.extend({}, _options || {}, defaults);

if (!options.button_bar) {
options.button_bar = "wmd-button-bar-" + counter;
$("<div/>")
.attr("class", "wmd-button-bar")
.attr("id", options.button_bar)
.insertBefore(this);
}

if (typeof(options.preview) == "boolean" && options.preview) {
options.preview = "wmd-preview-" + counter;
$("<div/>")
.attr("class", "wmd-preview")
.attr("id", options.preview)
.insertAfter(this);
}

if (typeof(options.output) == "boolean" && options.output) {
options.output = "wmd-output-" + counter;
$("<div/>")
.attr("class", "wmd-output")
.attr("id", options.output)
.insertAfter(this);
}

this.id = this.id || "wmd-input-" + counter;
options.input = this.id;

if (window.console)
console.log(options);

setup_wmd(options);
counter++;
});
};
})(jQuery);
167 changes: 15 additions & 152 deletions wmd-test.html
@@ -1,171 +1,34 @@
<!DOCTYPE html>

<html>

<head>
<title>Test WMD Page</title>

<link rel="stylesheet" type="text/css" href="wmd.css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="wmd.js"></script>
<script type="text/javascript" src="showdown.js"></script>
<script type="text/javascript" src="jquery.wmd.js"></script>
</head>

<body>
<div id="xwmd-editor" class="wmd-panel">
<div id="xwmd-button-bar" class="wmd-button-bar"></div>
<textarea id="xwmd-input" class="wmd-input"></textarea>
</div>
<div id="xwmd-preview" class="wmd-panel wmd-preview"></div>

<div id="ywmd-editor" class="wmd-panel">
<div id="ywmd-button-bar" class="wmd-button-bar"></div>
<textarea id="ywmd-input" class="wmd-input"></textarea>
<div style="width: 500px;">
<textarea id="xwmd-input" rows="5" style="width: 100%"></textarea>
</div>
<div id="ywmd-preview" class="wmd-panel wmd-preview"></div>


<p>To test that page up/down and arrow keys work, copy this above the WMD
control.</p>

<p>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
Scroll Down!<br/>
</p>

<script type="text/javascript" src="wmd.js"></script>
<div style="width: 500px;">
<textarea id="ywmd-input" rows="5" style="width: 100%"></textarea>
</div>

<script type="text/javascript">
setup_wmd({
input: 'xwmd-input',
preview: 'xwmd-preview',
button_bar: 'xwmd-button-bar'
$().ready(function() {
$("textarea").wmd({
"preview": true,
"helpLink": "http://daringfireball.net/projects/markdown/",
"helpHoverTitle": "Markdown Help",
});
setup_wmd({
input: 'ywmd-input',
preview: 'ywmd-preview',
button_bar: 'ywmd-button-bar'
});
});
</script>
</body>
</html>

0 comments on commit 3c7f2a8

Please sign in to comment.