feat: completed presentation

README.md

@@ -1,5 +1,5 @@
 # Presentation for the Methoden des IT-Projektmanagement Case Study
 <center>Ulm University, SoSe 2022</center>
-<center>Group: Yannik Bretschneider, Jonas Schwedler, Megi Hoxhalli, Sebastian Wünsch, Jana Leinmüller</center>
+<center>Group: Sebastian Wünsch, Yannik Bretschneider, Jonas Schwedler, Megi Hoxhalli,  Jana Leinmüller</center>
 
 To view, clone the Git repo, and open the `index.html` file in a browser, or run `npm start` to start a development server.

SprintPlanningSpreadsheet.csv

@@ -0,0 +1,79 @@
+Team Product Page Backlog,,,,,,,,,,,Ranking,High,Sprints,PI2 - Sprint 1
+Total Capacity,,Testing Capacity,,per Sprint,,,,,,,,Medium,,PI2 - Sprint 2
+189,,0 (because Test-Driven Development),,31.5,,,,,,,,Low,,PI2 - Sprint 3
+,,,,,,,,,,,,,,PI2 - Sprint 4
+,,,,,,,,,,,,,,PI2 - Sprint 5
+,,,,,,,,,,,,,,PI2 - Sprint 6
+,,,,,,,,,,,,,,
+,,,,,,,,,,,,,,
+,,,,,,,,,,,,,,
+,,,,,,,,,,,,,,
+,,,,,,,,,,,,,,
+Feature ID,Feature (Short Description),Description,Acceptance Criteria,Priority,Rank,Size,Dependency,Risk,Sprint assigned,,,,,
+SFEAT00124,Product Title Display,"As a customer, I want to see a unique identifiable product title, so that I can intuitively identify the product across the website. ",1. Display the title at the top of the website next to the picture on the right side.,High,7,3,Testing Accuracy Increase,,PI2 - Sprint 2,,,,,
+SFEAT00114,Product Page Picture and Alternate Views Display,"As a customer, I need to have as many visual information as possible, so that I can get a good overview of the various parts of the product.","1. The main picture shall be displayed on the top left of the product page.
+1.2. Customer shall be able to zoom into main picture displayed. 
+1.3. Main picture shall be changing according to selection from entire list. 
+2. Additional product picture shall be displayed at 75% size reduction centered and beneath the main picture. 
+3. 3 detailed pictures shall be displayed at the same time before scrolling through the list of pictures.
+4. List of pictures shall entail at least the following kinds: Product (alone), Product (in usage)",High,3,8,Testing Accuracy Increase,"Subpar Implementation might cause Loading Time Problems because of high-res images
+Mitigation: Page Speed Increase Feature at the end, so that flaws in all features can be found",PI2 - Sprint 1,,,,,
+SFEAT00125,Pricing information,"As a customer, I want to have an overview of the product's price and possible discount options, so that I can get full transparency on costs. ","1. Display the product price beneath the reviews summary
+2. Adjust the price based on sales & quantity regulations
+3. Inform the customer via a pop-up message on the availability of discounts or promotional offers. 
+4. Reduced prices shall be displayed next to the reguar price which gets crossed",High,2,6,Testing Accuracy Increase,,PI2 - Sprint 1,,,,,
+SFEAT00112,Testing Accuracy Increase,"As a webshop provider, I need to ensure that my features are deployed correctly, so that my customers do have a high quality user experience. ","1. Identification of tests which can be automated
+2. Automation of highly repetitive testing tasks",High,1,14,,"Developers need to be familiar with TDD, otherwise improper test cases might be written",PI2 - Sprint 1,,,,,
+SFEAT00111,Webshop - Page Speed Increase ,"As an online customer, I need to have a responsive website, so that I do not bounce from the website.","1. Load the website in maximum 3 seconds
+2. Ensure high picture resolution quality
+3. Reduce Java Script Usage whereever possible (spike task)",High,5,12,Everything,,PI2 - Sprint 5,PI2 - Sprint 6,,,,
+SFEAT00127,Product Quantity,"As a customer, I want to be able to change the quantity to purchase, so that I can directly buy the correct number of products I require. ","1. Display the purchase quantity below the product price
+2. Customers should not be able to purchase more than stock is available
+3. Display an out of stock message in case products are not available
+4. Display a notification on earliest shipment for which information is available",Low,14,6,Testing Accuracy Increase,,PI2 - Sprint 2,,,,,
+SFEAT00122,Add to cart function,"As a customer, I want to have the possibility to add items to my shopping cart, so that I can continue shopping for other items and return to payment at a later point in time. ","a) Display button 
+1. Display below Product Variables
+2. Display bigger in size than Product Variables
+3. Display next to product image
+
+b) Place item in cart
+1. adjust cart value
+2. calculate based on size/amount",High,6,10,"Testing Accuracy Increase
+Pricing Information",,PI2 - Sprint 2,,,,,
+SFEAT00116,Product Description Display,"As a customer, I want to have an informative product description, so that I can get a good overview of the product characteristics.","1. Display the product description as a related tab beneath the basic production information and general interaction section
+2. Display all relevant product and brand information available",Medium,4,4,Testing Accuracy Increase,,PI2 - Sprint 2,,,,,
+SFEAT00126,Product Star Review / Ranking,"As a customer, I want to give a star ranking for a product, so that I can feedback and share my experience.  ","1. Display the Product Review beneath the product title. 
+A. Display the overall average rating in te format of stars as X/5
+B. Display the number of ratings made
+2. Allow guest accounts to view the ranking
+3. Allow logged-in users to rank products",Low,15,8,Testing Accuracy Increase,,PI2 - Sprint 5,,,,,
+SFEAT00117,Consumer reviews on product,"As a customer, I want to have an overview of past reviews, so that I can get information about the quality and user experience of former buyers. ","1. Display the product reviews as a related tab beneath the basic production information and general interaction section
+2. Display reviews in chronological order starting with the most recent ones
+3. Customers can filter reviews according to ranking given
+",Low,16,12,"Testing Accuracy Increase
+Star Review
+",,PI2 - Sprint 5,,,,,
+SFEAT00128,Trust Signals,"As a customer, I want to see trusted signs along the purchasing process, so that I am reassured to be operating on a trustworthy website","1. Display the signals below the ""add to cart"" button",Medium,9,3,Testing Accuracy Increase,,PI2 - Sprint 3,,,,,
+SFEAT00121,Product Variables Overview,"As a webshop, I want to provide the customer with different product varieties, so that the customer can take a look at the entire product range.","1. Display coloring options
+2. Display sizing options",High,8,6,Testing Accuracy Increase,,PI2 - Sprint 1,,,,,
+SFEAT00115,Product Page View Different colors,"As a customer, I want to change colors of my product displayed, so that I can compare them with each other.","1. The pictures displayed on the product page shall be displayed according to the color being selected.
+2. Available colors shall be taken from the product variables section.",Medium,12,7,"Testing Accuracy Increase
+Product Page Picture and Alternate Views Display
+Product Variables Overview","Subpar Implementation might cause Loading Time Problems because of high-res images
+Mitigation: Page Speed Increase Feature at the end, so that flaws in all features can be found",PI2 - Sprint 4,,,,,
+SFEAT00129,Social Share Buttons,"As a customer, I want to have the possbility to share products with my community, so that I can engage with others about the products I am interested in.","1. Display the buttons below the ""add to wishlist""  button
+2. Add instagram, facebook, pinterest, tiktok, snapchat",Medium,10,22,Testing Accuracy Increase,Effort to implement Social Share Buttons is probably heavily overestimated,PI2 - Sprint 3,,,,,
+SFEAT00119,Add to wishlist function,"As a customer, I want to have the possibility to add items to my wishlist, so that I can save my favourite items for a later point in time. ",1. Display the wishlist button beneath the purchasing process,Low,17,6,Testing Accuracy Increase,,PI2 - Sprint 4,,,,,
+SFEAT00120,Add to comparison function,"As a customer, I want to have the possibility to compare items with each other, so that I can make an informed decision about different product options.",1. Display the comparison button next to the watchlist button on the right side,Low,13,8,"Testing Accuracy Increase
+Pricing Information",,PI2 - Sprint 4,,,,,
+SFEAT00118,Related products,"As a customer, I want to be informed about related products, so that I can be holistically informed about product usage. ","1. Display related products at the bottom of the page
+2. Show items ranked by customer reviews starting with highly ranked products first
+3. Show items first being bought by other customers in the past. ",Medium,11,6,Testing Accuracy Increase,"Algorithm (delayed for 2 sprints) might be delayed more
+Mitigation: Sprint 4 so that the other team has 1 Sprint as buffer",PI2 - Sprint 4,,,,,
+SFEAT00113,Enable English language,"As an online customer, I need to have an English version of the pages, so that I can find all relevant information in an internationally known language. ",,High,7,5,Testing Accuracy Increase,,PI2 - Sprint 2,PI2 – Sprint 6,,,,
+SFEAT00123,Live-Chat,"As a customer, I want to have the possibility to chat with a bot, so that I can get immediate answers to initial questions or be better directed to a customer service representative. ","1. Display the chat-bot at the bottom right corner of the page
+2. Chat-Bot icon display after 10 seconds are spent by the user on the page
+3. Create a welcome message for the initial contact with customer saying ""Got any questions? I am happy to help""
+4. Set different bot actions which include FAQ website and book a customer service appointment. ",Low,18,27,Testing Accuracy Increase,"Full-Capacity Sprints at the end
+=> Feature may not be finished in time
+Mitigation: Live-Chat Feature can be released after the Webshop Launch, so no time pressure",PI2 - Sprint 6,,,,,

