weather

<div class='container' ng-app='app' ng-controller='weatherController'>
  <img class='background' src="https://images.unsplash.com/photo-1446426156356-92b664d86b77?crop=entropy&fit=crop&fm=jpg&h=650&ixjsv=2.1.0&ixlib=rb-0.3.5&q=80&w=1375" alt='background image'>
  <div class='content jumbotron'>
    <div class='row'>
      <div class='location-info' ng-show='!!weather'>
      <div class='well'>
        <h2>{{location.city}}</h2>
      </div>    
    </div>
    </div>
    <div class='row'>
      <div class='loading' ng-show='!weather'>
        <i class='fa fa-cog fa-spin'></i>
      </div>
      <div class='weather-info col-md-6 col-md-offset-3' ng-show='!!weather'>
        <div class='row'>          
          <div class='description col-md-4 well'>
            <p> {{weather.description}} </p>
            <div class='icon'>
              <img ng-src="{{weather.icon}}" alt="weather icon" />
            </div>
          </div>
          <div class='temp col-md-4 well'>
            <p>{{getTemp()}} <span ng-show='isMetric'>°C</span><span ng-show='!isMetric'>°F</span></p>
            <div class='temp-control'>
              <button class='btn btn-info' ng-class="{'disabled':isMetric}" ng-click='isMetric = true;'>°C</button>
              <button class='btn btn-info' ng-class="{'disabled':!isMetric}" ng-click='isMetric = false;'>°F</button>
            </div>
          </div>
          <div class='humidity col-md-4 well'>
            <p>{{weather.atmos.humidity}}% humidity</p>
            <p>{{getWind()}}</p>
          </div>
        <div>
      </div>
    </div>
  </div>
</div>