<!DOCTYPE html>
<html>

  <!-- Original reference
        http://codepen.io/TestingWithJasmine/pen/bhvCL
      Theme:
        http://bootswatch.com/sandstone/
-->
  <head>
    <title>Local Weather</title>
    <!-- cdnjs.cloudflare.com -->
    <script data-require="jquery@2.0.3" data-semver="2.0.3" src="https://code.jquery.com/jquery-2.0.3.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.6/sandstone/bootstrap.min.css" rel="stylesheet" />
    
    
    
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.min.css" rel="stylesheet" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.min.js" type="text/javascript"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.min.js" type="text/javascript"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.min.js" type="text/javascript"></script>
    <!-- For testng a DOM event
      Reference:  https://github.com/velesin/jasmine-jquery
      Tutorial:
        http://www.htmlgoodies.com/beyond/javascript/js-ref/testing-dom-events-using-jquery-and-jasmine-2.0.html

      Employing the low volume cdn https://rawgit.com/
         the order of loading matters, jquery must be loaded first.
         https://rawgit.com/velesin/jasmine-jquery/master/lib/jasmine-jquery.js
    -->
  </head>

  <body>
    <!-- navbar - - - - - - - - - - - - - - - - - -  -->
    <div class="navbar navbar-default navbar-fixed-top">
      <!-- http://getbootstrap.com/examples/navbar-fixed-top/ -->
      <div class="container">
        <button data-target="#navbar-main" data-toggle="collapse" type="button" class="navbar-toggle collapsed" aria-expanded="false">
          <!-- Small responsive menu :) -->
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <div id="navbar-main" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li role="presentation">
              <a target="_blank" href="http://vividventures.biz/">
                <img title="Vivid Ventures" alt="gravatar" style="height:25px; width:25px" src="http://www.gravatar.com/avatar/c175f742f396370dd3738484f499e0ae" />
              </a>
            </li>
            <li role="presentation">
              <a target="_blank" href="http://accuweather.com/">
                <img title="Accuweather" alt="Accuweather" style="height:25px; width:25px" src="http://vortex.accuweather.com/adc2010/images/favicons/awx-2013-master.ico" />
              </a>
            </li>
            <li class="dropdown" role="presentation">
              <a aria-expanded="false" aria-haspopup="true" role="button" href="#" data-toggle="dropdown" class="dropdown-toggle">
      Other Resources                 <span class="caret"></span>
              </a>
              <ul class="dropdown-menu">
                <li role="presentation">
                  <a target="_blank" href="http://downloads.accuweather.com/"> Accuweather</a>
                </li>
                <li role="presentation">
                  <a target="_blank" href="http://openweathermap.org/"> Open weathermap</a>
                </li>
                <li role="presentation">
                  <a target="_blank" href="http://mesowest.org/api/">MesoWest api</a>
                </li>
                <li role="presentation">
                  <a target="_blank" href="http://www.wrh.noaa.gov/">WRH NOAA</a>
                </li>
              </ul>
            </li>
          </ul>
          <!-- /nav-tabs -->
        </div>
        <!-- /navbar-collaps -->
      </div>
      <!-- /continer -->
    </div>
    <!-- /navbar -->
    <!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - -  -->
    <div style="height: 30px"></div>
    <!--spacer fix start of body text  -->
    <div class="well">
      <h3> Show the local weather         <sup>
          <a target="_blank" href="https://www.freecodecamp.com/challenges/show-the-local-weather">1</a>
        </sup>
      </h3>
      <h4>
        Wherever you go, no matter what the weather, always bring your own sunshine.
                <small>
          <a target="_blank" href="http://www.brainyquote.com/quotes/keywords/weather.html">Anthony J. D'Angelo</a>
        </small>
      </h4>
    </div>
    <!-- /well -->
    <!-- Accuweather -->
    <a class="aw-widget-legal" href="http://www.accuweather.com/en/us/tacoma-wa/98402/current-weather/331423">
      <!--
By accessing and/or using this code snippet, you agree to AccuWeather’s terms and conditions (in English) which can be found at http://www.accuweather.com/en/free-weather-widgets/terms and AccuWeather’s Privacy Statement (in English) which can be found at http://www.accuweather.com/en/privacy.
-->
    </a>
    <div data-editlocation="true" data-uid="awtd1458271659344" data-useip="true" data-language="en-us" data-unit="f" data-locationkey="" class="aw-widget-36hour" id="awtd1458271659344"></div>
    <script src="http://oap.accuweather.com/launch.js" type="text/javascript"></script>
    <!-- End Accuweather -->
    <hr />
  </body>

</html>
/////////////////////////////////  
//  Tests
// 

describe("Accuweather widget", function() {
  it(" will need jQuery installed ", function() {
    expect( $.fn.jquery !== undefined ).toBe(true);
  });

  it("contains 36 hour information.", function() {
    //check to see if the div tag is installed
    var widgetInstalled = $("#awtd1458271659344").is(".aw-widget-36hour");
    expect( widgetInstalled ).toBe(true);
  });
});
/* Styles go here */

# Show the local weather
A solution to the FreeCodeCamp.com challenge [Show Weather](https://www.freecodecamp.com/challenges/show-the-local-weather)