zurb-foundation-5 5.2.2

data/spec/alert/basic.html

@@ -0,0 +1,4 @@
+<div data-alert class="alert-box">
+  <div id="myAlert">My Alert</div>
+  <a href="#" class="close">&times;</a>
+</div>

data/spec/clearing/basic.html

@@ -0,0 +1,5 @@
+<ul class="clearing-thumbs" data-clearing>
+  <li id="image1"><a href="/base/spec/clearing/ccc.gif"><img src="/base/spec/clearing/ccc.gif"></a></li>
+  <li id="image2"><a href="/base/spec/clearing/777.gif"><img src="/base/spec/clearing/777.gif"></a></li>
+  <li id="image3"><a href="/base/spec/clearing/222.gif"><img src="/base/spec/clearing/222.gif"></a></li>
+</ul>

data/spec/clearing/clearing.js

@@ -0,0 +1,55 @@
+describe('clearing:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place clearing-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+
+  describe('basic clearing', function() {
+    beforeEach(function() {
+      document.body.innerHTML = __html__['spec/clearing/basic.html'];
+    });
+
+    // TODO: Disabled - PhantomJS fails during Travis for this but works during watch...needs investigation.
+    xit('displays the first image on click', function() {
+      $(document).foundation();
+
+      $('#image1').click();
+
+      expect($('#image1').hasClass('visible')).toBe(true);
+      expect($('#image2').hasClass('visible')).toBe(false);
+      expect($('#image3').hasClass('visible')).toBe(false);
+    });
+
+  // TODO: Disabled - PhantomJS fails during Travis for this but works during watch...needs investigation.
+      xit('displays the second image on click', function() {
+      $(document).foundation();
+
+      $('#image2').click();
+
+      expect($('#image1').hasClass('visible')).toBe(false);
+      expect($('#image2').hasClass('visible')).toBe(true);
+      expect($('#image3').hasClass('visible')).toBe(false);
+    });
+
+    // TODO: Works in Firefox but nowhere else... disabling test until this is figured out.
+    xit('goes to the next slide on next', function() {
+      $(document).foundation();
+
+      $('#image1').click();
+
+      $('.clearing-main-next').click();
+
+      expect($('#image1').hasClass('visible')).toBe(false);
+      expect($('#image2').hasClass('visible')).toBe(true);
+      expect($('#image3').hasClass('visible')).toBe(false);
+    });
+  });
+});

data/spec/dropdown/basic.html

@@ -0,0 +1,10 @@
+<a id="drop1link" href="#" data-dropdown="drop1">Has Dropdown</a>
+<ul id="drop1" class="f-dropdown" data-dropdown-content>
+  <li><a href="#">This is a link</a></li>
+  <li><a href="#">This is another</a></li>
+  <li><a href="#">Yet another</a></li>
+</ul>
+<a id="drop2link" href="#" data-dropdown="drop2">Has Content Dropdown</a>
+<div id="drop2" data-dropdown-content class="f-dropdown content">
+  <p>Some text that people will think is awesome! Some text that people will think is awesome! Some text that people will think is awesome!</p>
+</div>

data/spec/dropdown/dropdown.js

@@ -0,0 +1,65 @@
+describe('dropdown:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place dropdown-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+
+ describe('basic clearing', function() {
+    beforeEach(function() {
+      document.body.innerHTML = __html__['spec/dropdown/basic.html'];
+    });
+
+    it('is hidden on initialization', function() {
+      $(document).foundation();
+
+      expect($('#drop1').hasClass('open')).toBe(false);
+      expect($('#drop2').hasClass('open')).toBe(false);
+    });
+
+    it('displays the dropdown on click', function() {
+      $(document).foundation();
+
+      $('#drop1link').click();
+
+      expect($('#drop1').hasClass('open')).toBe(true);
+      expect($('#drop2').hasClass('open')).toBe(false);
+    });
+
+    it('displays the content dropdown on click', function() {
+      $(document).foundation();
+
+      $('#drop2link').click();
+
+      expect($('#drop1').hasClass('open')).toBe(false);
+      expect($('#drop2').hasClass('open')).toBe(true);
+    });
+
+    it('closes an open dropdown when another is clicked', function() {
+      $(document).foundation();
+
+      $('#drop1link').click();
+      $('#drop2link').click();
+
+      expect($('#drop1').hasClass('open')).toBe(false);
+      expect($('#drop2').hasClass('open')).toBe(true);
+    });
+
+    it('closes an open dropdown when the document is clicked elsewhere', function() {
+      $(document).foundation();
+
+      $('#drop1link').click();
+      $('body').click();
+
+      expect($('#drop1').hasClass('open')).toBe(false);
+      expect($('#drop2').hasClass('open')).toBe(false);
+    });
+ });
+});

