MainView.ux

<App ux:Class="MainView">
    <Font File="Raleway-Medium.ttf" ux:Global="Medium" />
    <Text ux:Class="Medium" Font="Medium" TextWrapping="Wrap" />

<JavaScript>
  var Observable = require('FuseJS/Observable');
  var env = require('FuseJS/Environment');
  var data = Observable("data");
  var sunny = Observable(true);
  if (env.mobile) {
  var GeoLocation = require("FuseJS/GeoLocation");
    debug_log("Init geo.");
    var immediateLocation = JSON.stringify(GeoLocation.location);
    console.log(immediateLocation)
  }
  else {
      debug_log("Not on mobile, so we don't have geo");
  }
    var url = "http://api.openweathermap.org/data/2.5/weather?lat=34.052235&lon=-118.243683&APPID=93d0a69709b00dd7053de487f94a6270" 
      fetch(url)
          .then(function(result) {
            return result.json();
          }).then(function(resultData){
            data.value = resultData["main"]["temp"]*(9/5)-459.67;
            var description = resultData["weather"][0].description;
            console.log(JSON.stringify(description));
            switch(description) {
              case 'clear sky':
                sunny.value = true;
                break;
              default:
                sunny.value = false;
            }
            console.log("HEY!!!!", data.value)
          });
          
        module.exports = {
          temp: data.map(function(val) {return parseInt(val).toFixed() + 'F' }),
          sunny: sunny,
        }

</JavaScript>
	<PageControl>
		<Page HitTestMode="LocalBoundsAndChildren" ClipToBounds="true" Color="#4A90E299">
        <WhileTrue Value="{sunny}">
        <fan.Artboard_2.Cloud ux:Name="cloud1" Width="40%" Height="30%" X="5%" Y="40%" >
                <Medium Value="{temp}" Width="50%" X="35%" Y="50%"/>

          <WhileTrue Value="True" Bypass="Never">
            <Cycle Target="cloud1.X" Low="-80" High="100" Waveform="Sawtooth" Frequency="0.05"/>
          </WhileTrue>
        </fan.Artboard_2.Cloud>
        <fan.Artboard_2.Cloud ux:Name="cloud2" Width="40%" Height="30%" X="40%" Y="60%" >
        </fan.Artboard_2.Cloud>
        <fan.Artboard_2.Cloud ux:Name="cloud3" Width="40%" Height="30%" X="60%" Y="10%" >
        </fan.Artboard_2.Cloud> 
        <fan.Artboard_2.Sun Width="70%" Height="40%" X="15%" Y="26%">
        </fan.Artboard_2.Sun>
      </WhileTrue> 
      <WhileFalse Value="{sunny}">
        <fan.Artboard_2_Copy.Group ux:Name="cloud4" Width="40%" Height="30%" X="5%" Y="40%" >
                        <Medium Value="{temp}" Width="50%" X="35%" Y="40%"/>

          <WhileTrue Value="True" Bypass="Never">
            <Cycle Target="cloud4.X" Low="-80" High="100" Waveform="Sawtooth" Frequency="0.05"/>
          </WhileTrue>
        </fan.Artboard_2_Copy.Group>
        <fan.Artboard_2_Copy.Group ux:Name="cloud5" Width="40%" Height="30%" X="40%" Y="60%" >
        </fan.Artboard_2_Copy.Group>
        <fan.Artboard_2_Copy.Group ux:Name="cloud6" Width="40%" Height="30%" X="60%" Y="10%" >
        </fan.Artboard_2_Copy.Group> 
        <fan.Dark_Sun.DarkSun Width="70%" Height="40%" X="15%" Y="26%">
        </fan.Dark_Sun.DarkSun>
      </WhileFalse>

		</Page>
	</PageControl>
</App>