Category Archives: TOS

Almost reaching home stretch..

After our class this past week we discussed were we all lie with the project. We also went over the rest of the timeline for the semester. We only really have 3 classes left  until the semester is over. It is starting to approach real fast and I think it has all of the groups thinking what will the final product look like. I know for the puzzling team we have a working application with a home page that directs you to the puzzle and allows you to restart and go back to the main page. We spoke with Tim on Monday and he has a main screen layout that he is going to give us hopefully soon so we can implement it into our code and then start to get the final touches on it that he wants. The one difficult thing we have been having is getting multiple images to work with this open source code. Our last resort if we cannot get this working is we can have 3 index.html files which would call for that specific image. Good thing the index.html file is rather small so if we need to go to this it should not be a big issue. We hopefully should have some images that Tim wants for our next meeting in class. Once all of theses changes are set we will give Joe the ok to start invoking the color scheme to the puzzle part to the application. I think it is getting to the exciting point seeing it all come to an end and see our final product of all of our hard work put in this semester. 

This week has been slow for improvements besides getting the multple images to work. The layout and home page I have left the way they are now because if Tim is going to be giving a template for us to use that he designed then it sounds best to wait until we have that in our hands before we start making anymore layout UI changes. 

We do not have class this week due to the holiday so hopefully our next meeting we can get everything we need from Tim to get the final touches going on this.

From the blog rwilliams5262 » cs-wsu by rwilliams5262 rwilliams5 and used with permission of the author. All other rights reserved by the author.

Almost reaching home stretch..

After our class this past week we discussed were we all lie with the project. We also went over the rest of the timeline for the semester. We only really have 3 classes left  until the semester is over. It is starting to approach real fast and I think it has all of the groups thinking what will the final product look like. I know for the puzzling team we have a working application with a home page that directs you to the puzzle and allows you to restart and go back to the main page. We spoke with Tim on Monday and he has a main screen layout that he is going to give us hopefully soon so we can implement it into our code and then start to get the final touches on it that he wants. The one difficult thing we have been having is getting multiple images to work with this open source code. Our last resort if we cannot get this working is we can have 3 index.html files which would call for that specific image. Good thing the index.html file is rather small so if we need to go to this it should not be a big issue. We hopefully should have some images that Tim wants for our next meeting in class. Once all of theses changes are set we will give Joe the ok to start invoking the color scheme to the puzzle part to the application. I think it is getting to the exciting point seeing it all come to an end and see our final product of all of our hard work put in this semester. 

This week has been slow for improvements besides getting the multple images to work. The layout and home page I have left the way they are now because if Tim is going to be giving a template for us to use that he designed then it sounds best to wait until we have that in our hands before we start making anymore layout UI changes. 

We do not have class this week due to the holiday so hopefully our next meeting we can get everything we need from Tim to get the final touches going on this.

From the blog rwilliams5262 » cs-wsu by rwilliams5262 rwilliams5 and used with permission of the author. All other rights reserved by the author.

update in articles chapter(light box)4-10-2013

update in articles chapter(light box)

We are almost there for the light box function. After Monday’s meeting, the light box function can works with in the articles in general. And notice the close button has been move to the right-up side of the screen, and I kept the close function working when the user click on anywhere in and outside of the light box. The only thing need to be fixed for the lighte box is the sized of the image. And that could be fixed easily by photoshop or any image software.

From the blog zli1 » cs-wsu by zhengjunli and used with permission of the author. All other rights reserved by the author.

Code Review

This past week didn’t entail much especially since the project seems to be winding down. At this point it is just code review / bug fixes and optimization for the slideshow. We seem to be pretty much done with the slideshow as of now, since James caught the error in why our results didn’t replicate correctly on the server (case sensitive issue). We just need to put in the correct pictures when they come and get the swipe function working and we should be good! That’s my standpoint on this, lets see if the others agree! If not, then updates will be forthcoming.

