<?php include "db_connect.php"; if(isset($_POST['logUserid'])){ $logUserid = $_POST['logUserid']; } else { header("Location: (index.php)"); } ?> <!DOCTYPE html> <html lang="zxx"> <!--[endif]--> <!-- Mirrored from xdemos.space/xpedia/car_checkout.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 30 Jun 2021 08:26:21 GMT --> <!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=utf-8" /><!-- /Added by HTTrack --> <head> <meta charset="utf-8" /> <title>User-Friendly Railway </title> <meta content="width=device-width, initial-scale=1.0" name="viewport" /> <meta name="MobileOptimized" content="320" /> <!--Template style --> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" /> <link rel="stylesheet" type="text/css" href="css/xpedia.css" /> <style type="text/css"> #myBtn { display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: #4f5dec; color: white; cursor: pointer; padding: 15px; border-radius: 10px; } #myBtnChat:hover { background-color: #ffffff; color: #4f5dec; border: 1px solid #4f5dec; } #myBtnChat { display: none; position: fixed; bottom: 90px; right: 30px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: #4f5dec; color: white; cursor: pointer; padding: 15px; border-radius: 10px; } #myBtn:hover { background-color: #ffffff; color: #4f5dec; border: 1px solid #4f5dec; } #myBtnPlan:hover { background-color: #ffffff; color: #4f5dec; border: 1px solid #4f5dec; } #myBtnPlan { display: none; position: fixed; bottom: 90px; right: 30px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: #4f5dec; color: white; cursor: pointer; padding: 15px; border-radius: 10px; } </style> <script> function getXmlHttpRequestObject() { if (window.XMLHttpRequest) { return new XMLHttpRequest(); } else if(window.ActiveXObject) { return new ActiveXObject("Microsoft.XMLHTTP"); }else { } } </script> </head> <body onload="loadFun(); createTripPlan();"> <div id="subform"></div> <?php include('common_header.php'); ?> <script> function createTripPlan(){ let logUserid = document.getElementById(`logUserid`).value; var formData = new FormData(); formData.append('logUserid', logUserid); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { // alert(req.responseText); // console.log(req.responseText); document.getElementById(`collapseOne`).innerHTML = req.responseText; changeLineName(); } } } req.open("POST", 'sub_trip_planned_create_trip_plan.php', true); req.send(formData); } } function changeLineName(){ let logUserid = document.getElementById(`logUserid`).value; var formData = new FormData(); formData.append('logUserid', logUserid); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { // alert(req.responseText); // console.log(req.responseText); document.getElementById(`lineNameSec`).innerHTML = req.responseText; } } } req.open("POST", 'sub_change_line_name.php', true); req.send(formData); } } function createSeatDesign(logUserid, train_id, train_start_station, seat_design){ logUserid = logUserid; train_id = train_id; train_start_station = train_start_station; seat_design = seat_design; var formData = new FormData(); formData.append('logUserid', logUserid); formData.append('train_id', train_id); formData.append('train_start_station', train_start_station); formData.append('seat_design', seat_design); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { document.getElementById(`seatPlanAdd`).innerHTML = req.responseText; $(`#train_${train_id}_${train_start_station}`).modal('show'); } } } req.open("POST", 'sub_design_seat.php', true); req.send(formData); } } function selectSeat(logUserid, train_id, train_start_station, row, seat, status) { var formData = new FormData(); formData.append('logUserid', logUserid); formData.append('train_id', train_id); formData.append('train_start_station', train_start_station); formData.append('row', row); formData.append('seat', seat); formData.append('status', status); if(status == 'no') { var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { alert(req.responseText); document.getElementById(`div_${row}_${status}`).innerHTML = req.responseText; } } } req.open("POST", 'sub_design_seat_add_to_temp.php', true); req.send(formData); } } else if(status == 'yes') { var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { alert(req.responseText); document.getElementById(`div_${row}_${status}`).innerHTML = req.responseText; } } } req.open("POST", 'sub_design_seat_remove_from_temp.php', true); req.send(formData); } } } </script> <!-- hs Navigation End --> <!-- btc tittle Wrapper Start --> <div class="btc_tittle_main_wrapper"> <div class="btc_tittle_img_overlay"></div> <div class="container"> <div class="row"> <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12 full_width"> <div class="btc_tittle_left_heading"> <h1>Custom Trip Plan</h1> </div> </div> <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12 full_width"> <div class="btc_tittle_right_heading"> <div class="btc_tittle_right_cont_wrapper"> <ul> <li><a href="#">Home</a> <i class="fa fa-angle-right"></i> </li> <li>Custom Trip Plan</li> </ul> </div> </div> </div> </div> </div> </div> <!-- btc tittle Wrapper End --> <!-- x tittle num Wrapper Start --> <div class="x_title_num_mian_Wrapper float_left"> <div class="container"> <div class="x_title_inner_num_wrapper float_left"> <div class="x_title_num_heading"> <h3>Create Custom Trip Plan</h3> <p>Complete Your Step</p> </div> <div class="x_title_num_heading_cont"> <div class="x_title_num_main_box_wrapper"> <div class="x_icon_num"> <p>1</p> </div> <h5>Fill Details</h5> </div> <div class="x_title_num_main_box_wrapper"> <div class="x_icon_num "> <p>2</p> </div> <h5>Select Location</h5> </div> <div class="x_title_num_main_box_wrapper"> <div class="x_icon_num"> <p>3</p> </div> <h5>Create plan</h5> </div> <div class="x_title_num_main_box_wrapper"> <div class="x_icon_num"> <p>4</p> </div> <h5>customize Plan</h5> </div> <div class="x_title_num_main_box_wrapper x_title_num_main_box_wrapper3 x_title_num_main_box_wrapper_last"> <div class="x_icon_num"> <p>5</p> </div> <h5>done!</h5> </div> </div> </div> </div> </div> <!-- x tittle num Wrapper End --> <!-- x car book sidebar section Wrapper Start --> <div class="x_car_book_sider_main_Wrapper float_left"> <div class="container" > <div class="row"> <div class="col-xl-3 col-lg-4 col-md-12 col-sm-12 col-12"> <div class="x_car_book_left_siderbar_wrapper float_left"> <div class="row"> <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12"> <div class="x_slider_form_main_wrapper float_left x_slider_form_main_wrapper_ccb"> <div class="x_slider_form_heading_wrapper x_slider_form_heading_wrapper_carbooking float_left"> <h3>Let’s Create perfect Trip</h3> </div> <input type="text" value="<?php echo $logUserid ?>" id="logUserid" hidden> <div class="row"> <div class="col-md-12"> <div class="x_slider_form_input_wrapper float_left"> <h3>Railway Line</h3> <div class="x_slider_select" style="width: 100%; margin-top: 0px;"> <select class="myselect form-control" onchange="setToLine(this.value);"> <?php $sql1 = "SELECT * FROM linelist WHERE logUserid = $logUserid ORDER BY `priority` ASC"; $result1 = mysqli_query($con,$sql1) or die(mysqli_error($con)); while($row1 = mysqli_fetch_array($result1)){ $slected_line_no = $row1['lineNo']; $sql2 = "SELECT * FROM railway_line WHERE id = $slected_line_no"; $result2 = mysqli_query($con,$sql2) or die(mysqli_error($con)); $row2 = mysqli_fetch_assoc($result2) ?> <option value="<?php echo $row2['id'] ?>"><?php echo $row2['line'] ?></option> <?php } ?> </select> </div> </div> </div> <div class="col-md-12"> <div class="x_slider_form_input_wrapper float_left"> <h3>Location Category</h3> <div class="x_slider_select" style="width: 100%; margin-top: 0px;"> <select class="myselect form-control" onchange="setToCat(this.value)"> <?php $sql3 = "SELECT * FROM catlist WHERE logUserid = $logUserid ORDER BY `priority` ASC"; $result3 = mysqli_query($con,$sql3) or die(mysqli_error($con)); while($row3 = mysqli_fetch_array($result3)){ $selected_cat_id = $row3['catNo']; $sql4 = "SELECT * FROM category WHERE id = '$selected_cat_id' "; $result4 = mysqli_query($con,$sql4) or die(mysqli_error($con)); $row4 = mysqli_fetch_assoc($result4) ?> <option value="<?php echo $row4['id'] ?>"><?php echo $row4['name'] ?></option> <?php } ?> </select> </div> </div> </div> <div class="col-md-12"> <div class="form-sec-header"> <h3>Start Date</h3> <?php $sql5 = "SELECT * FROM user_details WHERE logUserid = $logUserid"; $result5 = mysqli_query($con,$sql5) or die(mysqli_error($con)); $row5 = mysqli_fetch_assoc($result5); ?> <label class="cal-icon"> <input type="text" id="startTime" onchange="changeTime();" value="<?php echo $row5['start'] ?>" placeholder="Start Date" class="form-control datepicker" readonly> </label> </div> </div> <div class="col-md-12"> <div class="form-sec-header"> <h3>End Date</h3> <label class="cal-icon"> <input type="text" id="endTime" onchange="changeTime();" value="<?php echo $row5['end'] ?>" placeholder="End Date" class="form-control datepicker" readonly> </label> </div> </div> </div> </div> </div> </div> </div> </div> <script> function changeTime() { let logUserid = document.getElementById(`logUserid`).value; let startTime = document.getElementById(`startTime`).value; let endTime = document.getElementById(`endTime`).value; var formData = new FormData(); formData.append('logUserid', logUserid); formData.append('startTime', startTime); formData.append('endTime', endTime); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { // alert(req.responseText); // console.log(req.responseText); if(req.responseText == 1) { createTripPlan(); } // createTripPlan(); } } } req.open("POST", 'sub_update_date.php', true); req.send(formData); } } function setToCat(value) { let logUserid = document.getElementById(`logUserid`).value; let catDropValue = value; var formData = new FormData(); formData.append('logUserid', logUserid); formData.append('catDropValue', catDropValue); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { // alert(req.responseText); // console.log(req.responseText); createTripPlan(); } } } req.open("POST", 'sub_arrange_cat.php', true); req.send(formData); } } function setToLine(value){ let logUserid = document.getElementById(`logUserid`).value; let lineDropValue = value; var formData = new FormData(); formData.append('logUserid', logUserid); formData.append('lineDropValue', lineDropValue); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { createTripPlan(); } } } req.open("POST", 'sub_arrange_line.php', true); req.send(formData); } } </script> <div class="col-xl-9 col-lg-8 col-md-12 col-sm-12 col-12"> <div class="x_carbooking_right_section_wrapper float_left"> <div class="row"> <div class="col-md-12"> <div class="x_car_checkout_right_main_box_wrapper float_left"> <div class="car-filter order-billing margin-top-0"> <div class="heading-block text-left margin-bottom-0"> <h4>Trip Details</h4> </div> <hr> <!-- <form class="billing-form"> <ul class="list-unstyled row"> <li class="col-md-6"> <label>First Name * <input type="text" placeholder="" class="form-control"> </label> </li> <li class="col-md-6"> <label>Last Name * <input type="text" placeholder="" class="form-control"> </label> </li> <li class="col-md-6"> <label>NIC / Passport <input type="text" placeholder="" class="form-control"> </label> </li> <li class="col-md-6"> <label>Passengers <input type="text" placeholder="" class="form-control"> </label> </li> </form> --> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <div class="accordion" id="accordionExample" style="width: 100%; "> <div class="card"> <div class="card-header" id="headingOne" style="background-color: #4f5dec;"> <h2 class="mb-0" > <button style="color: #ffffff;" class="btn btn-link btn-block text-left" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Best Trip Plan - <b> <span id="lineNameSec"> Main Line </span></b> </button> </h2> </div> <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample"> <!-- Content Add --> <!-- Content Add --> <!-- Content Add --> <!-- Content Add --> <!-- Content Add --> </div> </div> </div> </div> </div> </div> <div class="col-md-12"> <div class="contect_btn contect_btn_contact"> <ul> <li><a href="#">Confirm Plan <i class="fa fa-arrow-right"></i></a> </li> </ul> </div> </div> </div> </div> </div> </div> </div> </div> <!-- x car book sidebar section Wrapper End --> <!-- Button trigger modal --> <div id="seatPlanAdd"> </div> <style> .btn-link:hover, .btn-link, .btn-link:focus{ text-decoration:none; } </style> <?php include('common_footer.php'); ?> <div class="container pull-right" id="chatbox"> <div class="row chat-window col-xs-5 col-md-4 pull-right" id="chat_window_1"> <div class="col-xs-12 col-md-12"> <div class="panel panel-default"> <div class="panel-heading top-bar" style="border-radius: 5px 5px 0px 0px;"> <div class="col-sm-12 col-md-12 col-lg-12"> <div class="row"> <div class="col-md-8 col-xs-8"> <h5 class="panel-title" style="font-size: 18; font-weight: 600; color: #ffffff; text-transform: uppercase;"><span class="glyphicon glyphicon-comment"></span> Railbot </h3> </div> <div class="col-md-4 col-xs-4" style="text-align: right;"> <a style="color: #ffffff; cursor:pointer;" onclick="minimizeChat();"><i id="minim_chat_window" class="fa fa-window-minimize icon_minim"></i></a> <a style="color: #ffffff; cursor:pointer;" onclick="closeChat();"><i class="fa fa-close icon_close" data-id="chat_window_1"></i></a> </div> </div> </div> <!-- <div class="col-sm-12 col-md-12 col-lg-12"> <div class="row"> <div class="col-sm-5 col-md-5 col-lg-5">xxxxxxx</div> <div class="col-sm-4 col-md-4 col-lg-4">xxxxxxxx</div> </div> </div> --> </div> <div id="messagebody" class="panel-body msg_container_base"> <div class="row msg_container base_sent"> <div class="col-md-10 col-xs-10" style="padding:0;"> <div class="messages msg_sent"> <p>Hi</p> <time datetime="2009-11-13T20:00">User • Today 10:05:22</time> </div> </div> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatMan.png" class="chatimg img-responsive "> </div> </div> <div class="row msg_container base_receive"> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatTrain.png" class="chatimg img-responsive "> </div> <div class="col-md-10 col-xs-10" style="padding:0;"> <div class="messages msg_receive"> <p>Hi there, how can I help?</p> <time datetime="2009-11-13T20:00">Railbot • Today 10:05:28</time> </div> </div> </div> <div class="row msg_container base_sent"> <div class="col-xs-10 col-md-10" style="padding:0;"> <div class="messages msg_sent"> <p>What are the historical places i can visit in Sri Lanka? </p> <time datetime="2009-11-13T20:00">User • Today 10:05:38</time> </div> </div> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatMan.png" class="chatimg img-responsive "> </div> </div> <div class="row msg_container base_receive"> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatTrain.png" class="chatimg img-responsive "> </div> <div class="col-xs-10 col-md-10" style="padding:0;"> <div class="messages msg_receive"> <p>You can see Ruwanweliseya, Thuparamaya, Isurumuniya and many other historical places in Sri Lanka.</p> <time datetime="2009-11-13T20:00">Railbot • Today 10:05:41</time> </div> </div> </div> <div class="row msg_container base_sent"> <div class="col-md-10 col-xs-10 " style="padding:0;"> <div class="messages msg_sent"> <p>Who made sigiriya?</p> <time datetime="2009-11-13T20:00">User • Today 10:05:45</time> </div> </div> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatMan.png" class="chatimg img-responsive "> </div> </div> <div class="row msg_container base_receive"> <div class="col-md-2 col-xs-2 avatar" style="padding:0;"> <img src="./images/chatTrain.png" class="chatimg img-responsive "> </div> <div class="col-xs-10 col-md-10" style="padding:0;"> <div class="messages msg_receive"> <p>Sigiriya was built by King Kashyapa</p> <time datetime="2009-11-13T20:00">Railbot • Today 10:09:33</time> </div> </div> </div> </div> </div> <div class="panel-footer" id="inputSec"> <div class="input-group"> <input id="btn-input" type="text" class="form-control input-sm chat_input" placeholder="Write your message here..." required="required" /> <span class="input-group-btn"> <button class="btn btn-primary btn-sm" style="margin-top: 5%;" id="btn-chat">Send <i class="fa fa-send-o" style="font-size:15px; padding-left: 5%;"></i></button> </span> </div> </div> </div> </div> </div> <script> function minimizeChat() { if(document.getElementById('messagebody').style.display == 'block' && document.getElementById('inputSec').style.display == 'block') { document.getElementById('messagebody').style.display = 'none'; document.getElementById('inputSec').style.display = 'none'; } else { document.getElementById('messagebody').style.display = 'block'; document.getElementById('inputSec').style.display = 'block'; } } function closeChat() { $( "#chatbox" ).hide(); } function showChat() { $( "#chatbox" ).show(); } function loadFun(){ document.getElementById('messagebody').style.display = 'none'; document.getElementById('inputSec').style.display = 'none'; } </script> <style> .panel{ margin-bottom: 0px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } .chat-window{ bottom:0; right:5%; position:fixed; float:right; } .chat-window > div > .panel{ border-radius: 5px 5px 0 0; } .icon_minim{ padding:2px 10px; } .msg_container_base{ background: #e5e5e5; margin: 0; padding: 0 10px 10px; max-height:300px; overflow-x:hidden; } .top-bar { background: #4f5dec; color: white; padding: 10px; position: relative; overflow: hidden; } .msg_receive{ padding-left:0; margin-left:0; } .msg_sent{ padding-bottom:20px !important; margin-right:0; } .messages { background: white; padding: 10px; border-radius: 2px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); max-width:100%; } .messages > p { font-size: 13px; margin: 0 0 0.2rem 0; } .messages > time { font-size: 11px; color: #ccc; } .msg_container { padding: 10px; overflow: hidden; display: flex; } .chatimg { display: block; width: 100%; } .avatar { position: relative; } .base_receive > .avatar:after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border: 5px solid #FFF; border-left-color: rgba(0, 0, 0, 0); border-bottom-color: rgba(0, 0, 0, 0); } .base_sent { justify-content: flex-end; align-items: flex-end; } .base_sent > .avatar:after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border: 5px solid white; border-right-color: transparent; border-top-color: transparent; box-shadow: 1px 1px 2px rgba(black, 0.2); // not quite perfect but close } .msg_sent > time{ float: right; } .msg_container_base::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5; } .msg_container_base::-webkit-scrollbar { width: 12px; background-color: #F5F5F5; } .msg_container_base::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #555; } .btn-group.dropup{ position:fixed; left:0px; bottom:0; } .panel-footer { padding: 10px 15px; background-color: #a5abf3; border-top: 1px solid #ddd; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } </style> <script src="js/jquery-3.3.1.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/modernizr.js"></script> <script src="js/select2.min.js"></script> <script src="js/jquery.menu-aim.js"></script> <script src="js/jquery-ui.js"></script> <script src="js/jquery.nice-select.min.js"></script> <script src="js/owl.carousel.js"></script> <!-- <script src="js/own-menu.js"></script> --> <script src="js/jquery.bxslider.min.js"></script> <script src="js/jquery.magnific-popup.js"></script> <script src="js/xpedia.js"></script> <!-- custom js--> <link href="https://cdn.jsdelivr.net/npm/lobibox@1.2.7/dist/css/lobibox.css" rel="stylesheet" /> <!-- <script src="https://cdn.jsdelivr.net/npm/lobibox@1.2.7/lib/jquery.1.11.js"></script> --> <script src="https://cdn.jsdelivr.net/npm/lobibox@1.2.7/dist/js/lobibox.min.js"></script> <script src='https://kit.fontawesome.com/a076d05399.js' crossorigin='anonymous'></script> </body> <script> //Get the button var mybutton = document.getElementById("myBtn"); var mybuttonchat = document.getElementById("myBtnChat"); // When the user scrolls down 20px from the top of the document, show the button window.onscroll = function() {scrollFunction()}; function scrollFunction() { if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) { mybutton.style.display = "block"; mybuttonchat.style.display = "block"; } else { mybutton.style.display = "none"; mybuttonchat.style.display = "none"; } } // When the user clicks on the button, scroll to the top of the document function topFunction() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; } function naviFunction() { window.location.href = "train_planned.html"; } function naviHome() { window.location.href = "index.php"; } function naviFunction() { let logUserid = document.getElementById(`logUserid`).value; var formData = new FormData(); formData.append('logUserid', logUserid); var req = getXmlHttpRequestObject(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { if (req.status == 200) { // alert(req.responseText); if(req.responseText == 1) { var subform = document.getElementById('subform'); var form = document.createElement("form"); form.method = 'POST'; form.action = 'train_planned.php'; var input1 = document.createElement('input'); input1.type = "hidden"; input1.name = "logUserid"; input1.value = logUserid; form.appendChild(input1); subform.appendChild(form); form.submit(); } else { Lobibox.notify('error', { size: 'normal', sound: false, title: 'Cannot access...', icon: 'fa fa-times-circle', msg: 'Please fill your details before create trip plan.' }); } } } } req.open("POST", 'sub_check_user_submit_details.php', true); req.send(formData); } } </script> <!-- Mirrored from xdemos.space/xpedia/car_checkout.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 30 Jun 2021 08:26:21 GMT --> </html>