구희연 / Food_recipe_info

Go to a project
Toggle navigation Toggle navigation pinning
조국현
ac02840c 2 parents 96d69240 94ac838f

Merge branch 'feature_shareSNS' into develop

Inline Side-by-side
Showing 1 changed file with 25 additions and 0 deletions
...@@ -5,6 +5,7 @@ function getCheckboxValue(event) { ...@@ -5,6 +5,7 @@ function getCheckboxValue(event) {
5 }else { 5 }else {
6 caloriesLimit=9999; 6 caloriesLimit=9999;
7 } 7 }
8 +
8 } 9 }
9 10
10 const searchForm = document.querySelector('form'); 11 const searchForm = document.querySelector('form');
...@@ -26,6 +27,19 @@ searchForm.addEventListener('submit', function(event){ ...@@ -26,6 +27,19 @@ searchForm.addEventListener('submit', function(event){
26 fetchAPI(); 27 fetchAPI();
27 } 28 }
28 }); 29 });
30 +function shareRecipe(sns,urlInfo) {
31 + console.log(urlInfo);
32 + var thisUrl = document.URL;
33 + var snsWrite = "요리 레시피 공유하기"+urlInfo;
34 + if( sns == 'facebook' ) {
35 + var url = "http://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(thisUrl);
36 + window.open(url, "", "width=600, height=4060");
37 + }
38 + else if( sns == 'twitter' ) {
39 + var url = "http://twitter.com/share?url="+encodeURIComponent(thisUrl)+"&text="+encodeURIComponent(snsWrite);
40 + window.open(url, "tweetPop", "width=600, height=400,scrollbars=yes");
41 + }
42 +}
29 async function fetchAPI(){ 43 async function fetchAPI(){
30 const recipeURL = `https://api.edamam.com/search?q=${searchQuery}&app_id=${APP_ID}&app_key=${APP_KEY}`; 44 const recipeURL = `https://api.edamam.com/search?q=${searchQuery}&app_id=${APP_ID}&app_key=${APP_KEY}`;
31 const response = await fetch(recipeURL); 45 const response = await fetch(recipeURL);
...@@ -33,12 +47,14 @@ async function fetchAPI(){ ...@@ -33,12 +47,14 @@ async function fetchAPI(){
33 boxinfo(data.hits); 47 boxinfo(data.hits);
34 console.log(data); 48 console.log(data);
35 } 49 }
50 +
36 function boxinfo(results){ 51 function boxinfo(results){
37 let boxsinfo =''; 52 let boxsinfo ='';
38 results.map(result => { 53 results.map(result => {
39 const object = { 54 const object = {
40 cal: result.recipe.calories.toFixed(0) 55 cal: result.recipe.calories.toFixed(0)
41 }; 56 };
57 +
42 if(result.recipe.calories>=caloriesLimit){} 58 if(result.recipe.calories>=caloriesLimit){}
43 59
44 else{ 60 else{
...@@ -55,6 +71,15 @@ function boxinfo(results){ ...@@ -55,6 +71,15 @@ function boxinfo(results){
55 <a href="${result.recipe.url}" target="_blank">View Recipe</a> 71 <a href="${result.recipe.url}" target="_blank">View Recipe</a>
56 <!--result.recipe.labe에 + home + recipe 한 검색결과 페이지를 버튼에 링크시켜놓음--> 72 <!--result.recipe.labe에 + home + recipe 한 검색결과 페이지를 버튼에 링크시켜놓음-->
57 <a href="https://www.youtube.com/results?search_query=${result.recipe.label}+home+recipe" target="_blank">View Videos</a> 73 <a href="https://www.youtube.com/results?search_query=${result.recipe.label}+home+recipe" target="_blank">View Videos</a>
74 + <ul class="sns">
75 + <li class="facebook">
76 + <a href="#n" onclick="shareRecipe('facebook','${result.recipe.url}'');return false;" class="facebook" target="_self" title="페이스북 공유"><span class="skip">페이스북</span></a>
77 + </li>
78 + <li class="twitter">
79 + <a href="#n" onclick="shareRecipe('twitter','${result.recipe.url}');return false;" class="twitter" target="_self" title="트위터 공유"><span class="skip">트위터</span></a>
80 + </li>
81 + </ul>
82 +
58 </div> 83 </div>
59 ${(cal => { 84 ${(cal => {
60 if (cal >= 2000) { 85 if (cal >= 2000) {
......