Recent Notes
Displaying keyword search results 1 - 10
Created by Fang on November 10, 2011 09:26:12
Last update: November 10, 2011 09:26:12
Syntax highlighted XML schema for JSF 2.0 Application Configuration Resource File ( faces-config.xml ). Almost 3000 lines!
<?xml version="1.0" encoding="UTF-8"?>
<xsd:sch...
Created by Fang on October 31, 2011 21:10:10
Last update: October 31, 2011 21:13:10
In this example I'll add a parameter to a facelets template. The example contains three tabs, each tab points to a different page. The tab control is shared among all pages, therefore, it is put in the template.
Starting from the simple facelet example , make these additions:
Create a new template WEB-INF/templates/tabs.xhtml :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Stric...
Add a page for the about tab ( about.xhtml ):
<?xml version="1.0" encoding="UTF-8"?>
<ui:comp...
Add a page for the news tab ( news.xhtml ):
<?xml version="1.0" encoding="UTF-8"?>
<ui:comp...
Add a page for the partner tab ( partner.xhtml ):
<?xml version="1.0" encoding="UTF-8"?>
<ui:comp...
Build and re-deploy the application. Launch the browser and load page http://localhost:8080/facelet-demo/about.jsf .
This is a screenshot:
Created by Fang on October 28, 2011 14:49:53
Last update: October 28, 2011 14:52:19
Facelet templates can be nested, for example, a page can use a template which inherits from another template. To demonstrate this, let's start from the simple example and make these additions:
Add a place holder for CSS style sheets in WEB-INF/templates/default.xhtml :
<h:head>
<title>Facelets Template Demo</tit...
Add a derivative template ( WEB-INF/templates/default-style.xhtml ) which provides CSS:
<?xml version="1.0" encoding="UTF-8"?>
<ui:comp...
Add a page that uses the styled template ( home-style.xhtml ):
<?xml version="1.0" encoding="UTF-8"?>
<ui:comp...
The only difference between this file and home.xhtml is the template being used.
Compare the display of the pages home.xhtml and home-style.xhtml .
Created by Dr. Xi on September 30, 2011 15:34:47
Last update: September 30, 2011 15:34:47
A naive try would be something like this:
$ nc -l 8082 | nc remote_host 80 Yes, it does forward the request from local port 8082 to remote_host:80 , but the response is dumped to stdout , not routed back to the client as expected. Using a named pipe makes it work: $ mkfifo backpipe $ nc -l 8082 0<backpipe | nc ... Use tee to get a glimpse of the response through the pipe (I wasn't able to find a way to dump the request): $ nc -k -l 8082 0<backpipe | nc localhost 80 | tee... The GNU netcat has a different syntax than the stock nc . It also supports different switches. To listen to port 1234: $ netcat -l -p 1234...
Created by freyo on September 09, 2011 11:43:36
Last update: September 09, 2011 11:45:45
When you run automated Android tests with Eclipse or from the command line, you get text output, which isn't good for reporting purposes. If you run a large set of test cases with automated build, the text report isn't very helpful. Fortunately, Android CTS generates test reports in XML with accompanying XSL to make it look nice in a browser. To run your own tests with Android CTS: Download Android CTS Make a new directory MyRepository under android-cts , alongside the existing repository directory. Copy host_config.xml from repository to MyRepository Create directory plans under MyRepository , add a test plan ( MyTests.xml ):
<?xml version="1.0" encoding="UTF-8"?> <TestPla... Create directory testcases under MyRepository . Copy TestDeviceSetup.apk from repository/testcases to MyRepository/testcases Under MyRepository/testcases , create a test...
Created by Dr. Xi on August 31, 2008 20:43:44
Last update: January 22, 2011 12:48:08
It's probably more useful to make the JavaScript executor a bookmarklet. That way it gains access to the page on which it is invoked. Therefore, more helpful while debugging. Here's the code:
<html>
<body>
<a href="javascript:(funct...
Or, you can add this link to your bookmarks, name it "JS Executor". For a full featured JavaScript console, you may need Jash
Created by James on March 28, 2010 22:09:34
Last update: January 11, 2011 21:23:03
This CSS behavior looks weird to me and I don't know if it's by the spec. It doesn't make sense to me at all.
Using this markup:
<!doctype html>
<html>
<body style="width:25...
the page is rendered like this:
i.e., the text of the non-floating div wraps around the floating div.
However, by simply adding an overflow property to the non-floating div (doesn't matter what the value is, anything except inherit ), the text no longer wraps!
HTML:
<!doctype html>
<html>
<body style="width:25...
Page:
Created by James on July 04, 2009 16:30:40
Last update: January 11, 2011 21:21:59
If you are looking for a solution for a progress bar, I direct you to the following resources: Bare Naked App provides a simple and elegant solution based on pure CSS with two images. You control the percentage of completion through the background-position attribute of the CSS. HTML:
<img src="/images/percentImage.png" alt="... CSS: img.percentImage { background: white url(/imag... Images: (percentImage.png) (percentImage_back.png) WebAppers extended the above solution with JavaScript. They also added several colored images: JQuery UI has a built-in progress bar widget. However, if you want to get to understand some of the foobar needed to get CSS to work (in general) through this example, stay with me for the rest of this note. Initially I was thinking, a progress bar should be easy: just make...
Created by James on September 07, 2010 03:11:39
Last update: January 11, 2011 20:28:33
I didn't know how hard it was to vertically align something to the middle until I had to do it. An excellent writeup about the various techniques (or should I say hacks?) to achieve this is here: http://blog.themeforest.net/tutorials/vertical-centering-with-css/ Here I present a technique with the help of jQuery. To make it simple, what I'm doing is to display a single line of text in the middle of the page instead of at the top. The markup is made simple because the logic is moved to JavaScript. There are two requirements to make this work: The parent container uses relative positioning jQuery code added to re-position the content with absolute positioning
<!doctype html> <html> <head> <title>Vert... For some reason, the following code did not work although...
Created by James on March 29, 2010 03:11:38
Last update: January 11, 2011 20:19:39
This is an age old problem. Since it comes up time and time again, I'm writing this down for future reference. Let's start with a two-column layout generated by the 2 Column Layout Generator :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans... It renders like this: The left column is shorter than the right column. How to make the left and right column the same height? Adding height: 100% to the style sheet of the left column doesn't cut it. There are several hacks, none of them are straightforward: In search of the One True Layout Faux Columns Creating Liquid Layouts with Negative Margins In short, there's no instruction in CSS that tells a DIV that its height should be 100% of that of the...
