import { Component, OnInit } from '@angular/core';
import { OrderService } from '../services/order.service';
import { MallService } from '../services/mall.service';
import { IMall } from '../models/mall';
import { IOutlet } from '../models/outlet';
import { OutletService } from '../services/outlet.service';
import * as moment from 'moment';

@Component({
    selector: 'app-orders',
    templateUrl: './orders.component.html',
    styleUrls: ['./orders.component.scss'],
})
export class OrdersComponent implements OnInit {
	orders: any = [];
	all_malls: Array<IMall> = [];
	all_outlets: Array<IOutlet> = [];
	selected_rating: number = 0;
	show_rate_modal: boolean = false;

    constructor(
		private orderService: OrderService,
		private mallService: MallService,
		private outletService: OutletService
    ) { }

    ngOnInit() {
		this.orderService.getCreatedOrders().then((data: any) => {
			this.orders = data.reverse();
			console.log(this.orders);
		});

		this.mallService.getAllMalls().then((malls: Array<IMall>) => {
            this.all_malls = malls;
        });

		this.outletService.getAllOutlets().then((outlets: Array<IOutlet>) => {
			this.all_outlets = outlets;
		});
	}

	setRating() {
		let i: number, j:number, stars: any;
		stars = document.querySelectorAll('.star-holder ion-icon');

		for (i = 0; i < stars.length ; i += 1) {
			stars[i].classList.remove('active');
		}

		for (i = 0; i < this.selected_rating ; i += 1) {
			stars[i].classList.add('active');
		}
	}

	getFormattedDate(date : Date, format: string) {
		return moment(date).format(format);
	}

	getMallName(id: string) {
		return this.all_malls.find((mall) => {
			return mall.id === id;
		}).name;
	}

	getOutletName(id: string) {
		return this.all_outlets.find((mall) => {
			return mall.id === id;
		}).name;
	}

	getRating() {

	}

}
