Merge branch 'staging' into alignmentOfButtons

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/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/INoteEditor/INoteChapter.js

@@ -199,24 +199,24 @@ function INoteChapter ({
               {addTextElement(itemIdx)}
             </CTFragment>
 
-          {typeof content === "object" ? ( // image
-            <CTFragment className='img-con'>   
-              <ChapterImage 
-                id={`ch-content-${chapter.id}-${itemIdx}`}
-                image={content} // TODO ITEM id and ocr and alttext maybe map between item and content 
-                enableChapterScreenshots
-                onChooseImage={onImageChange(itemIdx)}
-                onRemoveImage={onRemove(itemIdx)}
-              />
-            </CTFragment> 
+            {typeof content === "object" ? ( // image
+              <CTFragment className='img-con'>   
+                <ChapterImage 
+                  id={`ch-content-${chapter.id}-${itemIdx}`}
+                  image={content} // TODO ITEM id and ocr and alttext maybe map between item and content 
+                  enableChapterScreenshots
+                  onChooseImage={onImageChange(itemIdx)}
+                  onRemoveImage={onRemove(itemIdx)}
+                />
+              </CTFragment> 
             ) : ( // text 
-            <CTFragment className='item-text'>   
-              <ChapterText  
-                id={`ch-content-${chapter.id}-${itemIdx}`}
-                text={content}
-                onSaveText={onTextChange(itemIdx)}
-              />
-            </CTFragment>  
+              <CTFragment className='item-text'>   
+                <ChapterText  
+                  id={`ch-content-${chapter.id}-${itemIdx}`}
+                  text={content}
+                  onSaveText={onTextChange(itemIdx)}
+                />
+              </CTFragment>  
           )}  
           </CTFragment>
         ))}

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

@@ -0,0 +1,87 @@
+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 { connect } from 'dva'
+
+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 showResetBtn = chapters.length > 1 || chapters[0].subChapters.length > 0;
+  const showSplitAllBtn = chapters.length !== items.length;
+
+  // 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/EditINote/index.js

@@ -1,25 +1,51 @@
 import React, { useEffect, useState } from 'react';
 import _ from 'lodash'
-import { CTFragment, CTHeading, CTText } from 'layout';
+
+import ButtonGroup from '@material-ui/core/ButtonGroup';
+import { CTFragment, CTHeading} from 'layout';
 import { connect } from 'dva'
+import Button from '@material-ui/core/Button';
 import { EPubNavigationProvider } from '../../components';
 import { epub as epubController} from '../../controllers';
 import INoteEditor from './INoteEditor';
+import QuickActionsEditNote from './QuickActionsEditNote';
+
 
 // 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 [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 sticky scrollY dFlexCol 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 sticky scrollY dFlexCol 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>
   )