{"author_name":"jpverkamp","cat":"LD #30","comments":[],"epoch":1408839840,"likes":0,"metadata":{"p_key":"27555","p_author":"jpverkamp","p_authorkey":"19702","p_urlkey":"62999","p_title":"24 hours in\u2026 we have a game!","p_cat":"LD #30","p_event":"LD30","p_time":"1408839840","p_likes":"0","p_comments":"0","p_status":"UPD5","us_key":"19702","us_name":"jpverkamp","us_username":"jpverkamp","event_start":"1408665600","event_key":"24","event_name":"LD30"},"text":"<p>24 hours in, and we&#8217;ve actually turned it into a game. Using some nice HTML tricks to layer everything correctly, we now have an options screen:<\/p>\n <p><a href=\"http:\/\/www.ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/options.png\"><img class=\"alignnone size-medium wp-image-379929\" src=\"http:\/\/www.ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/options-300x200.png\" alt=\"options\" width=\"300\" height=\"200\" srcset=\"http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/options-300x200.png 300w, http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/options-550x367.png 550w, http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/options.png 599w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n <p>It&#8217;ll fade in and out as you want.\u00a0When you actually start playing,\u00a0all of the instructions fade out:<\/p>\n <p><img class=\"alignnone size-medium wp-image-379928\" src=\"http:\/\/www.ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/in-game-2-300x199.png\" alt=\"in-game-2\" width=\"300\" height=\"199\" srcset=\"http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/in-game-2-300x199.png 300w, http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/in-game-2-550x365.png 550w, http:\/\/ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/in-game-2.png 597w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/p>\n <p>I actually had to spend a few hours re-factoring here too, unfortunately. Originally, I had everything as &#8216;threaded&#8217; as JavaScript can get, with setTimeout chains for each tile, along with for controls. Unfortunately, I was getting a bit of an issue with synchronization, so I had to make it single threaded. Amusingly, that&#8217;s a bit harder in JavaScript, but it worked out for the best.<\/p>\n <p>And then at the end, I spent a few hours making the scoring look nice.\u00a0You can&#8217;t see it here, but there&#8217;s a nice animation running from the bottom to\u00a0the top of each player counting up the total\u00a0types of sand.\u00a0At the moment, the overall most sand wins, but I&#8217;m probably going to play with that.<\/p>\n <p><a href=\"http:\/\/www.ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/scoring-in-progress.png\"><img class=\"alignnone size-medium wp-image-379930\" src=\"http:\/\/www.ludumdare.com\/compo\/wp-content\/uploads\/2014\/08\/scoring-in-progress-300x199.png\" alt=\"scoring-in-progress\" width=\"300\" height=\"199\" \/><\/a><\/p>\n <p>And that&#8217;s it. It&#8217;s going pretty well.<\/p>\n <p>For a full demo and the rest of\u00a0the write up (along with a <strong>fully playable demo!)<\/strong>, check out\u00a0the full length post on my blog: <a href=\"http:\/\/blog.jverkamp.com\/2014\/08\/23\/ludum-dare-30-24-hours\/\">Ludum Dare 30: 24 hours @ jverkamp.com<\/a>.<\/p>","time":"August 23rd, 2014 7:24 pm","title":"24 hours in\u2026 we have a game!"}