Change link behavior on sheets to open sheet links and refs in same s…

…econdary panel.
Sefaria · Mar 15, 2022 · 0216ff4 · 0216ff4
1 parent a955a0e
commit 0216ff4
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 2 deletions.
diff --git a/static/js/Editor.jsx b/static/js/Editor.jsx
@@ -2729,7 +2729,7 @@ const SefariaEditor = (props) => {
 
 
     return (
-        <div ref={editorContainer}>
+        <div ref={editorContainer} onClick={props.handleClick}>
         {
           /* debugger */
 

diff --git a/static/js/ReaderPanel.jsx b/static/js/ReaderPanel.jsx
@@ -669,6 +669,7 @@ class ReaderPanel extends Component {
           scrollToHighlighted={this.state.scrollToHighlighted}
           onRefClick={this.handleCitationClick}
           onSegmentClick={this.handleSheetSegmentClick}
+          onCitationClick={this.handleCitationClick}
           openSheet={this.openSheet}
           hasSidebar={this.props.hasSidebar}
           setSelectedWords={this.setSelectedWords}

diff --git a/static/js/Sheet.jsx b/static/js/Sheet.jsx
@@ -55,6 +55,35 @@ class Sheet extends Component {
       }
     }
   }
+  handleClick(e) {
+    const target = e.target.closest('a')
+    if (target) {
+      let url;
+      try {
+        url = new URL(target.href);
+      } catch {
+        return false;
+      }
+      const path = url.pathname;
+      const params = url.searchParams;
+
+      if (path.match(/^\/sheets\/\d+/)) {
+        e.preventDefault()
+        console.log();
+        this.props.onCitationClick(`Sheet ${path.slice(8)}`, `Sheet ${this.props.sheetID}`, true)
+      }
+
+      else if (Sefaria.isRef(path.slice(1))) {
+        e.preventDefault()
+        const currVersions = {en: params.get("ven"), he: params.get("vhe")};
+        const options = {showHighlight: path.slice(1).indexOf("-") !== -1};   // showHighlight when ref is ranged
+        this.props.onCitationClick(path.slice(1), `Sheet ${this.props.sheetID}`, true, currVersions)
+      }
+
+    }
+  }
+
+
   render() {
     const sheet = this.getSheetFromCache();
     const classes = classNames({sheetsInPanel: 1});
@@ -69,6 +98,7 @@ class Sheet extends Component {
           sources={sheet.sources}
           title={sheet.title}
           onRefClick={this.props.onRefClick}
+          handleClick={this.handleClick}
           sheetSourceClick={this.props.onSegmentClick}
           highlightedNode={this.props.highlightedNode}
           highlightedRefsInSheet={this.props.highlightedRefsInSheet}
@@ -95,6 +125,7 @@ class Sheet extends Component {
           <SefariaEditor
             data={sheet}
             hasSidebar={this.props.hasSidebar}
+            handleClick={this.handleClick}
             multiPanel={this.props.multiPanel}
             sheetSourceClick={this.props.onSegmentClick}
             highlightedNode={this.props.highlightedNode}
@@ -324,7 +355,7 @@ class SheetContent extends Component {
         </SheetMetaDataBox>
 
         <div className="text">
-          <div className="textInner" onMouseUp={this.handleTextSelection}>
+          <div className="textInner" onMouseUp={this.handleTextSelection} onClick={this.props.handleClick}>
             {sources}
           </div>
         </div>