Yet another code for Pig Latin converter

@flyboynmNov 14.2011

I have to convert english to pig latin for an assignment. I am having trouble with my code.

The assignment is that I have 2 separated functions on a page – one that does an individual word only and the other that will convert a whole phrase.

What am I doing wrong here? I am getting error messages but I cannot figure them out. I guess I have banged my head against the wall too many times to count over this code.

Here is my code so far:

<html>
<head>
<script type=”text/javascript” src=”convert.js”>
</script>
</head>
<body>
<body style=”background-color:silver”>
<b>Enter the word that you want to convert to Pig Latin:</b> <input id=”src” type=”text” name=”src”>
<p>
<input type=”button” value=”Translation” onClick=”Piglatin();>
<p>
<p>
<b>Gets you this in Pig Latin:</b>
<input id=”src” type=”text” name=”src”>
<p>
<p>
<p>
<hr />
<b>Enter phrase you want to translate into Pig Latin:</b> <input id=”src1″ type=”text” name=”src”>
<p>
<p>
<p>
<input type=”button” value=”Translation” onClick=”Piglat2();”>
<p>
<p>
<b>The phrase in Pig Latin is:</b> <input id=”src1″ type=”text” name=”dest1″>
<p>
<input value=”Clear Text” onclick=”ClearText()” type=”button”>
<p>
</body>
</html>

The convert.js is this:

to post a comment

JavaScript

26 Comments(s) _↴

@JMRKERNov 14.2011 — #Several problems to fix first.

1. Several extra { } pairs.

2. Non-unique id assignments. ID values MUST be unique.

3. Not fatal, but several name values of 'src'. Gets me confused as to which you are referring to.

4. No ClearText() function

BTW: You should put your script between [ code] and [ /code] tags (without the spaces)

to make it easier to view your code attempts.

You could shorten your "isLetter(ch)" function like this

<i>
 </i>function isLetter(ch) {
 ch = ch.toLowerCase();
 var ret = false;
 if ( (ch == 'a') || (ch == 'e') || (ch == 'i') || (ch == 'o') || (ch == 'u') ) {
 ret = true;
 }
 return ret;
 }

You should also check the error console if you are using FF or Chrome browser for development purposes.

@flyboynmauthorNov 14.2011 — #I really appreciate this help. It has been a really bad day....

@Logic_AliNov 15.2011 — #Why don't they teach students to use the error console?

Why do you need separate fields to translate one word or a phrase?

I had never heard of Pig Latin before, but as a matter of interest does this meet the spec?

&lt;!DOCTYPE HTML&gt;
 &lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;Pig Latin Translator&lt;/title&gt;
 &lt;/head&gt;
 &lt;body style="background-color:silver"&gt;
 &lt;form action='#'&gt;
 &lt;b&gt;Enter phrase you want to translate to Pig Latin:&lt;/b&gt;&lt;br&gt; 
 &lt;input type="text" name="userInput" size='60'&gt;
 &lt;p&gt;
 &lt;p&gt;
 &lt;p&gt;
 &lt;input type="button" value="Translation"  onClick="dest1.value=Piglat( userInput.value );"&gt;
 &lt;p&gt;
 &lt;p&gt;
 &lt;b&gt;The phrase in Pig Latin is:&lt;/b&gt;&lt;br&gt; 
 &lt;input type="text" name="dest1" size='60'&gt;
 &lt;p&gt;
 &lt;input value="Clear Text" onclick="userInput.value=dest1.value=''" type="button"&gt;
 &lt;/form&gt;
 &lt;script type="text/javascript"&gt;
 
 function Piglat( str )
 {
 var plStr = "", 
 re=/(s*)([aeiou]*)([b-df-hj-np-tv-z]*)([a-z]+)/ig,
 result;
 
 while( result = re.exec( str ) )
 plStr += result[ 1 ] + result[ 2 ] + result[ 4 ] + result [ 3 ] + 'ay'; 
 
 return plStr;  <br/>
 }
 
 &lt;/script&gt;
 &lt;/body&gt;
 &lt;/html&gt;

@flyboynmauthorNov 15.2011 — #1, I was using both Chrome and Firefox error consoles and just couldn't figure out the problem. I am new to all programming - not just js.

2, I have a bad headache from banging my head against a wall. I am DEFINITELY not a programmer.

I am working on a new, simpler code. Maybe it will work this time but probably not knowing my luck.

New code so far:

[SIZE="2"]

<HTML>

<HEAD>

<SCRIPT TYPE="TEXT/JAVASCRIPT" src="convert.js">

</SCRIPT>

</HEAD>

<BODY>

<FORM ACTION="#" NAME="conv">

