Development notes

A piggy bank of commands, fixes, succinct reviews, some mini articles and technical opinions from a (mostly) Perl developer.

Jump to

Quick reference

Showing posts with label html. Show all posts
Showing posts with label html. Show all posts

Web developer browser plugins

Chrome:
  • Chrome itself doesn't require admin privileges to install
  • Chrome has dev tools built in - type F12 and select a tab e.g. Network, or right-click on the page and choose 'Inspect element'
  • chrome://net-internals/
  • Web developer plugin
  • Modify headers
Internet Explorer:
  • Internet Explorer should be installed by default
  • It has some dev tools built in - type F12 and then:
    • Menu: Find | Select element by click
    • Menu: Cache | View cookie information
    • Tab: Script | Console
    • Tab: Network (IE9 and later) | Go to detailed view | Double-click an item for headers and cookies
Standalone:
Non-GUI:
  • curl -D -
  • wget -S

Labels: , , , , , , , , , ,

HTML::FormHandler example

package My::Form;

extends 'HTML::FormHandler';

has_field "age" (
    label => "Type",
    required => 0,
    type => 'Integer',
);

____________________________________________________________

package My::Handler;

my $form = My::Form->new;

if ($form->validated) {

    # validate form
    $form->process( params => $c->req->query_params );
    my @errors = $form->errors;
    alert("Error: $_") foreach @errors;

    my $age = $form->field('age')->value;
    $logger->info("User entered age $age");

    # build page
    $c->stash->{age} = $age;
}

Labels: , , ,

Allow PRE text to wrap on Confluence wiki


Add this to the wiki code:


{html}
<style type="text/css">
/* Allow PRE elements to wrap --- better than manually adding ad-hoc
 * linebreaks because
 * (a) It's automatic
 * (b) It adapts to the window width
 * (c) People can still copy-and-paste from the browser window and get the
 * original long lines
 */
pre {
 white-space: pre-wrap; /* css-3 */
 white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
 white-space: -pre-wrap; /* Opera 4-6 */
 white-space: -o-pre-wrap; /* Opera 7 */
 word-wrap: break-word; /* Internet Explorer 5.5+ */
}
</style>
{html}

Thanks duckbill


Labels: , , , , ,

Web scraping with Ruby

In order of goodness:

  • Nokogiri
  • Hpricot
  • Scrapi
Labels: , , ,

Prevent spammers from harvesting your email address

When you write your email address on a web page, use &#64; instead of @, and &#46; instead of the dot.
That way, most email harvesting programs won't recognise it.

Here's a method using Javascript that should stop 100% of email harvesting programs.

However, just using a web contact form would work best.

Labels: , , , , ,

Have vi detect perl mason .html files

In ~/.vim/ftdetect/mason.vim:

" Mason detection
au BufRead,BufNewFile *
\   if search('^\s*<%\(args\|once\|init\|perl\|shared\|attr\)>\s*$','n')
\|    set filetype=mason
\|  endif
Labels: , , ,

Don't display dynamic elements until page has loaded

<head>
<script type="text/javascript">

function getRefToDiv(divID,oDoc) {
if( document.getElementById ) {
return document.getElementById(divID); }
if( document.all ) {
return document.all[divID]; }
if( !oDoc ) { oDoc = document; }
if( document.layers ) {
if( oDoc.layers[divID] ) { return oDoc.layers[divID]; } else {
//repeatedly run through all child layers
for( var x = 0, y; !y && x < oDoc.layers.length; x++ ) {
//on success, return that layer, else return nothing
y = getRefToDiv(divID,oDoc.layers[x].document); }
return y; } }
return false;
}

function toggleDiv(divID_as_a_string,action) {
//get a reference as above ...
myReference = getRefToDiv(divID_as_a_string);
if( !myReference ) {
//window.alert('Nothing works in this browser');
return; //don't go any further
}
//now we have a reference to it
if( myReference.style ) {
//DOM & proprietary DOM
if (action == 'on') {
myReference.style.visibility = 'visible';
} else {
myReference.style.visibility = 'hidden';
}
} else {
//layers syntax
if (action == 'on') {
myReference.visibility = 'show';
} else {
myReference.visibility = 'hide';
}
}
}

function start() {
toggleDiv('slider','on');
}

window.onload = start;
&lt/script>
</head>

<body>
<div id="slider" style="visibility: hidden">
</body>
Labels: , ,

Basic Javascript 

if( document.getElementById ){
 var myReference = document.getElementById('divID');
}
Labels: , , ,

Nested comments

Are your comments disappearing when you wrap them with a <xsl:comment> tag?

They may already be inside a comment.
Labels: , , ,

Apache error "premature EOF in parsed file"

When Apache 1.3 says "premature EOF in parsed file".
What it means is "You've messed up the attribute syntax in a mod_include command".

Examples:

<!--#config timefmt=%s --> (no quotes)

<!--#set var='title' value='This title would've screwed things up' --> (apostrophe not escaped)
Labels: , , , , ,

Scanning HTML

Screen scraping with HTML::TreeBuilder:

my $real_h1 = $tree->look_down(
    '_tag', 'h1',
    sub {
        my $link = $_[0]->look_down('_tag','a');
        return 1 unless $link; # no link means it's fine
        return 0 if $link->attr('href') =~ m{/dyna/}; # a link to there is bad
        return 1; # otherwise okay
    }
);

Labels: , , ,
Subscribe to: Posts (Atom)