Psuedo 'Slide Show' - Displaying and Hiding divs

This is a nice example of the setInterval function of javascript.

Key features:

  • Divs can be added without modifying the code
  • Div naming scheme (div#) reduces collisions with other page content
  • setInterval drives the process
  • Tested with IE7 and FF3.5
  • Doesn’t require Flash or other complex content
  • Presentation interface can be managed with CSS

<html>
<head>
</head>
<body>
<!-- Name all the divs with div and a number, they must be sequential and they must start with 1 -->
<!-- You can add more divs as needed, first div is displayed, all others are display:none -->
<div id="div1" style="display:block">One</div>
<div id="div2" style="display:none">Two</div>
<script type="text/javascript">
var loop_pause=2000;
var int=self.setInterval("rotate()",loop_pause);
/* d indicates the current div */
var d=1;
/* newDiv is the one to be shown, firstDiv is the first in the list, and lastDiv is the last one that was shown */
var newDiv,firstDiv=document.getElementById('div1');
var lastDiv=firstDiv;
function rotate()
{
/* The first div is shown on page load, so advance d */
d++;
/* Try to get the next div */
newDiv=document.getElementById('div'+d);
/* If there is no div d */
if (newDiv == null)
{
  /* Cycle back to div1, firstDiv */
  newDiv=firstDiv;
  /* Reset d */
  d=1;
}
/* Hide the previous div */
lastDiv.style.display='none';
/* Display the new or next div */
newDiv.style.display='block';
lastDiv=newDiv;
}
</script>
</body>
</html>

Mobile Device HTML Page - Detect and Redirect

First, the device must be identified so the correct content can be served.

An .htaccess file can be used, or these settings can be placed in httpd.conf (or an included .conf file). This is an Apache 1.3 version, 2.+ may be slightly different.


# Set the MIME type
AddType "application/xhtml+xml;charset=utf-8" .html

# This handles the redirection
RewriteEngine On

# Don't redirect requests for images
RewriteRule \.(gif|jpe?g|png)$ - [L]

# Test for the user agent.  Mozilla is used to indicate a non-mobile device
# A more complex RewriteRule would be required for a production environment
# http://en.wikipedia.org/wiki/List_of_user_agents_for_mobile_phones is a good list
RewriteCond %{HTTP_USER_AGENT} !^Mozilla.*

# Use this page for mobile devices
RewriteRule .* wap.html       [L]

# Otherwise process the request normally

In this case, the page is a very simple page, to let people know that they need to use a browser to visit the page.



<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
    "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type"
                content="application/xhtml+xml;charset=utf-8" />
<meta http-equiv="Cache-Control" content="max-age=86400" />
<title>site.com</title>
<style type="text/css">
body
{
font-family:verdana,arial,sans-serif;
text-align:center;
margin:0 auto;
}
</style>
</head>
<body>
  <h1>Welcome to my.site.com</h1>
  <p><img src="icon64x64.gif" alt="logo" title="logo" height="64" width="64" /></p>
  <p>Please visit my.site.com from a laptop or desktop.</p>
</body>
</html>

Validate the code using the link above to ensure it displays well in most devices.

A different approach, using a .jsp is at: https://core.forge.funambol.org/wiki/HowToMakeAMobileOKPageForThePortal, a similar script could be adapted for PHP and ASP.

Fly High - JetScripts

Cool scripts that are worth buying. The purchase price is far less than the cost of the time you’d have to spend to write them yourself, and, in my case, the code’s much better, too. :)

http://jetscripts.com/sanitizer.htm - This is a much improved version of script that’s been shared and used by many people. It protects your code, data, and server. I’m using this on several systems.

http://jetscripts.com/geotool/ - This script allows you to prevent people from various locations from visiting your site. If your target market is the United States, and you don’t sell to or serve other people, there’s no need to serve pages to the rest of the world. You can customize the interface so the message.

http://jetscripts.com/captcha/ - Most people don’t like CAPTCHA forms - the images are difficult to read, and the code can be bothersome to integrate. This one’s easy to read and easy to work with.

http://jetscripts.com/jetbanners.htm - Awesome. Check it out.

