I need your help to figure out what's wrong with my code.
I have a HomeLayout devided to 3 sections;
- header
- side
- main
I have a conversation list ; it will be rendered in the main section and it contain a subsection called One_Conversation : when I click on conversation it's rendered
well right here it's ok : my problem that when I click on another conversation , the template won't be rendered
this is my code : /routes.js
FlowRouter.route('/conversation', {
name: 'Conversation',
action(){
BlazeLayout.render('HomeLayout', {side: 'Messages', main: 'Conversation_list'});
}
});
FlowRouter.route('/conversation/:idConversation', {
name: 'oneConversation',
action(){
BlazeLayout.render('HomeLayout', {side: 'Messages', main: 'Conversation_list', conversation: 'One_conversation'});
}
});
/HomeLayout.html
<template name="HomeLayout">
<div class="app header-fixed sidebar-fixed aside-menu-fixed aside-menu-hidden">
{{> Header}}
<div class="app-body">
<div class="sidebar">
{{> Template.dynamic template=side }}
</div>
<main class="main">
<div class="container-fluid">
{{> Template.dynamic template=main }}
</div>
</main>
</div>
{{> Footer}}
</div>
</template>
/Conversation_list.html
<template name="Conversation_list">
<div class="messages">
////code
////code
////...
</div>
<conversation class="content">
{{> Template.dynamic template=conversation }}
</conversation>
</template>
and finnaly in my Conversation_list.events when I click to conversation
FlowRouter.go('/conversation/:idConversation', {idConversation:this._id});
this is /OneConversation.html Template
<template name="One_conversation">
{{#with oneConversation}}
<div class="contact-profile">
{{#if isDefault}}
<img src="{{contact.profile_pic}}" alt="" />
<p>{{contact.first_name}} {{contact.last_name}}</p>
{{else}}
<img src="http://emilcarlsson.se/assets/harveyspecter.png" alt="" />
<p>{{contactLiveChat.first_name}} {{contactLiveChat.last_name}}</p>
{{/if}}
<div class="social-media">
<i class="fa fa-facebook" aria-hidden="true"></i>
<i class="fa fa-twitter" aria-hidden="true"></i>
<i class="fa fa-instagram" aria-hidden="true"></i>
</div>
</div>
<div class="messages">
{{#each allMessagesOfConversation}}
<ul>
{{#if isFirst}}
<li class="replies">
<img src="http://emilcarlsson.se/assets/harveyspecter.png" alt="" />
<p>{{message}} </p>
</li>
{{else}}
<li class="sent">
<img src="{{contactM.profile_pic}}" alt="" />
<p>{{message}}</p>
</li>
{{/if}}
</ul>
{{/each}}
</div>
<div class="message-input">
<div class="wrap">
<input type="text" placeholder="Write your message..." />
<i class="fa fa-paperclip attachment" aria-hidden="true"></i>
<button class="submit"><i class="fa fa-paper-plane" aria-hidden="true"></i></button>
</div>
</div>
{{/with}}
</template>
and this is /OneConversation.js
import { Template } from ‘meteor/templating’;
import ‘./One_conversation.html’;
import {Meteor} from “meteor/meteor”;
var idConversation=’’;
var typeConversation=’’;
var token=’’;
var psid=’’;
Template.One_conversation.onCreated(function One_conversationOnCreated() {
idConversation = FlowRouter.getParam(“idConversation”);
// typeConversation= Session.get(‘typeConversation’);
//
//
// token= Session.get(‘token’);
// psid= Session.get(‘psid’);
// console.log("OneConversation psid: ",psid);
// console.log("OneConversation token: ",token);
//
// psid= FlowRouter.getParam(“psid”);
// console.log("OneConversation psid liveChat: ",psid);
Meteor.subscribe('allConversations');
Meteor.subscribe('allMessages');
Meteor.subscribe('allContacts');
Meteor.subscribe('allHotels');
Meteor.subscribe('allImMessenger');
});
Template.One_conversation.rendered = function () {
};
Template.One_conversation.helpers({
allMessagesOfConversation: function() {
return Messages.find({idConversation: idConversation},{sort: {createdAt: 1}}).map(function(message) {
if (message.typeMessage ==="1") {
message.isFirst=true;
return message;
}else {
return message;
}
});
},
oneConversation: function() {
return Conversations.findOne({_id: idConversation});
},
});
Template.One_conversation.events({
‘click .submit’(event,instance) {
const message = $(".message-input input").val();
if($.trim(message) === '') {
return false;
}
if(Session.get('typeConversation') ==='facebook'){
Meteor.call("sendMessage",Session.get('token'),Session.get('psid'),message, function (er) {
if (er) {
console.log("send message problem");
console.log(er);
} else {
console.log("message sended successfully");
$(".message-input input").val('');
}
});
}else{
var newMessageInfo = {
idSender: Session.get('psid'),
message: message,
type: "liveChat",
createdAt: new Date(),
idConversation: Session.get('idConversation'),
status: "seen",
typeMessage: '1'
};
Meteor.call('insertMessages', newMessageInfo, function (er) {
if (er) {
console.log("insert problem");
console.log(er);
} else {
console.log("message added successfully", "success");
$(".message-input input").val('');
}
});
}
},
});
what am I doing wrong ?
