Add qunit submodule and javascript tests for slider_navigation

.gitmodules

 [submodule "library/storm"]
 	path = library/storm
 	url = git@git.afi-sa.fr:afi/storm.git
+[submodule "tests_js/lib/qunit-phantomjs-runner"]
+	path = tests_js/lib/qunit-phantomjs-runner
+	url = http://git.afi-sa.fr/afi/qunit-phantomjs-runner.git

public/opac/java/slider_navigation/slider.css

+.slider_button {
+    background: url('../../images/buttons/green_button.png') no-repeat 0px 0px;
+}
+
+* {
+    color: red;
+}
\ No newline at end of file

public/opac/java/slider_navigation/slider_navigation.js

+/**
+ * Copyright (c) 2014, Agence Française Informatique (AFI). All rights reserved.
+ *
+ * AFI-OPAC 2.0 is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE as published by
+ * the Free Software Foundation.
+ *
+ * There are special exceptions to the terms and conditions of the AGPL as it
+ * is applied to this software (see README file).
+ *
+ * AFI-OPAC 2.0 is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * along with AFI-OPAC 2.0; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301  USA 
+ */
+(function ( $ ) {
+  $.fn.slider_navigation = function (base_url, button_strategy) {
+    
+    if ($('head').find('link[href*="slider.css"]').length < 1) {
+      $('head').append('<link media="screen" href="' + base_url + '/slider.css" rel="stylesheet" type="text/css"></link>');
+    }
+
+    var html = $(this);
+    var articles = html.find('article');
+
+    if(!articles.length>0){
+      return $(this);
+    }
+
+    prepareHtml();
+
+    var news_row = html.find('div.news_row');
+    var article_size = html.find('article:first-child').width();
+    var position = 0;
+
+    var strategy;
+
+    initArticles();
+
+    if(button_strategy === "next"){
+      strategy = new Strategy_Next_Previous(html, articles, article_size, news_row);
+    } else {
+      strategy = new Strategy(html, articles, article_size, position, news_row);
+    }
+
+    html = strategy.createButton();
+    html = strategy.implementsButtons();
+
+    function prepareHtml() {
+      html.find('div.article_full_separator').remove();
+      articles.wrapAll('<div class="news_row"></div>');
+      html.find('div.news_row').wrap('<div class="window"></div>');
+      html.find('div.window').wrap('<div class="slider_navigation"></div>');
+      html.find('div.slider_navigation').append('<div class="slider_navigation_controls"></div>');
+    }
+
+
+    function initArticles() {
+      news_row.css('margin-left', position+'px');
+      news_row.width(articles.length*article_size);
+    }
+  };
+
+
+  var initCssForHorizontalSlideOnElement = function(element, length) {
+    return element.css({'margin-left': length+'px', 
+			'transition-property': 'all', 
+			'transition-duration': '0.8s'});
+  }
+
+
+  var Strategy = function(html, articles, article_size, position, news_row) {
+    var html = html;
+    var articles = articles;
+    var article_size = article_size;
+    var position = position;
+    var news_row = news_row;
+    
+    this.createButton = function() {
+      var slider_controls = html.find('div.slider_navigation_controls');
+      articles.each(function(index) {
+	slider_controls.append('<div class="slider_button" data-article="'+(index+=1)+'"></div>');
+      });
+      return html;
+    };
+
+    this.implementsButtons = function() {
+      html.find('div[data-article=1]').addClass('selected');
+      var current_position = 0;
+
+      html.find('div[data-article]').click(function() {
+	
+	html.find('div[data-article]').removeClass('selected');
+	$(this).addClass('selected');
+
+	current_position = $(this).data('article');
+
+	position = (-1) * (current_position-1) * article_size;
+	
+	initCssForHorizontalSlideOnElement(news_row, position);
+      });
+      return html;
+    }
+  };
+
+
+
+  var Strategy_Next_Previous = function(html, articles, article_size, news_row) {
+    var html = html;
+    var articles = articles;
+    var article_size = article_size;
+    var news_row = news_row;
+
+    this.createButton = function() {
+      html.find('div.slider_navigation_controls')
+	.append('<div class="slider_button" data-event="previous"></div>')
+	.append('<div class="slider_button" data-event="next"></div>');
+      return html;
+    };
+
+    this.implementsButtons = function() {
+      var right_cleat = ((articles.length * article_size) - article_size) * (-1);
+      var left_cleat = 0;
+
+      html.find('div[data-event="next"]').click(function() {
+	var old_margin = parseInt( news_row.css('margin-left'));
+	var length = (old_margin > right_cleat && (old_margin % article_size == 0)) 
+	  ? old_margin - article_size 
+	  : right_cleat;
+
+	initCssForHorizontalSlideOnElement(news_row, length);
+      });
+
+
+      html.find('div[data-event="previous"]').click(function() {
+	var old_margin = parseInt( news_row.css('margin-left'));
+	var length = (old_margin < left_cleat && (old_margin % article_size == 0)) 
+	  ? old_margin + article_size 
+	  : 0;
+
+	initCssForHorizontalSlideOnElement(news_row, length);
+      });
+
+      return html;
+    }
+  };
+
+} (jQuery));

