undo button for mobile

index.html

@@ -37,6 +37,9 @@
  <div class="submenu">
  <a class="logo" href="#">miniPaint</a>
  <div class="block attributes" id="action_attributes"></div>
+ <button class="undo_button" id="undo_button" type="button">
+ <span class="sr_only">Undo</span>
+ </button>
  </div>
 
  <div class="sidebar_left" id="tools_container"></div>

src/css/layout.css

@@ -174,6 +174,27 @@ body .sp-preview{
  font-size:15px;
  font-weight:bold;
 }
+.undo_button {
+ display: none;
+ width: 50px;
+ height: 50px;
+ top: 0;
+ border: 0;
+ outline: none;
+ cursor: pointer;
+ filter: var(--mobile-menu-toggle-filter);
+ background: url(images/icons/undo.svg) no-repeat center center;
+ background-size: auto 25px;
+ margin-left: 10px;
+}
+.undo_button:hover {
+ background-color: transparent;
+}
+@media screen and (max-width: 700px){
+ .undo_button {
+ display: block;
+ }
+}
 
 /* ========== sub-header ==================================================== */
 

src/js/modules/edit/undo.js

@@ -1,9 +1,26 @@
 import Base_state_class from './../../core/base-state.js';
 
+var instance = null;
+
 class Edit_undo_class {
 
  constructor() {
+ //singleton
+ if (instance) {
+ return instance;
+ }
+ instance = this;
+
  this.Base_state = new Base_state_class();
+ this.events();
+ }
+
+ events(){
+ var _this = this;
+
+ document.querySelector('#undo_button').addEventListener('click', function (event) {
+ _this.Base_state.undo();
+ });
  }
 
  undo() {