{"id":2283,"date":"2019-12-12T22:27:20","date_gmt":"2019-12-13T03:27:20","guid":{"rendered":"https:\/\/dems.asc.ohio-state.edu\/?p=2283"},"modified":"2019-12-12T22:27:20","modified_gmt":"2019-12-13T03:27:20","slug":"cycle-2-droidco-interface-development","status":"publish","type":"post","link":"https:\/\/dems.asc.ohio-state.edu\/?p=2283","title":{"rendered":"Cycle 2 &#8211; DroidCo. Interface Development"},"content":{"rendered":"\n<p>For cycle two, I finished the development of the OSC interface for DroidCo. The interface consisted of a set of buttons that sent keywords to Isadora which would then be used to generate the virtual code for each team&#8217;s droid to run.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"576\" height=\"1024\" src=\"https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-576x1024.jpeg\" alt=\"\" class=\"wp-image-2284\" srcset=\"https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-576x1024.jpeg 576w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-169x300.jpeg 169w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-768x1365.jpeg 768w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-864x1536.jpeg 864w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1-1152x2048.jpeg 1152w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_9729B501CD2A-1.jpeg 1242w\" sizes=\"auto, (max-width: 576px) 100vw, 576px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"576\" height=\"1024\" src=\"https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-576x1024.jpeg\" alt=\"\" class=\"wp-image-2285\" srcset=\"https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-576x1024.jpeg 576w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-169x300.jpeg 169w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-768x1365.jpeg 768w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-864x1536.jpeg 864w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1-1152x2048.jpeg 1152w, https:\/\/dems.asc.ohio-state.edu\/wp-content\/uploads\/2019\/12\/IMG_78EB469B41CB-1.jpeg 1242w\" sizes=\"auto, (max-width: 576px) 100vw, 576px\" \/><\/figure>\n\n\n\n<p>The interface (available in both an iPhone\/iPod version and iPad version) consisted of two pages. The first contained the END command to complete code blocks, IF and WHILE to create conditional blocks, action keywords to trigger turn actions, and a delete button to remove lines of code. The second page contained all the conditionals that would be used with the IF and WHILE blocks.<\/p>\n\n\n\n<p>To process these OSC inputs, I created a String builder javascript program. This program takes the next OSC input and adds it to a code string (the string the compiler from cycle 1 uses to create the virtual code) and a display string that shows the user their code (with proper indentation). Below is the code for this program.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>function main(){\n\tvar codeString = arguments&#91;0];\n\tvar displayString = arguments&#91;1];\n\tvar next = arguments&#91;2];\n\tvar ends = arguments&#91;3];\n\tvar i;\n\tswitch(next){\n\t\tcase \"END \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tends = ends - 1;\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"IF\":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tends = ends + 1;\n\t\t\tbreak;\n\t\tcase \"WHILE\":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tends = ends + 1;\n\t\t\tbreak;\n\t\tcase \"move \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"turn-left \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"turn-right \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"skip \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"hack \":\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tfor (i = 0; i &lt; ends; i++){\n\t\t\t\tdisplayString = displayString.concat(\"\\t\");\n\t\t\t}\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\tcase \"back\":\n\t\t\tif(codeString != \"BEGIN \"){\n\t\t\t\tif(codeString.substring(codeString.length - 4) == \"END \"){\n\t\t\t\t\tends = ends + 1;\n\t\t\t\t}\n\t\t\t\tcodeString = codeString.substring(0, codeString.lastIndexOf(\" \"));\n\t\t\t\tcodeString = codeString.substring(0, codeString.lastIndexOf(\" \")+1);\n\t\t\t\tdisplayString = displayString.substring(0, displayString.lastIndexOf(\" \"));\n\t\t\t\tdisplayString = displayString.substring(0, displayString.lastIndexOf(\" \")+2);\n\t\t\t}\n\t\t\tbreak;\n\t\tdefault:\n\t\t\tcodeString = codeString.concat(next);\n\t\t\tdisplayString = displayString.concat(next);\n\t\t\tdisplayString = displayString.concat(\"\\n\");\n\t\t\tbreak;\n\t\t}\t\n\tvar ret = new Array(codeString, displayString, ends);\n\treturn ret;\n}<\/code><\/pre>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>For cycle two, I finished the development of the OSC interface for DroidCo. The interface consisted of a set of buttons that sent keywords to Isadora which would then be used to generate the virtual code for each team&#8217;s droid to run. The interface (available in both an iPhone\/iPod version and iPad version) consisted of [&hellip;]<\/p>\n","protected":false},"author":44,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2283","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/posts\/2283","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/users\/44"}],"replies":[{"embeddable":true,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2283"}],"version-history":[{"count":1,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/posts\/2283\/revisions"}],"predecessor-version":[{"id":2288,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=\/wp\/v2\/posts\/2283\/revisions\/2288"}],"wp:attachment":[{"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2283"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2283"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/dems.asc.ohio-state.edu\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2283"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}