From the blog CS:401 » CS-WSU by dcarlin2013 and used with permission of the author. All other rights reserved by the author.

A Fly UI

Image

So I spent this weekend buried in my laptop, redesigning my coloring app interface.  Originally, I had a few tool buttons and selection menus on the right hand side of the screen. The canvas for drawing was positioned in the the center of the page and the coloring page selection area was on the far right.   The new design compacts everything on the right hand side of the screen.  That means no more menus that open up over the drawing screen.  In addition to a new interface, I just couldn’t resist adding some new functionality.  I started with undo and redo buttons, then I added clear and finally a spray paint tool which helped to even out the look of the new UI.

Rearranging the UI took a bit of time but it was relatively simple. First, I added color buttons for the featured colors the Worcester Art Museum wants displayed.  Then I resized the size menu and shoved it over to the right.  After that I recoded the coloring page scroll window to be horizontal, shrunk it to size, and sent it to the right.  I rearranged all the buttons into the right side UI including new animated undo, redo, and clear buttons and that was that.  

Undo and Redo were a piece of cake and I have to give full credit to http://www.codicode.com/art/undo_and_redo_to_the_html5_canvas.aspx author Chtiwi Malek.  His methods for handling undo and redo for a drawing app specifically, worked so perfectly, I found it unnecessary to make any modifications other than those necessary to add it to my program.  His solution was to take a snapshot of the screen after each mouse event and then store those images in an array.  Then you can traverse the images in the array using undo and redo.  I am having am issue on the iPad where you have to click the undo and redo buttons twice before they fire.  This does not happen on the computer however and thus far I can find no reason for the problem.  Clear will not only clear the page currently but it will also refresh the undo redo array so you cannot undo clear.  I am debating whether or not it should refresh the array though because hitting clear on accident would not be so good.  After that I decided to tackle spray paint.

Spray paint was actually very easy to implement. You set up two arrays one with width multiples <= 1 and the other with alpha values <= 1. The larger widths have the lighter alpha values and the small widths have the darker values.  It creates the effect of a well faded tip.  However, I found for larger tips you must increase the number of widths you are using or else the different alpha values in the tip will be distinguishable to the eye.  The effect can create a sort of cool pattern but for a spray tool it was undesirable.

I almost forgot, I changed the color wheel to a smaller wheel with no shaded regions.  the color wheel menu is activated by the color palette button.  When activated it takes the place of the original paint colors.  I created a slider bar similar to a volume bar for selecting the shade of the color.  The slider works as far as animation goes but there is no logic for shading or lightening the current color yet.  Work for this week I suppose.

Image

Anyway that just about wraps it up for this week.

Till next time.

Jason

From the blog jasonhintlian » cs-wsu by jasonhintlian and used with permission of the author. All other rights reserved by the author.

Puzzle Layout Changes

I wasn’t able to make it to class this work, but I was able to get all the information from my partners. Tim had come to the class meeting, so that he could tell everyone what he liked and didn’t like in the version that we had sent to him. For the puzzle app, he liked the basic design of it, but was wondering if we could have a cover page with a simple message to the user and then a start button and on that cover page you could choose from two different images that you would like to use in the puzzle. Once you clicked start you could begin the puzzle, restart the puzzle or go back and choose a different image. If you completed the puzzle a box would pop up and say something like congratulations you won!. Seeing the puzzle before hand without the cover letter I thought it looked good but now seeing it with the cover page and the buttons it look a ton better! Its very appealing. We decided to take out the difficulty levels because the hard was just too hard for kids to be playing with. So there is one level and that is easy that way it should only take a kid a couple minutes to complete. The next step is to be able to display the multiple images on the cover page. We have only been able to show one for right now. We finally got the images from Tim this week, so we were able to implement them into the puzzle.

From the blog klentblog » cswsu by klent22 and used with permission of the author. All other rights reserved by the author.

Screen Saver (continues…)

