I am working on a webapplication and I do most of the XHTML stuff in an editor.
Every once in a while I froget to close a tag or mess up the nesting (we all get distracted sometimes ;-)).
So I commpile, package and run my webapp (using maven mvn clean package jetty:run-war only to notice that displaying the view (where I messed up the jsp) fails with an exception while trying to render.
So I wondered:
Is there some tool that I can include into my build-cycle that automatically catches and rectifies those careless mistakes?
There is the Maven CheckStyle plugin that looks at certain style rules in Java and other languages. It is customisable so you can add other rules. I can't say for sure that it will catch unclosed tags but this may be the place to start.
Using an IDE like Ecplipse or Netbeans will highlight any invalid code also. So you can actually see a red mark on the page as you type. That may be even more effective.
Maybe a regular xml checker would do the trick. After all a JSP file is if properly written valid xml.
Related
In Objective C to build a Mac OSX (Cocoa) application, I'm using the native Webkit widget to display local files with the file:// URL, pulling from this folder:
MyApp.app/Contents/Resources/lang/en/html
This is all well and good until I start to need a German version. That means I have to copy en/html as de/html, then have someone replace the wording in the HTML (and some in the Javascript (like with modal dialogs)) with German phrasing. That's quite a lot of work!
Okay, that might seem doable until this creates a headache where I have to constantly maintain multiple versions of the html folder for each of the languages I need to support.
Then the thought came to me...
Why not just replace the phrasing with template tags like %CONTINUE%
and then, before the page is rendered, intercept it and swap it out
with strings pulled from a language plist file?
Through some API with this widget, is it possible to intercept HTML before it is rendered and replace text?
If it is possible, would it be noticeably slow such that it wouldn't be worth it?
Or, do you recommend I do a strategy where I build a generator that I keep on my workstation which builds each of the HTML folders for me from a main template, and then I deploy those already completed with my setup application once I determine the user's language from the setup application?
Through a lot of experimentation, I found an ugly way to do templating. Like I said, it's not desirable and has some side effects:
You'll see a flash on the first window load. On first load of the application window that has the WebKit widget, you'll want to hide the window until the second time the page content is displayed. I guess you'll have to use a property for that.
When you navigate, each page loads twice. It's almost not noticeable, but not good enough for good development.
I found an odd quirk with Bootstrap CSS where it made my table grid rows very large and didn't apply CSS properly for some strange reason. I might be able to tweak the CSS to fix that.
Unfortunately, I found no other event I could intercept on this except didFinishLoadForFrame. However, by then, the page has already downloaded and rendered at least once for a microsecond. It would be great to intercept some event before then, where I have the full HTML, and do the swap there before display. I didn't find such an event. However, if someone finds such an event -- that would probably make this a great templating solution.
- (void)webView:(WebView *)sender didFinishLoadForFrame:(WebFrame *)frame
{
DOMHTMLElement * htmlNode =
(DOMHTMLElement *) [[[frame DOMDocument] getElementsByTagName: #"html"] item: 0];
NSString *s = [htmlNode outerHTML];
if ([s containsString:#"<!-- processed -->"]) {
return;
}
NSURL *oBaseURL = [[[frame dataSource] request] URL];
s = [s stringByReplacingOccurrencesOfString:#"%EXAMPLE%" withString:#"ZZZ"];
s = [s stringByReplacingOccurrencesOfString:#"</head>" withString:#"<!-- processed -->\n</head>"];
[frame loadHTMLString:s baseURL:oBaseURL];
}
The above will look at HTML that contains %EXAMPLE% and replace it with ZZZ.
In the end, I realized that this is inefficient because of page flash, and, on long bits of text that need a lot of replacing, may have some quite noticeable delay. The better way is to create a compile time generator. This would be to make one HTML folder with %PARAMETERIZED_TAGS% inside instead of English text. Then, create a "Run Script" in your "Build Phase" that runs some program/script you create in whatever language you want that generates each HTML folder from all the available lang-XX.plist files you have in a directory, where XX is a language code like 'en', 'de', etc. It reads the HTML file, finds the parameterized tag match in the lang-XX.plist file, and replaces that text with the text for that language. That way, after compilation, you have several HTML folders for each language, already using your translated strings. This is efficient because then it allows you to have one single HTML folder where you handle your code, and don't have to do the extremely tedious process of creating each HTML folder in each language, nor have to maintain that mess. The compile time generator would do that for you. However -- you'll have to build that compile time generator.
PhpStorm can apply code style rules for specific languages with the Reformat Code command. PhpStorm can also recognize a language embedded within a file of another language (known in PhpStorm as 'Language Injection'). So, I expect that a language would be subject to its code style rules wherever the language is used -- whether embedded or in its own file.
I've found that this works as expected for css/js within an html file, but not for language injections within PHP files. PhpStorm will recognize css within a heredoc, and html as a heredoc and in single- and double- quoted strings -- yet reformatting does not work in any of these cases.
Short of using an intermediary file to reformat the code, how can I get PhpStorm to reformat these sections of code? I am using PhpStorm 6.0.3 for Mac.
Their documentation states:
PhpStorm supports full coding assistance for:
CSS and JavaScript in an HTML or XML file.
CSS, JavaScript, and SQL outside PHP code blocks and inside PHP string literals.
The second bullet seems only half true, as css/js/sql are recognized but not subjected to code styles inside PHP string literals. And injected html is not specified; but between PhpStorm recognizing the language injections and its capability to apply code styles to an arbitrary selection, all the pieces for formatting embedded languages seem to be there. What am I missing?
To reformat injected code according to PhpStorm code styles Preferences, select the injected code and open the Intention Actions list (Alt+Enter), and select "Edit __ Fragment" to edit it in it's own dedicated window (documentation). In this window, code formatting will work as expected.
Okay, so I've been utilizing HTML tidy to convert regular HTML webpages into XHTML suitable for parsing. The problem is the test page I saved in firefox had its html apparently somewhat precleaned by firefox during saving, call this File F. Html tidy works fine on file F, but fails on the raw data written to a file via .NET (file N). Html tidy is complaining about form tags being intermixed with table tags. The Html isn't mine so I can't just fix the source.
How do I clean up file N enough so that it can be run through Html tidy? Is there a standard way of hooking into Firefox (completely programmically without having to use mouse or keyboard) or another tool that will apply extra fixes to the html?
I had been using HTML tidy for some time, but then found that I was getting better results from TagSoup.
It can be used as a JAXP parser, converting non-wellformed HTML on the fly. I usually let it parse the input for Saxon XQuery transformations.
But it can also be used as a stand-alone utility, as an executable jar.
I wound up using SendKeys in C# and importing functions from user32.dll to set Firefox as the active window after launching it to the website I wanted (file:///myfilepathhere/).
SendKeys seemed to require running a windowed program, so I also added another executable which performs actions in its form_load() method.
By using alt+f, down six times, enter, wait for a bit, type full path file name, enter (twice) and then killing firefox, I was able to automate firefox's ability to clean some html up.
I write an application and inside of HTML code I have custom tags (of course these tags are parsed on server side and end user gets them as valid HTML code). Example of custom tag usage:
<html>
<body>
...
<Gallery type="grid" title="My Gallery" />
...
</body>
</html>
1.) How can I have eclipse recognize my custom tags inside of HTML code and add syntax highlighting to them?
2.) How can I add auto-suggestions to my custom tags? For example if I type "<Gallery " press "Ctrl+Space" - in the list of available attributes it shows me "type" and "title" and if I type "<Gallery type=" press "Ctrl+Space" I would see list of available values only for tag "Gallery" and its attribute "type".
Thanks in advance!
Not really what you want, but maybe it helps you:
You can try the Aptana Plug-in for Eclipse. It allows to write your own regular expression for HTML validation, so a custom tag would be ignored by the validator.
E.g.:
.gallery.
Eclipse allows you to add simple auto-suggestions via Templates. On
Eclipse 3.7.1 (Indigo) + PHP Dev Tools (PDT) 3.0.0: Window > Preferences > Web > HTML Files > Editor > Templates
Sadly, there is no easy way: you have to roll your own parser for this, and then add both your extra elements and the base grammar (HTML) to it.
If you have your parser, you could use it to do syntax highlighting (strictly speaking, for that simple lexing is enough); and a good parser can support content assist (auto-suggestions in your terminology).
Caveats:
Creating a parser for HTML is not an easy task. Maybe by aiming at a more often used subset is feasible.
If a parser exists, the editor parts are still hard to get well.
Some help on the other hand: you could use some text editor generators to ease your work:
Eclipse IMP http://www.eclipse.org/imp/ can in theory handle any type of parser, but currently it is most optimized for LPG. The documentation is scarce, but the developers are helpful in the forums.
Xtext http://www.eclipse.org/Xtext/ got quite a hype for creating text editors for DSLs. The generated editors are quite nice out of the box, but is not the best solution for large files. Has a really helpful developer community.
EMFText http://www.emftext.org/index.php/EMFText is a lesser known entity - I don't know it in details, but I guess, it is similar to Xtext.
I know its been a long time since this Q was asked,
but I hope this might help others like myself that reach this in search of a solution.
So, When using Eclipse (Mars.1 Release (4.5.1) - and possibly earlier - I did not check).
Go to Window - Prefrences
Then in the dialog that opens go to Web - HTML Files - Editor - Validation.
On the right side:
under Ignore specified element names in validation and enter the list of custom elements you use. (e.g. Gallery,tab,tabset,my-element-directives-*)
you might also like to go under Ignore specified attribute names in validation do the same for your custom attributes.(e.g. ng-*,my-attr-directives-*)
Two things to note:
After letting eclipse do a full validation you must also close the file and reopen it to have the warnings removed from the source code.
Using this method would ignore those attributes under any element. I don't think there is a simple way to tell it to ignore some-attribute only if its a child of some-element.
I find templates are an ok alternative but let's see if we can encourage a more robust solution; please take a moment and vote for this: https://bugs.eclipse.org/bugs/show_bug.cgi?id=422584
You need to add a new HTML template.To add a new template, complete the following steps:
1) From the Window menu, select Preferences.
2) In the Preferences page, select Web and XML > HTML Files > HTML Templates.
3) Click New.
4) Enter the new template name and a brief description of the template.
5) Using the Context drop-down list, specify the context in which the template is available.
6) In the Pattern field, enter the appropriate tags, attributes, or attribute values (the content of the template) to be inserted by content assist.
7) If you want to insert a variable, click the Variable button and select the variable to be inserted. For example, the word_selection variable indicates the word that is selected at the beginning of template insertion, and the cursor variable determines where the cursor will be after the template is inserted in the HTML document.
8) Click OK to save the new template.
You can edit, remove, import, or export a template by using the same Preferences page.
Reference : http://help.eclipse.org/kepler/index.jsp?topic=%2Forg.eclipse.wst.sse.doc.user%2Ftopics%2Ftsrcedt024.html
This would be an HTML minifier that skips everything between <% and %>.
Actually, an Open Source HTML minifier would be a good starting place, especially if it already had code to preserve the contents certain blocks like <textarea. It's code might be able to be made to preserve <%%> blocks also.
I am aware that HTML minifiers are less common because that changes more often than JS/CSS and is often dynamically generated, but if the JSP compiler could be made to minify before making its compiled cache copy, it would result in minified HTML.
Also, an ASP minifier would probably be very close to the same thing. And I don't care about custom tags that have meaning to the server. The only stuff that matters to the server (for my company) is in the <%%> blocks.
This question is a bit outdated but an answer with a resource still hasn't made it's way to the posting.
HtmlCompressor makes this very thing possible and quite simply.
You can use it via Java API:
String html = getHtml(); //your external method to get html from memory, file, url etc.
HtmlCompressor compressor = new HtmlCompressor();
String compressedHtml = compressor.compress(html);
Or you can use it via Taglib:
Download .jar file of the current release and put it into your lib/ directory
Add the following taglib directive to your JSP pages:
<%# taglib uri="http://htmlcompressor.googlecode.com/taglib/compressor" prefix="compress" %>
Please note that JSP 2.0 or above is required.
In JSP:
<compress:html removeIntertagSpaces="true">
<!DOCTYPE html>
...
</html>
</compress:html>
Cheers
JSP is transformed to Java code and subsequntly compiled to bytecode. Minifying JSP has no purpose then.
You can process output generated by JSP page by writing custom filter. I have written filter to trim empty lines and unnecessary whitespace from JSP output, unfortunately it's not public. But if you google around, I'm sure you can find servlet filters to remove unneeded stuff from generated HTML.
Have a look at the Trim Filter (http://www.servletsuite.com/servlets/trimflt.htm), which you can simply map in your web.xml.
It will help you to remove whitespace, and can also strip off comments.
From my experience, whitespace occurs a lot in JSPs if you use tags that themselves don't have any output, such a the JSTL C control tags (c:if, c:choose, ...), and then this comes in very handy.
As you are already aware that HTML minification is less common and it also results in errors sometime than getting any benefit out of it. HTML is also dynamically generated content.
On the other hand, there are many better ways to speed up the application front end.
Minimizing HTTP requests
Minifying JS, CSS contents
gzip/deflate contents
Leveraging browser cache
Server Side caching, until resource changes
And many other - http://developer.yahoo.com/performance/rules.html
WebUtilities is a small java library to help speed up J2EE webapp front-end. Below is the link.
http://code.google.com/p/webutilities/
With new 0.0.4 version it does many optimization and results in significant performance boost. Please have a look in case you find it useful.