data/spec/equalizer/basic.html

@@ -0,0 +1,24 @@
+<div class="row" data-equalizer="">
+  <div class="small-4 columns">
+    <div class="panel" data-equalizer-watch="" id="watchee1">
+      <h3>Panel 1</h3>
+      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante.</p>
+    </div>
+  </div>
+  <div class="small-4 columns">
+    <div class="callout panel" data-equalizer-watch="" id="watchee2">
+      <h3>Panel 2</h3>
+      <ul>
+         <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
+         <li>Aliquam tincidunt mauris eu risus.</li>
+         <li>Vestibulum auctor dapibus neque.</li>
+      </ul>
+    </div>
+  </div>
+  <div class="small-4 columns">
+    <div class="panel" data-equalizer-watch="" id="watchee3">
+      <h3>Panel 3</h3>
+      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
+    </div>
+  </div>
+</div>

data/spec/equalizer/equalizer.js

@@ -0,0 +1,30 @@
+describe('equalizer:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place equalize-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+
+  describe('basic height', function() {
+    beforeEach(function() {
+      document.body.innerHTML = __html__['spec/equalizer/basic.html'];
+    });
+
+    it('should have equal heights on load', function() {
+      $(document).foundation();
+
+      var equalized = $('[data-equalizer-watch]');
+
+      equalized.each(function(){
+        expect($(this).outerHeight()).toBe(equalized.first().outerHeight());
+      });
+    });
+  });
+});

data/spec/framework/framework.js

@@ -0,0 +1,14 @@
+describe('Foundation Framework:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place framework-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/helpers.js

@@ -0,0 +1,37 @@
+function when(size, testFunc) {
+  $(document).foundation();
+  if (matchMedia(Foundation.media_queries[size]).matches) {
+    return testFunc;
+  } else {
+    return function() {};
+  }
+}
+
+function when_not(size, testFunc) {
+  $(document).foundation();
+  if (!matchMedia(Foundation.media_queries[size]).matches) {
+    return testFunc;
+  } else {
+    return function() {};
+  }
+}
+
+beforeEach(function() {
+  jasmine.Clock.useMock();
+
+  if($('head').has('#foundation-style').length === 0) {
+    $('head').append('<style id="foundation-style"></style>')
+  }
+
+  $.ajax({ url: '/base/dist/assets/css/normalize.css', cache: false, async: false, success: function(data) {
+    $('#foundation-style').html(data);
+  }});
+
+  $.ajax({ url: '/base/dist/assets/css/foundation.css', cache: false, async: false, success: function(data) {
+    $('#foundation-style').append(data);
+  }});
+});
+
+afterEach(function() {
+  $('body').empty().removeClass();
+});

data/spec/interchange/basic.html

@@ -0,0 +1,3 @@
+<div data-interchange="[default.html, (default)], [medium.html, (medium)], [large.html, (large)]">
+  <h1 id="default">DEFAULT</h1>
+</div>

data/spec/interchange/interchange.js

@@ -0,0 +1,60 @@
+describe('interchange:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place interchange-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+
+    spyOn($, 'get').andCallFake(function(path, callback) {
+      switch(path) {
+        case 'default.html':
+          callback('<h1 id="default">DEFAULT</h1>');
+        case 'medium.html':
+          callback('<h1 id="medium">MEDIUM</h1>');
+        case 'large.html':
+          callback('<h1 id="large">LARGE</h1>');
+      }
+    });
+  });
+
+  describe('when below the large breakpoint', when_not('large', function() {
+    describe('when below the medium breakpoint', when_not('medium', function() {
+      describe('with html content interchange', function() {
+        beforeEach(function() {
+          document.body.innerHTML = __html__['spec/interchange/basic.html'];
+        });
+
+        it('shows the default html content', function() {
+          $(document).foundation();
+
+          expect($('[data-interchange]').length).toBe(1);
+          expect($('#medium').length).toBe(0);
+          expect($('#large').length).toBe(0);
+        });
+      });
+    }));
+  }));
+
+  describe('when above the large breakpoint', when('large', function() {
+      describe('with html content interchange', function() {
+        beforeEach(function() {
+          document.body.innerHTML = __html__['spec/interchange/basic.html'];
+        });
+
+        // Disabling for now... HTML partials may be misbehaving.
+        xit('shows the large html content', function() {
+          $(document).foundation();
+
+          expect($('#default').length).toBe(0);
+          expect($('#medium').length).toBe(0);
+          expect($('#large').length).toBe(1);
+        });
+      });
+  }));
+});