cost-graph.csv

@@ -0,0 +1,3 @@
+Feature Name,Product Title Display,Product Page Picture and Alternate Views Display,Pricing information,Testing Accuracy Increase,Webshop - Page Speed Increase,Product Quantity,Add to cart function,Product Description Display,Product Star Review / Ranking,Consumer reviews on product,Trust Signals,Product Variables Overview,Product Page View Different colors,Social Share Buttons,Add to wishlist function,Add to comparison function,Related products,Enable English language,Live-Chat
+Size,3,8,6,14,12,6,10,4,8,12,3,6,7,22,6,8,6,5,27
+Rank,7,3,2,1,5,14,6,4,15,16,9,8,12,10,17,13,11,7,18

index.html

@@ -1,40 +1,207 @@
 <!doctype html>
 <html>
-	<head>
-		<meta charset="utf-8">
-		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 
-		<title>reveal.js</title>
+    <title>reveal.js</title>
 
-		<link rel="stylesheet" href="dist/reset.css">
-		<link rel="stylesheet" href="dist/reveal.css">
-		<link rel="stylesheet" href="dist/theme/black.css">
+    <link rel="stylesheet" href="dist/reset.css">
+    <link rel="stylesheet" href="dist/reveal.css">
+    <link rel="stylesheet" href="dist/theme/blood.css">
 
