Adds split function to the edit iNote section

src/screens/EPub/models/data_reducer.js

@@ -324,9 +324,9 @@ export default {
         chapters[chapterIdx].title = value;
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
     },
-    splitChaptersByScreenshots(state, {payload: {wc}}) {
+    splitChaptersByScreenshots(state, {payload: {wc}}) { // Enforces Word Count
         console.log(`Splitting chapters by screenshots`);
-        const new_items = [];
+        const new_items = []; // duplicating some sentences (sentences with less than wc words)
         // min word count that each chapter should have
         const default_word_count = 25;
         let min_word_count = wc;
@@ -338,30 +338,31 @@ export default {
         if (min_word_count > total_word_count) {
             min_word_count = default_word_count;
         }
-        // loop through chapters and enforce minimum wc  
+        // loop through chapters and enforce minimum wc 
         (state.items).forEach(function(elem) {
-            let words = (elem.text).split(' ').length;
-            if (words < min_word_count && new_items.length!==0 ) { 
+            if (new_items.length!==0) { 
                 const oldelem = new_items.pop();
+                let words = (oldelem.text).split(' ').length;
+                if(words < min_word_count ) {
                 // append shorter text to previous chapter
-                oldelem.text += " ";
-                oldelem.text += elem.text;
-                new_items.push(oldelem);
+                    oldelem.text += " ";
+                    oldelem.text += elem.text;
+                    new_items.push(oldelem);
+                }
+                else {
+                    new_items.push(oldelem);
+                    new_items.push(elem)
+                }
             } else {
                 new_items.push(elem);
             }
            });
         // makes sure the first element also has a min of min_word_count words
-        const first_elem = new_items.shift();
-        let words = (first_elem.text).split(' ').length;
+        const last_elem = new_items.pop();
+        let words = (last_elem.text).split(' ').length;
         if(words < min_word_count) {
-            if(new_items.length !== 0) {
-                let elem_next_text = "";
-                // append first chapter's text to next chapter
-                elem_next_text += " ";
-                elem_next_text += new_items.shift().text;
-                first_elem.text += elem_next_text;
-                new_items.unshift(first_elem);
+            if(new_items.length !== 0 && words.length !== 0) {
+                new_items.push(last_elem);
             } 
         }
         let splitChapters = _.map(

src/screens/EPub/views/EditEPubChapter/index.js

@@ -19,7 +19,6 @@ function EditEPubChapter({ dispatch }) {
         <CTFragment width="67%">
           <ChapterEditor />
         </CTFragment>
-
         <CTFragment
           className="ct-epb ech-tool-bar"
           sticky

src/screens/EPub/views/EditEPubStructure/QuickActionsEditNote.js

@@ -0,0 +1,104 @@
+import React, {useState} from 'react';
+import cx from 'classnames';
+import Button from '@material-ui/core/Button';
+import TextField from '@material-ui/core/TextField';
+
+import ButtonGroup from '@material-ui/core/ButtonGroup';
+import { CTHeading, CTFragment, useButtonStyles } from 'layout';
+import { timestr } from 'utils';
+import { connect } from 'dva'
+import { epub as epubOld } from '../../controllers';
+
+function QuickActionsEditNote({ chapters = {}, items, currChIndex = 0, dispatch }) {
+  const btnStyles = useButtonStyles();
+  const btnClasses = cx(btnStyles.tealLink, 'justify-content-start');
+  if (currChIndex >= chapters.length) {currChIndex = 0;}
+  const { start, end, title } = chapters[currChIndex];
+  const startTimeStr = timestr.toPrettierTimeString(start);
+  const endTimeStr = timestr.toPrettierTimeString(end);
+  const showResetBtn = chapters.length > 1 || chapters[0].subChapters.length > 0;
+  const showSplitAllBtn = chapters.length !== items.length;
+
+  const watchInPlayer = () => {
+    dispatch({
+      type: 'epub/openPlayer', payload: {
+        title: `Chapter ${currChIndex + 1}: ${title}`, start, end
+      }
+    });
+  };
+
+  const onEditChapters = () => {
+    dispatch({ type: 'epub/setView', payload: epubOld.const.EpbEditChapter });
+  };
+
+  // default state is min word count of 25 for split by screenshots
+  const [wordInput, setWordInput] = useState("25");
+  const handleOnSubmit = (event) => {
+    event.preventDefault();
+    dispatch({type: 'epub/splitChaptersByScreenshots', payload:{wc: wordInput}});
+  };
+  const handleOnWcChange = (event) => {
+    setWordInput(event.target.value);
+  };
+
+  return (
+    <CTFragment margin="10" padding={[15, 10]} width="auto">
+      <CTHeading uppercase as="h4" icon="offline_bolt">Quick Split</CTHeading>
+
+      <ButtonGroup fullWidth>
+        {
+          showResetBtn
+          &&
+          <Button
+            className={btnClasses}
+            onClick={() => dispatch({type: 'epub/resetToDefaultChapters'})}
+          >
+            Reset to Default Chapters
+          </Button>
+        }
+        {
+          showSplitAllBtn
+          &&
+          <Button
+            className={btnClasses}
+            onClick={() => dispatch({type: 'epub/splitChaptersByScreenshots', payload:{wc: wordInput}})}
+          >
+            Split Chapters by Screenshots
+          </Button>
+        }
+        {/* {
+          showSubdivideAllBtn
+          &&
+          <Button className={btnClasses} onClick={epub.data.subdivideChaptersByScreenshots}>
+            Subdivide Chapters by Screenshots
+          </Button>
+        } */}
+      </ButtonGroup>
+      <CTFragment dFlexCol>
+        <form onSubmit={handleOnSubmit}> 
+          <TextField
+            fullWidth
+            variant='standard'
+            size='small'
+            value={wordInput}
+            onChange={handleOnWcChange}
+            sx={{
+              backgroundColor: "#F0F0F0",
+              border: "1px solid black",
+              borderRadius: "5px",
+              padding: "10px",
+              margin: "10rem 1rem"
+            }}
+            defaultValue='30'
+            helperText='Enter Minimum Word Count For Each Chapter (Default = 25)'
+          />  
+        </form>
+      </CTFragment>
+    </CTFragment>
+
+  );
+}
+
+export default connect(({ epub: { currChIndex, epub: { chapters }, items }, loading }) => ({
+  currChIndex, chapters, items
+}))(QuickActionsEditNote);

src/screens/EPub/views/EditEPubStructure/index.js

@@ -43,12 +43,13 @@ function EditEPubStructure({ epub: epubData, dispatch }) {
           <CTHeading>{epubData.title}</CTHeading>
           <ChapterList setEPubItem={setEPubItem} />
         </CTFragment>
-
+        
         <CTFragment sticky scrollY dFlexCol width="35%" padding={[30, 10]}>
           <Instruction expanded={instExp} onToggle={toggleInstExp} />
           {itemViewElem}
           <QuickActions />
         </CTFragment>
+
       </CTFragment>
     </EPubNavigationProvider>
   );

src/screens/EPub/views/EditINote/index.js

@@ -1,25 +1,88 @@
 import React, { useEffect, useState } from 'react';
 import _ from 'lodash'
-import { CTFragment, CTHeading, CTText } from 'layout';
+import cx from 'classnames';
+
+import ButtonGroup from '@material-ui/core/ButtonGroup';
+import { CTFragment, CTHeading, CTText, altEl, useButtonStyles } from 'layout';
 import { connect } from 'dva'
 import { EPubNavigationProvider } from '../../components';
-import { epub as epubController} from '../../controllers';
+import { epub as epubController, generateEPubGuide} from '../../controllers';
 import INoteEditor from './INoteEditor';
+import Instruction from '../EditEPubStructure/Instruction';
+import EPubItemView from '../EditEPubStructure/EPubItemView';
+import QuickActionsEditNote from '../EditEPubStructure/QuickActionsEditNote';
+import Button from '@material-ui/core/Button';
 
 // import './index.scss';
 
 function EditINote ({epub: epubData, dispatch}) {
   const dispatchScroll = _.debounce((e) => dispatch({ type: 'epub/onScroll', payload: e }), 300)
   const onScroll = (e) => dispatchScroll(e.target)
-
+
+  const [ePubItem, setEPubItem] = useState(null);
+  const [instExp, setInstExp] = useState(true);
+
+  const toggleInstExp = (e, newExpanded) => setInstExp(newExpanded);
+
+  useEffect(() => {
+    // show the user onboard guide if possible
+    setTimeout(() => {
+      const guide = generateEPubGuide();
+      guide.start();
+    }, 1000);
+  }, []);
+
+  useEffect(() => {
+    if (Boolean(ePubItem) && instExp) {
+      setInstExp(false);
+    }
+  }, [ePubItem]);
+  const itemViewElem = altEl(EPubItemView, Boolean(ePubItem), {
+    item: ePubItem, setEPubItem
+  });
+  const btnStyles = useButtonStyles();
+  const btnClasses = cx(btnStyles.tealLink, 'justify-content-start');
   const [iNoteItem, setINoteItem] = useState(null);
+  const [hidden, setHidden] = useState(true);
   return (
     <EPubNavigationProvider>
       <CTFragment dFlex h100 scrollY id={epubController.id.EPubChapterListID} onScroll={onScroll}>
-        <CTFragment width="75%">
+        <CTFragment width="100%">
           <CTHeading>{epubData.title}</CTHeading>
           <INoteEditor> setINoteItem={setINoteItem} dispatch={dispatch} </INoteEditor>
         </CTFragment>
+
+        {hidden ?
+          <>
+          <CTFragment margin="10" padding={[5, 10]} width="12%">
+            <CTFragment margin="10" padding={[5, 10]} width="auto">
+            <ButtonGroup fullWidth >
+            <Button onClick={()=>setHidden(!hidden)}>Split</Button>
+            </ButtonGroup>
+            </CTFragment>
+            </CTFragment>
+          </>
+
+        :
+          <>
+          <CTFragment margin="10" padding={[5, 10]} width="40%">
+          <CTFragment margin="10" padding={[5, 10]} width="auto">
+          <ButtonGroup fullWidth >
+            <Button  onClick={()=>setHidden(!hidden)}>Collapse</Button>
+            </ButtonGroup >
+            </CTFragment>
+            <QuickActionsEditNote />
+            </CTFragment>
+
+
+
+          </>
+        }
+
+
+
+
+
       </CTFragment>
     </EPubNavigationProvider>
   )