  <div class="container">
    <div class="section">

      
				
		<div class="row">
				<div class="col s12" id="result1" name="result1">
		
				</div>				
		</div>
		
				<br/><br/><h1>Enter Equation to be solved<h1></h1><br/><br/>

    </div>
  </div>
  <div class="container">
		<div class="section">
			
				<div class="row">
					<div id="screen" name="screen" class="col-4 equationscreen"> &nbsp;</div>
				</div>
				<div class="row">
					<div id="x3" name="x3" class="col-1 btn waves-effect waves-light">x<sup>3</sup></div>
					<div id="x2" name="x2" class="col-1 btn waves-effect waves-light">x<sup>2</sup></div>
					<div id="x" name="x" class="col-1 btn waves-effect waves-light">x</div>
					<div id="1x" name="1x" class="col-1 btn waves-effect waves-light">1/x</div>
				</div>
				<div class="row">
					<div id="sin" name="sin" class="col-1 btn waves-effect waves-light">sin</div>
					<div id="cos" name="cos" class="col-1 btn waves-effect waves-light">cos</div>
					<div id="tan" name="tan" class="col-1 btn waves-effect waves-light">tan</div>
					<div id="add" name="add" class="col-1 btn waves-effect waves-light">+</div>
				</div>
				<div class="row">
					<div id="1" name="1" class="col-1 btn waves-effect waves-light">1</div>
					<div id="2" name="2" class="col-1 btn waves-effect waves-light">2</div>
					<div id="3" name="3" class="col-1 btn waves-effect waves-light">3</div>
					<div id="subtract" name="subtract" class="col-1 btn waves-effect waves-light">-</div>
					
				</div>
				<div class="row">
					<div id="4" name="4" class="col-1 btn waves-effect waves-light">4</div>
					<div id="5" name="5" class="col-1 btn waves-effect waves-light">5</div>
					<div id="6" name="6" class="col-1 btn waves-effect waves-light">6</div>
					<div id="multiply" name="multiply" class="col-1 btn waves-effect waves-light">*</div>
				</div>
				<div class="row">
					<div id="7" name="7" class="col-1 btn waves-effect waves-light">7</div>
					<div id="8" name="8" class="col-1 btn waves-effect waves-light">8</div>
					<div id="9" name="9" class="col-1 btn waves-effect waves-light">9</div>
					<div id="devide" name="devide" class="col-1 btn waves-effect waves-light">&#247;</div>
				</div>
				<div class="row">
					<div id="clear" name="clear" class="col-1 btn waves-effect waves-light">clear</div>
					<div id="0" name="0" class="col-2 btn waves-effect waves-light">0</div>
					<div id="equal" name="equal" class="col-1 btn waves-effect waves-light">solve</div>
				</div>
			
		</div>
	</div>
  
  <script type="text/javascript" language="javascript">
    $(document).ready(function() {

                var email = localStorage.getItem("email");
                if(email == undefined || email == "")
                {
                    window.location = "?page=login";
                }

				$("#theloaded").hide();

				$("#btnCancel").click(function(){					
					$("#equation").val("");
					$("#result1").html("");
					//$("#result2").html("");
				})

				$("#btnSolve").click(function(){
					
				});


			var $window = $(window),
            $html = $('html');
            var buttons = ['x3','x2','x','1x','sin','cos','tan','1','2','3','4','5','6','7','8','9','0','add','subtract','multiply','devide','clear','c','equal'];

            function resize() {
                //alert("resized "+ $window.width());
                if ($window.width() < 514) {
                    for(i=0;i<buttons.length;i++)
                    {
                        if(buttons[i]=="0")
                        {
                            $("#"+buttons[i]).addClass('col-6');
                        }
                        else{
                            $("#"+buttons[i]).addClass('col-3');
                        }
                    }
                    $("#screen").addClass('col-12');
                    return $html.addClass('mobile');
                }
                for(i=0;i<buttons.length;i++)
                {
                    if(buttons[i]=="0")
                    {
                        $("#"+buttons[i]).removeClass('col-6');
                    }
                    else{
                        $("#"+buttons[i]).removeClass('col-3');
                    }
                }
                $("#screen").removeClass('col-12');
                $html.removeClass('mobile');
            }
            
            $window
                .resize(resize)
                .trigger('resize');

            $('.btn').click(function(event) {
                var status = $(this).attr('id');
                var currentEquation = $("#screen").html();
                switch(status)
                {
                    case "x3":
                    {
                        currentEquation = currentEquation+ "x<sup>3</sup>";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "x2":  
                    {
                        currentEquation = currentEquation+ "x<sup>2</sup>";
                        $("#screen").html(currentEquation);
                        break;
                    }                  
                    case "x": 
                    {
                        currentEquation = currentEquation+ "x";
                        $("#screen").html(currentEquation);
                        break;
                    }                   
                    case "1x":      
                    {
                        currentEquation = currentEquation+ "1/x";
                        $("#screen").html(currentEquation);
                        break;
                    }             
                    case "sin":
                    {
                        currentEquation = currentEquation+ "sin";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "cos":
                    {
                        currentEquation = currentEquation+ "cos";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "tan":                    
                    {
                        currentEquation = currentEquation+ "tan";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "1":
                    {
                        currentEquation = currentEquation+ "1";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    
                    case "2":
                    {
                        currentEquation = currentEquation+ "2";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "3":
                    {
                        currentEquation = currentEquation+ "3";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "4":
                    {
                        currentEquation = currentEquation+ "4";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "5":
                    {
                        currentEquation = currentEquation+ "5";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "6":
                    {
                        currentEquation = currentEquation+ "6";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "7":
                    {
                        currentEquation = currentEquation+ "7";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "8":
                    {
                        currentEquation = currentEquation+ "8";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "9":
                    {
                        currentEquation = currentEquation+ "9";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "0":
                    {
                        currentEquation = currentEquation+ "0";
                        $("#screen").html(currentEquation);
                        break;
                    }

                    case "add":
                    {
                        currentEquation = currentEquation+ "+";
                        $("#screen").html(currentEquation);
                        break;
                    }

                    case "subtract":
                    {
                        currentEquation = currentEquation+ "-";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "devide":
                    {
                        currentEquation = currentEquation+ "&#247;";
                        $("#screen").html(currentEquation);
                        break;
                    }
                    case "multiply":
                    {
                        currentEquation = currentEquation+ "*";
                        $("#screen").html(currentEquation);
                        break;
                    }

                    case "clear":
                    {
                        $("#screen").html("&nbsp;");
                        break;
                    }

					case "equal":
                    {
                        //$("#screen").html("&nbsp;");
						solve($("#screen").html().replace("&nbsp;",""));
                        break;
                    }
                }
            });	
		});

		function solve(equation)
		{
			equation = equation.replace("<sup>","^");
			equation = equation.replace("</sup>","");
			$("#theloaded").show();
			//alert($("#equation").val())
			var URL = "http://rosetaxis.dedicated.co.za:13085/solve2/"+	encodeURIComponent(equation);
			//var URL = "http://localhost:3085/login/"+$("#username").val()+"/"+$("#password").val();

			console.log(URL);
			$.ajax({
				url: URL,
				dataType: "jsonp",
				cache: false,
				timeout: 50000,
				jsonpCallback: "resultCall",
				success: function(data) {
					//$("#test").append(data);
					//alert(data.steps);

					var _resultHtml = "";
					for(i=0;i<data.length;i++)
					{
						var steps = data[i];
						console.log(steps);
						_resultHtml = _resultHtml + steps;
						//$("#result").html(steps);
					}
				$("#result1").html("<br/><br/><br/><font size=5>"+_resultHtml+ "</font>");
			//	_resultHtml = _resultHtml + data.images;
				//$("#result2").html(data.images);
				$("#theloaded").hide();        
									
				},
				error: function(jqXHR, textStatus, errorThrown) {
					alert('error ' + textStatus + " " + errorThrown);
					//window.location = "clients";
				}
			});
		}
		
</script>