-		<!-- Theme used for syntax highlighted code -->
-		<link rel="stylesheet" href="plugin/highlight/monokai.css">
-	</head>
-	<body>
-		<div class="reveal">
-			<div class="slides">
-				<section>Slide 1</section>
-				<section>Slide 2</section>
-			</div>
-		</div>
+    <!-- Theme used for syntax highlighted code -->
+    <link rel="stylesheet" href="plugin/highlight/monokai.css">
+</head>
+<body>
+<div class="reveal">
+    <div class="slides">
+        <section>
+            <h1 class="r-fit-text">PI2<br/>Sprint Planning</h1>
+            <p style="color: grey; font-size: 50%;">
+                Sebastian Wünsch,
+                Yannik Bretschneider,
+                Jonas Schwedler,
+                Megi Hoxhalli,
+                Jana Leinmüller
+            </p>
+        </section>
+        <section>
+            <h2>Goals</h2>
+            <ul>
+                <li class="fragment fade-up">Transition to Test-Driven Development</li>
+                <li class="fragment fade-up">Implement Core Features before Mid-September</li>
+            </ul>
+            <aside class="notes" data-markdown>
+                - transition to tdd
+                    - tried-and-true method to improve code quality
+                    - will ensure that the system will be testable in the future
+                - implement core features before Mid-September
+                    - product launch
+                    - a at least partially working version should be up-and-running then
+            </aside>
+        </section>
+        <!--
+        <section>
+            <div class="r-stretch">
+                <canvas data-chart="bar" data-chart-src="cost-graph.csv">
+                    -->
+                    <!--
+                    {
+                    "data" : {
+                    "datasets" : [{ "backgroundColor": "#0f0" }, { "backgroundColor": "#0ff" } ]
+                    },
+                    "options": { "scales": { "x": {  }, "y": {  } } }
+                    }
+                    -->
+                <!--
+            </canvas>
+        </div>
+        <aside class="notes" data-markdown>
+            - Graph of feature priority and feature size
+                - *big* features generally have a *higher* rank
 
