CommentFinalVersion1

working with metags

by David Gonzalez

HTML

<link rel="stylesheet" href="http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.firebase.com/js/client/2.2.9/firebase.js"></script>
<div class="pageContainer">
<div class="metag metagRank">
            <div class="rankingContainer"><label class="rankingLabel"></label></div>
            <div class="voteContainer">
                <div>
                    <div>
                    <span class="voteUpContainer">
                        <button class="voteButton vote-button btn btn-info fa fa-arrow-up faup"></button>
                    </span>
                </div>
                    <div class="voteCountContainer" >
                        <label class="voteCountLabel"> </label>
                    </div>
                    <div>
      <span class="voteDownContainer">
        <button class="voteButton vote-button btn btn-info fa fa-arrow-down">
        </button>
      </span>
                    </div>
                </div>
            </div>

            <div class="userChoicesContainer">
                <div class="favoriteToggleIcon iconChosenFalse">
                    <i class="fa fa-star" ></i>
                </div>
                <div class="pinnedToggleIcon iconChosenFalse">
                    <i class="fa fa-thumb-tack"></i>
                </div>
            </div>
            <div class="threadContainer">

                <div>
                    <!-- <i class="material-icons">chat</i>
                     <i class="fa fa-check-circle" id="check" aria-hidden="true"></i>-->
                    <button class= "blogSelectedButton iconChosenTrue">
                        Blog
                    </button>
                    <button class= "wikiSelectedButton iconChosenFalse">
                        Wiki
                    </button>
                    <button class= "qaSelectedButton...

CSS

.pageContainer{
left: 0;
position: absolute;
}

.metagRank {
margin: 0 auto;
width: 340px;
padding: 5px;
}

.rankingLabel {
display: block;
text-align: center;
line-height: 150%;
font-size: 2em;
top:20px;
padding:0.2em;
}

.voteCountLabel{
text-align: center;
padding-left: 2px;
}

.metagRank .rankingContainer {
margin: 0 auto;
float: left;
width: 30px;
height: 75px;
}

.metagRank .voteContainer {
margin: 0 auto;
float: left;
width: 45px;
height: 75px;
}

.metagRank .userChoicesContainer {
margin: 0 auto;
float: left;
width: 45px;
height: 75px;
}
.metagRank .commentChatContainer {
margin: 0 auto;
float: left;
width: 220px;
height: 75px;
position:relative;
left:-20px;
background: white;
}

.voteButton {
background-color: Transparent;
border:none;
}

.iconChosenFalse{
color: gray;
}

.iconChosenTrue{
color: DodgerBlue ;
}

.favoriteToggleIcon{
padding-left:0px;
padding-top:15px;
cursor: pointer;
}

.pinnedToggleIcon{
cursor: pointer;
}

.commentsSection{
padding-left: 50px;
}
.commentsSaveSection{
padding-left: 60px;
bottom: 60px;
border: 3px solid #73AD21;
}
.ansSection{
padding-left: 50px;
}

.pageContainer .metagRank:nth-child(1) .deletePostAction{
  display:none;
}

JavaScript

$(function () {
		$('.pageContainer').html("");
    loadMetagRank();
});
let metagsURLFirebaseVote = null;
let metagTemplate = null;

function settingMetagComments(){
console.log("starting of settingmetagComment");
 let ranking = 1; // ranking is determined by the page results.
  let votes= 5019;
  let userChoices = {favorited: true, pinned: false};
  //let sourceType={ blogSelected: true};
  //console.log(sourceType);
  let metagRanking = { votes: votes,  userChoices: userChoices};


  // "metagRanking/votes" , "metagRanking/userChoices/favorited" and "metagRanking/userChoices/pinned"
 
  let metagComments = {
  
    metagRanking: metagRanking,
    text: "Hi Fardina!",
    comments:0, // this is an array, it is 0 because of Firabase rules
    sourceType: {
				blogSelected: false,
        wikiSelected: false,
        qaSelected: false,
        apiSelected: false
    	}
   
   
   };
   
  let pageURL = {url: "http://facebook.com", metagRanking: metagRanking, metagComments: metagComments};  
  var metagsURLFirebase = new Firebase(`https://seecoderun.firebaseio.com/test/-KhGIb91d_T3gIjfW5dq/metags/urls`);
	metagsURLFirebase.push(pageURL);
  console.log("ending of settingmetagComment");



}
///////////////////////
console.log();
function settingFirabaseMetags(){
console.log("starting of settingFirebaseComment");
  let search = {
  	query: "where is facebook?",
    results: 0
  };
  
  
  var metagsSearchFirebase = new Firebase(`https://seecoderun.firebaseio.com/test/-KhGIb91d_T3gIjfW5dq/metags/search`);

metagsSearchFirebase.push(search);

  let result1 = {
    ranking: 1,
      url: "http://facebook.com",
        title: "facebook",
          description: "welcome to Facebook"
  };
metagsSearchFirebase.orderByChild('query').equalTo('where is facebook?').on('child_added',
function child_added(snapshot) {
			let data = snapshot.val();
   
      if(!data.results){
       data.results = [];
      }
      data.results.push(result1);

     //...