edit.html

<div id='sidebar'>
	<div class='panel'>
		<div class='header'>
			<span class='col_fade'>话题发布步骤</span>
		</div>
		<div class='inner'>
			<ol>
				<li>填写标题</li>
				<li>填写内容</li>
				<li>选择话题标签</li>
				<li>确认后发布话题</li>
			</ol>
		</div>
	</div>
	<div class='sep10'></div>
	<div class='panel'>
		<div class='header'>
			<span class='col_fade'>话题发布指南</span>
		</div>
		<div class='inner'>
			<ul>
				<li>尽量把话题要点浓缩到标题里</li>
				<li>内容对标题做进一步说明，但不是必须的</li>
				<li>给话题选择合适的标签能增加被阅读的机会</li>
			</ul>
		</div>
	</div>
	<div class='sep10'></div>
	<div class='panel'>
		<div class='header'>
			<span class='col_fade'>markdown语法参考</span>
		</div>
		<div class='inner'>
			<ul>
				<li>换行：两个空格</li>
				<li>分段：一个空行</li>
				<li>斜体：*斜体*</li>
				<li>粗体：**粗体**</li>
				<li>代码：行首四个空格</li>
				<li>链接：[文字](url)</li>
				<li>图片：![alt 文字](url)</li>
			</ul>
			<span>详见 <a href='http://www.ituring.com.cn/article/775' target='_blank'>Markdown Wiki</a></span>
		</div>
	</div>
</div>

<div id='content'>
	<div class='panel'>
		<div class='header'>
			<ul class='breadcrumb'>
				<li><a href='/'>主页</a><span class='divider'>/</span></li>
				<% if(locals.action && action == 'edit'){ %>
				<li class='active'>编辑话题</li>
				<% }else{ %>
				<li class='active'>发布话题</li>
				<% } %>
			</ul>
		</div>
		<div class='inner'>
			<% if(locals.edit_error){ %>
			<div class="alert alert-error">	
				<a class="close" data-dismiss="alert" href="#">&times;</a>
				<strong><%= edit_error %></strong>
			</div>
			<% } %>
			<% if(locals.error){ %>
			<div class="alert alert-error" >	
				<strong><%= error %></strong>
			</div>
			<% }else{ %>
			<% if(locals.action && action == 'edit'){ %>
			<form id='create_topic_form' action='/topic/<%= topic_id %>/edit' method='post'>
			<% }else{ %>
			<form id='create_topic_form' action='/topic/create' method='post'>
			<% } %>
				<div>
					<label class='bold' for='title'>标题</label>
					<div>
						<% if(locals.title){ %>
						<textarea class='span8' id='title' name='title' rows='3'><%= title %></textarea>
						<% }else{ %>
						<textarea class='span8' id='title' name='title' rows='3'></textarea>
						<% } %>
						<p class='help-block'>字数控制在10到100个之间</p>
					</div>
				</div>
				<div class='sep10'></div>
				<div class='sep10'></div>
				<div>
					<label class='bold' for='t_content'>内容和标签</label>
					<div class='tabbable'>
						<ul class='nav nav-pills'>
							<li class='active'><a href='#markdown' data-toggle='pill'>markdown</a></li>
							<li><a href='#preview' data-toggle='pill'>预览</a></li>
							<li><a href='#tags'data-toggle='pill'>标签</a></li>
						</ul>
						<div class='tab-content'>
							<div class='active tab-pane' id='markdown'>
								<div id='wmd-button-bar'></div>
								<div class='input'>
									<% if(locals.content){ %>
									<textarea class='span8' id='wmd-input' name='t_content' rows='20'><%= content %></textarea>
									<% }else{ %>
									<textarea class='span8' id='wmd-input' name='t_content' rows='20'></textarea>
									<% } %>
								</div>
							</div>
							<div id='preview' class='tab-pane'>
								<div id='wmd-preview' class='wmd-preview topic-wmd-preview'></div>
							</div>
							<div id='tags' class='tab-pane'>
								<div class='tags_select'>
									<%- partial('tag/tag_selectable',{collection:tags, as:'tag'}) %>
								</div>
							</div>
						</div>
					</div>
				</div>
				<input type='hidden' id='topic_tags' name='topic_tags' value=''></input>
				<input type='hidden' name='_csrf' value='<%= csrf %>' />
				<div class='form-actions'>
					<button id='submit_btn' class='btn'>发布</button>
				</div>
			</form>
		</div>
		<% } %>
	</div>	
</div>

<!-- ajaxupload -->
<script type='text/javascript' src='/libs/ajax-upload/ajaxupload.js'></script>
<!-- markdown editor -->
<script type='text/javascript' src='/libs/pagedown/Markdown.Converter.js'></script>
<script type='text/javascript' src='/libs/pagedown/Markdown.Sanitizer.js'></script>
<script type='text/javascript' src='/libs/pagedown/Markdown.Editor.js'></script>

<script type='text/javascript'>
	$(document).ready(function(){
		function run_md_editor(){
			var converter = Markdown.getSanitizingConverter();
			var editor = new Markdown.Editor(converter);
			editor.run();	
		}
		run_md_editor();

		$('.tag_selectable').click(function(){
			$(this).toggleClass('tag_select');
		});

		$('#submit_btn').click(function(){
			var values=[];
			$('.tag_selectable').each(function(){
				if($(this).hasClass('tag_select')){
					values.push($(this).attr('tag_id'));
				}
			});
			$('#topic_tags').val(values);
			$('#create_topic_form').submit();
		});
	});
</script>