{"id":108,"date":"2020-10-17T09:35:39","date_gmt":"2020-10-17T09:35:39","guid":{"rendered":"http:\/\/course.ece.cmu.edu\/~ece500\/projects\/f20-teamb1\/?p=108"},"modified":"2020-10-19T06:27:45","modified_gmt":"2020-10-19T06:27:45","slug":"yuhan-xiaos-status-update-for-10-17","status":"publish","type":"post","link":"http:\/\/course.ece.cmu.edu\/~ece500\/projects\/f20-teamb1\/2020\/10\/17\/yuhan-xiaos-status-update-for-10-17\/","title":{"rendered":"Yuhan Xiao\u2019s Status Update for 10\/17"},"content":{"rendered":"

I set up an EC2 instance and prepared it for web app deployment.<\/p>\n

I worked on web app frontend and made UI for user to set time and choose from a list of ringtones. Feel free to try it out here<\/a> (note this might be updated to display new UI next week).\u00a0If you clicks on the ringtone name, it plays a short ringtone that is defined by an array of notes, and each note consists of pitch and duration. I\u00a0 implemented a “fast selecting” feature(user can choose “weekdays” to auto-select all five weekdays, and vice versa) which is also pretty neat.<\/p>\n

I wrote a short script for Pi to communicate with the web app on EC2 instance and receives sample ringtone data.<\/p>\n

I also worked on some portions of design review report(overall & subsystem architecture, etc).<\/p>\n

Other work I did:<\/p>\n

    \n
  1. I looked into using AWS Amplify(versus EC2) as a choice of hosting the web app. It can allow me to deploy and publish my web app every time I update it using one console command. However in the end, I decided against it because I am not sure if and how to implement the alarm scheduling using Amplify (2) it requires using GraphQL and DynamoDB which I am less familiar with, hence longer time to ramp up.<\/li>\n
  2. I checked out Typescript as a possible option for frontend framework language, and ultimately decided it is not worth since the frontend framework I chose lacks documentation for Typescript.<\/li>\n
  3. I decided on Ant Design as the frontend framework since it covers all UI widgets I would need.<\/li>\n
  4. I looked at a few node packages for playing audio from midi files. I realized I had some misunderstanding about what midi is and how some of the “midi player” packages work. In the end I decided to use a different package for playing audio than I previously planned.\n
      \n
    1. I used this for playing audio by specifying notes:\u00a0https:\/\/www.npmjs.com\/package\/soundfont-player\n
        \n
      1. It is a lighter version of\u00a0https:\/\/github.com\/gleitz\/midi-js-soundfonts<\/li>\n
      2. I was gonna use\u00a0https:\/\/github.com\/grimmdude\/MidiPlayerJS but it turns out it just translate a midi file into a sequence of json data, but not play the audio<\/li>\n
      3. I was gonna use sample-player package but decided other packages have a bigger user base<\/li>\n<\/ol>\n<\/li>\n<\/ol>\n<\/li>\n
      4. I realized the user might not want to create a new ringtone every time they set an alarm, so I made a new page that is not previously on the mockup for design presentation for users to make ringtones and then the ringtones will be updated on create alarm page.<\/li>\n<\/ol>\n

        Currently on schedule. My own updated timeline (before integration) is as follows:<\/p>\n