WMD is a JavaScript based code editor for the Markdown formatting language. It includes a Markdown interpreter – Showdown – for live preview and output of the Markdown generated HTML.
The goal of this project is to add support for simple input elements and forms to Markdown. This code is forked from Jim Brikman's fork of WMD, which, in turn, was forked from a number of other sources. All credit goes to the respective authors.
I (maleldil) forked this from brikis98 to play around and see how difficult it would be to add the functionality he has defined here. All the documentation provided is his, and all credit for the ideas are his as well.
name = ___
<label for="name">Name:</label>
<input type="text" id="name" name="name" size="20"/>Or:
name = ___[50]
<label for="name">Name:</label>
<input type="text" id="name" name="name" size="50"/>Exactly 3 underscores will be matched. Any more will be handled as standard underline directives. Default input size is 20.
sex = (x) male () female
<label>Sex:</label>
<input type="radio" name="sex" id="male" value="male" checked="checked"/><label for="male">Male</label>
<input type="radio" name="sex" id="female" value="female"/><label for="female">Female</label> phones = [] Android [x] iPhone [x] Blackberry
<label>Phones:</label>
<input type="checkbox" name="phones" id="Android" value="Android"/><label for="Android">Android</label>
<input type="checkbox" name="phones" id="iPhone" value="iPhone" checked="checked"/><label for="iPhone">iPhone</label>
<input type="checkbox" name="phones" id="Blackberry" value="Blackberry" checked="checked"/><label for="Blackberry">Blackberry</label>city = {BOS, SFO, (NYC)}
<label for="city">City:</label>
<select id="city" name="city">
<option value="BOS">BOS</option>
<option value="SFO">SFO</option>
<option value="NYC" selected="selected">NYC</option>
</select>Or with user-friendly labels:
city = {BOS -> Boston, SFO -> San Francisco, (NYC -> New York City)}
<label for="city">City:</label>
<select id="city" name="city">
<option value="BOS">Boston</option>
<option value="SFO">San Francisco</option>
<option value="NYC" selected="selected">New York City</option>
</select>Or both:
city = {BOS, SFO, (NYC -> New York City)}
<label for="city">City:</label>
<select id="city" name="city">
<option value="BOS">BOS</option>
<option value="SFO">SFO</option>
<option value="NYC" selected="selected">New York City</option>
</select>zip code* = ___
<label for="zip-code" class="required-label">Zip code*:</label>
<input type="text" name="zip-code" id="zip-code" size="20" class="required-input"/>zip code* = ___[50]
<label for="zip-code" class="required-label">Zip code*:</label>
<input type="text" name="zip-code" id="zip-code" size="50" class="required-input"/><html>
<head>
<title>WMD Example</title>
<link rel="stylesheet" type="text/css" href="wmd.css"/>
<script type="text/javascript" src="wmd.js"></script>
<script type="text/javascript" src="showdown.js"></script>
</head>
<body>
<h1>WMD Example</h1>
<div>
<div id="notes-button-bar"></div>
<textarea id="notes" name="copy"></textarea>
<div id="notes-preview"></div>
<input type="text" name="copy_html" value="" id="copy_html"/>
</div>
<script type="text/javascript">
setup_wmd({
input: "notes",
button_bar: "notes-button-bar",
preview: "notes-preview",
output: "copy_html"
});
</script>
</body>
</html>All documented features have been implemented and tested with basic use cases. It could use more thorough testing, though.
WMD Editor is licensed under MIT License.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent