<!DOCTYPE HTML>
<html lang="en" class="sidebar-visible no-js">
<head>
<!-- Book generated using mdBook -->
<meta charset="UTF-8">
<title>Chapter 4 - Merging actions - </title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#ffffff" />
<link rel="shortcut icon" href="favicon.png">
<link rel="stylesheet" href="css/variables.css">
<link rel="stylesheet" href="css/general.css">
<link rel="stylesheet" href="css/chrome.css">
<link rel="stylesheet" href="css/print.css" media="print">
<!-- Fonts -->
<link rel="stylesheet" href="FontAwesome/css/font-awesome.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:500" rel="stylesheet" type="text/css">
<!-- Highlight.js Stylesheets -->
<link rel="stylesheet" href="highlight.css">
<link rel="stylesheet" href="tomorrow-night.css">
<link rel="stylesheet" href="ayu-highlight.css">
<!-- Custom theme stylesheets -->
</head>
<body class="light">
<!-- Provide site root to javascript -->
<script type="text/javascript">var path_to_root = "";</script>
<!-- Work around some values being stored in localStorage wrapped in quotes -->
<script type="text/javascript">
try {
var theme = localStorage.getItem('mdbook-theme');
var sidebar = localStorage.getItem('mdbook-sidebar');
if (theme.startsWith('"') && theme.endsWith('"')) {
localStorage.setItem('mdbook-theme', theme.slice(1, theme.length - 1));
}
if (sidebar.startsWith('"') && sidebar.endsWith('"')) {
localStorage.setItem('mdbook-sidebar', sidebar.slice(1, sidebar.length - 1));
}
} catch (e) { }
</script>
<!-- Set the theme before any content is loaded, prevents flash -->
<script type="text/javascript">
var theme;
try { theme = localStorage.getItem('mdbook-theme'); } catch(e) { }
if (theme === null || theme === undefined) { theme = 'light'; }
document.body.className = theme;
document.querySelector('html').className = theme + ' js';
</script>
<!-- Hide / unhide sidebar before it is displayed -->
<script type="text/javascript">
var html = document.querySelector('html');
var sidebar = 'hidden';
if (document.body.clientWidth >= 1080) {
try { sidebar = localStorage.getItem('mdbook-sidebar'); } catch(e) { }
sidebar = sidebar || 'visible';
}
html.classList.remove('sidebar-visible');
html.classList.add("sidebar-" + sidebar);
</script>
<nav id="sidebar" class="sidebar" aria-label="Table of contents">
<ol class="chapter"><li><a href="chapter_1.html"><strong aria-hidden="true">1.</strong> What are actions?</a></li><li><ol class="section"><li><a href="example_1.html"><strong aria-hidden="true">1.1.</strong> Example: Counter</a></li></ol></li><li><a href="chapter_2.html"><strong aria-hidden="true">2.</strong> Chapter 2 - A chain of actions</a></li><li><a href="chapter_3.html"><strong aria-hidden="true">3.</strong> Chapter 3 - Undo and redo</a></li><li><a href="chapter_4.html" class="active"><strong aria-hidden="true">4.</strong> Chapter 4 - Merging actions</a></li></ol>
</nav>
<div id="page-wrapper" class="page-wrapper">
<div class="page">
<div id="menu-bar" class="menu-bar">
<div id="menu-bar-sticky-container">
<div class="left-buttons">
<button id="sidebar-toggle" class="icon-button" type="button" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
<i class="fa fa-bars"></i>
</button>
<button id="theme-toggle" class="icon-button" type="button" title="Change theme" aria-label="Change theme" aria-haspopup="true" aria-expanded="false" aria-controls="theme-list">
<i class="fa fa-paint-brush"></i>
</button>
<ul id="theme-list" class="theme-popup" aria-label="Themes" role="menu">
<li role="none"><button role="menuitem" class="theme" id="light">Light <span class="default">(default)</span></button></li>
<li role="none"><button role="menuitem" class="theme" id="rust">Rust</button></li>
<li role="none"><button role="menuitem" class="theme" id="coal">Coal</button></li>
<li role="none"><button role="menuitem" class="theme" id="navy">Navy</button></li>
<li role="none"><button role="menuitem" class="theme" id="ayu">Ayu</button></li>
</ul>
<button id="search-toggle" class="icon-button" type="button" title="Search. (Shortkey: s)" aria-label="Toggle Searchbar" aria-expanded="false" aria-keyshortcuts="S" aria-controls="searchbar">
<i class="fa fa-search"></i>
</button>
</div>
<h1 class="menu-title"></h1>
<div class="right-buttons">
<a href="print.html" title="Print this book" aria-label="Print this book">
<i id="print-button" class="fa fa-print"></i>
</a>
</div>
</div>
</div>
<div id="search-wrapper" class="hidden">
<form id="searchbar-outer" class="searchbar-outer">
<input type="search" name="search" id="searchbar" name="searchbar" placeholder="Search this book ..." aria-controls="searchresults-outer" aria-describedby="searchresults-header">
</form>
<div id="searchresults-outer" class="searchresults-outer hidden">
<div id="searchresults-header" class="searchresults-header"></div>
<ul id="searchresults">
</ul>
</div>
</div>
<!-- Apply ARIA attributes after the sidebar and the sidebar toggle button are added to the DOM -->
<script type="text/javascript">
document.getElementById('sidebar-toggle').setAttribute('aria-expanded', sidebar === 'visible');
document.getElementById('sidebar').setAttribute('aria-hidden', sidebar !== 'visible');
Array.from(document.querySelectorAll('#sidebar a')).forEach(function(link) {
link.setAttribute('tabIndex', sidebar === 'visible' ? 0 : -1);
});
</script>
<div id="content" class="content">
<main>
<a class="header" href="#chapter-3---merging-actions" id="chapter-3---merging-actions"><h1>Chapter 3 - Merging actions</h1></a>
<p>Imagine this scenario.</p>
<p>You have got a very simple program. A counter.
The user can enter an operation (increment or decrement) and a value. The user could, for example say: <em>increment</em> the counter by <em>5</em>. Then the user decrements the counter by <em>4</em>. Lastly, the user performs an <em>increment</em> of <em>3</em>.</p>
<p>We can use an enum to represent those actions.</p>
<pre><pre class="playpen"><code class="language-rust">
# #![allow(unused_variables)]
#fn main() {
enum MyAction {
Add(u8),
Subtract(u8)
}
#}</code></pre></pre>
<p>But the user is not satisfied. The user wants to automate this time-consuming process. Simple!</p>
<p>We just <strong>record the actions and store them</strong>. If the user wants to perform all 3 actions, the user can just press one button to perform all 3 actions. They will be executed sequentially.</p>
<pre><pre class="playpen"><code class="language-rust">
# #![allow(unused_variables)]
#fn main() {
let actions = vec![
MyAction::Add(5),
MyAction::Subtract(4),
MyAction::Add(3)
];
#}</code></pre></pre>
<p>"<strong>That is dumb, it could just be 1 single action</strong>", you say? Yes, it <em>is</em> dumb. That is why <code>actions</code> enables you to merge actions by creating a <code>Chain</code> of actions. <strong>You provide the merge-logic</strong>. This is how that would look like for our example:</p>
<pre><pre class="playpen"><code class="language-rust">
# #![allow(unused_variables)]
#fn main() {
impl Merge for Action {
fn merge(&self, previous: &MyAction) -> MergeResult<Self> {
match self {
// If the current action is incrementing by val
MyAction::Add(val) => match previous {
// If the previous action was decrementing by val2
MyAction::Subtract(val2) =>
// Then return a new 'merged' action which
// increments by (val - val2)
MergeResult::Merged(
MyAction::Add(val - val2)
),
// Etc..
MyAction::IncrementBy(val2) =>
MergeResult::Merged(
MyAction::Add(val + val2)
),
},
MyAction::DecrementBy(val) => match previous {
MyAction::IncrementBy(val2) =>
MergeResult::Merged(
MyAction::Add(val2 - val)
),
MyAction::DecrementBy(val2) =>
MergeResult::Merged(
MyAction::Subtract(val + val2)
)
},
}
}
}
#}</code></pre></pre>
<p><strong>Please note that this merge is not the optimal solution</strong>, because it is possible to end up with either <code>CounterAction::Add(0)</code> or <code>CounterAction::Subtract(0)</code>, which could be entirely removed.</p>
<p>To solve that issue, you can return other <code>MergeResult</code>s. You can return <code>MergeResult::CancelsOut</code>, for example. You can read more about the different <code>MergeResult</code>s in the documentation.</p>
</main>
<nav class="nav-wrapper" aria-label="Page navigation">
<!-- Mobile navigation buttons -->
<a rel="prev" href="chapter_3.html" class="mobile-nav-chapters previous" title="Previous chapter" aria-label="Previous chapter" aria-keyshortcuts="Left">
<i class="fa fa-angle-left"></i>
</a>
<div style="clear: both"></div>
</nav>
</div>
</div>
<nav class="nav-wide-wrapper" aria-label="Page navigation">
<a href="chapter_3.html" class="nav-chapters previous" title="Previous chapter" aria-label="Previous chapter" aria-keyshortcuts="Left">
<i class="fa fa-angle-left"></i>
</a>
</nav>
</div>
<script src="elasticlunr.min.js" type="text/javascript" charset="utf-8"></script>
<script src="mark.min.js" type="text/javascript" charset="utf-8"></script>
<script src="searcher.js" type="text/javascript" charset="utf-8"></script>
<script src="clipboard.min.js" type="text/javascript" charset="utf-8"></script>
<script src="highlight.js" type="text/javascript" charset="utf-8"></script>
<script src="book.js" type="text/javascript" charset="utf-8"></script>
<!-- Custom JS scripts -->
</body>
</html>
