
	<!-- PRICING -->	
	<div class="content pricing" id="pricing">
		<!-- BASIC PRICE -->
		<div class="row section-title p-5-l p-5-r p-5-t p-0-b text-center">
			<div class="col">
				<h1 class="m-0-t font-weight-bold"><?php echo $this->lang->line('titlePricingGuide'); ?></h1>
				<p class="m-0-b"><?php echo $this->lang->line('titlePricingGuideDesc'); ?></p>
			</div>
		</div>

		<div class="row pricing-row p-5-l p-5-r p-0-t p-1-b text-center">
			<div class="col-md-4 col-md-offset-4 pricing-item hilite">
				<div class="pricing-item-wrap bg-blue p-sm-2 p-xs-5">
					<div class="pricing-item-price"><span class="currency">RM</span><span class="value">500</span></div>
					<ul class="pricing-item-feature">
						<li><i class="fa fa-check"></i>&nbsp;Up to 200 <?php echo strtolower($this->lang->line('voters')); ?></li>
						<li><span id="calculate_voter_0">??</span> <?php echo strtolower($this->lang->line('voters')); ?> (RM500 / 200 <?php echo strtolower($this->lang->line('voters')); ?>) = RM <span id="calculate_cost_0">??</span></li>
					</ul>
					<div class="pricing-item-button">
						<a href="<?php echo base_url(); ?>registration" class="btn btn-block btn-primary"><?php echo $this->lang->line('freeSignup'); ?></a>
					</div>
				</div>
			</div>
		</div>
		
		<!-- ADDITIONAL VOTER -->
		<div class="row section-title p-5-l p-5-r p-5-t p-0-b text-center">
			<div class="col">
				<h1 class="m-0-t font-weight-bold"><?php echo $this->lang->line('additionalVoters'); ?></h1>
				<p class="m-0-b"><?php echo $this->lang->line('additionalVotersDesc'); ?></p>
			</div>
		</div>

		<!-- CALCULATE -->
		<div class="row pricing-row calculate p-2-l p-2-r p-1-t p-1-b text-center">
			<div class="col-sm-12">
				<h2><?php echo $this->lang->line('calcCost'); ?></h2>					
				<div class="text-center p-1">
					<div class="text-center col-md-4 col-md-offset-4">
						<strong><?php echo $this->lang->line('calcCostDesc'); ?></strong><br />
						<input type="number" id="calculate_input" min="0" />
						<div class="hidden-md hidden-lg hidden-xl m-1-t"></div>
						<button type="button" class="btn btn-primary" onclick="return calculatePricingCost(this);"><i class="fa fa-calculator"></i>&nbsp;<?php echo $this->lang->line('calc'); ?></button>
						<button type="button" class="btn btn-warning" onclick="return resetCalculatePricing(this);"><i class="fa fa-undo"></i>&nbsp;<?php echo $this->lang->line('reset'); ?></button>
					</div>
				</div>
			</div>
			
			<div class="m-1-t col-sm-4 col-md-offset-4 calculate-result" id="calculate_result" style="display:none;">
				<div class="calculate-result-item">
					<span class="currency">RM</span>
					<span class="value" id="calculate_cost_total"></span>
				</div>
				<div class="text-center m-1-t bg-white">
					<span id="calculate_voter_x">??</span> <?php echo strtolower($this->lang->line('voters')); ?> (RM500 / 200 <?php echo strtolower($this->lang->line('voters')); ?>) = RM <span id="calculate_cost_x">??</span>
					<br />
					<i class="fa fa-plus fa-5x text-black"></i>
				</div>		
			</div>
		</div>
		
		<div class="row pricing-row p-5-l p-5-r p-0-t p-1-b text-center">
			<div class="col-md-4 pricing-item">
				<div class="pricing-item-wrap p-sm-2 p-xs-5">
					<div class="pricing-item-price"><span class="currency">RM</span><span class="value">0.50</span><small> / <?php echo strtolower($this->lang->line('voters')); ?></small></div>
					<ul class="pricing-item-feature">
						<li><i class="fa fa-check"></i>&nbsp;<?php echo $this->lang->line('for'); ?> <?php echo strtolower($this->lang->line('voters')); ?> 201 - 500</li>
						<li><span id="calculate_voter_1">??</span> <?php echo strtolower($this->lang->line('voters')); ?> (X RM 0.50 / 1 <?php echo strtolower($this->lang->line('voters')); ?>) = RM <span id="calculate_cost_1">??</span></li>
					</ul>
				</div>
			</div>
			
			<div class="col-md-4 pricing-item">
				<div class="pricing-item-wrap bg-green p-sm-2 p-xs-5">
					<div class="pricing-item-price"><span class="currency">RM</span><span class="value">0.40</span><small> / <?php echo strtolower($this->lang->line('voters')); ?></small></div>
					<ul class="pricing-item-feature">
						<li><i class="fa fa-check"></i>&nbsp;<?php echo $this->lang->line('for'); ?> <?php echo strtolower($this->lang->line('voters')); ?> 501 - 1000</li>
						<li><span id="calculate_voter_2">??</span> <?php echo strtolower($this->lang->line('voters')); ?> (X RM 0.40 / 1 <?php echo strtolower($this->lang->line('voters')); ?>) = RM <span id="calculate_cost_2">??</span></li>
					</ul>
				</div>
			</div>
			
			<div class="col-md-4 pricing-item">
				<div class="pricing-item-wrap bg-yellow p-sm-2 p-xs-5">
					<div class="pricing-item-price"><span class="currency">RM</span><span class="value">0.30</span><small> / <?php echo strtolower($this->lang->line('voters')); ?></small></div>
					<ul class="pricing-item-feature">
						<li><i class="fa fa-check"></i>&nbsp;<?php echo $this->lang->line('for'); ?> <?php echo strtolower($this->lang->line('voters')); ?> 1001 <?php echo $this->lang->line('nMore'); ?></li>
						<li><span id="calculate_voter_3">??</span> <?php echo strtolower($this->lang->line('voters')); ?> (X RM 0.30 / 1 <?php echo strtolower($this->lang->line('voters')); ?>) = RM <span id="calculate_cost_3">??</span></li>
					</ul>
				</div>
			</div>
		</div>
	</div>

	