In the class time this week, Tim told us more about how he wanted the screensaver to look like and how it works. Previously, we are asked to create a screensaver with pictures or video; and the screensaver will appear after a fixed amount of idle time. Then, touching the iPad’s screen will lead the user to the home page.

Now, before popping to the home page right after the touch , we were told to add a kind of slideshow/presentation with some pictures and short introducing texts, which will appears after the first touch. The second touch will pop up the home page.

So now, the work of screensaver has 3 parts: 

– making a screen saver appearing after a fixed idle time.

– making a kind of presentation with some pictures and introducing texts appearing right after the touch.

– linking the two parts above together.

The first part seems to be done so far. For this week, we are going to work on the second part.

From the blog daunguyen10&#039;s Blog » CS-WSU by daunguyen10 and used with permission of the author. All other rights reserved by the author.

Update of light box 4-2-2013

Update of light box 4-2-2013

Here is the new update of light box since last week, There is few issues I have make it improved.
The most significant improvement is that my original code would work for multiple pictures. And that gets improved.
Second, I added a close button on the top of the picture in the center.
Third, I added some shadow feature to the light box to make it looks pretty.
So for the rest of the week, hopefully I could meet up with Joe and James and let them add the light box into both article chapter and slide show chapter.

And since my code only work while have the pictures, so I will zip them and e-mail it out.

From the blog zli1 » cs-wsu by zhengjunli and used with permission of the author. All other rights reserved by the author.

Puzzle Layout Changes

Today during class each group got a chance to meet with Tim to discuss the progress of the current section everyone was working on. Tim liked the design so far of the puzzle section but had some ideas to improve on it. We decided it would be best to have a main screen which would have a simple message to the user and show a image of the sculpture broken into pieces. This then would have the user click the start button to begin the puzzle. From there they would complete the sculpture. Once it is finished they are prompted with a alert saying you won! From there they can return back to the main screen or restart the puzzle depending on the button they select. After re coding the design layout and getting everything working, I think this overall feel and look to the puzzle is better to the eye. We decided to take out the hard level difficulty because having so many small pieces would almost be impossible to the user to complete. Now the puzzle has one difficulty level and eventually will have multiple images to select from (Work in Progress…)

Here are 2 screen shots of the latest puzzle application.

Image

 

 

Image

 

Next step will be getting the images for the user to select depending on which one they want to build. If you would like to test this code, it is not up on the development branch yet but is on my user directory on the server.

More to come…

 

http://cstest.worcester.edu/development/rwilliams/newestPuzzle/index.html

 

From the blog rwilliams5262 » cs-wsu by rwilliams5262 rwilliams5 and used with permission of the author. All other rights reserved by the author.

Puzzle Layout Changes

Today during class each group got a chance to meet with Tim to discuss the progress of the current section everyone was working on. Tim liked the design so far of the puzzle section but had some ideas to improve on it. We decided it would be best to have a main screen which would have a simple message to the user and show a image of the sculpture broken into pieces. This then would have the user click the start button to begin the puzzle. From there they would complete the sculpture. Once it is finished they are prompted with a alert saying you won! From there they can return back to the main screen or restart the puzzle depending on the button they select. After re coding the design layout and getting everything working, I think this overall feel and look to the puzzle is better to the eye. We decided to take out the hard level difficulty because having so many small pieces would almost be impossible to the user to complete. Now the puzzle has one difficulty level and eventually will have multiple images to select from (Work in Progress…)

Here are 2 screen shots of the latest puzzle application.

Image

 

 

Image

 

Next step will be getting the images for the user to select depending on which one they want to build. If you would like to test this code, it is not up on the development branch yet but is on my user directory on the server.

More to come…

 

http://cstest.worcester.edu/development/rwilliams/newestPuzzle/index.html

 

From the blog rwilliams5262 » cs-wsu by rwilliams5262 rwilliams5 and used with permission of the author. All other rights reserved by the author.