Update Share function in twitter SNS

@@ -5,6 +5,7 @@ function getCheckboxValue(event)  {
   }else {
     caloriesLimit=9999;
   }
+
 }
 
 const searchForm = document.querySelector('form');
@@ -26,6 +27,19 @@ searchForm.addEventListener('submit', function(event){
     fetchAPI();
   }
 });
+function shareRecipe(sns,urlInfo) {
+  console.log(urlInfo);
+  var thisUrl = document.URL;
+  var snsWrite = "요리 레시피 공유하기"+urlInfo;
+  if( sns == 'facebook' ) {
+      var url = "http://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent(thisUrl);
+      window.open(url, "", "width=600, height=4060");
+  }
+  else if( sns == 'twitter' ) {
+      var url = "http://twitter.com/share?url="+encodeURIComponent(thisUrl)+"&text="+encodeURIComponent(snsWrite);
+      window.open(url, "tweetPop", "width=600, height=400,scrollbars=yes");
+  }
+}
 async function fetchAPI(){
   const recipeURL = `https://api.edamam.com/search?q=${searchQuery}&app_id=${APP_ID}&app_key=${APP_KEY}`;
   const response = await fetch(recipeURL);
@@ -33,12 +47,14 @@ async function fetchAPI(){
   boxinfo(data.hits);
   console.log(data);
 }
+
 function boxinfo(results){
   let boxsinfo ='';
   results.map(result => {
   const object = {
   	  cal: result.recipe.calories.toFixed(0)
   };
+  
   if(result.recipe.calories>=caloriesLimit){}
 
   else{
@@ -55,6 +71,15 @@ function boxinfo(results){
         <a href="${result.recipe.url}" target="_blank">View Recipe</a>
         <!--result.recipe.labe에 + home + recipe 한 검색결과 페이지를 버튼에 링크시켜놓음-->
         <a href="https://www.youtube.com/results?search_query=${result.recipe.label}+home+recipe" target="_blank">View Videos</a>
+        <ul class="sns">
+    <li class="facebook">
+    <a href="#n" onclick="shareRecipe('facebook','${result.recipe.url}'');return false;" class="facebook" target="_self" title="페이스북 공유"><span class="skip">페이스북</span></a>
+    </li>
+    <li class="twitter">
+    <a href="#n" onclick="shareRecipe('twitter','${result.recipe.url}');return false;" class="twitter" target="_self" title="트위터 공유"><span class="skip">트위터</span></a>
+    </li>
+    </ul>
+
       </div>
       ${(cal => {
         if (cal >= 2000) {