<script>

function calculatePricingCost() {	
	$('#calculate_result').slideUp(function() {
		$('[id*="calculate_voter_"]').html('??');
		$('[id*="calculate_cost_"]').html('??');
		
		var request = Number($('#calculate_input').val());
		var data = {
			0 : { 'voters' : request, 'cost' : 500 },
			1 : { 'voters' : 0, 'cost' : 0 },
			2 : { 'voters' : 0, 'cost' : 0 },
			3 : { 'voters' : 0, 'cost' : 0 }
		};
		
		if( (request - 200) > 0 ) {
			data[0]['voters'] = 200;
			data[0]['cost'] = 500;
			if(	(request - 500) > 0 ) {
				data[1]['voters'] = 300;
				data[1]['cost'] = Math.round(	((300 * 0.50) * 100) ) / 100;
				if(	(request - 1000) > 0 ) {
					data[2]['voters'] = 500;
					data[2]['cost'] = Math.round(	((500 * 0.40) * 100) ) / 100;
					
					data[3]['voters'] = request - 1000;
					data[3]['cost'] = Math.round(	((data[3]['voters'] * 0.30) * 100) ) / 100;
				} else {
					data[2]['voters'] = request - 500;
					data[2]['cost'] = Math.round(	((data[2]['voters'] * 0.40) * 100) ) / 100;
				}
			} else {
				data[1]['voters'] = request - 200;
				data[1]['cost'] = Math.round(	((data[1]['voters'] * 0.50) * 100) ) / 100;
			}
		}
		
		var total = 0;
		$.each(data, function(k,v) {
			$('#calculate_voter_'+k).html(v['voters']);
			$('#calculate_cost_'+k).html(v['cost']);
			
			total += v['cost'];
			
			if(k == 0) {
				$('#calculate_voter_x').html(v['voters']);
				$('#calculate_cost_x').html(v['cost']);
			}
		});
		
		$('#calculate_cost_total').html(total);
		
		$(this).slideDown();
	});
}

function resetCalculatePricing() {	
	$('#calculate_result').slideUp(function() {
		$('[id*="calculate_voter_"]').html('??');
		$('[id*="calculate_cost_"]').html('??');
	});
}

</script>




























