shopsheep basic

by stofke

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
</head>

<body>
<form>
    <ul id="countrylist" class="align">
        <li>
            <label for="US-country">
                <input name="amazonstore" id="US-country" type="radio" value="com" checked="checked"/>
                <img src="images/small_flag_us.png" width="45" height="35" alt="US-store"/></label>
        </li>
        <li>
            <label for="CA-country">
                <input name="amazonstore" id="CA-country" type="radio" value="ca"/>
                <img src="images/small_flag_ca.png" width="45" height="35" alt="CA-Store"/></label>
        </li>
        <li>
            <label for="UK-country">
                <input name="amazonstore" id="UK-country" type="radio" value="uk"/>
                <img src="images/small_flag_uk.png" width="45" height="35" alt="UK-Store"/></label>
        </li>
        <li>
            <label for="DE-country">
                <input name="amazonstore" id="DE-country" type="radio" value="de"/>
                <img src="images/small_flag_de.png" width="45" height="35" alt="DE-Store"/></label>
        </li>
        <li>
            <label for="FR-country">
                <input name="amazonstore" id="FR-country" type="radio" value="fr"/>
                <img src="images/small_flag_fr.png" width="45" height="35" alt="FR-Store"/></label>
        </li>
        <li>
            <label for="IT-country">
                <input name="amazonstore" id="IT-country" type="radio" value="it"/>
                <img src="images/small_flag_it.png" width="45" height="35" alt="IT-Store"/></label>
        </li>
        <li>
            <label for="JP-country">
                <input name="amazonstore" id="JP-country" type="radio" value="jp"/>
               ...

CSS

.searchSelect{
display:none;
}
#com{
display:inline;
}

JavaScript

$(function() {
    var store = {
        "com"  : {"currency": "$","tag": "09-20"},
        "uk"   : {"currency": "£","tag": "-21"},
        "ca"   : {"currency": "$","tag": "-20"},
        "de"   : {"currency": "€","tag": "-21"},
        "it"   : {"currency": "€","tag": "04-21"},
        "fr"   : {"currency": "€","tag": "0e-21"},
        "jp"   : {"currency": "¥","tag": "-22"}
        };
    var currency = store.com.currency; //defaults = dollar
    $(".countryCurrency").text(currency);
    $("input:radio").click(function() {
        domain   = $(this).val();
        currency = store[domain].currency;
        tag      = store[domain].tag;
        $(".countryCurrency").text(currency);
        $(".searchSelect").hide();
        $('#'+domain).show();
    });
    $("input:text[name='searchTerm']").click(function() {
        $("input:text[name='searchTerm']").val('');
    });    
    $("input[type=range]").change(function() {
        ptcOff   = $(this).val();
        $("#percentOff").text(ptcOff);
    });
    $("input:radio").click(function() {
    }
    $('form').submit( function() {              
          goUrl = 'http://mysite.com/' + $('#keyword').val().toLowerCase();
          window.location = goUrl;
          return false;  // Prevent the default form behaviour
    });                    
});