-		<script src="dist/reveal.js"></script>
-		<script src="plugin/notes/notes.js"></script>
-		<script src="plugin/markdown/markdown.js"></script>
-		<script src="plugin/highlight/highlight.js"></script>
-		<script>
-			// More info about initialization & config:
-			// - https://revealjs.com/initialization/
-			// - https://revealjs.com/config/
-			Reveal.initialize({
-				hash: true,
+        </aside>
+        </section>
+        -->
+        <section>
+            <h2>Development Schedule</h2>
+            <pre><code style="overflow: hidden; font-size: 70%; line-height: 100%" data-trim data-noescape class="yaml" data-line-numbers="1-8|9-17|18-23|24-31|32-38|39-45">
+            S1:
+                cap: 36
+                tasks:
+                    - Testing Accuracy Increase (14P) (focus on test-driven development)
+                    - Pricing information (+++) (6P)
+                    - Product Page Picture and Alternate Views Display (+++) (8P)
+                    - Product Variables Overview (+++) (6P)
+                load_capacity: 94%
+            S2:
+                cap: 32
+                tasks:
+                    - Add to cart function (+++)(10P)
+                    - Product Quantity (6P) (+)
+                    - Product Title Display (++) (3P)
+                    - Product Description Display (++) (4P)
+                    - Enable English Language (first half) (3P)
+                load_capacity: approx 81%
+            S3:
+                cap: 31
+                tasks:
+                    - Social Share Buttons (+ for current cost, ++ for less points) (22P)
+                    - Trust Signals (first part) (++) (3P)
+                load_capacity: 80%
+            S4:
+                cap: 29
+                tasks:
+                    - Related products (6P)
+                    - Product Page View Different colors (7P)
+                    - Add to comparison function (8P)(0)
+                    - Add to wishlist function (6P) (+)
+                load_capacity: 93%
+            S5:
+                cap: 25
+                tasks:
+                    - Product Star Review / Ranking (8P) (+)
+                    - Consumer reviews on product (12P) (0)
+                    - Webshop - Page Speed Increase (first part) (5P)
+                load_capacity: 100%
+            S6:
+                cap: 36
+                tasks:
+                    - Webshop - Page Speed Increase (second part) (7P)
+                    - Live-Chat (0) (27P)
+                    - Enable English Language (second half) (2P)
+                load_capacity: 100%
+            </code></pre>
 
-				// Learn about plugins: https://revealjs.com/plugins/
-				plugins: [ RevealMarkdown, RevealHighlight, RevealNotes ]
-			});
-		</script>
-	</body>
+            <aside class="notes" data-markdown>
+                - We're not gonna go through everything, but we are going to talk about why we made the decisions we made
+                1. Sprint
+                    - Testing Accuracy Increase is early to ensure that *all future code will
+                be developed in a testable way*
+                    - Instruct the team on how to carry out TDD
+                        - TDD is a skill that all professional developers should have
+                    - Other than that, some core features are done early on
+                2. Sprint
+                    - Thematically similar features to Sprint 1
+                    - Core Features of the webshop
+                    - First Part of the english translation to have a sample to review the translation quality
+                3. Sprint
+                    - Development of Social Share Button is extremely expensive
+                        - Wierd, as there are libraries out there to do this in a single LoC
+                        - If development finishes early, features from later sprints should be started
+                4. Sprint
+                    - Focus on low-priority features that are still important parts of the webshop
+                    - Related Products are placed here
+                        - Reason is that the team working on the algorithm needed two more sprints to get the algorithm ready
+                        - We gave them three to account for possible delays
+                5. Sprint
+                    - Similar to the previous sprint
+                    - Webshop should be deployed now because of timeline, product launch
+                    - Here, first part of increasing the webshop speed is started
+                        - Optimization is done at the end to *ensure that all components have been developed already*
+                            - leads to more accurate profiling of the application
+                            - better / bigger speed improvements
+                            - "cleanup" of speed problems that were caused by development
+                6. Sprint
+                    - More Speed Increase
+                    - Second part of the english translation (released after the sprint)
+                    - Live Chat is really expensive, but basically irrelevant
+                        - Can be temporarily replaced with a simple FAQ page
+                        - If the time is not enough, it might be sacrificed for more important features
+
+            </aside>
+        </section>
+        <section>
+            <h2>No extra testing capacity needed</h2>
+            <aside class="notes" data-markdown>
+                - No extra testing capacity is needed because:
+                    - Team develops through TDD
+                    - Tests are written before the code is
+                    - Tests are automatically executed all the time
+                - That's also the reason for being able to release the not-finished version of the webshop
+            </aside>
+        </section>
+        <section>
+            <h4>Lastly: A Note on Social Share Buttons</h4>
+            <pre><code data-trim data-line-numbers="2-7" class="jsx">
+                <!--
+              <TwitterShareButton
+                        url={shareUrl}
+                        title={title}
+                        className="...">
+                <TwitterIcon size={32} round />
+              </TwitterShareButton>
+              -->
+            </code></pre>
+            <a href="https://github.com/nygardk/react-share">nygarkd/react-share on GitHub</a>
+            <aside class="notes" data-markdown>
+                - Implementing Social Share Buttons is easy
+                - Libraries exist to do this in a couple lines of code
+                    - Our Estimation is 2 Points instead of 22
+            </aside>
+        </section>
+    </div>
+</div>
+
+<script src="dist/reveal.js"></script>
+<script src="plugin/notes/notes.js"></script>
+<script src="plugin/markdown/markdown.js"></script>
+<script src="plugin/highlight/highlight.js"></script>
+<script src="plugin/chart/plugin.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.2.0/chart.min.js"></script>
+
+<script>
+    // More info about initialization & config:
+    // - https://revealjs.com/initialization/
+    // - https://revealjs.com/config/
+    Reveal.initialize({
+        hash: true,
+        showNotes: false,
+
+        // Learn about plugins: https://revealjs.com/plugins/
+        plugins: [RevealMarkdown, RevealHighlight, RevealNotes, RevealChart]
+    });
+</script>
+</body>
 </html>

