mwangibrian21

Untitled

Jan 13th, 2018
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
XML 5.97 KB | None | 0 0
  1. <App Background="Black">
  2.  
  3.     <JavaScript>
  4.         var Observable = require("FuseJS/Observable");
  5.         var GeoLocation = require("FuseJS/GeoLocation");
  6.         var longitude = Observable();
  7.         var latitude = Observable();
  8.         var userfullnames = Observable();
  9.         var userphonenumber = Observable();
  10.         var carnumberplate = Observable();
  11.         var carmodel = Observable();
  12.         var carproblemdetails = Observable();
  13.  
  14.         // Continuous
  15.         var continuousLocation = GeoLocation.observe("changed").map(JSON.stringify);
  16.  
  17.         GeoLocation.on("error", function(fail) {
  18.             console.log("GeoLocation error " + fail);
  19.         });
  20.  
  21.         GeoLocation.on("changed", function(location) {
  22.             latitude.value = location.latitude.toFixed(3);
  23.             longitiude.value = location.longitude.toFixed(3);
  24.         });
  25.  
  26.         function startContinuousListener() {
  27.             var intervalMs = 1000;
  28.             var desiredAccuracyInMeters = 10;
  29.             GeoLocation.startListening(intervalMs, desiredAccuracyInMeters);
  30.         }
  31.  
  32.         function stopContinuousListener() {
  33.             GeoLocation.stopListening();
  34.         }
  35.  
  36.         function gotomainpage() {
  37.             router.goto("mainpage");
  38.         }
  39.         function gotodetailspage() {
  40.             stopContinuousListener();
  41.             router.goto("detailspage");
  42.         }
  43.  
  44.         function sendBreakdownRequest() {
  45.             requestObject = {
  46.                 names : userfullnames,
  47.                 phonenumber : userphonenumber,
  48.                 carnumberplate : carnumberplate,
  49.                 carmodel : carmodel,
  50.                 problem : carproblemdetails,
  51.                 latitude : latitude,
  52.                 longitude : longitude
  53.             };
  54.  
  55.             fetch('http://fundis.co.ke/fundisapp/breakdowntest.php', {
  56.                 method: 'POST',
  57.                 headers: { "Content-type": "application/json"},
  58.                 body: JSON.stringify(requestObject)
  59.             }).then(function(response) {
  60.                 status = response.status;  // Get the HTTP status code
  61.                 response_ok = response.ok; // Is response.status in the 200-range?
  62.                 return response.json();    // This returns a promise
  63.             }).then(function(responseObject) {
  64.                 // Do something with the result
  65.             }).catch(function(err) {
  66.                 // An error occurred somewhere in the Promise chain
  67.             });
  68.         }
  69.  
  70.         module.exports =  {
  71.             userfullnames : userfullnames,
  72.             userphonenumber : userphonenumber,
  73.             carnumberplate : carnumberplate,
  74.             carmodel : carmodel,
  75.             carproblemdetails : carproblemdetails,
  76.             longitude : longitude,
  77.             latitude : latitude,
  78.             gotomainpage : gotomainpage,
  79.             gotodetailspage : gotodetailspage,
  80.             sendBreakdownRequest : sendBreakdownRequest,
  81.             startContinuousListener : startContinuousListener,
  82.             stopContinuousListener : stopContinuousListener,
  83.             continuousLocation : continuousLocation
  84.         };
  85.  
  86.     </JavaScript>
  87.  
  88.     <StatusBarBackground Dock="Top" />
  89.     <BottomBarBackground Dock="Bottom" />
  90.     <Android.StatusBarConfig Color="Black" />
  91.     <Font File="Assets/LemonMilk.otf" ux:Global="myfirstfont" />
  92.     <Font File="Assets/Carbax.otf" ux:Global="mysecondfont" />
  93.     <Router ux:Name="router" />
  94.  
  95.     <TextInput ux:Class="MyTextInput" FontSize="21" Font="mysecondfont" PlaceholderColor="#ccc" TextColor="White" Padding="5" Width="300" >
  96.         <Rectangle Layer="Background" CornerRadius="3">
  97.             <Stroke Width="2" Color="#ccc" />
  98.         </Rectangle>
  99.     </TextInput>
  100.  
  101.     <Button ux:Class="MyButton" Alignment="Center" Color="#25a" Padding="10,10,10,10" >
  102.         <Rectangle Layer="Background" Background="White" CornerRadius="3" />
  103.     </Button>
  104.  
  105.     <ClientPanel>
  106.         <PageControl>
  107.             <Panel ux:Name="splashpage" Background="Black" >
  108.                 <Image File="Assets/bg.jpg" StretchMode="UniformToFill" Layer="Background">
  109.                     <Blur />
  110.                 </Image>
  111.  
  112.                 <StackPanel Alignment="Center" >
  113.                     <Text Value="BreaKE" FontSize="70" Font="myfirstfont" Color="Black" Alignment="Center" />
  114.                     <Text Value="breakdown services on the go" FontSize="18" Font="mysecondfont" Color="Black" Alignment="Center" Margin="0,0,0,20"/>
  115.  
  116.                     <MyButton Text="Touch to proceed" Clicked="{gotomainpage}" />  
  117.                 </StackPanel>
  118.             </Panel>
  119.  
  120.             <Panel ux:Name="mainpage" Background="Black" Clicked="{gotodetailspage}" >
  121.                 <DockPanel>
  122.                     <Rectangle Dock="Top" Color="Black" Height="70" Width="110%">
  123.                         <Text Value="SET LOCATION" Font="myfirstfont" Alignment="Center" Color="White" FontSize="21" />
  124.                         <Stroke Width="2" Color="#ccc" />
  125.                     </Rectangle>
  126.  
  127.                     <Panel>
  128.                         <NativeViewHost Layer="Background">
  129.                             <MapView ShowMyLocation="True" ShowMyLocationButton="true" ShowCompass="True" Latitude="{latitude}" Longitude="{longitude}" Zoom="10">
  130.                                 <MapMarker Latitude="{latitude}" Longitude="{longitude}" Label="Your location"/>
  131.                             </MapView>
  132.                         </NativeViewHost>
  133.                     </Panel>
  134.  
  135.                     <Rectangle Dock="Bottom" Color="White" Height="70" Width="110%">
  136.                         <MyButton Text="Touch to proceed" Clicked="{gotodetailspage}" />
  137.                         <Stroke Width="2" Color="#ccc" />
  138.                     </Rectangle>
  139.                 </DockPanel>
  140.             </Panel>
  141.  
  142.             <Panel ux:Name="detailspage" Background="Black" >
  143.                 <DockPanel>
  144.                     <Rectangle Dock="Top" Color="Black" Height="70" Width="110%">
  145.                         <Text Value="DETAILS" Font="myfirstfont" Alignment="Center" Color="White" FontSize="21" />
  146.                         <Stroke Width="2" Color="#ccc" />
  147.                     </Rectangle>
  148.  
  149.                     <Rectangle Dock="Top" Color="Black" Height="50" Width="110%">
  150.                         <Text Value="enter all details for clarity" Font="mysecondfont" Alignment="Center" Color="White" FontSize="21" />
  151.                     </Rectangle>
  152.  
  153.                     <StackPanel Alignment="Top" ItemSpacing="10" >
  154.                         <MyTextInput Value="{userfullnames}" PlaceholderText="Full Names" />
  155.                         <MyTextInput Value="{userphonenumber}" PlaceholderText="Phone Number" InputHint="Phone" />
  156.                         <MyTextInput Value="{carnumberplate}" PlaceholderText="Car Numberplate" />
  157.                         <MyTextInput Value="{carmodel}" PlaceholderText="Car Model" />
  158.                         <MyTextInput Value="{carproblemdetails}" PlaceholderText="Brief problem description" Height="100" TextWrapping="Wrap" />               
  159.  
  160.                         <MyButton Text="Request breakdown" Margin="0,20,0,0" Clicked="{sendBreakdownRequest}" />
  161.                     </StackPanel>
  162.                 </DockPanel>
  163.  
  164.             </Panel>       
  165.         </PageControl>
  166.     </ClientPanel>
  167.  
  168. </App>
Add Comment
Please, Sign In to add comment