Enter what you wish to convert to Pig Latin:<input type="text" id="english" size="5" value="" />

<input type="button" name="translate" value="Translate" onclick="

getElementById('answerbox').innerHTML= convert(

document.getElementById('english').value

);"

/>



<BR>

This is what it is in Pig Latin:<INPUT TYPE=TEXT NAME="piglatin">

</FORM>

<hr />

</BODY>

</HTML> [/QUOTE][/SIZE]
The .js file:

[SIZE="2"]function convert() {

var word = document.conv.english.value.split (" ")

output = ""

for (i = 0; i < word.length; i++) {

thisword = word [i]

output = output + thisword.substring (1, thisword.length) + thisword.substring(0,1) + "way "

}

document.conv.piglatin.value = output

}

[/QUOTE][/SIZE]

As you can see, I am having a problem with the innerHTML section and haven't even attempted to figure out how to make it so it does an individual word and then a separate function for a phrase. The plan for that is to use the <hr /> to separate the sections and use a 2nd function for below it.

Feel free to provide any suggestions/feedback. I appreciate it!

*heads back to bang his head against a wall*

@JunkMaleNov 15.2011 — #or

[CODE]function isLetter(ch) {
 ch = ch.toUpperCase();
 return ( (ch == 'A') || (ch == 'E') || (ch == 'I') || (ch == 'O') || (ch == 'U') ) || false;
 }[/CODE]

and I'm sure some smarty will have an even shorter RegExp version

I would also note that it is best to avoid using variables that are also methods or properties of an element like src. You might be better naming things with meaningful names like : -

destObj = document.getElementById("dest");

destObj.value = srcData;

in your code you have

[CODE]{
 document.getElementById("dest").value = dest;
 }[/CODE]

which wouldn't work if the script is loaded in the head of the HTML because the script is parsed and the interpreter sees that this is part of the main body script, executes it and its a gamble that the object exists at the time of JS making the call.

So I would stick all those elements in to an onload event that initializes those elements when the document page has loaded.

[CODE]function init(){
 // do stuff like set up the object Refs.
 dataSrc1 = document.getElementsById("src1") || false;
 dataSrc2 = document.getElementsById("src2") || false;
 //... etc,
 }
 window.onload = init;[/CODE]

However... if you already have an onload event, this would write over the function that is to be called. So you would need to move that element to the init function or stack them in the body tag onload="someExistingFunc(); init();"

This :- [code=html]<input value="Clear Text" onclick="ClearText()" type="button">[/code] would be better as a plain old "Reset" button which would do the same thing as the ClearText() function.

@Logic_AliNov 15.2011 — #or

function isLetter(ch) {
 ch = ch.toUpperCase();
 return ( (ch == 'A') || (ch == 'E') || (ch == 'I') || (ch == 'O') || (ch == 'U') ) || false;
 }

and I'm sure some smarty will have an even shorter RegExp version[/quote]You can shorten it without resorting to regex. (It should be called isVowel)

function isVowel( ch ) 
 {
 return 'aeiou'.indexOf( ch.toLowerCase() ) &gt; -1 ;
 }

@Logic_AliNov 15.2011 — #

function convert() {
 
 var word = document.conv.english.value.split (" ")
 output = ""
 for (i = 0; i &lt; word.length; i++) {
 thisword = word [i]
 output = output + thisword.substring (1, thisword.length) + thisword.substring(0,1) + "way "
 }
 document.conv.piglatin.value = output
 }

[/quote]As I understand it, Pig Latin involves transferring the first group of consonants to the end of the word then appending 'ay' or similar.

Your algorithm seems to be moving the first letter to the end regardless of what it is.

@flyboynmauthorNov 15.2011 — #Thank you all for your input. I am working on fixing this code now and see where I can go from here. So far so good. The latest issue for me is "uncaught syntaxerror: Unexpected end of input" according to Chrome. I will figure it out. ?

At least I am trying and NOT asking you to do the coding for me. I have got myself into this mess of a program and need to figure it out on my own.

Any suggestions as to how to search for all the extra {} that I have in there? Earlier I was told that I had unneeded ones and cannot see them for myself. I have used notepad++ to try to show the elements that it does but it is Greek to me.

On a side note, does anyone know of a program that will do this javascript for me if I just think of what I want it to do? You know, like Scotty said in the movies "Computer, override all commands from the Borg". ?

@JunkMaleNov 15.2011 — #Having looked in to this, http://en.wikipedia.org/wiki/Pig_Latin seems to be pretty reliable on the "rules" and has other similar "obfuscation" methods of communication.

Seems that vowels dont change but consonants do.

