+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Assignment/HW4_Soundcloud/main.js b/Assignment/HW4_Soundcloud/main.js
new file mode 100644
index 0000000..bf2665c
--- /dev/null
+++ b/Assignment/HW4_Soundcloud/main.js
@@ -0,0 +1,132 @@
+//created by Robin Oh
+
+// Event hander for calling the SoundCloud API using the user's search query
+function callAPI(query) {
+ $.get("https://api.soundcloud.com/tracks?client_id=b3179c0738764e846066975c2571aebb",
+ {'q': query,
+ 'limit': '200'},
+ function(data) {
+ // PUT IN YOUR CODE HERE TO PROCESS THE SOUNDCLOUD API'S RESPONSE OBJECT
+ // HINT: CREATE A SEPARATE FUNCTION AND CALL IT HERE
+ display_20(data)
+ },'json'
+ );
+}
+
+// 'Play' button event handler - play the track in the Stratus player
+function changeTrack(url) {
+ // Remove any existing instances of the Stratus player
+ $('#stratus').remove();
+
+ // Create a new Stratus player using the clicked song's permalink URL
+ $.stratus({
+ key: "b3179c0738764e846066975c2571aebb",
+ auto_play: true,
+ align: "bottom",
+ links: url
+ });
+}
+
+
+//clicking on the search bar
+$(document).ready(
+ $("#search_button").on('click', function() {
+ get_search()
+ })
+ );
+
+//pressing enter on the search funtion
+$('#search_bar').bind("enterKey",function(e){
+ get_search()
+});
+
+//pressing enter on the search funtion
+$('#search_bar').keyup(function(e){
+ if(e.keyCode == 13)
+ {
+ $(this).trigger("enterKey");
+ }
+});
+
+//get variable from the search bar, clears existing
+function get_search(){
+ var user_input = $("#search_bar").val();
+ $("#search_bar").val('');
+ callAPI(user_input)
+}
+
+//display the first 20 got from soundcloud api
+function display_20(dick){
+
+ $("#search_body").empty();
+
+ for(var i=0;i<20; i++){
+ var artist = dick[i].artist;
+ var title = dick[i].title;
+ var image = dick[i].artwork_url;
+ var permalink = dick[i].permalink_url;
+ if(image == null){
+ if(i%2==0){
+ image = "https://store-images.s-microsoft.com/image/apps.62807.9007199266242506.1b72c6b3-a4b4-4841-b9f2-f45f38b18c8f.fd6d73e9-8feb-4c96-bb77-84bd32fac8c2?w=96&h=96&q=60"
+ } else{
+ image="OhLogo.png"
+ }
+ }
+ //creates play button and add to playlist button
+ $('#search_body').append("
\
+
" + title + "
\
+
\
+
\
+
\
+
")
+ }
+}
+
+//when clicked on play button, plays the song
+$("table").on('click', '.play', function() {
+ var url = (this).getAttribute("data-url")
+ changeTrack(url)
+})
+
+
+//when clicked on add to list button, adds to the playlist
+$("#displayed_search").on('click', '.add', function() {
+ var copy = $(this).parent().parent().clone();
+
+ // changes the plus sign to minus sign
+ var to_change= $(copy).find("span").eq(1)
+ $(to_change).removeClass('glyphicon-plus').addClass('glyphicon-minus')
+
+ //add up and down button
+ $(copy).append("
")
+
+ $(copy).append("
")
+
+
+ $('#playlist').prepend(copy)
+
+})
+
+//remove song from playlist
+$("#playlist").on('click', '.add', function() {
+ $(this).parent().parent().remove();
+})
+
+//Make the songs go up one in the playlist
+$("#playlist").on('click', '.up', function() {
+ $(this).parent().parent().insertBefore($(this).parent().parent().prev());
+})
+
+//Make the songs go down one in the playlist
+$("#playlist").on('click', '.down', function() {
+ $(this).parent().parent().insertAfter($(this).parent().parent().next());
+})
\ No newline at end of file
diff --git a/Assignment/HW4_Soundcloud/startercode_HW4_skeleton.js b/Assignment/HW4_Soundcloud/startercode_HW4_skeleton.js
index dbd277e..cb2804f 100644
--- a/Assignment/HW4_Soundcloud/startercode_HW4_skeleton.js
+++ b/Assignment/HW4_Soundcloud/startercode_HW4_skeleton.js
@@ -1,22 +1,24 @@
+//created by Robin Oh
+
// Event hander for calling the SoundCloud API using the user's search query
function callAPI(query) {
- $.get("https://api.soundcloud.com/tracks?client_id=b3179c0738764e846066975c2571aebb",
- {'q': query,
- 'limit': '200'},
- function(data) {
- // PUT IN YOUR CODE HERE TO PROCESS THE SOUNDCLOUD API'S RESPONSE OBJECT
- // HINT: CREATE A SEPARATE FUNCTION AND CALL IT HERE
- },'json'
- );
+ $.get("https://api.soundcloud.com/tracks?client_id=b3179c0738764e846066975c2571aebb",
+ {'q': query,
+ 'limit': '200'},
+ function(data) {
+ // PUT IN YOUR CODE HERE TO PROCESS THE SOUNDCLOUD API'S RESPONSE OBJECT
+ // HINT: CREATE A SEPARATE FUNCTION AND CALL IT HERE
+ },'json'
+ );
}
// 'Play' button event handler - play the track in the Stratus player
function changeTrack(url) {
- // Remove any existing instances of the Stratus player
- $('#stratus').remove();
+ // Remove any existing instances of the Stratus player
+ $('#stratus').remove();
- // Create a new Stratus player using the clicked song's permalink URL
- $.stratus({
+ // Create a new Stratus player using the clicked song's permalink URL
+ $.stratus({
key: "b3179c0738764e846066975c2571aebb",
auto_play: true,
align: "bottom",
@@ -25,3 +27,15 @@ function changeTrack(url) {
}
+$(document).ready(
+ $("#search_button").on('click', function() {
+ // once the document loads, create new item with this function
+ var user_input = $("#search_bar").val();
+ console.log(user_input)
+
+ })
+);
+
+
+
+
diff --git a/Assignment/HW4_Soundcloud/style.css b/Assignment/HW4_Soundcloud/style.css
new file mode 100644
index 0000000..e69de29
diff --git a/Assignment/Homework_1 - HTML/area.html b/Assignment/Homework_1 - HTML/area.html
new file mode 100644
index 0000000..62e25ad
--- /dev/null
+++ b/Assignment/Homework_1 - HTML/area.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Assignment/Homework_1 - HTML/map.html b/Assignment/Homework_1 - HTML/map.html
new file mode 100644
index 0000000..9b470a7
--- /dev/null
+++ b/Assignment/Homework_1 - HTML/map.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Assignment/Homework_1 - HTML/test.html b/Assignment/Homework_1 - HTML/test.html
new file mode 100644
index 0000000..e69de29
diff --git a/Assignment/test1.css b/Assignment/test1.css
new file mode 100644
index 0000000..e69de29
diff --git a/Labs/flasklab2/flaskLab2/.spyderworkspace b/Labs/flasklab2/flaskLab2/.spyderworkspace
new file mode 100644
index 0000000..be24de3
Binary files /dev/null and b/Labs/flasklab2/flaskLab2/.spyderworkspace differ
diff --git a/Labs/flasklab2/flaskLab2/app/__init__.py b/Labs/flasklab2/flaskLab2/app/__init__.py
new file mode 100644
index 0000000..9a4e940
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/__init__.py
@@ -0,0 +1,4 @@
+from flask import Flask
+
+myapp = Flask(__name__)
+from app import views
diff --git a/Labs/flasklab2/flaskLab2/app/__init__.pyc b/Labs/flasklab2/flaskLab2/app/__init__.pyc
new file mode 100644
index 0000000..4d4e5ad
Binary files /dev/null and b/Labs/flasklab2/flaskLab2/app/__init__.pyc differ
diff --git a/Labs/flasklab2/flaskLab2/app/__pycache__/__init__.cpython-35.pyc b/Labs/flasklab2/flaskLab2/app/__pycache__/__init__.cpython-35.pyc
new file mode 100644
index 0000000..7b28a8e
Binary files /dev/null and b/Labs/flasklab2/flaskLab2/app/__pycache__/__init__.cpython-35.pyc differ
diff --git a/Labs/flasklab2/flaskLab2/app/__pycache__/views.cpython-35.pyc b/Labs/flasklab2/flaskLab2/app/__pycache__/views.cpython-35.pyc
new file mode 100644
index 0000000..f418e22
Binary files /dev/null and b/Labs/flasklab2/flaskLab2/app/__pycache__/views.cpython-35.pyc differ
diff --git a/Labs/flasklab2/flaskLab2/app/static/interactions.js b/Labs/flasklab2/flaskLab2/app/static/interactions.js
new file mode 100644
index 0000000..68445c1
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/static/interactions.js
@@ -0,0 +1,39 @@
+$('#submit-survey').on('click', function submitSurvey() {
+ var color = $("input[name=color]").val();
+ var food = $("input[name=food]").val();
+ var vacation = $("input[name=vacation]").val();
+ var feBefore = $("input[name=front-end-before]").val();
+ var feAfter = $("input[name=front-end-after]").val();
+ $.post("submit-survey",
+ {color: color,
+ food: food,
+ vacation: vacation,
+ feBefore: feBefore,
+ feAfter: feAfter},
+ function(data) {
+ $("html").html(data);
+ }
+ )
+});
+
+$("#results-email-container").on('click', '#email-results-button', function emailResults() {
+ console.log($(this));
+});
+
+$("#site-title-wrapper").on('click', function goHome() {
+ window.location.href = '/';
+});
+
+$(document).ready(function applySliderLabels() {
+ var currentValue = $("#fe-before").val();
+ $("#fe-before").next().html(currentValue);
+
+ currentValue = $("#fe-after").val();
+ $("#fe-after").next().html(currentValue);
+});
+
+
+$("input[type='range']").on('change', function updateLabel() {
+ var currentValue = $(this).val();
+ $(this).next().html(currentValue);
+});
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/static/main.css b/Labs/flasklab2/flaskLab2/app/static/main.css
new file mode 100644
index 0000000..ccd8971
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/static/main.css
@@ -0,0 +1,225 @@
+/*----------------- CSS RESET ------------------*/
+
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol, ul {
+ list-style: none;
+}
+blockquote, q {
+ quotes: none;
+}
+blockquote:before, blockquote:after,
+q:before, q:after {
+ content: '';
+ content: none;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+/*----------------- CSS RESET ------------------*/
+
+html, body {
+ background-color: #f9f9f9;
+ font-family: 'Open Sans', sans-serif;
+ font-size: 16px;
+}
+
+header {
+ background-color: #1abc9c;
+ box-shadow: 0 2px 6px 1px #a7a7a7;
+ color: #ecf0f1;
+ height: 5rem;
+}
+
+footer {
+ background-color: #16a085;
+ bottom: 0;
+ color: #ecf0f1;
+ height: 7rem;
+ margin-top: 2em;
+ text-align: center;
+ width: 100%;
+}
+
+footer p {
+ height: 7rem;
+ line-height: 7rem;
+}
+
+h1, h3 {
+ padding: 4px;
+}
+
+h1 {
+ font-size: 2rem;
+ font-weight: bold;
+}
+
+h3 {
+ font-size: 1.4rem;
+}
+
+a {
+ text-decoration: none;
+}
+
+input[type="text"], input[type="range"] {
+ border: 1px solid #bdc3c7;
+ border-radius: 2px;
+ margin-left: 1rem;
+ vertical-align: middle;
+}
+
+input[type=range]{
+ -webkit-appearance: none;
+}
+
+input[type=range]::-webkit-slider-thumb {
+ -webkit-appearance: none;
+ border: none;
+ height: 1.2rem;
+ width: 1.2rem;
+ border-radius: 50%;
+ background: #1abc9c;
+ margin-top: -.5rem;
+}
+
+input[type=range]::-webkit-slider-runnable-track {
+ background: #ccc;
+ height: .2rem;
+}
+
+.action-button {
+ background-color: #1abc9c;
+ border: none;
+ border-bottom: 3px solid #16a085;
+ border-radius: 2px;
+ color: #ecf0f1;
+ display: inline-block;
+ font-size: 1rem;
+ font-weight: bold;
+ height: 3rem;
+ padding: 4px;
+ width: 6rem;
+}
+
+.action-button:hover {
+ background-color: #16a085;
+}
+
+#site-title-wrapper {
+ display: inline-block;
+ height: 5rem;
+ width: 15%;
+}
+
+#site-icon-wrapper {
+ display: inline-block;
+ margin-left: 1rem;
+ margin-top: -.5rem;
+ vertical-align: middle;
+ width: 2.5rem;
+}
+
+#site-icon-wrapper img {
+ display: inline-block;
+ max-height: 100%;
+ max-width: 100%
+}
+
+#site-title {
+ display: inline-block;
+ font-weight: bold;
+ height: 5rem;
+ line-height: 5rem;
+ margin-left: .1rem;
+}
+
+#username {
+ margin-right: .7rem;
+}
+
+#logout {
+ float: right;
+ height: inherit;
+ line-height: 5rem;
+ margin-right: 1rem;
+}
+
+#logout-button {
+ background-color: #ecf0f1;
+ border-bottom-color: #bdc3c7;
+ color: #222222;
+ height: 2.5rem;
+ width: 5rem;
+}
+
+#logout-button:hover {
+ background-color: #bdc3c7;
+}
+
+#content {
+ margin-top: 2rem;
+ text-align: center;
+ width: 100%;
+}
+
+.main-container {
+ background: #ecf0f1;
+ border-radius: 4px;
+ box-shadow: 0px 2px 10px 2px #95a5a6;
+ display: block;
+ min-height: 50vh;
+ margin: 2rem 0 0 25%;
+ padding: 1rem;
+ text-align: left;
+ width: 50%;
+}
+
+.survey-item, .result-item, #results-email-container {
+ box-sizing: border-box;
+ display: block;
+ margin: 1.5rem 0;
+ padding: 4px;
+}
+
+.survey-item span {
+ font-size: 1rem;
+ margin-left: 1rem;
+}
+
+#email-results-button, #goHome {
+ height: 2rem;
+ line-height: 2rem;
+ margin-left: 1rem;
+ text-align: center;
+}
+
diff --git a/Labs/flasklab2/flaskLab2/app/templates/base.html b/Labs/flasklab2/flaskLab2/app/templates/base.html
new file mode 100644
index 0000000..ffba46d
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/base.html
@@ -0,0 +1,33 @@
+
+
+
+
+
+ {% block title %}{% endblock %} - Ape Ask
+
+
+
+ {% block styles %}{% endblock %}
+
+
+
+
+
+ {% block header %}
+
+
+
+
+
Ape Ask
+
+ {% endblock %}
+
+
{% block content %}{% endblock %}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/templates/login.html b/Labs/flasklab2/flaskLab2/app/templates/login.html
new file mode 100644
index 0000000..834eb71
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/login.html
@@ -0,0 +1,19 @@
+{% extends "base.html"%}
+
+{% block title %}
+ Login
+{% endblock %}
+
+
+{% block content %}
+
Hi There! Welcome to Ape Ask, the leading online survey site.
+
+
Let's get you logged in
+
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/templates/not_authorized.html b/Labs/flasklab2/flaskLab2/app/templates/not_authorized.html
new file mode 100644
index 0000000..0baeb84
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/not_authorized.html
@@ -0,0 +1,13 @@
+
+
+
+
+ Oops!
+
+
+
Uh Oh! You're not authorized
+
+
+ Take me back home, already!
+
+
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/templates/page_not_found.html b/Labs/flasklab2/flaskLab2/app/templates/page_not_found.html
new file mode 100644
index 0000000..2dacddb
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/page_not_found.html
@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+
+{% block title %}
+ Oops!
+{% endblock %}
+
+{% block content %}
+
Oh, Pooh Bear! You're stuck because we don't have that page for you.
+
+
+ Go back!
+{% endblock %}
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/templates/results.html b/Labs/flasklab2/flaskLab2/app/templates/results.html
new file mode 100644
index 0000000..c1efdc8
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/results.html
@@ -0,0 +1,32 @@
+{% extends "base.html" %}
+
+{% block title %}
+ Survey
+{% endblock %}
+
+{% block header %}
+ {{ super() }}
+
+{% endblock %}
+
+{% block content %}
+
Great news - your results are in! Check it out...
+
+
Here are some of your favorite things
+ Your favorite color is {{ surveyResponse['color']}}
+ Your favorite food is {{ surveyResponse['food']}}
+ Your favorite vacation spot is {{ surveyResponse['vacation']}}
+
+
Wow! Your front end skillz are getting sharp!
+ Before IO Lab, your front end skillz were at a {{ surveyResponse['fe-before']}}
+ But in just a few short weeks of IO Lab, your front end skillz are now a {{ surveyResponse['fe-after']}}
+
+
+ Want your survey results emailed to you?
+ Yes!
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/Labs/flasklab2/flaskLab2/app/templates/survey.html b/Labs/flasklab2/flaskLab2/app/templates/survey.html
new file mode 100644
index 0000000..1c9f6da
--- /dev/null
+++ b/Labs/flasklab2/flaskLab2/app/templates/survey.html
@@ -0,0 +1,33 @@
+{% extends "base.html"%}
+
+{% block title %}
+ Survey
+{% endblock %}
+
+
+{% block header %}
+ {{super()}}
+
+{% endblock %}
+
+{% block content %}
+
+ 
+ 
+