data/spec/joyride/joyride.js

@@ -0,0 +1,14 @@
+describe('joyride:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place joyride-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/magellan/magellan.js

@@ -0,0 +1,14 @@
+describe('magellan:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place magellan-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/offcanvas/offcanvas.js

@@ -0,0 +1,14 @@
+describe('offcanvas:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place offcanvas-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/orbit/orbit.js

@@ -0,0 +1,14 @@
+describe('orbit:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place orbit-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/reveal/reveal.js

@@ -0,0 +1,14 @@
+describe('reveal:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place reveal-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/tab/tab.js

@@ -0,0 +1,14 @@
+describe('tab:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place tab-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/tooltip/tooltip.js

@@ -0,0 +1,14 @@
+describe('tooltip:', function() {
+  beforeEach(function() {
+    this.addMatchers({
+      // Place tooltip-specific matchers here...
+    });
+
+    var origFunc = $.fn.foundation;
+    spyOn($.fn, 'foundation').andCallFake(function() {
+      var result = origFunc.apply(this, arguments);
+      jasmine.Clock.tick(1000); // Let things settle...
+      return result;
+    });
+  });
+});

data/spec/topbar/multidropdown.html

@@ -0,0 +1,60 @@
+<nav class="top-bar" data-topbar>
+  <ul class="title-area">
+    <li class="name">
+      <h1><a href="#">Top Bar Title</a></h1>
+    </li>
+    <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
+  </ul>
+
+  <section class="top-bar-section">
+    <ul class="left">
+      <li class="divider"></li>
+      <li class="active"><a href="#">Main Item 1</a></li>
+      <li class="divider"></li>
+      <li class="has-dropdown"><a href="#">Main Item 2</a>
+
+        <ul class="dropdown">
+          <li class="has-dropdown"><a href="#">Dropdown Level 1a</a>
+
+            <ul class="dropdown">
+              <li><label>Dropdown Level 2 Label</label></li>
+              <li><a href="#">Dropdown Level 2a</a></li>
+              <li class="has-dropdown"><a href="#">Dropdown Level 2b</a>
+
+                <ul class="dropdown">
+                  <li><label>Dropdown Level 3 Label</label></li>
+                  <li><a href="#">Dropdown Level 3a</a></li>
+                  <li><a href="#">Dropdown Level 3b</a></li>
+                  <li class="divider"></li>
+                  <li><a href="#">Dropdown Level 3c</a></li>
+                </ul>
+              </li>
+              <li><a href="#">Dropdown Level 2c</a></li>
+            </ul>
+          </li>
+          <li><a href="#">Dropdown Level 1b</a></li>
+          <li><a href="#">Dropdown Level 1c</a></li>
+        </ul>
+      </li>
+      <li class="divider"></li>
+    </ul>
+
+    <!-- Right Nav Section -->
+    <ul class="right">
+      <li class="divider hide-for-small"></li>
+      <li class="has-dropdown"><a href="#">Main Item 3</a>
+
+        <ul class="dropdown">
+          <li><label>Dropdown Level 1 Label</label></li>
+          <li class="has-dropdown"><a href="#" class="">Dropdown Level 1a</a>
+
+            <ul class="dropdown">
+              <li><a href="#">Dropdown Level 2a</a></li>
+              <li><a href="#">Dropdown Level 2b</a></li>
+            </ul>
+          </li>
+        </ul>
+      </li>
+    </ul>
+  </section>
+</nav>