package-lock.json

@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "reveal.js",
       "version": "4.3.1",
       "license": "MIT",
       "devDependencies": {

plugin/chart/plugin.js

@@ -0,0 +1,198 @@
+/*****************************************************************
+** Author: Asvin Goel, goel@telematique.eu
+** Fixed for Reveal4: kotborealis@awooo.ru
+**
+** A plugin for reveal.js allowing to integrate Chart.js
+**
+** Version: 1.3.1
+**
+** License: MIT license (see LICENSE.md)
+**
+******************************************************************/
+
+/**
+ * Reveal Plugin
+ * https://revealjs.com/creating-plugins/
+ */
+window.RevealChart = window.RevealChart || {
+    id: 'RevealChart',
+    init: function(deck) {
+        initChart(deck);
+    },
+    update: function(canvas, idx, data) { update(canvas, idx, data); },
+};
+
+const initChart = function(Reveal){
+	function parseJSON(str) {
+	    var json;
+	    try {
+        	json = JSON.parse(str);
+	    } catch (e) {
+        	return null;
+    		}
+            return json;
+	}
+
+	/*
+	* Recursively merge properties of two objects
+	*/
+	function mergeRecursive(obj1, obj2) {
+
+	  for (var p in obj2) {
+	    try {
+	      // Property in destination object set; update its value.
+	      if ( obj1[p] !== null && typeof obj1[p] === 'object' && typeof obj2[p] === 'object' ) {
+	        obj1[p] = mergeRecursive(obj1[p], obj2[p]);
+	      } 
+	      else {
+	        obj1[p] = obj2[p];
+	      }
+	    } catch(e) {
+	      // Property in destination object not set; create it and set its value.
+	      obj1[p] = obj2[p];
+	    }
+	  }
+
+	  return obj1;
+	}
+
+
+	function createChart(canvas, CSV, comments) {
+		canvas.chart = null;
+		var ctx = canvas.getContext("2d");
+		var chartOptions = { responsive: true, maintainAspectRatio: false };
+		var chartData = { labels: null, datasets: []};
+		if ( comments !== null ) for (var j = 0; j < comments.length; j++ ){
+			comments[j] = comments[j].replace(/<!--/,'');
+			comments[j] = comments[j].replace(/-->/,'');
+			var config = parseJSON(comments[j]);
+			if ( config ) {
+				if ( config.data ) {
+					mergeRecursive( chartData, config.data);
+				}
+				if ( config.options ) {
+					mergeRecursive( chartOptions, config.options);
+				}
+			}
+		}
+
+		var lines = CSV.split('\n').filter(function(v){return v!==''});
+		// if labels are not defined, get them from first line
+		if ( chartData.labels === null && lines.length > 0 ) {
+			chartData.labels = lines[0].split(',');
+			chartData.labels.shift();
+			lines.shift();
+		}
+		// get data values
+		for (var j = 0; j < lines.length; j++ ){
+			if (chartData.datasets.length <= j) chartData.datasets[j] = {};
+			chartData.datasets[j].data =  lines[j].split(','); //.filter(function(v){return v!==''});
+			chartData.datasets[j].label = chartData.datasets[j].data[0];
+			chartData.datasets[j].data.shift();
+			for (var k = 0; k < chartData.datasets[j].data.length; k++ ){
+				chartData.datasets[j].data[k] = Number(chartData.datasets[j].data[k]);
+			}
+		}
+
+		// add chart options
+		var config = chartConfig[canvas.getAttribute("data-chart")];
+		if ( config ) {
+			for (var j = 0; j < chartData.datasets.length; j++ ){
+				for (var attrname in config) {
+					if ( !chartData.datasets[j][attrname]  ) {
+						chartData.datasets[j][attrname] = config[attrname][j%config[attrname].length];
+					}
+				}
+			}
+		}
+
+		canvas.chart = new Chart(ctx, { type: canvas.getAttribute("data-chart"), data: chartData, options: chartOptions });
+
+	}
+
+	function updateChart(canvas, idx, data) {
+		canvas.chart.data.datasets[idx].data = data;
+		recreateChart( canvas );
+	}
+
+	var initializeCharts = function(){
+		// Get all canvases
+		var canvases = document.querySelectorAll("canvas");
+		for (var i = 0; i < canvases.length; i++ ){
+			// check if canvas has data-chart attribute
+			if ( canvases[i].hasAttribute("data-chart") ){
+				var CSV = canvases[i].innerHTML.trim();
+				var comments = CSV.match(/<!--[\s\S]*?-->/g);
+				CSV = CSV.replace(/<!--[\s\S]*?-->/g,'').replace(/^\s*\n/gm, "")
+				if ( ! canvases[i].hasAttribute("data-chart-src") ) {
+					createChart(canvases[i], CSV, comments);
+				}
+				else {
+					var canvas = canvases[i];
+					var xhr = new XMLHttpRequest();
+					xhr.onload = function() {
+						if (xhr.readyState === 4) {
+							createChart(canvas, xhr.responseText, comments);
+						}
+						else {
+							console.warn( 'Failed to get file ' + canvas.getAttribute("data-chart-src") +". ReadyState: " + xhr.readyState + ", Status: " + xhr.status);
+						}
+					};
+
+					xhr.open( 'GET', canvas.getAttribute("data-chart-src"), false );
+					try {
+						xhr.send();
+					}
+					catch ( error ) {
+						console.warn( 'Failed to get file ' + canvas.getAttribute("data-chart-src") + '. Make sure that the presentation and the file are served by a HTTP server and the file can be found there. ' + error );
+					}
+				}
+
+			}
+		}
+	}
+
+	function recreateChart(canvas) {
+		// clear data to redraw animation
+		var data = canvas.chart.data.datasets;
+		canvas.chart.data.datasets = []; 
+		canvas.chart.update();
+		canvas.style.visibility = "hidden";
+		setTimeout( function(canvas, data) { 
+			canvas.chart.data.datasets = data; 
+			canvas.style.visibility = "visible"; 
+			canvas.chart.update(); 
+		}, 500, canvas, data); // wait for slide transition to re-add data and animation
+/*
+		var config = canvas.chart.config;
+		canvas.chart.destroy();
+		setTimeout( function() { canvas.chart = new Chart(canvas, config);}, 500); // wait for slide transition
+*/
+	}
+
+	// check if chart option is given or not
+	var chartConfig = Reveal.getConfig().chart || {};
+
+	// set global chart options
+	var config = chartConfig.defaults;
+	if ( config ) {
+		mergeRecursive(Chart.defaults, config);
+	}
+
+	Reveal.addEventListener('ready', function(){
+		initializeCharts();
+		Reveal.addEventListener('slidechanged', function(){
+			var canvases = Reveal.getCurrentSlide().querySelectorAll("canvas[data-chart]");
+			for (var i = 0; i < canvases.length; i++ ){
+				if ( canvases[i].chart  && canvases[i].chart.config.options.animation !== false ) {
+					recreateChart( canvases[i] );
+				}
+			}
+
+		});
+	});
+
+	this.update = updateChart;
+
+	return this;
+};