ga-wdi-exercises / project1

[project] GA- Project 1
3 stars 75 forks source link

Not Urgent #230

Closed MaxKaye closed 8 years ago

MaxKaye commented 8 years ago

I have completed the assignment by making my flashcards functional- however I know there have ways to make my code a lot more simple using less reused knowledge (e.g. current code is inline because had trouble linking external style sheets). I would like to learn how to re-express and reorganize what I currently have into a more object-oriented approach.

I have tried a few other ways of creating the same solution but nothing else is working.

jshawl commented 8 years ago

can you post a link to your repo here and identify the lines you want to optimize?

MaxKaye commented 8 years ago

http://github.com/MaxKaye/project1/blob/master/flashcard.html

  1. lines 75 - 283: essentially I had to repeat a bunch of the same code to do two task: translate chinese character to english word or pinyin. I wrote a new function and new chunk of input for each flashcard. Instead, it would be visually better if there was two chunk of code and two functions taking into account all the flashcards. Does this make sense?
  2. Tailing on the same logic, I have two buttons for each translation. One click of "translate" button translates Chinese to English, and one click of "refresh" button returns translation to initial state. I would like to just have one button that incorporates both functionalities instead of two.
RobertAKARobin commented 8 years ago

I see what you mean! How about something like this, eliminating the need to copy and paste everything a zillion times:

var myCharacters = [
  {english: "hello", chinese: "你好", pronounce: "ni3hao3"}
];
myCharacters.forEach(function(character){
  var myText = document.createElement("INPUT");
  var translate = document.createElement("BUTTON");
  myText.value = character.chinese;
  button.addEventListener("click", function(){
    alert(character.english);
  });
});
MaxKaye commented 8 years ago

Thank you- this works AND exposes all the other structural problems in my code