<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>Louis Ramos' Blog</title>
	<atom:link href="http://louisramos.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://louisramos.wordpress.com</link>
	<description>Random stuff about coding and the internet.</description>
	<lastBuildDate>Wed, 25 Mar 2009 04:17:20 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.com/</generator>
<cloud domain='louisramos.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://s2.wp.com/i/buttonw-com.png</url>
		<title>Louis Ramos' Blog</title>
		<link>http://louisramos.wordpress.com</link>
	</image>
	<atom:link rel="search" type="application/opensearchdescription+xml" href="http://louisramos.wordpress.com/osd.xml" title="Louis Ramos&#039; Blog" />
	<atom:link rel='hub' href='http://louisramos.wordpress.com/?pushpress=hub'/>
		<item>
		<title>Javascript/CSS detect browser fonts</title>
		<link>http://louisramos.wordpress.com/2009/02/14/javascript-css-detect-browser-fonts/</link>
		<comments>http://louisramos.wordpress.com/2009/02/14/javascript-css-detect-browser-fonts/#comments</comments>
		<pubDate>Sat, 14 Feb 2009 16:44:00 +0000</pubDate>
		<dc:creator>louisramos</dc:creator>
				<category><![CDATA[Javascript/HTML/CSS]]></category>

		<guid isPermaLink="false">http://louisramos.wordpress.com/?p=16</guid>
		<description><![CDATA[Was looking for a script that detects the browser&#8217;s available/installed fonts and came up with this final result. Original idea found at lalit.org The original code I found did not work properly for my browser, it detected more fonts than actually available. I&#8217;m using Firefox 3.0.6 (Ubuntu 8.04). This is a modified and working example [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=louisramos.wordpress.com&amp;blog=2824220&amp;post=16&amp;subd=louisramos&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
			<content:encoded><![CDATA[<p>Was looking for a script that detects the browser&#8217;s available/installed fonts and came up with this final result.</p>
<p>Original idea found at <a href="http://www.lalit.org/lab/javascript-css-font-detect">lalit.org</a></p>
<p>The original code I found did not work properly for my browser, it detected more fonts than actually available. I&#8217;m using Firefox 3.0.6 (Ubuntu 8.04).</p>
<p>This is a modified and working example that returns only the fonts that are actually available and returns adds them to a drop down / select box:</p>
<blockquote><p>&lt;html&gt;<br />
&lt;body&gt;</p>
<p>&lt;script type=&#8221;text/javascript&#8221;&gt;<br />
/**<br />
* JavaScript code to detect available availability of a<br />
* particular font in a browser using JavaScript and CSS.<br />
*<br />
* Author : Lalit Patel<br />
* Website: http://www.lalit.org/lab/javascript-css-font-detect<br />
* License: Creative Commons Attribution-ShareAlike 2.5<br />
* http://creativecommons.org/licenses/by-sa/2.5/<br />
* Version: 0.1<br />
* Updated: Aug 11, 2007 10:09am<br />
*<br />
* Modified: Feb 14, 2009, Louis: http://blog.louisramos.com/<br />
* Made changes to detect fonts that are actually &#8220;different&#8221; from the default.<br />
*<br />
*/</p>
<p>/**<br />
* Actual function that does all the work. Returns an array with all the info.<br />
* My Assumption is that most of the browsers will have arial set as their default sans-serif font.<br />
*/<br />
var Detector = function(){<br />
doc = document;<br />
var h = doc.getElementsByTagName(&#8220;BODY&#8221;)[0];<br />
var d = doc.createElement(&#8220;DIV&#8221;);<br />
var s = doc.createElement(&#8220;SPAN&#8221;);</p>
<p>d.appendChild(s);<br />
d.style.fontFamily = &#8220;xfndkjfeief&#8221;; //font for the parent element DIV.<br />
s.style.fontFamily = &#8220;xfndkjfeief&#8221;; //arial font used as a comparator.<br />
s.style.fontSize = &#8220;72px&#8221;; //we test using 72px font size, we may use any size. I guess larger the better.<br />
s.innerHTML = &#8220;mmmmmmmmmml&#8221;; //we use m or w because these two characters take up the maximum width. And we use a L so that the same matching fonts can get separated<br />
h.appendChild(d);<br />
var defaultWidth = s.offsetWidth; //now we have the defaultWidth<br />
var defaultHeight = s.offsetHeight; //and the defaultHeight, we compare other fonts with these.<br />
h.removeChild(d);</p>
<p>/* test<br />
* params:<br />
* font &#8211; name of the font you wish to detect<br />
* return:<br />
* f[0] &#8211; Input font name.<br />
* f[1] &#8211; Computed width.<br />
* f[2] &#8211; Computed height.<br />
* f[3] &#8211; Detected? (true/false).<br />
*/<br />
function test(font) {<br />
h.appendChild(d);<br />
var f = [];<br />
f[0] = s.style.fontFamily = font; // Name of the font<br />
f[1] = s.offsetWidth; // Width<br />
f[2] = s.offsetHeight; // Height<br />
h.removeChild(d);<br />
font = font.toLowerCase();<br />
if (font == &#8220;arial&#8221; || font == &#8220;sans-serif&#8221;) {<br />
f[3] = true; // to set arial and sans-serif true<br />
} else {<br />
f[3] = (f[1] != defaultWidth || f[2] != defaultHeight); // Detected?<br />
}<br />
return f;<br />
}<br />
this.test = test;<br />
}</p>
<p>function updateFonts(result){<br />
new_ele = doc.createElement(&#8220;OPTION&#8221;)<br />
new_ele.innerHTML = result[0]<br />
new_ele.value = result[0]</p>
<p>if (result[3]==true) {<br />
resultFont=&#8217;goodFonts&#8217;;<br />
} else {<br />
resultFont=&#8217;badFonts&#8217;;<br />
}<br />
doc.getElementById(resultFont).appendChild(new_ele)<br />
}</p>
<p>function updateTest(font) {<br />
tA = doc.getElementById(&#8216;testArea&#8217;)<br />
tA.innerHTML = &#8216;This is how &#8216;+font+&#8217; looks.&#8217;<br />
tA.style.fontFamily = font;<br />
}<br />
&lt;/script&gt;</p>
<p>&lt;div&gt;<br />
Good Fonts: &lt;select id=&#8221;goodFonts&#8221; onChange=&#8221;updateTest(this.value)&#8221; onKeyUp=&#8221;updateTest(this.value)&#8221;&gt;&lt;/select&gt;<br />
Bad Fonts: &lt;select id=&#8221;badFonts&#8221; onChange=&#8221;updateTest(this.value)&#8221; onKeyUp=&#8221;updateTest(this.value)&#8221;&gt;&lt;/select&gt;<br />
&lt;/div&gt;<br />
&lt;p id=&#8221;testArea&#8221;&gt;Select a font.&lt;/p&gt;</p>
<p>&lt;script&gt;</p>
<p>dtest = new Detector()<br />
var fonts = ['academy engraved let', 'algerian', 'amaze', 'arial', 'arial black', 'balthazar', 'bankgothic lt bt', 'bart', 'bimini', 'comic sans ms', 'book antiqua', 'bookman old style', 'braggadocio', 'britannic bold', 'brush script mt', 'century gothic', 'century schoolbook', 'chasm', 'chicago', 'colonna mt', 'comic sans ms', 'commercialscript bt', 'coolsville', 'courier', 'courier new', 'cursive', 'dayton', 'desdemona', 'fantasy', 'flat brush', 'footlight mt light', 'futurablack bt', 'futuralight bt', 'garamond', 'gaze', 'geneva', 'georgia', 'geotype tt', 'helterskelter', 'helvetica', 'herman', 'highlight let', 'impact', 'jester', 'joan', 'john handy let', 'jokerman let', 'kelt', 'kids', 'kino mt', 'la bamba let', 'lithograph', 'lucida console', 'map symbols', 'marlett', 'matteroffact', 'matisse itc', 'matura mt script capitals', 'mekanik let', 'monaco', 'monospace', 'monotype sorts', 'ms linedraw', 'new york', 'olddreadfulno7 bt', 'orange let', 'palatino', 'playbill', 'pump demi bold let', 'puppylike', 'roland', 'sans-serif', 'scripts', 'scruff let', 'serif', 'short hand', 'signs normal', 'simplex', 'simpson', 'stylus bt', 'superfrench', 'surfer', 'swis721 bt', 'swis721 blkoul bt', 'symap', 'symbol', 'tahoma', 'technic', 'tempus sans itc', 'terk', 'times', 'times new roman', 'trebuchet ms', 'trendy', 'txt', 'verdana', 'victorian let', 'vineta bt', 'vivian', 'webdings', 'wingdings', 'western', 'westminster', 'westwood let', 'wide latin', 'zapfellipt bt']</p>
<p>for (f in fonts) {<br />
result = dtest.test(fonts[f]);<br />
updateFonts(result);<br />
}</p>
<p>&lt;/script&gt;<br />
&lt;/body&gt;<br />
&lt;/html&gt;</p></blockquote>
<br />  <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gofacebook/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/facebook/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gotwitter/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/twitter/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/louisramos.wordpress.com/16/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/louisramos.wordpress.com/16/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/louisramos.wordpress.com/16/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=louisramos.wordpress.com&amp;blog=2824220&amp;post=16&amp;subd=louisramos&amp;ref=&amp;feed=1" width="1" height="1" />]]></content:encoded>
			<wfw:commentRss>http://louisramos.wordpress.com/2009/02/14/javascript-css-detect-browser-fonts/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/2ffe981753288446bbb91798ab3a8d17?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">louisramos</media:title>
		</media:content>
	</item>
		<item>
		<title>Hello World!</title>
		<link>http://louisramos.wordpress.com/2008/02/09/hello-world/</link>
		<comments>http://louisramos.wordpress.com/2008/02/09/hello-world/#comments</comments>
		<pubDate>Sat, 09 Feb 2008 13:52:32 +0000</pubDate>
		<dc:creator>louisramos</dc:creator>
				<category><![CDATA[My Blog]]></category>
		<category><![CDATA[introduction]]></category>

		<guid isPermaLink="false">http://louisramos.wordpress.com/?p=3</guid>
		<description><![CDATA[Hello, this is my second attempt at a blog. I shall try to keep it updated with current events, cool new findings, and of course personal interests since this is my blog. Most of the content will  be related to technology, internet, programming, and social networking websites&#8230; topics of my interest.<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=louisramos.wordpress.com&amp;blog=2824220&amp;post=3&amp;subd=louisramos&amp;ref=&amp;feed=1" width="1" height="1" />]]></description>
			<content:encoded><![CDATA[<p>Hello, this is my second attempt at a blog. I shall try to keep it updated with current events, cool new findings, and of course personal interests since this is my blog. Most of the content will  be related to technology, internet, programming, and social networking websites&#8230; topics of my interest.</p>
<br /><img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/louisramos.wordpress.com/3/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/louisramos.wordpress.com/3/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gofacebook/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/facebook/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gotwitter/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/twitter/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/louisramos.wordpress.com/3/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/louisramos.wordpress.com/3/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/louisramos.wordpress.com/3/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=louisramos.wordpress.com&amp;blog=2824220&amp;post=3&amp;subd=louisramos&amp;ref=&amp;feed=1" width="1" height="1" />]]></content:encoded>
			<wfw:commentRss>http://louisramos.wordpress.com/2008/02/09/hello-world/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/2ffe981753288446bbb91798ab3a8d17?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">louisramos</media:title>
		</media:content>
	</item>
	</channel>
</rss>
