transplant methods related draft top PageContainer

src/client/js/app.js

@@ -202,7 +202,7 @@ const saveWithShortcut = function(markdown) {
 
 const saveWithSubmitButtonSuccessHandler = function() {
   const { path } = pageContainer.state;
-  appContainer.clearDraft(path);
+  pageContainer.clearDraft(path);
   window.location.href = path;
 };
 

src/client/js/components/MyDraftList/MyDraftList.jsx

@@ -34,7 +34,7 @@ class MyDraftList extends React.Component {
   }
 
   async getDraftsFromLocalStorage() {
-    const draftsAsObj = JSON.parse(window.localStorage.getItem('draft') || '{}');
+    const draftsAsObj = this.props.pageContainer.drafts;
 
     const res = await this.props.appContainer.apiGet('/pages.exist', {
       pages: draftsAsObj,
@@ -93,7 +93,7 @@ class MyDraftList extends React.Component {
   }
 
   clearDraft(path) {
-    this.props.appContainer.clearDraft(path);
+    this.props.pageContainer.clearDraft(path);
 
     this.setState((prevState) => {
       return {
@@ -104,7 +104,7 @@ class MyDraftList extends React.Component {
   }
 
   clearAllDrafts() {
-    this.props.appContainer.clearAllDrafts();
+    this.props.pageContainer.clearAllDrafts();
 
     this.setState({
       drafts: [],

src/client/js/legacy/crowi.js

@@ -592,7 +592,8 @@ $(() => {
       const templateId = $(this).data('template');
       const template = $(`#${templateId}`).html();
 
-      crowi.saveDraft(path, template);
+      const pageContainer = appContainer.getContainer('PageContainer');
+      pageContainer.saveDraft(path, template);
       top.location.href = `${path}#edit`;
     });
 

src/client/js/services/AppContainer.js

@@ -191,28 +191,6 @@ export default class AppContainer extends Container {
       });
   }
 
-  clearDraft(path) {
-    delete this.draft[path];
-    window.localStorage.setItem('draft', JSON.stringify(this.draft));
-  }
-
-  clearAllDrafts() {
-    window.localStorage.removeItem('draft');
-  }
-
-  saveDraft(path, body) {
-    this.draft[path] = body;
-    window.localStorage.setItem('draft', JSON.stringify(this.draft));
-  }
-
-  findDraft(path) {
-    if (this.draft && this.draft[path]) {
-      return this.draft[path];
-    }
-
-    return null;
-  }
-
   findUserById(userId) {
     if (this.userById && this.userById[userId]) {
       return this.userById[userId];

src/client/js/services/PageContainer.js

@@ -55,12 +55,15 @@ export default class PageContainer extends Container {
 
     this.initStateMarkdown();
     this.initStateGrant();
-    this.initDraft();
+    this.initDrafts();
 
     this.addWebSocketEventHandlers = this.addWebSocketEventHandlers.bind(this);
     this.addWebSocketEventHandlers();
   }
 
+  /**
+   * initialize state for markdown data
+   */
   initStateMarkdown() {
     let pageContent = '';
 
@@ -73,6 +76,9 @@ export default class PageContainer extends Container {
     this.state.markdown = markdown;
   }
 
+  /**
+   * initialize state for page permission
+   */
   initStateGrant() {
     const elem = document.getElementById('save-page-controls');
 
@@ -87,9 +93,25 @@ export default class PageContainer extends Container {
     }
   }
 
-  initDraft() {
+  /**
+   * initialize state for drafts
+   */
+  initDrafts() {
+    this.drafts = {};
+
+    // restore data from localStorage
+    const contents = window.localStorage.drafts;
+    if (contents != null) {
+      try {
+        this.drafts = JSON.parse(contents);
+      }
+      catch (e) {
+        window.localStorage.removeItem('drafts');
+      }
+    }
+
     if (this.state.pageId == null) {
-      const draft = this.appContainer.findDraft(this.state.path);
+      const draft = this.findDraft(this.state.path);
       if (draft != null) {
         this.state.markdown = draft;
       }
@@ -118,6 +140,28 @@ export default class PageContainer extends Container {
     });
   }
 
+  clearDraft(path) {
+    delete this.drafts[path];
+    window.localStorage.setItem('drafts', JSON.stringify(this.drafts));
+  }
+
+  clearAllDrafts() {
+    window.localStorage.removeItem('drafts');
+  }
+
+  saveDraft(path, body) {
+    this.drafts[path] = body;
+    window.localStorage.setItem('drafts', JSON.stringify(this.drafts));
+  }
+
+  findDraft(path) {
+    if (this.drafts != null && this.drafts[path]) {
+      return this.drafts[path];
+    }
+
+    return null;
+  }
+
   addWebSocketEventHandlers() {
     const pageContainer = this;
     const websocketContainer = this.appContainer.getContainer('WebsocketContainer');