public/opac/java/slider_navigation/tests/agenda_slider.html

+<!DOCTYPE html>
+<!--
+/**
+ * Copyright (c) 2012, Agence Française Informatique (AFI). All rights reserved.
+ *
+ * AFI-OPAC 2.0 is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE as published by
+ * the Free Software Foundation.
+ *
+ * There are special exceptions to the terms and conditions of the AGPL as it
+ * is applied to this software (see README file).
+ *
+ * AFI-OPAC 2.0 is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * along with AFI-OPAC 2.0; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301  USA 
+ */
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>QUnit tests</title>
+  <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css">
+</head>
+<body>
+  <div id="qunit"></div>
+  <div id="qunit-fixture"></div>
+  <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
+  <script src="../slider_navigation.js"></script>
+  <script src="http://code.jquery.com/qunit/qunit-1.13.0.js"></script>
+  <script src="agenda_slider_test.js"></script>
+</body>
+</html>

public/opac/java/slider_navigation/tests/agenda_slider_test.js

+/**
+ * Copyright (c) 2014, Agence Française Informatique (AFI). All rights reserved.
+ *
+ * AFI-OPAC 2.0 is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE as published by
+ * the Free Software Foundation.
+ *
+ * There are special exceptions to the terms and conditions of the AGPL as it
+ * is applied to this software (see README file).
+ *
+ * AFI-OPAC 2.0 is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * along with AFI-OPAC 2.0; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301  USA 
+ */
+var fixture;
+
+QUnit.module('slider_navigation', {
+  setup: function() {
+
+    fixture = $('<div>'
+		+'<article style="width:50px;">Bokeh</article>'
+		+'<article>Biquette</article>'
+		+'<article>Bokeh la biquette</article>'
+		+'</div>');
+
+    fixture.slider_navigation('../', 'next');
+  }
+});
+
+
+test('slider buttons should be next_event type', function() {
+  deepEqual(fixture.find('div.slider_button[data-event="next"], div.slider_button[data-event="previous"]').length, 2, fixture.html());
+});
+
+
+test('Click on next button should display "Biquette"', function() {
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '-50px', fixture.html());
+});
+
+
+test('Click on next then previous should display "Bokeh"', function() {
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="previous"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '0px', fixture.html());
+});
+
+
+test('Click 2 times on next should display "Bokeh la biquette"', function() {
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '-100px', fixture.html());
+});
+
+
+test('Click 2 times on  next then click on previous should display "Biquette"', function() {
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="previous"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '-50px', fixture.html());
+});
+
+
+test('Click 3 times on  next should display "Bokeh la biquette"', function() {
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  fixture.find('div.slider_button[data-event="next"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '-100px', fixture.html());
+});
+
+
+test('Click on previous should stay on "Bokeh"', function() {
+  fixture.find('div.slider_button[data-event="previous"]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '0px', fixture.html());
+});

public/opac/java/slider_navigation/tests/news_slider.html

+<!DOCTYPE html>
+<!--
+/**
+ * Copyright (c) 2012, Agence Française Informatique (AFI). All rights reserved.
+ *
+ * AFI-OPAC 2.0 is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE as published by
+ * the Free Software Foundation.
+ *
+ * There are special exceptions to the terms and conditions of the AGPL as it
+ * is applied to this software (see README file).
+ *
+ * AFI-OPAC 2.0 is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * along with AFI-OPAC 2.0; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301  USA 
+ */
+-->
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>QUnit tests</title>
+  <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-git.css">
+</head>
+<body>
+  <div id="qunit"></div>
+  <div id="qunit-fixture"></div>
+  <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
+  <script src="../slider_navigation.js"></script>
+  <script src="http://code.jquery.com/qunit/qunit-1.13.0.js"></script>
+  <script src="news_slider_test.js"></script>
+</body>
+</html>

public/opac/java/slider_navigation/tests/news_slider_test.js

+/**
+ * Copyright (c) 2014, Agence Française Informatique (AFI). All rights reserved.
+ *
+ * AFI-OPAC 2.0 is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE as published by
+ * the Free Software Foundation.
+ *
+ * There are special exceptions to the terms and conditions of the AGPL as it
+ * is applied to this software (see README file).
+ *
+ * AFI-OPAC 2.0 is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU AFFERO GENERAL PUBLIC LICENSE for more details.
+ *
+ * You should have received a copy of the GNU AFFERO GENERAL PUBLIC LICENSE
+ * along with AFI-OPAC 2.0; if not, write to the Free Software
+ * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301  USA 
+ */
+var fixture;
+var html = $('html');
+html.find('div').css('color', 'green');
+QUnit.module('slider_navigation', {
+  setup: function() {
+
+    fixture = $('<div>'
+		+'<article style="width:50px;">Bokeh</article>'
+		+'<div class="article_full_separator"></div>'
+		+'<article>Biquette</article>'
+		+'</div>');
+
+    fixture.slider_navigation("..");
+  }
+});
+
+test('no articles should return', function() {
+  var empty = $('<body><div><div></div></div></body>');
+  empty.slider_navigation();
+  deepEqual(empty.find('div').length, 1, empty.html());
+});
+
+
+test('div.article_full_separator should have been delete', function() {
+  deepEqual(fixture.find('div.article_full_separator').length, 0, fixture.html());
+});
+
+
+test('control button for article Bokeh should be set as button 1', function() {
+  deepEqual(fixture.find('div.slider_button[data-article=1]').length, 1, fixture.html());
+});
+
+
+test('control button for article Biquette should be set as button 2', function() {
+  deepEqual(fixture.find('div.slider_button[data-article=2]').length, 1, fixture.html());
+});
+
+
+test('articles should be wrapped in div.news_row', function() {
+  deepEqual(fixture.find('div.news_row article').length, 2, fixture.html());
+});
+
+
+test('div.news_row should be wrapped in div.window', function() {
+  deepEqual(fixture.find('div.window div.news_row').length, 1, fixture.html());
+});
+
+
+test('div.window and div.slider_navigation_controls should be wrapped in div.slider_navigation', function() {
+  deepEqual(fixture.find('div.slider_navigation div.window, div.slider_navigation div.slider_navigation_controls').length, 2, fixture.html());
+});
+
+
+test('slider buttons should be wrapped in div.slider_navigation_controls', function() {
+  deepEqual(fixture.find('div.slider_navigation_controls div.slider_button').length, 2, fixture.html());
+});
+
+
+test('first slider buttons should be selected', function() {
+  deepEqual(fixture.find('div.slider_button.selected').length, 1, fixture.html());
+});
+
+
+test('click slider buttons should select it', function() {
+  fixture.find('div.slider_button[data-article=2]').trigger('click');
+  deepEqual(fixture.find('div.slider_button[data-article=2].selected').length, 1, fixture.html());
+});
+
+
+test('only one slider buttons should be selected', function() {
+  fixture.find('div.slider_button[data-article=2]').trigger('click');
+  deepEqual(fixture.find('div.slider_button[data-article].selected').length, 1, fixture.html());
+});
+
+
+test('div.news_row should be at position 1', function() {
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '0px', fixture.html());
+});
+
+
+test('div.news_row should be at position 2', function() {
+  fixture.find('div.slider_button[data-article=2]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '-50px', fixture.html());
+});
+
+
+test('div.news_row should be at position 2', function() {
+  fixture.find('div.slider_button[data-article=2]').trigger('click');
+  fixture.find('div.slider_button[data-article=1]').trigger('click');
+  deepEqual(fixture.find('div.news_row').css('margin-left'), '0px', fixture.html());
+});
+
+
+test('div.news_row width should be 100px', function() {
+  deepEqual(fixture.find('div.news_row').width(), 100, fixture.html());
+});
+
+
+test('slider.css should be loaded only once', function() {
+  deepEqual(html.find('link[href*="slider.css"]').length, 1, html.html());
+});

public/opac/java/slider_navigation/tests/qunit-phantomjs-runner

+../../../../../tests_js/lib/qunit-phantomjs-runner
\ No newline at end of file

public/opac/java/slider_navigation/tests/run.sh

+#!/bin/sh
+
+MY_DIR="$(dirname "${BASH_SOURCE[0]}")"
+
+phantomjs $MY_DIR/qunit-phantomjs-runner/runner.js $MY_DIR/news_slider.html
+phantomjs $MY_DIR/qunit-phantomjs-runner/runner.js $MY_DIR/agenda_slider.html

qunit-phantomjs-runner @ 86c8c41c

+Subproject commit 86c8c41c95cbc17a2753ce141357021a4263a58a