HTML5 formatting on MacOS X? (preferably with TextMate)
Are there any e开发者_如何学Pythonditors or bundles available for MacOS X that support formatting of HTML5 documents? Tidy errors out on newer tags like canvas.
This question talks about how to make Tidy work with HTML5; tweaking the TextMate bundle's command line to use these params should work.
I managed to add a HTML5 Tidy to TextMate by using the information found in this question. Tidy does not seem to accept a custom string as a DocType, so I used a TextMate macro to insert a valid one. There probably is a more elegant way of doing this, but it gets the job done!
To start off, we need to create a TextMate command for Tidy that plays nice with HTML5. Access the "Bundle Editor" from the Bundles menu, and create a new command containing the following:
#!/usr/bin/env ruby -wKU
require ENV['TM_SUPPORT_PATH'] + '/lib/ui.rb'
require ENV['TM_SUPPORT_PATH'] + '/lib/exit_codes.rb'
result = `"${TM_TIDY:-tidy}" -f /tmp/tm_tidy_errors -iq -utf8 \
-wrap 0 --tab-size $TM_TAB_SIZE --indent-spaces $TM_TAB_SIZE \
--indent yes \
${TM_XHTML:+-asxhtml --output-xhtml yes} \
${TM_SELECTED_TEXT:+--show-body-only yes} \
--enclose-text yes \
--doctype omit \
--new-blocklevel-tags article,header,footer \
--new-inline-tags video,audio,canvas,ruby,rt,rp \
--break-before-br yes --vertical-space yes \
--wrap-php no \
--tidy-mark no`
status = $?.exitstatus
at_exit { File.unlink('/tmp/tm_tidy_errors') } # Clean up error log
if status == 2 # Errors
msg = "Errors: " + File.read('/tmp/tm_tidy_errors')
TextMate.exit_show_tool_tip msg
elsif status == 1 # Warnings - use output but also display notification with warnings
log = File.read('/tmp/tm_tidy_errors').to_a.select do |line|
! (ENV['TM_SELECTED_TEXT'] and (line.include?('Warning: missing <!DOCTYPE> declaration') or line.include?("Warning: inserting missing 'title' element")))
end.join rescue nil
unless log.empty?
options = {
:title => "Tidy Warnings",
:summary => "Warnings for tidying your document (press escape to close):",
:log => log
}
TextMate::UI.simple_notification(options)
end
end
if ENV['TM_SOFT_TABS'] == "YES"
print result
else
in_pre = false
result.each_line do |line|
unless in_pre
tab_size = ENV["TM_TAB_SIZE"].to_i
space, text = /( *)(.*)/m.match(line)[1..2]
line = "\t" * (space.length / tab_size).floor + " " * (space.length % tab_size) + text
end
print line
in_pre = true if line.include?("<pre>")
in_pre = false if line.include?("</pre>")
end
end
Name this command something along the lines of "HTML5 Tidy". Set the scope selection to "text.html". We'll set up a keyboard shortcut in a moment. Note that the "doctype" switch has been set to "omit", which removes the DocType declaration entirely.
You then need to record a macro from the Bundles menu with the following actions:
- Selecting the "HTML5 Tidy" command you just created
- Pressing CMD+Up to move to the beginning of the document
- Typing
<!DOCTYPE html> - Inserting a new line
Select the "Save Last Recording" menu item to store the macro. Name it something appropriate, such as "HTML5 Tidy + DocType", and set its scope to "text.html". You can then assign a keyboard shortcut for your completed macro using the "Key Equivalent" input.
This should allow you to use Tidy on your HTML5 documents without any problems.
Do not about textmate bundles, but how about coda from panic? www.panic.com/coda
John Muhl's html5 bundle - https://github.com/johnmuhl/html5.tmbundle
Textmate has a bundle that will validate against the W3C validator - http://validator.w3.org/
I have to say that I am not familiar with TextMate bundles because I do not personally use that editor. None the less, I found out that they have a public subversion server where they keep different bundles. A quick search did not reveal any HTML5 bundle. You can find more information about bundles on their website.
If you want an out of the box way of create web content in HTML5, have a look at Aloha Editor.
加载中,请稍侯......
精彩评论