PyChi - The art of learning Python and Chinese at the same time.
PyChi - It sounds almost like then name of a martial art-form and well, you could call it that, as the purpose of PyChi is to stimulate one of the most dangerous weapons know to man… the brain, in this case my brain, feeling like a rather blunt thing at the inception of this the newest of my many grand schemes.
You see, being married to a fantastic chinese woman, I had always been a bit saddned by going to visit the in laws and the rest of the family in China as my limited vocabulary was good for ordering tea, gum bao jiling and asking for the bill, adding wo shao bu hao jungua hua.
Knowing my humble abilities I figured it was time to something about two things I'd been procrastinating over for quite some time.
Over the course of some months I intended to become relatively proficient in two different languages, and during this process I would attempt to create applications that would help me understand Python as well as learning Chinese.
But wait there was more, for while I would be doing the aforementioned, I would at the same time be making it possible for me to pursue another goal of mine, namely to transform the concepts of an application my brother and I had created in order to help people with aphasia to re-learn word and picture association, into a truly open and multi platform free and open source application written in Python.
(Yes I know my sentences are insanely long at times).
It was a tall order I admit it but being keen on grand plans I decided to embark on an adventure that would take me straight into the fray.
If you my dear reader still haven't lost interest you might at this time find that I have pre-written some of the lower parts of the text, why… well I always liked to predict and think ahead, if events turn out differently I shall correct them as we go along, for while this is about sharing knowledge I am doing this as much for myself as for anyone else to keep track of where I am Py Chi wise - notice that at the end of this project this paragraph might disappear as it if my predictions / pre-writings turn out to be correct will have no relevance at all, and if it turns out wrong the pre-writing will have disappeared and been replaced with the truth, the truth? you can't handle… oh wait back to Py Chi no more digression or explanation.
Beginnings.
I'm quite a visual person and during my period of considering to learn Python I had stumbled across a series of videos on youtube by a user going by the handle thenewboston.
In the tutorials he calls himself bucky roberts, the video's can be seen on youtube. The tutorial names will follow further down, but here's a link to the first tutorial http://www.youtube.com/watch?v=4Mf0h3HphEA , called “Python Programming Tutorial - 1”.
I figured that I'd begin by methodically sitting through all the tutorial sessions he had created in order to assimilate what I could visually about programming in Pyhton before I began my development project.
I had noticed that in the tutorials a really neat and simple IDE was used for Python programming and from browsing the 5 minute tutorial at python.org I was reminded that it was called IDLE, as I had by chance strayed across a video on the python.org site.
Trying to see if it was installed on my system I found that I needed to apt-get it as it was not installed.
But before I did that I figured that I'd find out which version of Python was installed on the machine, as I had noticed while browsing Synaptic Package Manager for anything Python related that my machine had in fact already some Python stuff installed and the 5 minute introduction boasted that it should be installed by default.
The machine was an Ubuntu 10.04 and scouring the web I quickly found the command for checking which version of Python you have installed on your Linux box.
python -V
I'm guessing it will be the same on other operating systems, but I couldn't tell and quite honestly didn't really cared, as I had switched to Linux almost 10 years earlier and have never looked back since.
Anyway seeing that the version was Python 2.6.5 and discovering that IDLE wasn't installed already, I decided to install IDLE for the particular version, I did this using Synaptic the built in package manager, the easiest way to find and install programs for any operating system.
Anyway decided it was time to pour over the videos one by one until I reached the end.
I began on 24/06 - 2010 and ended on 04/07 - 2010.
* EDIT THIS TO EXPLAIN ABOUT TUTORIALS * Completed watching up to: 43 of 43 of the tutorials named Python Programming Tutorial by Youtube user thenewboston by bucky roberts
Completed watching up to: 14 of 14 of the tutorials named wxPython Programming Tutorial by Youtube user thenewboston by bucky roberts
Completed watching up to: 17 of 17 of the tutorials named Game Development Tutorial by Youtube user thenewboston by bucky roberts * EDIT THIS TO EXPLAIN ABOUT TUTORIALS *
So what did I learn from the above lessons, well that Pyhton is quite a flexible language, it combines the best of multiple programming paradigms.
You can work object oriented, but at the same time you have the functional programming aspect available, there is much less typing required than Java, which I love, one should always let the computer work for you and not only by suggesting what has to be typed by predictive typing, but by actually eliminating the need to type.
I mean compare these two.
To print something in java in the console I would have to write the following statement.
class HelloWorld
{
public static void main(String args[])
{
System.out.println("Hello World!");
}
}
Did you notice all the brackets and syntax needed for such a simple operation ?
In IDLE (The Python IDE) to get the same effect I would simply type:
print "Hello World!"
And the IDE would promptly reward me with:
Hello World!
Somthing of a difference eh ?
Python also is able to figure out on its own if I am creating a string or an int.
Creating arrays/lists in JAVA, particularly mixed lists of integers ans strings can be an ardous deal and retrieveing information from them can be a pain.
In Python I can create a list like this:
Question = ['What is a : ',2,'Cat', 'Is it an animal type 1. ','Is it a plant, type 2. ','Is it a machine, type 3']
Here in one simple list I have both the question, the possibilities and the correct answer.
To retrieve the information a simple syntax like this can be used:
print Question[0];print Question[2];print Question[3]; print Question[4]; print Question[5];
That would result in something like this:
What is a : cat Is it an animal type 1. Is it a plant, type 2. Is it a machine, type 3
After this you could add a raw_input for the user to interact with the program and then perform checks to see if the value the user typed was correct etc.
You can check out the flashcard quiz program I'll decribe later in this text to see an implementation of a quiz using randomly selected questions chosen from a pool.
But to get back on track.
After going through the tutorials I felt confident that I was ready to embark on the next part of this adventure i.e. putting the both my ideas into code, as well as utilize the same code to help me practice my chinese.
I definitely had learned a lot from those online presentations. The big question was just, would developing a program in Python be as fast as in JAVA and how much of my thinking could I re-use but before I could begin contemplating using the foundation already laid for the flash cards JAVA version of our old PDS/Xbasic program.
But first I needed doing a little additional groundwork to implement phase two of my PyChi regimen.
The groundwork consisted of translating 900+ words already present in the standard dictionary of our old program.
I decided not to hire someone to do the translation and also to avoid cut and paste as much as possible.
Instead I would manually write the words I wanted translated as I wanted to try to trigger my brain using bodily functions in order to sharpen my abilities to form memories, thus making the translation process a little more challenging.
Yes I fully know cut and paste, or hiring a professional would have speeded up the process a whole lot, but this was not the purpose again, now was it ?
The translation process.
Being that I had to translate nearly 900 words I figured that I could do about 100 each day. This would be tested over a period of XXX days.
100 words per day is quite a lot, so I knew that in order to speed up some of the process in particular regarding creating the dictionary file itself, I figured I might as well work a little smart and create an application that could assist me in building a dictionary file that was correctly formatted to be used for the flashcard trainer as well as other upcoming programs in the development pipeline of The Global Ability Initiative.
I decided to aim at what I refer to as v.2 of the dictionary file format, you can see an example of the style below.
<entry><text>Salt</text> <imagename>shaker.svg</imagename> <soundname>salt.wav</soundname></entry>
Styling each line like this in an XML like syntax, was the suggestion of someone I only know as Davidos who had actually begun working on an android application on behalf of the Global Ability initiative, but had unfortunately been forced to quit in the midst of his efforts, due to the fact that he got a job and was no longer able to do freelance work.
So to assist me in the translation process I decided to create a tiny command line application that would take as parameters, the word or sentences I was typing, along with an image name.
What images you might wonder. Well we have a library of approx 900 images ready and named for each word/sentence in our base dictionaries and while a fully fledged translation interface is planned and mock up's of it do exist, due to personal time constraints, this remained on the todo list (volunteers are most welcome).
The images can be found at: [http://globability.org/wiki/doku.php?id=icon_images_tboard]
However after some experimentation trying to avoid writing the line quitapplication to break the loop, I decided to never mind fiddling about as I kept ending in infinite loops and simply get on with the task. (became quitapp though)
The program did what it was supposed to do anyway, and the need for any further fancy stuff could wait (so much for learning Python, it was time for learning some chinese), but before I skip to the learning chinese part, here's what the translation helper program ended up looking like after being massaged on the way:
print 'Welcome to the translation helper interface'
print 'Welcome to the translation helper interface'
s=''
img=''
originalwordsentence=''
fob=open('./textfile001.txt', 'a')
while 1:
if s=='quitapp':break
s = raw_input('Type word/sentence to be translated here: ')
img = raw_input('Type image number here: ')
originalwordsentence = raw_input('Type english text and number here: ')
fob.write('<entry><text>'+s+'</text><imagename>P'+img+'.png</imagename><soundname>P'+img+'.wav</soundname></entry> Original word/sentence: ' + originalwordsentence + ':\n')
fob.close()
print 'Program terminated'
Let me try to break down what the application does.
The first line is a simple print statement so that the CLI gives an indication of that the program has started.
The following two lines initiate the three strings that you will notice are used later to build our entry sentence.
The line after this creates a so called file object fob opening a file called textfile001.txt, the a is for append, other syntax is read 'r' and write 'w' which would either let your read or write the file in question.
After this a while loop is initiated.
The line after this creates a condition to break out from the loop
The following two lines set the conditions for user input to be obtained from the command line.
Then next line writes what the user has typed to the text file we have opened weaving a text string from regular text and the raw input we have obtained in the previous two lines.
Once the break condition is met the program performs the next line of the code and closes the file object.
The last line prints a message in the CLI that the program has terminated.
The drawback with this program is that it will append a line with the word quitapp in the last line, one could create a parser that would parse the lines of the program and remove said line.
However I decided that I'd first try out a little translation, then I'd consider refining the application.
For the translation work itself I searched for a site that displayed pinyin as this was important for me since I needed to understand Chinese and am at the time of writing unable to read Chinese characters.
I used the following site/s for the practice translation process:
The sites is really nice in that that it has both pinyin and traditional characters and spoken word as well in audio.
I like the former over googles as I do not need to ask for pinyin every time and I'm too lazy to begin fiddling with settings on google to personalize it.
But it was nice to have multiple sites as a cross reference and I can definately recommend using it as a potential source for learning Chinese, that and naturally the application that I have ended up creating in Python.
Begin translation phase on: 05/07 - 2010 End translation phase on: /- 2010
But back to the experience, my goal of 100 words per day was too high, my other goal to minimize cut and paste was also lofty at best, as cutting just those characters in pinyin that I had no clue how to replicate using my keyboard was more confusing that just cutting the entire word and trying to learn it in the process.
After translating just the first 20 words or so I realized what a momentous task it would be for me to finish but hoped I'd be able to do some sprints in the weekend and the upcoming holiday I had ahead.
Translation from English to Chinese
In a valiant attempt I figured I'd be using a windows machine as well, however as usual UTF-8 and Windows are not good friends and it seems Python for windows was default in ascii mode so I ditched the idea of using it directly on windows. Instead I opted to run a Virtual machine on the Windows system that way I could proceed without bothering about the differences and knowing that unicode issues should be fixed in Python 3 I figured it would be a waste of time at this point to bother fiddling with converting back and forth on the Windows system.
My holiday was spent caring for a tremendous toothache and not much work was done, went home again and yeah I admit it, I did not live up to my own plan, work, holidays more work and holidays, what can I say, a minor detour has also led to the creation of the beginnings of a mobile interface i.e an application capable of running on a touchsensitive based on TADA… HTML code to make it as portable as possible.
Before going on let me give a summary of the application.
The concept is simple the application displays a number of clickable icons based on the dictionary files available for the project, when clicked these icons produce a sound, voila instant communication on your mobile, and not just for disabled, you could take the application anywhere in the world and use it to communicate.
The main page of the prototype looks like this (a number of prototypes have gone before it but I'll just list one here so you get the idea, this one does 90% of what I had hoped the prototype could, it just needs to be rendered better sizewise and sound needs to be available on the mobile, it currently works in a browser on a regular computer under Linux (FireFox 3.6.12 / Ubuntu 10.04 “Lucid Lynx”.
I shall gradually update the code so that it becomes more and more functional, I will not list any subpages unless they introduce some functionality that is not included in the main page.
<style>
div.floating-menu {position:fixed;background:#fff4c8;border:1px solid #ffcc00;width:100%;z-index:100;}
div.floating-menu2 {position:fixed;background:#fff4c8;border:1px solid #ffcc00;width:100%;z-index:100;}
</style>
<div class="floating-menu">
<center>
<img style="border: 0px solid" alt="This is an image of an arrow pointing left" title="Image of arrow pointing left" src="images/menuarrow_left.png">
<a href="cph01.html"> <img style="border: 0px solid" alt="Link to chapter 1" title="Chapter 1" src="images/CHPBUT01.png">
<a href="cph02.html"> <img style="border: 0px solid" alt="Link to chapter 2" title="Chapter 2" src="images/CHPBUT02.png">
<a href="cph03.html"> <img style="border: 0px solid" alt="Link to chapter 3" title="Chapter 3" src="images/CHPBUT03.png">
<a href="cph04.html"> <img style="border: 0px solid" alt="Link to chapter 4" title="Chapter 4" src="images/CHPBUT04.png">
<a href="cph05.html"> <img style="border: 0px solid" alt="Link to chapter 5" title="Chapter 5" src="images/CHPBUT05.png">
<a href="cph06.html"> <img style="border: 0px solid" alt="Link to chapter 6" title="Chapter 6" src="images/CHPBUT06.png">
<a href="cph07.html"> <img style="border: 0px solid" alt="Link to chapter 7" title="Chapter 7" src="images/CHPBUT07.png">
<a href="cph08.html"> <img style="border: 0px solid" alt="Link to chapter 8" title="Chapter 8" src="images/CHPBUT08.png"> </a>
<img style="border: 0px solid" alt="This is an image of an arrow pointing left" title="Image of arrow pointing right" src="images/menuarrow_right.png">
</center>
</div>
<!-- Enabling playback of embedded sounds -->
<script>
function GetSound(soundobj) {
var thissound= eval("document."+soundobj);
thissound.Play();
}
</script>
<BR><BR>
<table style="text-align: left; width: 100%;" border="1" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="vertical-align: top;"> <a href="P377.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 0/líng/wú P377.png" title="0/líng/wú" src="images/P377.png"></center></a> </td>
<td style="vertical-align: top;"> <embed src="sound/babyP001.wav" autostart="false" loop="false" hidden = "true" >
<noembed>Sorry, your browser doesn't support the embedding of multimedia.</noembed>
</embed>
<a href src> <center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="Baby" title="Baby" src="images/P001.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="P369.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="Baby" title="This is the image for 2/èr/liǎ P369.png" src="images/P369.png"></center></a></td>
<td style="vertical-align: top;"> <a href="P368.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is P368.png" title="This is the image for 1/yī P368.png" src="images/P368.png"></center></a></td>
<td style="vertical-align: top;"> <a href="./P369.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 2/èr/liǎ P369.png" title="2/èr/liǎ" src="images/P369.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P370.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 3/sān P370.png" title="3/sān" src="images/P370.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P371.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 4/sì P371.png" title="4/sì" src="images/P371.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P372.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 5/wǔ P372.png" title="5/wǔ" src="images/P372.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P373.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 6/liù P373.png" title="6/liù" src="images/P373.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P374.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 7/qī P374.png" title="7/qī" src="images/P374.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P375.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 8/bā P375.png" title="8/bā" src="images/P375.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P376.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for 9/jiǔ P376.png" title="9/jiǔ" src="images/P376.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P346.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for zhī shàng P346.png" title="zhī shàng" src="images/P346.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P358.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for shì gù P358.png" title="shì gù" src="images/P358.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P865.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for huó dòng P865.png" title="huó dòng" src="images/P865.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P865.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fān P865.png" title="fān" src="images/P865.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P709.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for juǎn dài P709.png" title="juǎn dài" src="images/P709.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P564.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for shēn ài P564.png" title="shēn ài" src="images/P564.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P564.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for ài hào P564.png" title="ài hào" src="images/P564.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P876.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for lǎo rén gōng yù P876.png" title="lǎo rén gōng yù" src="images/P876.png"></center></a> </td>
</tr>
<tr>
<td style="vertical-align: top;"> <a href="./P400.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for ào nǎo P400.png" title="ào nǎo" src="images/P400.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P855.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for shēng chù P855.png" title="shēng chù" src="images/P855.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P788.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for dòngwù gōngyuán P788.png" title="dòngwù gōngyuán" src="images/P788.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P213.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fú P213.png" title="fú" src="images/P213.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P777.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yǒu qù P777.png" title="yǒu qù" src="images/P777.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P236.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for jiù hù chē P236.png" title="jiù hù chē" src="images/P236.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P776.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for dān dú P776.png" title="dān dú" src="images/P776.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P233.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fēi jī P233.png" title="fēi jī" src="images/P233.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P413.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fàng xué hòu P413.png" title="fàng xué hòu" src="images/P413.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P413.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yú lè zhōng xīn P413.png" title="yú lè zhōng xīn" src="images/P413.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P210.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for hài pà P210.png" title="hài pà" src="images/P210.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P654.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for sì yuè P654.png" title="sì yuè" src="images/P654.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P436.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for wéi qún P436.png" title="wéi qún" src="images/P436.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P132.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for píng guǒ P132.png" title="píng guǒ" src="images/P132.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P880.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Shuǐzú guǎn P880.png" title="Shuǐzú guǎn" src="images/P880.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P020.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for bì P020.png" title="bì" src="images/P020.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P658.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Bā yuè P658.png" title="Bā yuè" src="images/P658.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P648.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for qiū tiān P648.png" title="qiū tiān" src="images/P648.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P692.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fǔ tóu P692.png" title="fǔ tóu" src="images/P692.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P001.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yīng ér P001.png" title=" yīng ér" src="images/P001.png"></center></a> </td>
</tr>
<tr>
<td style="vertical-align: top;"> <a href="./P688.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Bèibāo P688.png" title=" Bèibāo" src="images/P688.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P734.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for xūn ròu P734.png" title="xūn ròu" src="images/P734.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P432.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for dài P432.png" title="dài" src="images/P432.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P319.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for kǎo P319.png" title="kǎo" src="images/P319.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P727.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for kǎo shuā P727.png" title="kǎo shuā" src="images/P727.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P488.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Hōng kǎo mújù P488.png" title="Hōng kǎo mújù" src="images/P488.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P493.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Kǎo qī bǎn P493.png" title="Kǎo qī bǎn" src="images/P493.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P732.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Kǎo fěn mò P732.png" title="Kǎo fěn mò" src="images/P732.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P470.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Qiú shā xiàn P470.png" title="Qiú shā xiàn" src="images/P470.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P175.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Qiú P175.png" title="Qiú" src="images/P175.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P129.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for xiāng jiāo P129.png" title="xiāng jiāo" src="images/P129.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P280.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for xǐ zǎo P280.png" title=" xǐ zǎo" src="images/P280.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P242.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yù shì P242.png" title=" yù shì" src="images/P242.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P695.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Diànchí P695.png" title="Diànchí" src="images/P695.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P849.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yù shì P849.png" title="yù shì" src="images/P849.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P419.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for hǎi tān P419.png" title="hǎi tān" src="images/P419.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P535.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Xióng P535.png" title="Xióng" src="images/P535.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P759.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for hǎi lí P759.png" title=" hǎi lí" src="images/P759.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P060.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for chuáng P060.png" title="chuáng" src="images/P060.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P243.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for wò shì P243.png" title=" wò shì" src="images/P243.png"></center></a> </td>
</tr>
<tr>
<td style="vertical-align: top;"> <a href="./P536.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Mìfēng/Huángfēng/Wénzi P536.png" title="Mìfēng/Huángfēng/Wénzi" src="images/P536.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P523.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for pí jiǔ P523.png" title=" pí jiǔ" src="images/P523.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P161.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for jiǎ chóng P161.png" title="jiǎ chóng" src="images/P161.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P132.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for píng guǒ P132.png" title="píng guǒ" src="images/P132.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P880.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Shuǐzú guǎn P880.png" title="Shuǐzú guǎn" src="images/P880.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P020.wav<.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for bì P020.png" title="bì" src="images/P020.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P658.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Bā yuè P658.png" title="Bā yuè" src="images/P658.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P648.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for qiū tiān P648.png" title="qiū tiān" src="images/P648.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P692.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for fǔ tóu P692.png" title="fǔ tóu" src="images/P692.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P001.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for yīng ér P001.png" title="yīng ér" src="images/P001.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P688.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Bèibāo P688.png" title="Bèibāo" src="images/P688.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P734.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for xūn ròu P734.png" title="xūn ròu" src="images/P734.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P432.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for dài P432.png" title="dài" src="images/P432.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P319.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for kǎo P319.png" title="kǎo" src="images/P319.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P727.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for kǎo shuā P727.png" title="kǎo shuā" src="images/P727.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P488.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Hōng kǎo mújù P488.png" title="Hōng kǎo mújù" src="images/P488.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P493.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Kǎo qī bǎn P493.png" title="Kǎo qī bǎn" src="images/P493.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P732.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Kǎo fěn mò P732.png" title="Kǎo fěn mò" src="images/P732.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P470.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Qiú shā xiàn P470.png" title="Qiú shā xiàn" src="images/P470.png"></center></a> </td>
<td style="vertical-align: top;"> <a href="./P175.wav.html"><center> <img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Qiú P175.png" title="Qiú" src="images/P175.png"></center></a> </td>
</tr>
</tbody>
</table>
<div class="floating-menu2">
<center>
<a href="about.html"> <img style="border: 0px solid" alt="About" title="About" src="images/ABOUTBUT.png"></a>
<a href="goals.html"> <img style="border: 0px solid" alt="Our goals" title="Our goals" src="images/GOALSBUT.png"> </a>
<a href="http://globability.org/wiki/doku.php?id=general_contact_form"> <img style="border: 0px solid" alt="Join us!" title="Join us!" src="images/JOINUSBUT.png"> </a>
</center>
</div>
The play_soundname.wav.html construction with regards to the images will be replaced by a javascript structure some of which you already see implemented above whcih is looking like this:
<script>
function GetSound(soundobj) {
var thissound= eval("document."+soundobj);
thissound.Play();
}
</script>
<!-- Generate table from below example -->
<embed src="sound/babyP001.wav" autostart=false width=0 height=0 name="sound1"
enablejavascript="true">
<embed src="sound/farP010.wav" autostart=false width=0 height=0 name="P806"
enablejavascript="true">
<!-- Basically do the above for every image when generating the HTML-
create variable based on soundname -->
<!-- Here is an examples for a link with the same properties as an image i.e. will play a sound when hovered over.
<a href="#" onMouseOver="GetSound('sound1')">Move mouse here</A>
Next one uncommented is the same just using an image -->
<PRE>
<UL>
<img src="images/P001.png" onClick="GetSound('sound1')" img style="border: 0px solid ; width: 70px; height: 60px;" alt="This is the image for Baby P0017.png" title="Baby" >
</PRE>
</UL>
<embed src="sound/pigeP002.wav" autostart=false width=0 height=0 name="sound2"
enablejavascript="true">
<PRE>
<UL>
<img src="images/P002.png" onClick="GetSound('sound2')">
</PRE>
</UL>
I just need to generate said code with the parse3.py program listed above after which this section will be removed and the code above replaced with the final code.
For now I'll leave this code to speak for itself as this is not a study into HTML, but I figured that since the development is derived from my quest for mastery of PyChi I need to include it here, I shall if I get time look into giving a walkthrough once finish the PyChi part of the project.
Actually there is more to the above story, I was not supposed to do that part myself, my grand plan was to outsource the work, I had heard of a couple of places Freelancer.com and Vworker.com, I ran a test project on Freelancer with regards to a Checz dictionary that worked out splendidly and I figured I'd try to run fyrst a QT project for the above and then an Android project you can find a complete explanation of the application on http://globability.org/wiki/doku.php?id=mobile_pointing_tablet I might go back and do it as a Python application but for now it stays in the HTML realm which has also forced me to learn some useful stuff in Python.
But the road to me doing it myself was troublesome to say the least, on one page I got a bid from a guy and he developed something like 40% of a finished application before he unfortunately had to drop the project as he got a job, the second guy I got hold of was a complete disaster, apparently he did not bother to read the page above, secondly he kept asking questions that were right before him if he had bothered to read the requirements and in the end he became fresh with me after which I pointed out that we were in an employer employee relationship and pointed out that he had gone far over the agreed deadline and that he should never ever refer to me as dude again. He became so upset that he told me to go bully someone else, I set up arbitration on the page and won.
What I have learned from this is that while it is a possibility to outsource your work you will need to do a great amount of planning before, divide your project into itty bitty parts, I can recommend reading about object oriented analysis and design, a lot of the stuff described in the following two books is pure gold first I'd like to recommend:
<a href="http://www.amazon.co.uk/gp/offer-listing/0077125363?ie=UTF8&tag=einarpetersen-21&linkCode=am2&camp=1634&creative=6738&creativeASIN=0077125363">Object-Oriented Systems Analysis and Design</a><img src="http://www.assoc-amazon.co.uk/e/ir?t=einarpetersen-21&l=as2&o=2&a=0077125363" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
Do put it in the shopping basket immediately and I'll earn a small fee taken out of Amazon's profit on the book, you'd be helping me to continue helping and entertaining you if you do so, do not navigate away before you pressed the icon to add to shopping cart or my ID might be lost.
The second recommendation for you today is:
<a href="http://www.amazon.co.uk/gp/offer-listing/0764549103?ie=UTF8&tag=einarpetersen-21&linkCode=am2&camp=1634&creative=6738&creativeASIN=0764549103">UML Weekend Crash Course</a><img src="http://www.assoc-amazon.co.uk/e/ir?t=einarpetersen-21&l=as2&o=2&a=0764549103" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" />
While it I believe is written before the UML 2.0 specifications came out I still believe it is a worthwile investment.
Okay now it is time for you to ask why am I promoting these two books ?
Sure the money would be nice, I will get a 1 digit % fee of the sales price if you buy it and don't navigate around before you click buy this item, but it so happens I have actually also read both the predecessor to Simon Bennet et 'al's book (i.e. an earlier edition) and have to admit that I absolutely loved the earlier edition which was taught in my Computer Sciences class, if you read this Flemming you are truly a superb teacher!!! However I figured I'd rather recommend a 4'th edition as techniques evolve and even better methods must have surfaced since I went to school a few years ago.
With regards to the weekend crash course, I noticed a fellow student having. I got my hands on it and after reading it I'd say that they two complement each other brilliantly, the weekend course by being a easy to follow introduction giving you a really good overview and the (expensive) book being the thorough detailed journey into object oriented system analysis and design.
So if you want to invest in good knowledge I'd say they are a good buy.
There sales promo done now back to PyChi…
In creating the application whether HTML based or Python based I needed to be able to browse the newly created XML'ish file, I also knew that once I mastered parsing the XML'ish file I could apply the same techniques on the original dictionary files and thus have 9 complete dictionaries updated to reflect the new syntax which makes it possible to create backwards compatibility for future products and even makes it possible for anyone to utilize the newest possible dictionaries if their applications just browse for what is between tags of a specific line and thus populate their applications with data.
But before being able to offer this wonderful backwards compatibility and additional dictionaries as well as the above HTML application I needed to be able to parse the contents of files from disc in furter detail than just reading one line at the time and creating another line, I needed to be able to extract words from within my tags and if I could do this I would subsequently also be able to search for other specifics in a file and create dictionaries from other sources than through the manual translation process already explained earlier in this text.
The parsing program explained:
This program basically reads a dictionary file and in the process parses each line for certain words that it subsequently uses to building a HTML syntax, the code could be done with more beauty, it is crude and ugly to say the least but it does what it is supposed to. Feel free to improve to make more clean and get back to me with the result, if I find it appealing and you are willing to hand it over FOC and with no strings attached I'll be happy to share with others here.
Oh and just a little backpeddling, I have tried to make the code self explanatory using variable names describing what I am doing anf commenting a lot in the code itself so I hope that is enough to make it clear what is happening.
anyfilename = 'textfile001.txt'
f = open(anyfilename,'r')
output = []
newoutput=[]
htmloutput=[]
for line in f:
if '' in line:
output.append(line)
f.close()
'''determine length of list and then set number_of_lines to this value'''
count = 0
number_of_lines = 0
linenumber = 0
for i in output:
count = count+1
'''Now we have the number of lines'''
number_of_lines = count
for i in range(0, number_of_lines):
'''print "gubblegub" '''
'''print output[i] '''
else:
print 'Reading the information into output complete now we should perform string operation'
print " "
print " "
'''First assignment clean output for anything after : in each line'''
print "Innerloop beginning, finding all instances of ':'"
for i in range(0, number_of_lines):
search = '</entry>'
output[i].find(search)
index = output[i].find(search)
'''print search, "found at index", index'''
'''Now we cut the end of every sentence of output'''
cut_text_from_string=output[i][13:index]
print ' \n'
print cut_text_from_string
if '' in line:
newoutput.append(cut_text_from_string)
print 'We have now removed all heading text and trailing text after the ":" '
print "innerloop 2 complete and we can begin stripping down further in order to build our HTML"
'''
actual_imagefilename - Is the primary variable to find as most of the latter variables will depend upon it, this we
read from within the tags <imagename> ??? </imagename> of the line in question, once we have that we are ready to move
on
'''
for i in range(0, number_of_lines):
search = '<soundname>'
newoutput[i].find(search)
index = newoutput[i].find(search)
print search, "found at index", index
indexvalue1=int(index)
print indexvalue1
actual_soundfilename = newoutput[i][indexvalue1+11:indexvalue1+11+8]
print actual_soundfilename
'''create sentence for soundplayback script'''
soundplayback = '<embed src="sound/'+actual_soundfilename+'" autostart=false width=0 height=0 name="' + actual_soundfilename[:4] + '" enablejavascript="true">'
print "This is the soundplayback / embed sentencegeneration" + soundplayback
'''Use actual_soundfilename to create the_HTML_playbackname_for_an_image '''
the_HTML_playbackname_for_an_image = actual_soundfilename + '.html'
print the_HTML_playbackname_for_an_image
search2 = '</text>'
newoutput[i].find(search2)
index = newoutput[i].find(search2)
print search2, "found at index", index
indexvalue2=int(index)
print indexvalue2
an_alternate_title_for_the_image_for_HTML_purposes = newoutput[i][:indexvalue2]
print an_alternate_title_for_the_image_for_HTML_purposes
the_title_of_the_image = an_alternate_title_for_the_image_for_HTML_purposes
print the_title_of_the_image + 'Is the text displayed on a mouseover'
search3 = '</imagename>'
newoutput[i].find(search3)
index = newoutput[i].find(search3)
print search3, "found at index", index
indexvalue3=int(index)
print indexvalue3
actual_imagefilename = newoutput[i][indexvalue3-8:indexvalue3]
print actual_imagefilename
an_alternate_title_for_the_image_for_HTML_purposes = 'This is the image for ' + an_alternate_title_for_the_image_for_HTML_purposes + ' ' + actual_imagefilename
print an_alternate_title_for_the_image_for_HTML_purposes
'''if condition needed for number so that 0 is padded before'''
generatedHTMLstring = soundplayback + ' <PRE> <UL> <td style="vertical-align: top;"> <center> <img src="images/'+ actual_imagefilename +'" onClick="GetSound(\''+actual_imagefilename[:4]+'\')" img style="border: 0px solid ; width: 70px; height: 60px;" alt="' +an_alternate_title_for_the_image_for_HTML_purposes + ' title="' + the_title_of_the_image + '" src="images/' + actual_imagefilename + '"></center> </PRE> </UL> </td>'
print generatedHTMLstring
htmloutput.append(generatedHTMLstring+'\n')
anyfilename2 = 'htmltablefile001.txt'
fob2 = open(anyfilename2,'w')
fob2.writelines(htmloutput)
fob2.close()
print "Hallo der"
'''Open fob for HTML in append mode'''
'''Write values of our HTML code to fob'''
'''Close the fob'''
You will notice a lot of print statements, these are completely unnecessary however printing variables as you go along can help you keep an overview of what is happening, comment all of the print sentences out for speed optimization. And like I said feel free to improve and share as long as you do not hinder others to do the same.
A modification of this program will also enable the swift creation of XML'ish styled dictionary files for our flashcard quiz program from all the dictionaries available already, which would be a tremendous boon as there are 8 or nine of them available already and in turn those can be turned into HTML for the mobile pointing tablet application so even if it was a detour it has been worth the delay.
The code below is to be used to popuate a list of filenames that will be associated with the danish dictionary where the lines are built like this:
Sometext someimagename.spr
or like this:
Sometext someimagename.pcx
or like this:
Sometext someimagename.pcx sonesoundfilename.wav
os.listdir ('/home/ep/data/data20100509/globability/xtrajava_n_more/soundbites_dk/')
WARNING PREDICTIVE WRITING!!!!!!
Some of these things I have done
Having translated the standard dictionary I turned to my better half to proof read my translation attempt, however wanting to do this cleverly as well I had to design another application, the proofreader.
The application is quite simple actually, it parses through the text one entry at the time, displays the image, displays the Chinese text and finally the English text. The interface has an OK button and an empty text field for entering text.
If no text is entered and user presses OK the application goes to the next line.
If new text is entered, the application writes that new text into the string in the correct place and then goes to the next line.
The application also saves a file summarizing the corrections and on which line the corrections were made. The application also counts how many lines it has parsed through.
This enables the user to start the application and say yes to skip to where the application last quit when the application starts as it checks the summary so that the user does not have to skip through work already checked.
While the dictionary was being checked I could begin phase 3, the creation of an application that would allow me to use the dictionary I had just finished building to actually practice the Chinese language. I would also be able to reuse parts of what I had learned from designing the proofreader application using it as part of the trainer.
PREDICTIVE WRITING ENDS!!!!!!
Building the application.
As I said earlier I had already covered a lot of ground in the program design I'd done for the JAVA application so I had an idea of what was needed to get things off the ground. Furthermore I had created a little code already for the former two applications made during the translation phase so I was good to go.
I decided on a simplistic approach, an application that read it's data from a text file, in a new meta format I had “developed” in order to make parsing easier for an application programmer that was to make a so called sound board program for the Android platform for my dearest FOSS project The Global Ability Initiative.
The aforementioned XML style approach being suggested by someone I only know by the name Dantevios, whom I met on a forum and was originally supposed to assist The Global Ability Initiative to build the aforementioned Android application.
I did not choose a database driven application as I wanted to first create a text based application as I could use this to create a better foundation for a database driven application and people without too fancy computer setup's would be able to participate in the translation efforts and running the program created even if they did not know how or have the resources to have a DB running in the background.
For sound am relying on good old SoX which I have done in the Java version as well, I do this because I know that will make it work on at least Linux and on several Windows platforms as well, possibly also on others as well as OSX.
SoX ?
SoX, is what the project home page calls the Swiss Army knife of sound processing programs. It is a command line utility able to handle an insane amount of sound formats as well as manipulate them.
For me the choice was obvious as sound implementation in Java had been a pain until I came across SoX which my brother had chosen earlier as well for our early applications and it would not require any additional plug in's or libraries for Python which I was in the process of learning.
Those interested in SoX can go to http://sox.sourceforge.net/Docs/Features to learn more, I will not go into the many features and formats of SoX, as I believe it is quite redundant for me to repeat what is said elsewhere.
Design
Classes, in my early iteration of the semi abandoned Java project I had tried to create an overview of classes that would be needed for the program to work.
LIST CLASSES HERE - Write overview
As earlier mentioned I didn't want to go all the way to a database implementation so I decided on just writing the text parsing version of the program, this would also enable me to use said text parser as a data exchange tool in case people wanted to exchange data in text form rather than using databases etc.
I will go over each class and try to explain how I'm thinking the application ought to look using the MVC “pattern” (MVC = Model View Controller).