eZ Publish Feedback Form Template

This template makes a feedback form a little easier to use. It sets up the from and the subject out of the submitted content, and puts the message in as text.


{set-block scope=global variable=cache_ttl}0{/set-block}
{set-block scope=global variable=$email_receiver}{$object.data_map.recipient.content}{/set-block}
{foreach $collection.attributes as $a}
{switch match=$a.contentclass_attribute_name}
{case match='Subject'}
{set-block scope=global variable=$subject}[Website] {$a.content|wash}{/set-block}
{/case}
{case match='Message'}
{attribute_result_gui view=info attribute=$a}
{/case}
{case match='Email'}
{set-block scope=global variable=$email_sender}{$a.content|wash}{/set-block}
{/case}
{/switch}
{/foreach}

Be sure to adjust your attribute names if necessary.

Using .htaccess to Report Delivery Time

The question was whether the number of rewrite rules in .htaccess would have a significant impact on performance.

With the following set of rewrite rules:

Options +FollowSymLinks -Indexes
<IfModule mod_php5.c>
        php_value magic_quotes_gpc 0
        php_value magic_quotes_runtime 0
        php_value allow_call_time_pass_reference 0
</IfModule>
DirectoryIndex index.php
<IfModule mod_rewrite.c>
        RewriteEngine On
        RewriteRule ^cms/index\.php/plain_admin$ http://domain.com/admin [R=3
01,L]
        RewriteRule ^cms/index\.php/plain(.*) $1 [R=301,L]
        RewriteRule ^media.* - [L]
        RewriteRule ^custom.* - [L]
        RewriteRule content/treemenu/? /index_treemenu.php [L]
        RewriteRule ^var/[^/]+/cache/public/.* - [L]
        RewriteRule ^var/storage/.* - [L]
        RewriteRule ^var/[^/]+/storage/.* - [L]
        RewriteRule ^var/cache/texttoimage/.* - [L]
        RewriteRule ^var/[^/]+/cache/texttoimage/.* - [L]
        RewriteRule ^design/[^/]+/(stylesheets|images|javascript)/.* - [L]
        RewriteRule ^share/icons/.* - [L]
        RewriteRule ^extension/[^/]+/design/[^/]+/(stylesheets|images|javascripts?)/.* - [L]
        RewriteRule ^packages/styles/.+/(stylesheets|images|javascript)/[^/]+/.* - [L]
        RewriteRule ^packages/styles/.+/thumbnail/.* - [L]
        RewriteRule ^/favicon\.ico - [L]
        RewriteRule ^/robots\.txt - [L]
        # Uncomment the following lines when using popup style debug.
        # RewriteRule ^/var/cache/debug\.html.* - [L]
        # RewriteRule ^/var/[^/]+/cache/debug\.html.* - [L]

        RewriteCond %{HTTP_HOST} ^webdav\..*
        RewriteRule ^(.*) /webdav.php [L]

        RewriteRule .* index.php
</IfModule>

The results were:

Received: t=1267660375832889 Duration: D=273652
Received: t=1267660761803171 Duration: D=297682
Received: t=1267660779066518 Duration: D=272959
Received: t=1267660804103095 Duration: D=292675
Received: t=1267660821137470 Duration: D=256268

This set of rewrite rules:

Options +FollowSymLinks -Indexes
<IfModule mod_php5.c>
        php_value magic_quotes_gpc 0
        php_value magic_quotes_runtime 0
        php_value allow_call_time_pass_reference 0
</IfModule>
DirectoryIndex index.php
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule ^media.* - [L]
RewriteRule ^custom.* - [L]
RewriteRule !(\.(gif|jpe?g?|png|css|swf|mp4|js|html?)|var(.+)storage.pdf(.+)\.pdf)$ index.php
</IfModule>

Yielded these results:

Received: t=1267660624947466 Duration: D=279933
Received: t=1267660660237894 Duration: D=289207
Received: t=1267660681578539 Duration: D=327192
Received: t=1267660701894745 Duration: D=254252
Received: t=1267660719493366 Duration: D=262131

This was a very informal test, just to see if there were any glaring differences, as you can see, the results were reasonably close.