diff --git a/src/components/CTEPubListScreen/controllers/EPubListController.js b/src/components/CTEPubListScreen/controllers/EPubListController.js
index a8ca6a8e2..ee1894a84 100644
--- a/src/components/CTEPubListScreen/controllers/EPubListController.js
+++ b/src/components/CTEPubListScreen/controllers/EPubListController.js
@@ -43,7 +43,7 @@ class EPubListController {
     }
 
     uurl.openNewTab(
-      links.epub(newEPubData.id, Constants.EpbEditStructure, Constants.HFromNew)
+      links.epub(newEPubData.id, Constants.EditINote, Constants.HFromNew)
     );
 
     return newEPubData;
diff --git a/src/entities/EPubs/structs/EPubChapterData.js b/src/entities/EPubs/structs/EPubChapterData.js
index df6305dc2..c991ef1b2 100644
--- a/src/entities/EPubs/structs/EPubChapterData.js
+++ b/src/entities/EPubs/structs/EPubChapterData.js
@@ -10,7 +10,7 @@ function _createChapterTitle() {
 }
 
 class EPubChapterData extends EPubChapterLikeData {
-  constructor(chapterLike, resetText = true) {
+  constructor(chapterLike, resetText) {
     super(chapterLike, resetText, _createChapterTitle);
 
     const { subChapters = [] } = chapterLike;
diff --git a/src/screens/Asl/components/AslTable/index.js b/src/screens/Asl/components/AslTable/index.js
index a85b82727..debb14ecc 100644
--- a/src/screens/Asl/components/AslTable/index.js
+++ b/src/screens/Asl/components/AslTable/index.js
@@ -55,6 +55,7 @@ const AslTable = props => {
     const [onePage, setOnePage] = useState([]);
     const [showVideo, setShowVideo] = useState(false);
     const [videoUrl, setVideoUrl] = useState('');
+    const [selectedTerm, setSelectedTerm] = useState(null);
     const [style, setStyle] = useState({
         left: 100,
         top: 100,
@@ -71,7 +72,7 @@ const AslTable = props => {
     })
     const [isDown, setIsDown] = useState(false);
     const [direction, setDirection] = useState('');
-
+    
     useEffect(() => {
       const index = (pageNumber-1) * ONE_PAGE_NUM;
       setOnePage(items.filter(item => item.term.toLowerCase().includes(search.toLowerCase())).slice(index, index + ONE_PAGE_NUM));
@@ -117,7 +118,10 @@ const AslTable = props => {
       return 'Example'
     }
 
-    const handleVideo = (source, uniqueASLIdentifier) => {
+    const handleVideo = (term) => {
+      setSelectedTerm(term);
+      const source = term.source;
+      const uniqueASLIdentifier = term.uniqueASLIdentifier;
       const hostName = window.location.hostname;
       if (hostName !== '') {
         if (source === 'ASLCORE') {
@@ -227,9 +231,10 @@ const AslTable = props => {
               onClick={() => setShowVideo(false)}
             >X
             </button>
-
+            <span>{`${selectedTerm.term} (Source:${selectedTerm.source})`}</span>
             <video 
-              className="video-js vjs-default-skin video-player" 
+              className="video-js vjs-default-skin video-player"
+              id="ASL-Glossary-video-player" 
               controls
               preload="auto"
               data-setup="{}"
@@ -319,7 +324,7 @@ const AslTable = props => {
                   <td>
                     <button 
                       type='button' 
-                      onClick={() => handleVideo(term.source, term.uniqueASLIdentifier)}
+                      onClick={() => handleVideo(term)}
                     >
                       Watch
                     </button>
diff --git a/src/screens/Asl/components/AslTable/index.scss b/src/screens/Asl/components/AslTable/index.scss
index 983e27712..c6b6eb081 100644
--- a/src/screens/Asl/components/AslTable/index.scss
+++ b/src/screens/Asl/components/AslTable/index.scss
@@ -96,9 +96,10 @@ tbody tr:hover {
     position: absolute;
 }
 
-.video-player {
+#ASL-Glossary-video-player{
+    margin-top: 33px;
     width: 100%;
-    height: 100%;
+    height: 84%;
 }
 
 .drawing-wrap{
@@ -110,13 +111,22 @@ tbody tr:hover {
     // cursor: move;
     width: 100px;
     height: 100px;
-    background-color: #ccc;
+    background-color: rgb(2, 50, 64);
     position: absolute;
     top: 100px;
     left: 100px;
     box-sizing: border-box;
 
 }
+
+.drawing-item span{
+    color: white;
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+    font-size: larger;
+    margin-top: 5px;
+}
 .control-point {
   position: absolute;
   box-sizing: border-box;
diff --git a/src/screens/EPub/components/ChapterImage/ImageWrapper.js b/src/screens/EPub/components/ChapterImage/ImageWrapper.js
index ade5e0682..fa521be1b 100644
--- a/src/screens/EPub/components/ChapterImage/ImageWrapper.js
+++ b/src/screens/EPub/components/ChapterImage/ImageWrapper.js
@@ -68,7 +68,7 @@ function ImageWrapper({
           >
             Choose Image
           </Button>
-          <Button 
+          {/* <Button 
             uppercase 
             color="white" 
             icon="image"
@@ -76,7 +76,7 @@ function ImageWrapper({
             onClick={() => setShowLink(true)}
           >
             Change Embedded Link
-          </Button>
+          </Button> */}
           {
             showLink && 
             <div>
diff --git a/src/screens/EPub/components/EPubHeader/ViewDropdown.js b/src/screens/EPub/components/EPubHeader/ViewDropdown.js
index b390d2ed4..4beadb0ac 100644
--- a/src/screens/EPub/components/EPubHeader/ViewDropdown.js
+++ b/src/screens/EPub/components/EPubHeader/ViewDropdown.js
@@ -27,6 +27,11 @@ function ViewDropdown({ view, dispatch }) {
       value: epub.const.EpbEditChapter,
       text: 'Edit Chapters',
       icon: 'dashboard'
+    },
+    {
+      value: epub.const.EditINote,
+      text: 'Edit INote (beta)',
+      icon: 'edit'
     }
   ];
 
diff --git a/src/screens/EPub/controllers/constants/EPubConstants.js b/src/screens/EPub/controllers/constants/EPubConstants.js
index 1be36e760..de37caf0e 100644
--- a/src/screens/EPub/controllers/constants/EPubConstants.js
+++ b/src/screens/EPub/controllers/constants/EPubConstants.js
@@ -10,11 +10,14 @@ export default class EPubConstants {
   static EpbReadOnly = 'v-read-only';
   static EpbEditStructure = 'v-structure';
   static EpbEditChapter = 'v-edit';
-  static EpbDefaultView = EPubConstants.EpbReadOnly;
+  static EditINote = 'v-edit-inote'
+
+  static EpbDefaultView = EPubConstants.EditINote;
   static EPubViews = [
     EPubConstants.EpbReadOnly,
     EPubConstants.EpbEditStructure,
-    EPubConstants.EpbEditChapter
+    EPubConstants.EpbEditChapter,
+    EPubConstants.EditINote
   ];
 
   // saving status
diff --git a/src/screens/EPub/index.js b/src/screens/EPub/index.js
index 1b5f76379..8350307be 100644
--- a/src/screens/EPub/index.js
+++ b/src/screens/EPub/index.js
@@ -13,7 +13,7 @@ import {
   EPubFileInfoModal,
   ImagePickerModal
 } from './components';
-import { EditEPubStructure, EditEPubChapter, ViewAndDownload } from './views';
+import { EditEPubStructure, EditEPubChapter, ViewAndDownload, EditINote } from './views';
 import './index.scss';
 
 function shouldDisable() {
@@ -30,6 +30,7 @@ function EPubWithRedux({ view, chapters, epub, dispatch }) {
   const editStructView = altEl(EditEPubStructure, view === epubController.const.EpbEditStructure);
   const editChapterView = altEl(EditEPubChapter, view === epubController.const.EpbEditChapter);
   const readOnlyView = altEl(ViewAndDownload, view === epubController.const.EpbReadOnly);
+  const editINoteView = altEl(EditINote, view === epubController.const.EditINote);
 
   const previewModal = makeEl(PreviewModal);
   const shortcutModal = makeEl(ShortcutModal);
@@ -101,6 +102,7 @@ function EPubWithRedux({ view, chapters, epub, dispatch }) {
       {headerElement}
 
       <CTFragment id="ct-epb-view-con">
+        {editINoteView}
         {editStructView}
         {editChapterView}
         {readOnlyView}
diff --git a/src/screens/EPub/model.js b/src/screens/EPub/model.js
index 2d9078cae..d0f91ccae 100644
--- a/src/screens/EPub/model.js
+++ b/src/screens/EPub/model.js
@@ -146,6 +146,8 @@ const EPubModel = {
                 const media = yield call(getMediaById, _epub.sourceId);
                 yield put({ type: 'setMedia', payload: media });
             }
+            // split chapter by screenshots on create (default of 25 min word count)
+            // yield put({type: 'epub/splitChaptersByScreenshots', payload:{wc: 25}});
         },
         *openPlayer({ payload: { title, start, end } }, { call, put, select, take }) {
             const { epub } = yield select();
@@ -184,7 +186,7 @@ const EPubModel = {
                 return;
             }
 
-            uurl.openNewTab(links.epub(newEPubData.id, Constants.EpbEditStructure));
+            uurl.openNewTab(links.epub(newEPubData.id, Constants.EditINote));
         },
         *deleteEPub({ payload: ePubId }, { call, put, select, take }) {
             try {
diff --git a/src/screens/EPub/models/data_reducer.js b/src/screens/EPub/models/data_reducer.js
index e37ba1c61..47ed486a3 100644
--- a/src/screens/EPub/models/data_reducer.js
+++ b/src/screens/EPub/models/data_reducer.js
@@ -28,8 +28,8 @@ function removeSubChapter(chapter, subChapterIndex) {
     ];
     return subChapter;
 }
-function insertChapter(chapters, index, chapterLike) {
-    let newChapter = new EPubChapterData(chapterLike);
+function insertChapter(chapters, index, chapterLike, resetText = true) {
+    let newChapter = new EPubChapterData(chapterLike, resetText);
     newChapter = newChapter.__data__ ? newChapter.__data__ : newChapter.toObject();
 
     console.log(`Inserting chapter at ${index}: `, chapterLike);
@@ -266,7 +266,6 @@ export default {
         const chapters = state.epub.chapters;
         const currChp = chapters[chapterIdx];
         const prevChp = chapters[chapterIdx - 1];
-
         console.log(`Undoing split-chapter at ${chapterIdx}`);
         // if the prev chapter has sub-chapters
         // append curr chapter and its sub-chapters to prev's sub-chapters
@@ -279,11 +278,33 @@ export default {
             prevChp.subChapters = currChp?.subChapters;
             // remove combined chapter
             newChapters = removeChapter(chapters, chapterIdx);
-        }
+        } 
         rebuildChapter(chapters, chapterIdx - 1);
         // this.updateAll('Undo split chapters', chapterIdx - 1);
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters(newChapters) } };
     },
+    sliceChapter(state, { payload: { chapterIdx, itemIdx}}) {
+        console.log(`Splitting Chapter ${chapterIdx} at ItemIdx ${itemIdx}`);
+        const chapters = state.epub.chapters;
+        const chapter = chapters[chapterIdx]
+        // remove contents from current chapter and add to new chapter
+        let contents = _.slice(chapter.contents, itemIdx, chapter.contents.length);
+        chapter.contents = _.slice(chapter.contents, 0, itemIdx);
+        // insert the new chapter
+        const newChapters = insertChapter(chapters, chapterIdx + 1, { contents }, false);
+        return { ...state, epub: { ...state.epub, ...nextStateOfChapters(newChapters) } };
+    },
+    mergeChapter(state, { payload: { chapterIdx } }) {
+        console.log(`Merging Contents of Chapters ${chapterIdx - 1} and ${chapterIdx}`);
+        const chapters = state.epub.chapters;
+        const currChp = chapters[chapterIdx];
+        const prevChp = chapters[chapterIdx - 1];
+        
+        // TODO account for sub chapters
+        prevChp.contents = _.concat(prevChp?.contents, currChp?.contents);
+        let newChapters = removeChapter(chapters, chapterIdx);
+        return { ...state, epub: { ...state.epub, ...nextStateOfChapters(newChapters) } };
+    },
     appendChapterAsSubChapter(state, { payload: { chapterIdx } }) {
         console.log(`Appending chapter ${chapterIdx} as subchapter`);
         const chapters = state.epub.chapters;
@@ -358,7 +379,7 @@ export default {
         const defaultChapters = EPubData.__buildEPubDataFromArray(state.items);
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters(defaultChapters) }, currChIndex: 0 };
     },
-    insertChapterContent(state, { payload: { type = 'text', contentIdx, subChapterIdx, value } }) {
+     insertChapterContent(state, { payload: { type = 'text', contentIdx, subChapterIdx, value } }) {
         if (type === 'image') {
             value = new EPubImageData(value).toObject();
         }
@@ -373,6 +394,21 @@ export default {
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
         // this.updateAll('Insert chapter content');
     },
+    insertChapterContentAtChapterIdx(state, { payload: { type = 'text', contentIdx, chapterIdx, subChapterIdx, value } }) {
+        if (type === 'image') {
+            value = new EPubImageData(value).toObject();
+        }
+        const chapters = state.epub.chapters;
+        if (subChapterIdx === undefined) {
+            console.log(`Inserting chapter ${state.currChIndex} content: `, value);
+            insertContentChapter(chapters[chapterIdx], contentIdx, value);
+        } else {
+            console.log(`Inserting chapter ${state.currChIndex} subchapter ${subChapterIdx} content: `, value);
+            insertContentChapter(chapters?.[chapterIdx]?.subChapters?.[subChapterIdx], contentIdx, value);
+        }
+        return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
+        // this.updateAll('Insert chapter content');
+    },
     setChapterContent(state, { payload: { type = 'text', contentIdx, subChapterIdx, value } }) {
         if (type === 'image') {
             value = new EPubImageData(value).toObject();
@@ -395,6 +431,29 @@ export default {
         // this.__feed();
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
     },
+
+    setChapterContentAtChapterIdx(state, { payload: { type = 'text', contentIdx, chapterIdx, subChapterIdx, value } }) {
+        if (type === 'image') {
+            value = new EPubImageData(value).toObject();
+        }
+        const chapters = state.epub.chapters;
+        if (subChapterIdx === undefined) {
+            const chapter = chapters[chapterIdx];
+            if (type === 'condition') {
+                chapter.condition = value;
+                console.log(`Setting chapter ${state.currChIndex} condition: `, value);
+            } else{
+                chapter.contents[contentIdx] = value;
+                console.log(`Setting chapter ${state.currChIndex} content: `, value);
+            }
+        } else if (chapters?.[chapterIdx]?.subChapters?.[subChapterIdx]) {
+            chapters[chapterIdx].subChapters[subChapterIdx] = value
+            console.log(`Setting chapter ${state.currChIndex} subchapter ${subChapterIdx} content: `, value);
+        }
+        // this.updateAll('Update the chapter content');
+        // this.__feed();
+        return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
+    },
     removeChapterContent(state, { payload: { type = 'text', contentIdx, subChapterIdx } }) {
         const chapters = state.epub.chapters;
         if (subChapterIdx === undefined) {
@@ -409,6 +468,20 @@ export default {
         // this.__feed('Removed.');
         return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
     },
+    removeChapterContentAtChapterIdx(state, { payload: { type = 'text', contentIdx, chapterIdx, subChapterIdx } }) {
+        const chapters = state.epub.chapters;
+        if (subChapterIdx === undefined) {
+            const chapter = chapters[chapterIdx];
+            console.log(`Removing chapter ${chapterIdx} content`);
+            removeContent(chapter, contentIdx);
+        } else if (chapters?.[chapterIdx]?.subChapters?.[subChapterIdx]) {
+            console.log(`Removing chapter ${chapterIdx} subchapter ${subChapterIdx} content`);
+            removeContent(chapters?.[chapterIdx]?.subChapters?.[subChapterIdx], contentIdx)
+        }
+        // this.updateAll('Remove the chapter content');
+        // this.__feed('Removed.');
+        return { ...state, epub: { ...state.epub, ...nextStateOfChapters([...chapters]) } };
+    },
 }
 /*
 __feed(mesg = 'Saved.') {
diff --git a/src/screens/EPub/models/navigator_effects.js b/src/screens/EPub/models/navigator_effects.js
index d93611045..07485401b 100644
--- a/src/screens/EPub/models/navigator_effects.js
+++ b/src/screens/EPub/models/navigator_effects.js
@@ -119,6 +119,9 @@ export default {
                 case Constants.EpbReadOnly:
                     yield call(updateNavIdForEpbEditStructure, e, epub, put);
                     break;
+                case Constants.EditINote:
+                    yield call(updateNavIdForEpbEditStructure, e, epub, put);
+                    break;
                 default:
                     break;
             }
diff --git a/src/screens/EPub/views/EditEPubChapter/index.js b/src/screens/EPub/views/EditEPubChapter/index.js
index 0c26fcf17..0e0b16e65 100644
--- a/src/screens/EPub/views/EditEPubChapter/index.js
+++ b/src/screens/EPub/views/EditEPubChapter/index.js
@@ -13,7 +13,7 @@ function EditEPubChapter({ dispatch }) {
   const dispatchScroll = _.debounce((e) => dispatch({ type: 'epub/onScroll', payload: e }), 300)
   const onScroll = (e) => dispatchScroll(e.target)
 
-  return (
+  return ( 
     <EPubNavigationProvider>
       <CTFragment dFlex h100 scrollY id={epub.id.EPubChapterListID} onScroll={onScroll}>
         <CTFragment width="67%">
diff --git a/src/screens/EPub/views/EditINote/INoteEditor/INoteChapter.js b/src/screens/EPub/views/EditINote/INoteEditor/INoteChapter.js
new file mode 100644
index 000000000..fd6a6ae4d
--- /dev/null
+++ b/src/screens/EPub/views/EditINote/INoteEditor/INoteChapter.js
@@ -0,0 +1,237 @@
+import { CTFragment, CTText, altEl} from 'layout'
+import React, {useState} from 'react' 
+import { Button } from 'pico-ui';
+import { EPubImageData } from 'entities/EPubs';
+import { ChapterImage, ChapterText, ChapterTitle, MDEditorModal } from '../../../components';
+import {epub as epubTools} from '../../../controllers'
+
+
+function INoteChapter ({
+  chapter, 
+  chIdx,
+  canSplitSubChapter = true,
+  canSubdivide = true,
+  isSubChapter,
+  subChIdx,
+  dispatch 
+}) {
+  const [insertType, setInsertType] = useState(null);
+  const openMDEditor = insertType === 'md';
+  const [openModalIndex, setOpenModalIndex] = useState(null);
+
+  const handleOpenMDEditor = (itemIdx) => {
+    setInsertType('md');
+    setOpenModalIndex(itemIdx)
+  };
+      
+  const handleClose = () => {
+    setInsertType(null);
+    setOpenModalIndex(openModalIndex);
+  }
+
+  const onInsert = (index) => (val) => {
+    dispatch({
+      type: 'epub/updateEpubData', payload: {
+        action: 'insertChapterContentAtChapterIdx', payload: { contentIdx: index, chapterIdx: chIdx, value: val }
+      }
+    })
+  };
+
+  const handleSave = (val) => {
+    if (typeof onInsert === 'function' && val) {
+      onInsert(openModalIndex)(val);
+    }
+    handleClose();
+  };
+    
+   
+  const handleSaveImage = (itemIdx) => (val) => {
+    let imageval = new EPubImageData(val).toObject();
+    if (typeof onInsert === 'function' && imageval) {
+      onInsert(itemIdx)(imageval);
+    }
+  };
+
+  const handleOpenImgPicker = (itemIdx) => {
+    const imgData = {
+      onSave: handleSaveImage(itemIdx),
+    };
+    dispatch({ type: 'epub/setImgPickerData', payload: imgData });
+  }
+
+  // Buttons and onClick Functions 
+  const btnProps = {
+    round: true,
+    uppercase: true,
+    classNames: 'item-action-btn',
+    color: 'teal transparent'
+  };
+
+  // Split and Merge Chapter Button and Functions
+  const sliceChapter = (itemIdx) => dispatch({
+    type: 'epub/updateEpubData', payload: {
+      action: 'sliceChapter', payload: { chapterIdx: chIdx, itemIdx }
+    }
+  });
+
+  // Undo Chapter Split 
+  const mergeChapter = () => dispatch({
+    type: 'epub/updateEpubData', payload: {
+      action: 'mergeChapter', payload: { chapterIdx: chIdx }
+    }
+  })
+
+  const splitBtnElement = (itemIdx) => {
+    let canSplit = itemIdx > 0
+    return altEl(Button, canSplit, {
+      ...btnProps,
+      text: 'Split Chapter',
+      icon: 'unfold_more',
+      onClick: () => sliceChapter(itemIdx)
+  })};
+
+  const mergeChapterBtnElement = (itemIdx) => {
+    let canMerge = chIdx > 0 && itemIdx === 0;
+    return altEl(Button, canMerge, {
+      ...btnProps,
+      text: 'Merge Chapter With Above',
+      icon: 'unfold_less',
+      onClick: mergeChapter
+  })};
+
+  // Add Image Button
+  const addImgElement = (itemIdx) => {
+    return altEl(Button, true, {
+      ...btnProps,
+      text: 'Add Image',
+      icon: 'image',
+      onClick: () => handleOpenImgPicker(itemIdx)
+  })};
+
+  // Add Text Button 
+  function addTextElement(itemIdx) {
+    return altEl(Button, true, {
+      ...btnProps,
+      text: 'Add Text',
+      icon: 'add',
+      onClick: () => handleOpenMDEditor(itemIdx)
+  })};
+
+  // New Subchapter Button 
+  const splitSChBtnElement = (itemIdx) => {
+    return altEl(Button, canSplitSubChapter, {
+      ...btnProps,
+      text: 'New Sub-Chapter',
+      icon: 'subdirectory_arrow_right',
+      // onClick: splitSubChapter
+  })};
+
+  // Subdivide Button 
+  const subdivideBtnElement = (itemIdx) => {
+    return altEl(Button, canSubdivide, {
+      ...btnProps,
+      text: 'subdivide',
+      icon: 'subdirectory_arrow_right',
+      // onClick: subdivideChapter
+  })};
+
+  // DISPATCH FUNCTIONS 
+  // Save Chapter Title Handler 
+  const saveChapterTitle = (value) =>
+    dispatch({
+      type: 'epub/updateEpubData', payload: {
+        action: 'saveChapterTitle', payload: { chapterIdx: chIdx, value }
+    }
+  })
+
+  // Chapter Image Functions
+  const onImageChange = (index) => (val) => {
+    dispatch({
+      type: 'epub/updateEpubData', payload: {
+        action: 'setChapterContentAtChapterIdx', payload: { chapterIdx: chIdx, contentIdx: index, value: val, type: 'image' }
+      }
+    })
+  };
+
+  const onTextChange = (index) => (val) => {  
+    dispatch({
+      type: 'epub/updateEpubData', payload: {
+        action: val ? 'setChapterContentAtChapterIdx' : 'removeChapterContentAtChapterIdx', payload: { chapterIdx: chIdx, contentIdx: index, value: val }
+      }
+    })
+  };
+
+  const onRemove = (index) => () => {
+    dispatch({
+      type: 'epub/updateEpubData', payload: {
+        action: 'removeChapterContent', payload: { contentIdx: index, type: 'image' }
+      }
+    })
+  };
+
+  return (
+    <CTFragment dFlexCol>
+      <CTFragment 
+        id={epubTools.id.chID(chapter.id)}
+        className='ct-inote-chapter'
+      >
+        <CTFragment className='chapter-title'>
+          <CTText muted className="pt-2 pl-2">Chapter {chIdx + 1}: {chapter.title}</CTText>
+          <CTFragment className="ch-item-title-con ct-d-r-center-v">
+            <ChapterTitle
+              id={epubTools.id.chTitleID(chapter.id)}
+              value={chapter.title}
+              onSave={saveChapterTitle}
+              headingType="h2"
+              className="ch-item-title"
+            />
+          </CTFragment>
+        </CTFragment>
+
+        {chapter.contents.map((content, itemIdx) => (
+          <CTFragment key={itemIdx}>
+            <CTFragment className="item-actions">
+              {mergeChapterBtnElement(itemIdx)}
+              {splitBtnElement(itemIdx)}
+              {/* {splitSChBtnElement(itemIdx)} */}
+              {/* {subdivideBtnElement(itemIdx)} */}
+              {addImgElement(itemIdx)}
+              {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> 
+            ) : ( // text 
+            <CTFragment className='item-text'>   
+              <ChapterText  
+                id={`ch-content-${chapter.id}-${itemIdx}`}
+                text={content}
+                onSaveText={onTextChange(itemIdx)}
+              />
+            </CTFragment>  
+          )}  
+          </CTFragment>
+        ))}
+      </CTFragment>
+
+      {insertType !== null && (
+        <MDEditorModal
+          show={openMDEditor}
+          onClose={handleClose}
+          onSave={handleSave}
+          title="Insert New Text"
+        />
+      )}     
+    </CTFragment>
+  )
+}
+
+export default INoteChapter
\ No newline at end of file
diff --git a/src/screens/EPub/views/EditINote/INoteEditor/index.js b/src/screens/EPub/views/EditINote/INoteEditor/index.js
new file mode 100644
index 000000000..095c23689
--- /dev/null
+++ b/src/screens/EPub/views/EditINote/INoteEditor/index.js
@@ -0,0 +1,35 @@
+
+import React, { useEffect, useState } from 'react';
+import { connect } from 'dva'
+import './index.scss';
+
+
+import INoteChapter from './INoteChapter';
+
+function INoteEditor({ chapters = [], foldedIds = [], currChIndex, setINoteItem, dispatch }) {
+  useEffect(() => {
+    if (currChIndex > 0) {
+      setTimeout(() => {
+        dispatch({ type: 'epub/navigateChapter', payload: chapters[currChIndex].id });
+      }, 500);
+    }
+  }, []);
+
+  return (
+    <ul className='ct-inote-editor'> 
+      {chapters.map((chapter, chIdx) => (
+        <INoteChapter 
+          key={chapter.id}
+          chapter={chapter} 
+          chIdx={chIdx}
+          isSubChapter={false}
+          dispatch={dispatch}
+        />
+      ))}
+    </ul>
+  )
+}
+
+export default connect(({ epub: { currChIndex, epub: { chapters, images}, foldedIds }, loading }) => ({
+    currChIndex, chapters, images, foldedIds
+  }))(INoteEditor); 
\ No newline at end of file
diff --git a/src/screens/EPub/views/EditINote/INoteEditor/index.scss b/src/screens/EPub/views/EditINote/INoteEditor/index.scss
new file mode 100644
index 000000000..af125b738
--- /dev/null
+++ b/src/screens/EPub/views/EditINote/INoteEditor/index.scss
@@ -0,0 +1,49 @@
+
+// INoteChapter 
+.ct-epb.ch-img-con {
+    position: relative;
+    width: 100%;
+    flex: 0 0 auto;
+    padding-bottom: 20px;
+    border-top: solid 1px rgb(236, 236, 236);
+    .ch-img-wrapper{
+        position: relative;
+        min-width: 150px;
+        height: max-content;
+
+        .ct-epb.ch-img {
+            display: block;
+            margin-left: auto;
+            margin-right: auto;
+            position: relative;
+            padding-left: 10px;
+            padding-top: 10px;
+            padding-bottom: 10px;
+            width: 220px;
+            object-fit: contain;
+            cursor: zoom-in;
+        }
+    }
+}
+
+.item-text {
+    position: relative;
+    white-space: pre-wrap;
+    padding-left: 10px;
+    padding-top: 10px;
+    font-size: 14px;
+    line-height: 23px;
+    // height: 92px;
+    overflow: hidden;
+}
+// .ct-inote-chapter {
+//     .item-actions {
+//         width: 100%;
+//         transition: opacity .2s ease-in;
+//         opacity: 0;
+//         pointer-events: none;
+//         border-radius: 0 20px 20px 0;
+//         padding-left: 20px;
+//         // background-color: rgb(245, 245, 245);
+//     }
+// }
\ No newline at end of file
diff --git a/src/screens/EPub/views/EditINote/index.js b/src/screens/EPub/views/EditINote/index.js
new file mode 100644
index 000000000..eea9d38b4
--- /dev/null
+++ b/src/screens/EPub/views/EditINote/index.js
@@ -0,0 +1,29 @@
+import React, { useEffect, useState } from 'react';
+import _ from 'lodash'
+import { CTFragment, CTHeading, CTText } from 'layout';
+import { connect } from 'dva'
+import { EPubNavigationProvider } from '../../components';
+import { epub as epubController} from '../../controllers';
+import INoteEditor from './INoteEditor';
+
+// 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);
+  return (
+    <EPubNavigationProvider>
+      <CTFragment dFlex h100 scrollY id={epubController.id.EPubChapterListID} onScroll={onScroll}>
+        <CTFragment width="75%">
+          <CTHeading>{epubData.title}</CTHeading>
+          <INoteEditor> setINoteItem={setINoteItem} dispatch={dispatch} </INoteEditor>
+        </CTFragment>
+      </CTFragment>
+    </EPubNavigationProvider>
+  )
+}
+export default connect(({epub: {epub}, loading }) => ({
+    epub
+  }))(EditINote);
\ No newline at end of file
diff --git a/src/screens/EPub/views/index.js b/src/screens/EPub/views/index.js
index 655b026bd..970b22b59 100644
--- a/src/screens/EPub/views/index.js
+++ b/src/screens/EPub/views/index.js
@@ -1,3 +1,4 @@
 export { default as EditEPubStructure } from './EditEPubStructure';
 export { default as EditEPubChapter } from './EditEPubChapter';
-export { default as ViewAndDownload } from './ViewAndDownload';
\ No newline at end of file
+export { default as ViewAndDownload } from './ViewAndDownload';
+export {default as EditINote } from './EditINote';
\ No newline at end of file
diff --git a/src/screens/Watch/Components/CTPopup/CTPopup.jsx b/src/screens/Watch/Components/CTPopup/CTPopup.jsx
index e8f96f195..1508c585e 100644
--- a/src/screens/Watch/Components/CTPopup/CTPopup.jsx
+++ b/src/screens/Watch/Components/CTPopup/CTPopup.jsx
@@ -10,6 +10,24 @@ import './CTPopup.scss'
 import GlossaryPanel from './GlossaryPanel';
 
 
+
+const ASLVideoPlayer = (word, videoURL, source) => {
+  return (
+    <TabPanel>
+      <strong>{`${word} (Source: ${source})`}</strong><br /><br />
+      {videoURL==='' ? (<span>video not found</span>) 
+      : 
+      (<video 
+        className="video-js vjs-default-skin video-player" 
+        controls
+        preload="auto"
+        data-setup="{}"
+      >
+        <source src={videoURL} type='video/mp4' />
+      </video>)}
+    </TabPanel>)
+}
+
 const CTPopup = ({ time = 0, duration = 0, liveMode = false }) => {
   const [opvalue, setOpvalue] = useState(0.75); // variable for transparency
   const OPSTEP = 0.125; // the amount of changed opvalue for each operation
diff --git a/src/screens/Watch/Components/CTPopup/CTPopup.scss b/src/screens/Watch/Components/CTPopup/CTPopup.scss
index 1e7175e71..52fb6d7cb 100644
--- a/src/screens/Watch/Components/CTPopup/CTPopup.scss
+++ b/src/screens/Watch/Components/CTPopup/CTPopup.scss
@@ -65,7 +65,7 @@
 
 .glossary-entry {
   list-style: none;
-  color:white;
+  color:rgb(169, 169, 169);
   padding-bottom: 3px;
   overflow-x: hidden;
 }
@@ -77,19 +77,21 @@
 
 .glossary-entry button:focus {
   outline-style: none;
-  text-decoration: underline;
+  font-size: larger;
 }
 
 .glossary-entry-highlighted {
-  color:red;
+  font-weight: bold;
+  color:rgb(255, 255, 255);
 }
 
 .glossary-entry-highlighted button {
   background-color: rgb(2, 50, 64);
 }
 
-.nowrap {
+.divPanel span {
   word-wrap: break-word;
+  width: 280px;
 }
 
 
@@ -106,10 +108,15 @@
 }
 
 .video-player {
-  width: 90%;
-  height: 90%;
+  width: 300px;
+  height: 170px;
 }
 
+// .popup-video-player {
+//   height: 80%;
+//   z-index: 100;
+// }
+
 .search-bar {
   // z-index: 100;
   // position: absolute;