5

Have you encountered an OS X text editor capable of indenting both the line

var x = 2;

and the lines

<it>Item A</it>
<it>Item B</it>

in the following html?

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Test</title>
<script>
function foo_bar() {
var x = 2;
}
</script>
</head>
<body onload="foo_bar()">

<h1>Header</h1>

<ul>
<it>Item A</it>
<it>Item B</it>
</ul>

</body>
</html>

I have tried all emacs packages purporting to do this simple task properly (through a major and a minor mode), but none is adequate. I am too heavily into emacs to abandon it altogether, but I am now looking for an editor other than emacs for this task.

  • No-one else is going to choose a text editor based on whether it can auto-indent JavaScript embedded in HTML. (Or search for this question.) – Lri Jul 6 '12 at 9:51
  • Is that so? Do elucidate us. – Calaf Jul 6 '12 at 12:46
  • 2
    @LauriRanta That's not a good assumption. If one person had the question, it's entirely likely that more will. If you're interested in fussing about obscure questions, have a crack at a few of mine. – CajunLuke Jul 6 '12 at 22:52
  • 1
    It is interesting so I don't think we should close it. OTOH it appears to be solvable with some clever Emacs Lisp hacking so maybe AskDifferent is just the wrong place to ask. – nohillside Aug 14 '12 at 17:34
  • @patrix I have tried multi-web-mode and nXhtml. Neither fits the bill. Support for two modes has been missing from emacs ever since Knuth mixed TeX with programs in a single file. It is safe not to bet that emacs will have this capability anytime soon. Of course, should you publish the "clever Lisp hacks", you will make many people rather delighted. – Calaf Aug 14 '12 at 20:44
3

I've written web-mode.el (available on http://web-mode.org) because I had the same problems as you. This Emacs Major Mode for editing HTML templates (HTML with CSS/JS/PHP/JSP) is autonomous (no other major required) and syntax-highlights and indents according to the block's type.

OP Raving

With nothing more than

(require 'web-mode)

in your .emacs and storing web-mode.el in an accessible location (your home directory will do for a start), the code sample in the question will look like this out-of-the-box.

enter image description here

To get the right indentation

enter image description here

you'll need to use

;; First the (general) requisite initialization.
(package-initialize)

(require 'web-mode)

(eval-after-load "web-mode"
  '(progn 
     (add-to-list 'auto-mode-alist '("\\.css\\'" . web-mode))
     (add-to-list 'auto-mode-alist '("\\.html\\'" . web-mode))
     (add-to-list 'auto-mode-alist '("\\.js\\'" . web-mode))

     (setq web-mode-script-padding 2)
     (setq web-mode-style-padding 2)
     (setq web-mode-block-padding 2)
     ))
2

I use Textmate heavily and love how auto indents for me when doing my Rails Developments. It is a really good text editor and totally worth the price. Has a lot of good features.

Though, most text editors usually have auto indentation. Coda 2 does and I believe Textwrangler and a few others. Shouldn't be too hard to find that works and most of them all have free trials to play with first to see if they are to your liking.

I hope that this answer helps you out.

  • 1
    Sublime Text is another good choice: sublimetext.com – Vickash Jul 5 '12 at 18:26
  • Yes it is, thank you, I had for got about that one. – de_an777 Jul 5 '12 at 18:31
  • Textmate does indeed indent Javascript embedded within HTML (Edit\Select\All = Command-A; Text\Indent Selection Option-Command-[). I don't see how either Coda 2 or Textwrangler can indent a selection. Sublime Text 2 has several selection and indentation options. None of my trials indented the selected buffer. Now if only Textmate would somehow import my emacs color scheme. – Calaf Jul 5 '12 at 19:31
  • Textmate does allow for you to change the color scheme to whatever you like. Its pretty awesome, there are plenty of themes to download for it. You can make and create your own too. Here is one that I found that looks like a dark theme for emacs: mac.softpedia.com/get/Graphics/Emacs-TextMate.shtml – de_an777 Jul 5 '12 at 20:49
  • ..and to use a theme one double-clicks the .tmTheme file, rather than loads it through Textmate itself. Also, as indicated in the "14 Themes" section of the manual, the wiki (wiki.macromates.com/Themes/UserSubmittedThemes) has a number of additional themes. – Calaf Jul 5 '12 at 22:11

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .