eBay Language-Script

Discussions that just won't fit
Post a reply

eBay Language-Script

Postby Jelenoczka on Wed Jun 17, 2009 4:59 pm

Hey guys,

I've been working on a simple JavaScript that makes it possible to switch between different languages in eBay auctions.

As you know eBay does not allow MooTools, so I think this is an Off-Topic.


Here is the source code:

Line number On/Off | Expand/Contract | Select all
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <!DOCTYPE html
  4.     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  5.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  6.  
  7. <html dir="ltr" lang="de" xml:lang="de" xmlns="http://www.w3.org/1999/xhtml">
  8.     <head>
  9.         <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  10.         <title>Language Script</title>
  11.         <style type="text/css">
  12.             <!--
  13.  
  14.                 /* General */
  15.  
  16.                 #wrapper {
  17.                     margin: 0 auto;
  18.                     width: 976px
  19.                 }
  20.  
  21.                 #wrapper .de, #wrapper .en {
  22.                     display: none;
  23.                     visibility: hidden
  24.                 }
  25.  
  26.                 #wrapper.german .de, #wrapper.english .en {
  27.                     display: block;
  28.                     visibility: visible
  29.                 }
  30.  
  31.             -->
  32.         </style>
  33.         <script type="text/javascript">
  34.             <!--
  35.  
  36.                 /* <![CDATA[ */
  37.  
  38.                     function choose(language) {
  39.                         var contents = document.getElementById('wrapper');
  40.                         var searchbar = document.getElementById('searchbar');
  41.                         if (language.options[0].selected) {
  42.                             contents.className = 'german';
  43.                             searchbar.value = 'Artikel suchen ...';
  44.                             searchbar.onfocus = function() {
  45.                                 if (this.value == 'Artikel suchen ...') this.value = '';
  46.                             }
  47.                             searchbar.onblur = function() {
  48.                                 if (this.value == '') this.value = 'Artikel suchen ...';
  49.                             }
  50.                         } else if (language.options[1].selected) {
  51.                             contents.className = 'english';
  52.                             searchbar.value = 'Search item ...';
  53.                             searchbar.onfocus = function() {
  54.                                 if (this.value == 'Search item ...') this.value = '';
  55.                             }
  56.                             searchbar.onblur = function() {
  57.                                 if (this.value == '') this.value = 'Search item ...';
  58.                             }
  59.                         }
  60.                     }
  61.  
  62.                 /* ]]>
  63. */
  64.  
  65.             //-->
  66.         </script>
  67.     </head>
  68.     <body>
  69.         <div id="wrapper" class="german">
  70.             <div id="top">
  71.                 <div>
  72.                     <p class="de">
  73.                         Sprache:
  74.                     </p>
  75.                     <p class="en">
  76.                         Language:
  77.                     </p>
  78.                     <form method="post" action="">
  79.                         <p>
  80.                             <select name="language" onchange="choose(this)">
  81.                                 <option selected="selected">Deutsch</option>
  82.                                 <option>English</option>
  83.                             </select>
  84.                         </p>
  85.                     </form>
  86.                     <hr />
  87.                     <form method="get" action="http://shop.ebay.de/merchant/puristi">
  88.                         <p>
  89.                             <input id="searchbar" name="_nkw" type="text" value="Artikel suchen ..."
  90.                                 onblur="if (this.value == '') this.value = 'Artikel suchen ...';"
  91.                                 onfocus="if (this.value == 'Artikel suchen ...') this.value = '';" />
  92.                             <input type="submit" />
  93.                         </p>
  94.                     </form>
  95.                 </div>
  96.             </div>
  97.         </div>
  98.     </body>
  99. </html>


I want to ask you now, whether you find any better ways to change the search-textfield value content language including the onblur and onfocus function. At the moment, there are 2 functions for each language which make the onblur and onfocus effect possible but if I added a third language it would need 2 more functions and so on. I think that would require a lot of code... Maybe too much of code? \":roll:\"

Line number On/Off | Expand/Contract | Select all
  1. /* <![CDATA[ */
  2.  
  3.     function choose(language) {
  4.         var contents = document.getElementById('wrapper');
  5.         var searchbar = document.getElementById('searchbar');
  6.         if (language.options[0].selected) {
  7.             contents.className = 'german';
  8.             searchbar.value = 'Artikel suchen ...';
  9.             searchbar.onfocus = function() {
  10.                 if (this.value == 'Artikel suchen ...') this.value = '';
  11.             }
  12.             searchbar.onblur = function() {
  13.                 if (this.value == '') this.value = 'Artikel suchen ...';
  14.             }
  15.         } else if (language.options[1].selected) {
  16.             contents.className = 'english';
  17.             searchbar.value = 'Search item ...';
  18.             searchbar.onfocus = function() {
  19.                 if (this.value == 'Search item ...') this.value = '';
  20.             }
  21.             searchbar.onblur = function() {
  22.                 if (this.value == '') this.value = 'Search item ...';
  23.             }
  24.         }
  25.     }
  26.  
  27. /* ]]> */

Line number On/Off | Expand/Contract | Select all
  1. <input id="searchbar" name="_nkw" type="text" value="Artikel suchen ..."
  2.     onblur="if (this.value == '') this.value = 'Artikel suchen ...';"
  3.     onfocus="if (this.value == 'Artikel suchen ...') this.value = '';" />

Does anyone know how to change the value, onblur and onfocus in a smaller solution as in mine? :cry:

Thank you very much! :oops:
Jelenoczka
 
Posts: 11
Joined: Wed Jun 03, 2009 5:31 pm
Top

Re: eBay Language-Script

Postby sugarfree on Fri Jun 19, 2009 10:49 am

Hi Jelenoczka,
what about this:
Line number On/Off | Expand/Contract | Select all
  1.     function choose(language) {
  2.         var contents = document.getElementById('wrapper');
  3.         var searchbar = document.getElementById('searchbar');
  4.         var lang=[{klass:'german',searchbartext:'Artikel suchen ...'},{klass:'english',searchbartext:'Search item ...'}];
  5.         for(var i=0;i<lang.length;i++){
  6.             for(attr in lang[i]){
  7.                 if (language.options[i].selected) {
  8.                     contents.className = lang[i].klass;
  9.                     searchbar.value = lang[i].searchbartext;
  10.                     searchbar.onfocus = function() {
  11.                         if (this.value == lang[i].searchbartext) this.value = '';
  12.                     }
  13.                     searchbar.onblur = function() {
  14.                         if (this.value == '') this.value = lang[i].searchbartext;
  15.                     }
  16.                 }
  17.             }
  18.         }
  19.     }
?
sugarfree
mootools enthusiast
 
Posts: 182
Joined: Wed Mar 04, 2009 8:18 pm
Location: Poland
Top

Re: eBay Language-Script

Postby Jelenoczka on Fri Jun 19, 2009 1:35 pm

sugarfree wrote:Hi Jelenoczka,
what about this: [...]

Hey, that looks nice! :P

Line number On/Off | Expand/Contract | Select all
  1. function choose(language) {
  2.     var contents = document.getElementById('wrapper');
  3.     var searchbar = document.getElementById('searchbar');
  4.     var lang=[{klass:'german',searchbartext:'Artikel suchen ...'},{klass:'english',searchbartext:'Search item ...'}];
  5.     for(var i=0;i<lang.length;i++){
  6.         for(attr in lang[i]){
  7.             if (language.options[i].selected) {
  8.                 contents.className = lang[i].klass;
  9.                 searchbar.value = lang[i].searchbartext;
  10.             }
  11.         }
  12.     }
  13. }


That part works fine but the onblur and onfocus functions make errors...
lang[i] is undefined
Jelenoczka
 
Posts: 11
Joined: Wed Jun 03, 2009 5:31 pm
Top
Post a reply

Return to Off-Topic

Who is online

Users browsing this forum: No registered users and 1 guest

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
phpBB SEO