in the examples, omputer-cay = computer.

This I might sounds much like that guy who made an entire career talking gibberish. If you can master talking this stuff fluently then you got a good party piece.

@flyboynmauthorNov 15.2011 — #LOL.

I got the syntaxerror fixed so I am now tackling the invalid XML attribute values.

As for pig latin, I do not want to hear it, know it or even think of it again after this assignment!

I would shoot the guy at the party that tried to use this %@##$@ language with me - just like I am tempted to shoot my computer with my work on this code.

@JMRKERNov 15.2011 — #...

Any suggestions as to how to search for all the extra {} that I have in there? Earlier I was told that I had unneeded ones and cannot see them for myself. I have used notepad++ to try to show the elements that it does but it is Greek to me.

...[/QUOTE]

From your original attempt of post #1 (unchanged except for formatting) ...

[COLOR="Red"]Extra '{' and '( )' in RED[/COLOR]

[COLOR="Lime"]Needed '}' in GREEN[/COLOR]

Easier to spot if you indent the blocks of statements logically.

<i>
 </i>function isLetter(ch) {
 var ret = false;
 if (
 (ch == 'a') || (ch == 'A') ||
 (ch == 'e') || (ch == 'E') ||
 (ch == 'i') || (ch == 'I') ||
 (ch == 'o') || (ch == 'O') ||
 (ch == 'u') || (ch == 'U')
 ) { ret = true; }
 [COLOR="Red"]{[/COLOR]
 return[COLOR="Red"]([/COLOR]ret[COLOR="Red"])[/COLOR];
 }
 
 function Piglatin() {
 var dest = "";
 var src = document.getElementById("src").value;
 if (isVowel(src.charAt(0))) {
 dest = src + "way";
 } else {
 var startLet = "";
 while (!isVowel(src.charAt(0)) &amp;&amp; src.length &gt; 0) {
 startLet = startLet + src.charAt(0);
 src = src.substring(1,src.length);
 }
 dest = src + startLet + "way";
 }
 [COLOR="Red"]{
 [/COLOR]  document.getElementById("dest").value = dest;
 }
 
 function Piglat2() {
 var dest1 = "";
 var src1 = document.getElementById("src1").value;
 if (isLetter(src1.charAt(0))) {
 dest1 = src1 + "way";
 } else {
 var startLet = "";
 while (!isLetter(src1.charAt(0)) &amp;&amp; src.length &gt; 0) {
 startLet = startLet + src1.charAt(0);
 src1 = src1.substring(1,src.length);
 }
 dest1 = src + startLet + "way";
 } 
 [COLOR="Lime"]}
 [/COLOR]

@flyboynmauthorNov 16.2011 — #Almost there! Could you look at the below code and tell me where I am going wrong? Feel free to suggest anything that you wish. Once I get this correct, I am going to do it to work on a sentence instead of a word ?

code for html:

<html>

<head>

<title> Pig Latin </title>

<script type="text/javascript" src="attempt.js">

</script>

</head>

<body>

<form name="PigForm">

Enter a word: <input type="text" name="single" value="" />

<br /><br />

<input type="button" name="translate" value="translate" onclick="

getElementById('answerbox').innerHTML= PigLatin(

document.getElementById('single').value);"

/>

<br /><br />

In Pig Latin: <i

<div style='text-align:center' id="answerbox" ></div>

</form>

<hr />

</body>

</html>

Js

function PigLatin(word)

{

var index;

index = word.search(/[aeiouAEIOU]/);
respond if (index <= 0) {

word + "way";

}

else {

word.substring(index, word.length) + word.substring(0,index) + "ay";

return respond

}

}

@Logic_AliNov 16.2011 — #

function PigLatin(word) 
 { 
 var index; 
 
 <i>    </i>  index = word.search(/[aeiouAEIOU]/); /* Simpler to use the i flag: /[aeiou]/i */
 respond      if (index &lt;= 0) { [COLOR=Red]/*Where is 'respond' defined? It has no effect here */[/COLOR]
 word + "way"; /* this line has no effect */
 } 
 else { 
 word.substring(index, word.length) + word.substring(0,index) + "ay"; [COLOR=Red] /* This line has no effect */[/COLOR]
 return respond      [COLOR=Red]/* 'respond' has no value assigned to it in this function */[/COLOR]
 } 
 }

[/quote]This function does nothing.

@flyboynmauthorNov 16.2011 — #Okay, I feel stupid. I want to change this code up so that it will come back in the body of the html and not in a text box. I figured putting in the respond where I did would cause the code to show the answer to teh conversion at the bottom of the page under Translated....

Suggested method?

js file

function Latin(word)

{

var index;

index = word.search(/[aeiouAEIOU]/);

if (index <= 0) {

return word + "way";

}

else {

return word.substring(index, word.length) + word.substring(0,index) + "ay";

}

}

html

<body>

<form name="PigForm">

Enter a word: <input type="text" name="word" size=40 value="" />

<br /><br />

<input type="button" value="Translate to Pig Latin"

onClick="document.PigForm.pigWord.value =

Latin(document.PigForm.word.value);" />

<br /><br />

In Pig Latin: <input type="text" name="pigWord" size=40 value="" />

</form>

</body>

</html>

@JMRKERNov 16.2011 — #Once you have the conversion from a word to piglatin,

the conversion of several words (phrase or sentence) is very easy...

<i>
 </i>&lt;html&gt;
 &lt;head&gt;
 &lt;title&gt; PigLatin Converter &lt;/title&gt;
 &lt;script type="text/javascript"&gt;
 function LatinWord(word) {
 var index;
 index = word.search(/[aeiouAEIOU]/);
 if (index &lt;= 0) { return word + "way"; }
 else { return word.substring(index, word.length) + word.substring(0,index) + "ay"; }
 }
 function LatinPhrase(phrase){
 var str = '';
 var tarr = phrase.split(' ');
 for (var i=0; i&lt;tarr.length; ++i) {  str += LatinWord(tarr[i])+' '; }
 return str;
 }
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 &lt;form name="PigForm" onsubmit="return false"&gt;
 Enter a word:&lt;br /&gt; &lt;input type="text" name="word" size=40 value="" /&gt;
 &lt;p /&gt;
 &lt;input type="button" value="Translate to Pig Latin"
 onClick="document.PigForm.pigWord.value=LatinWord(document.PigForm.word.value);" /&gt;
 &lt;p /&gt;
 In Pig Latin:&lt;br /&gt; &lt;input type="text" name="pigWord" size=40 value="" /&gt;
 &lt;p /&gt;
 
 &lt;hr&gt;
 &lt;p /&gt;
 Enter a phrase/sentence:&lt;br /&gt; &lt;input type="text" name="phrase" size=40 value="" /&gt;
 &lt;p /&gt;
 &lt;input type="button" value="Translate to Pig Latin"
 onClick="document.PigForm.pigPhrase.value=LatinPhrase(document.PigForm.phrase.value);" /&gt;
 &lt;p /&gt;
 In Pig Latin:&lt;br /&gt; &lt;input type="text" name="pigPhrase" size=40 value="" /&gt;
 
 &lt;/form&gt;
 &lt;/body&gt;
 &lt;/html&gt;

BTW: Remember to use [ code] and [ /code] tags (without the spaces) around your script to make it easier to read

and keep the format (indentations) more manageable.

@Logic_AliNov 16.2011 — #In post #6 I defined translation into Pig Latin. Does this match exactly what you are required to do, and if not what is required?

@flyboynmauthorNov 16.2011 — #Thank you for the help. As you can see, I am writing code but just need help tweaking it. The directions are as follows:

[I]If a word contains no vowels or begins with a vowel, the characters “way” are appended to the end of the word. Thus the word nth is translated as “nthway” in PigLatin, and apple is translated as “appleway”.

If a word begins with a consonant, its initial sequence of consonants is shifted to the end of the word and followed by “ay”. Thus, the word banana is translated as “ananabay” in PigLatin, and cherryI is translated as “errychay”.

You should create a text file named Latin.js and then define a function named PigLatin that takes a string as input and returns the PigLatin translation. For example, the call PigLatin (‘oops&#8217? should return ‘oopsway’, whereas PigLatin (‘foo&#8217? should return ‘oofay’. Insert this function definition into your.js library file. Then create a webpage named LastnameFirstname_P5.html in which the user can enter a word in a text box and click a button to see the PigLatin translation onto the screen or in a textarea. Put instructions onto this part of the page so that it instructs the user t o enter a word for translation.

This part of your page will only accept single words.[/I]

My code is this for the function:

function Isword(word)

{

if (word.search(" ") == -1) {

return "word";

}

else {

return "phrase";

}

}

function PigLatin(word) 
  { 
   var index; 
 
   if (IsWord(word) == "phrase") { 
   return "Please enter a single word." 
   } 
   else { 
   index = word.search(/[aeiouAEIOU]/); 
   if (index <= 0) { 
   return word + "way"; 
   } 
   else { 
   return word.substring(index, word.length) + word.substring(0,index) + ay; 
   } 
   }

}

I figured once I have this it will be easy to convert to innerHTML strings. Is that right?

@JunkMaleNov 17.2011 — #PigLatin is "ay" appended and up to two consonants can be shifted .... upidstay

@flyboynmauthorNov 18.2011 — #I am happy to say that I am now only working on ascetics of the page. Here is my code:

html:

<html>

<head>

<title> English to Pig Latin Translater </title>

<script type="text/javascript" src="convert.js">

</script>

</head>

<body style="background-color:lightblue;">

<form name="oink" onsubmit="return false">

<b>Enter a word:</b>

<p>

<input type="text" name="the_word" size=40 value="" />

<p>

<input type="button" value="Translate this word"

onClick="document.oink.pig.value=latin(document.oink.the_word.value);" />

<p>

<p>

<b>In Pig Latin:</b><br /> <input type="text" name="pig" size=40 value=""/>

<hr />

<hr />

<p>

<p>

<b>Enter a phrase/sentence:</b><br /> <input type="text" name="phrase" size=100 value="" />

<p>

<input type="button" value="Translate this phrase/sentence into Pig Latin"

onClick="document.oink.piggy.value=sent(document.oink.phrase.value);" />

<p>

<p>

<p>

<b>In Pig Latin:</b>

<p>

<input type="text" name="piggy" size=100 value="" />

<p>

<p>

</form>

</body>

</html>

.js

// Thanks to https://webdeveloper.com/ for the input on what I was getting right and wrong.

function Word(the_word) {

var idx;

idx = the_word.search(/[aeiouAEIOU]/);

if (idx <= 0) { return the_word + "way"; }

else {

return the_word.substring(idx, the_word.length) + the_word.substring(0,idx) + "way";

//

}

}

function sent(phrase){

var str = '';

var tarr = phrase.split(' ');

for (var i=0; i<tarr.length; ++i) { str += Word(tarr[i])+' '; }

return str;

}

function latin(the_word)

{

var idx;

if (class_word(the_word) == "phrase") {

return "Please enter a single word.";

}

else {

idx = the_word.search(/[aeiouAEIOU]/);

if (idx <= 0) {

return word + "way";

}

else {

return the_word.substring(idx, the_word.length) + the_word.substring(0,idx) + "way";

}

}

}

function class_word(the_word)

{

if (the_word.search(" ") == -1) {

return "word";

}

else {

return "phrase";

}

}

Thank you all for your help! Next I need to find a picture of a pig to put as the background but that is a VERY minor thing to do.

@flyboynmauthorNov 18.2011 — #PigLatin is "ay" appended and up to two consonants can be shifted .... upidstay[/QUOTE]

You may know that. I know that BUT the professor wants it that way.

upidstway ?

@JunkMaleNov 18.2011 — #Well the professor is upidsaty then.

@flyboynmauthorNov 18.2011 — #LOL, exactly.

My newest program is going to drive me nuts. I am going to get my basics going before I ask for suggestions. Let's just say that I have to figure out if a certain amount of various bars of metals would fit in a Mini Cooper and if it would weigh too much for the car. This assignment is based on the movie "The Italian Job."

I am looking forward to this assignment in some ways....

@JunkMaleNov 18.2011 — #Here is a tip that was indicated earlier... Indentation.

Nesting of loops and segments helps people follow the flow of programming and its easily readable and debugging is simpler.

@flyboynmauthorNov 18.2011 — #Unfortunately, it is indented on the one in notepad ++ but when I do a copy and paste, it loses formatting for some reason.

Can you suggest any "better" programs for programming? I currently use UltraEdit, Notepad ++ with Chrome and Firefox's error consoles.

@JunkMaleNov 18.2011 — #Well, I use NP++ too and Dreamweaver and Notepad.

Perhaps its to do with character setting.

As for tools, its more a case of what fits you, some people can not use certain layouts for example in Windows Office 2010 like 2007 they use the Ribbon which I hate personally and had the menus related to earlier versions, then possibly I would have taken a shine to it. So editor wise, its personal choice.

Indentation on this site is a case of pad it with spaces.

@flyboynmauthorNov 18.2011 — #Yes, I know about spacing. I have a plugin for notepad++ that formats it for me. Javascript plugin(?) is the name of it, I think. I am not on my laptop I do coding otherwise I would be able to tell you.

I really appreciate all the tips I have gotten from this site. It has opened my mind to other things that I hadn't thought of before.

Also in #JavaScript _↴

An idea to crate my personal webpage, but how?Javascript event to detect browser close help needed on a direction for a new script

Success!

Help @flyboynm spread the word by sharing this article on Twitter...

Tweet This

Yet another code for Pig Latin converter

26 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Yet another code for Pig Latin converter

26 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

26 Comments(s) _↴

Also in #JavaScript _↴