Implementation of Vote feature in ionic 4.

Kamana — Sat, 14 Aug 2021 12:23:56 +0000

I'm publishing the first part where I used this feature that was in a chatroom.
Should I explain the code?

Read it on your own risk

Using Firebase so here, I have used the array chatRef from ts and then we will check if the uid(user id is my user id ) is yes ill
ill type my message and in the next line if the chat message is a poll ill see the poll.
and we have two buttons we have only kept two vote options.
Next is the same if i'm not the user that is the user is another stranger from chatroom, the code is for them.

We will store our user id data at a different place and stranger\s at a collective place. We will see that next time.

  <ion-content padding>
    <div class="chat" *ngFor= "let chat of chatRef | async">
        <div class="me" *ngIf = "uid==chat.UserID">
          {{chat.Message}}
        <div  class="me" *ngIf = "chat.Message =='POLL' "  >
          <h1>{{chat.poll}}</h1>
          <div> 
            <ion-button  (click)="opinionClick('yes',chat.id)" >{{chat.option1}}:{{chat.countoption1}}</ion-button>
           <ion-button  (click)="opinionClick('no',chat.id)" >{{chat.option2}} :  {{chat.countoption2}}  </ion-button> 
         </div>
        </div>
        </div>
        <div class="you" *ngIf = "uid!=chat.UserID">
          <span class="name">{{chat.Name}}</span>
         <br> {{chat.Message}}
        <div class="name" *ngIf = "chat.Message =='POLL'" >
          <h1>{{chat.poll}}</h1>
            <div  > 
             <ion-button  (click)="opinionClick('yes',chat.id)" >{{chat.option1}}: {{chat.countoption1}}</ion-button>
            <ion-button  (click)="opinionClick('no',chat.id)" >{{chat.option2}}:  {{chat.countoption2}} </ion-button> 
          </div>
        </div>
      </div>
    </div>
  </ion-content>

I know I'm bad at selecting the palette.

Aniyooo 💕

Vote in Chat based Application in Ionic 4. ✨

Kamana — Wed, 11 Aug 2021 10:06:26 +0000

Hey,

I thought of writing a blog.
This is my first blog.
The topic that, I'm going to cover is poll (Vote) chat based application in ionic 4.

My professor asked me why did I add this feature or what is the one feature that stood your app out. I bluntly blurred out the Vote feature.
You'll ask why? Because I have always wanted it in my Applications that I use in daily life.

Friend 1 : Hey lets go to ABC Café. Friend 2: No, Lets go to DEF Café. ME: Just vote it out guys.. That's when it was clicked oh! why isn't there any feature of vote. Would have made my life easier.

But when my teacher asked I said, So that we can vote if we want the test or not without you knowing that I want the test or not.
So, this project was done by me in my Masters final year program.
Today we will code for UI and further in the next blog(If I remember to write this). I'll add the connectivity with UI + firebase.

Let me cut this shot if you want to know what is Ionic and what is Angular just head to the official website. (Because no one is going to read the blog).

Let's go slowly!! See you in my next blog 😉

DEV Community: Kamana

Implementation of Vote feature in ionic 4.

Vote in Chat based Application in Ionic 4. ✨