Skip to content

Commit a185513

Browse files
committed
added advanced parameters to the link sharing
1 parent 343dfcd commit a185513

File tree

12 files changed

+393
-19
lines changed

12 files changed

+393
-19
lines changed

README.md

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -102,10 +102,5 @@ ROS1_ARATH and ROS1A_ORYSJ
102102
103103
104104
## Quick notes
105-
106-
* Leave the charactesr out when too zoomed out
107-
* Add explanation of the blue line
108105
* Crash report should tell the user to refresh the page
109-
* Examples should give better sequences to test
110106
* Try example should have a link
111-
* Change example sequences

src/components/alignment/AlignmentGraphWithInfoPanel.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,9 @@ interface AlignmentGraphWithInfoPanelProps {
2828
delta?: number;
2929
accessionA?: string;
3030
accessionB?: string;
31+
gapCost?: number;
32+
startGap?: number;
33+
costMatrixType?: number;
3134
}
3235

3336
export const AlignmentGraphWithInfoPanel: React.FC<AlignmentGraphWithInfoPanelProps> = ({
@@ -45,7 +48,10 @@ export const AlignmentGraphWithInfoPanel: React.FC<AlignmentGraphWithInfoPanelPr
4548
alpha,
4649
delta,
4750
accessionA,
48-
accessionB
51+
accessionB,
52+
gapCost: _gapCost,
53+
startGap: _startGap,
54+
costMatrixType: _costMatrixType
4955
}) => {
5056
const [selectedSafetyWindowId, setSelectedSafetyWindowId] = useState<string | null>(null);
5157
const [hoveredSafetyWindowId, setHoveredSafetyWindowId] = useState<string | null>(null);

src/components/alignment/SafetyWindowsInfoPanel.tsx

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import VisualizationSettingsPanel from './VisualizationSettingsPanel';
44
import type { VisualizationSettings } from './VisualizationSettingsPanel';
55
import { ShareAndExportPanel } from '../share';
66
import type { PointGridPlotRef } from './PointGridPlot';
7+
import { useSequence } from '../../context/SequenceContext';
78
// import AlignmentParamsPanel from './AlignmentParamsPanel';
89
import './SafetyWindowsInfoPanel.css';
910
import './SequenceAlignmentViewer.css'; // Import for amino acid coloring classes
@@ -79,6 +80,7 @@ export const SafetyWindowsInfoPanel: React.FC<SafetyWindowsInfoPanelProps> = ({
7980
accessionA,
8081
accessionB
8182
}) => {
83+
const { state } = useSequence();
8284
const [copyStatus, setCopyStatus] = useState<{id: string, success: boolean} | null>(null);
8385
const [internalActiveTab, setInternalActiveTab] = useState<'general-info' | 'safety-windows' | 'unsafe-windows' | 'visualization' | 'path-selection' | 'export'>('general-info'); // Use external active tab if provided, otherwise use internal state
8486
const activeTab = externalActiveTab !== undefined ? externalActiveTab : internalActiveTab;
@@ -1207,6 +1209,9 @@ export const SafetyWindowsInfoPanel: React.FC<SafetyWindowsInfoPanelProps> = ({
12071209
delta={delta}
12081210
accessionA={accessionA}
12091211
accessionB={accessionB}
1212+
gapCost={state.params.gapCost}
1213+
startGap={state.params.startGap}
1214+
costMatrixType={state.params.costMatrixType}
12101215
canvasRef={canvasRef}
12111216
pointGridRef={pointGridRef}
12121217
/>

src/components/sequence/EmeraldInput.tsx

Lines changed: 38 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const EmeraldInput: React.FC<EmeraldInputProps> = ({ onSubmit }) => {
2121
const { sequences, params, alignmentStatus, fetchStatusA, fetchErrorA, fetchStatusB, fetchErrorB } = state;
2222

2323
// Feedback notifications
24-
const { notifySuccess, notifyError, notifyInfo } = useFeedbackNotifications();
24+
const { notifySuccess, notifyError, notifyInfo, showError } = useFeedbackNotifications();
2525

2626
// Get validation warnings
2727
const validationWarnings = getValidationWarnings();
@@ -89,7 +89,26 @@ const EmeraldInput: React.FC<EmeraldInputProps> = ({ onSubmit }) => {
8989

9090
notifySuccess('Alignment Complete', 'Suboptimal alignment graph has been generated successfully');
9191
} catch (error) {
92-
notifyError('Alignment Failed', `Failed to generate alignment: ${error instanceof Error ? error.message : 'Unknown error'}`);
92+
const errorMessage = error instanceof Error ? error.message : 'Unknown error';
93+
94+
// Check if this is a memory-related error
95+
if (errorMessage.includes('Memory limit exceeded') ||
96+
errorMessage.includes('Cannot enlarge memory') ||
97+
errorMessage.includes('out of memory') ||
98+
errorMessage.includes('OutOfMemory') ||
99+
errorMessage.includes('stack overflow') ||
100+
errorMessage.includes('Maximum call stack') ||
101+
errorMessage.includes('Aborted') ||
102+
errorMessage.includes('RuntimeError') ||
103+
errorMessage.includes('memory access out of bounds')) {
104+
showError(
105+
'Memory Limit Exceeded',
106+
'Your browser has run out of memory processing these sequences. Please refresh the page and try again with shorter sequences.',
107+
{ duration: 0 } // Don't auto-dismiss memory errors
108+
);
109+
} else {
110+
notifyError('Alignment Failed', `Failed to generate alignment: ${errorMessage}`);
111+
}
93112
}
94113
} else {
95114
notifyError('Invalid Input', 'Please check your sequences and parameters before submitting');
@@ -478,7 +497,23 @@ const EmeraldInput: React.FC<EmeraldInputProps> = ({ onSubmit }) => {
478497

479498
{state.alignmentError && (
480499
<div className="error-message">
481-
{state.alignmentError}
500+
{/* Check if this is a memory-related error from context */}
501+
{(state.alignmentError.includes('Memory limit exceeded') ||
502+
state.alignmentError.includes('Cannot enlarge memory') ||
503+
state.alignmentError.includes('out of memory') ||
504+
state.alignmentError.includes('OutOfMemory') ||
505+
state.alignmentError.includes('stack overflow') ||
506+
state.alignmentError.includes('Maximum call stack') ||
507+
state.alignmentError.includes('Aborted') ||
508+
state.alignmentError.includes('RuntimeError') ||
509+
state.alignmentError.includes('memory access out of bounds')) ? (
510+
<div>
511+
<strong>Memory Limit Exceeded</strong><br />
512+
Your browser has run out of memory processing these sequences. Please refresh the page and try again with shorter sequences.
513+
</div>
514+
) : (
515+
state.alignmentError
516+
)}
482517
</div>
483518
)}
484519
</div>

src/components/sequence/FileUploader.tsx

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -174,7 +174,23 @@ export const FileUploader = ({
174174

175175
} catch (err) {
176176
console.error('Error processing file:', err);
177-
alert('Error processing file: ' + err);
177+
const errorMessage = err instanceof Error ? err.message : String(err);
178+
179+
// Check if this is a memory-related error
180+
if (errorMessage.includes('Memory limit exceeded') ||
181+
errorMessage.includes('Cannot enlarge memory') ||
182+
errorMessage.includes('out of memory') ||
183+
errorMessage.includes('OutOfMemory') ||
184+
errorMessage.includes('stack overflow') ||
185+
errorMessage.includes('Maximum call stack') ||
186+
errorMessage.includes('Aborted') ||
187+
errorMessage.includes('RuntimeError') ||
188+
errorMessage.includes('memory access out of bounds') ||
189+
errorMessage.includes('unreachable executed')) {
190+
alert('Memory Limit Exceeded\n\nYour browser has run out of memory processing these sequences. Please refresh the page and try again with shorter sequences.');
191+
} else {
192+
alert('Error processing file: ' + errorMessage);
193+
}
178194
} finally {
179195
setLoading(false);
180196
}

src/components/share/ShareAndExportPanel.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,9 @@ interface ShareAndExportPanelProps {
1212
delta: number;
1313
accessionA?: string;
1414
accessionB?: string;
15+
gapCost?: number;
16+
startGap?: number;
17+
costMatrixType?: number;
1518
// Props for ExportImagePanel
1619
canvasRef: React.RefObject<HTMLCanvasElement | null>;
1720
pointGridRef?: React.RefObject<PointGridPlotRef | null>;
@@ -24,6 +27,9 @@ const ShareAndExportPanel: React.FC<ShareAndExportPanelProps> = ({
2427
delta,
2528
accessionA,
2629
accessionB,
30+
gapCost,
31+
startGap,
32+
costMatrixType,
2733
canvasRef,
2834
pointGridRef
2935
}) => {
@@ -42,6 +48,9 @@ const ShareAndExportPanel: React.FC<ShareAndExportPanelProps> = ({
4248
delta={delta}
4349
accessionA={accessionA}
4450
accessionB={accessionB}
51+
gapCost={gapCost}
52+
startGap={startGap}
53+
costMatrixType={costMatrixType}
4554
/>
4655
</div>
4756
);

src/components/share/ShareUrlPanel.tsx

Lines changed: 33 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,32 @@ import { generateShareableUrl, isAlignmentShareable, checkBrowserCompatibility }
33
import '../shared/Panel.css';
44
import './ShareUrlPanel.css';
55

6+
// Helper function to get cost matrix name
7+
const getCostMatrixName = (matrixType: number): string => {
8+
const names = {
9+
0: 'BLOSUM45',
10+
1: 'BLOSUM50',
11+
2: 'BLOSUM62',
12+
3: 'BLOSUM80',
13+
4: 'BLOSUM90',
14+
5: 'PAM30',
15+
6: 'PAM70',
16+
7: 'PAM250',
17+
8: 'IDENTITY'
18+
};
19+
return names[matrixType as keyof typeof names] || 'Unknown';
20+
};
21+
622
interface ShareUrlPanelProps {
723
descriptorA: string;
824
descriptorB: string;
925
alpha: number;
1026
delta: number;
1127
accessionA?: string;
1228
accessionB?: string;
29+
gapCost?: number;
30+
startGap?: number;
31+
costMatrixType?: number;
1332
}
1433

1534
const ShareUrlPanel: React.FC<ShareUrlPanelProps> = ({
@@ -18,7 +37,10 @@ const ShareUrlPanel: React.FC<ShareUrlPanelProps> = ({
1837
alpha,
1938
delta,
2039
accessionA,
21-
accessionB
40+
accessionB,
41+
gapCost,
42+
startGap,
43+
costMatrixType
2244
}) => {
2345
const [isCopied, setIsCopied] = useState(false);
2446
const [copyError, setCopyError] = useState<string | null>(null);
@@ -41,7 +63,7 @@ const ShareUrlPanel: React.FC<ShareUrlPanelProps> = ({
4163
return null;
4264
}
4365

44-
const shareUrl = generateShareableUrl(descriptorA, descriptorB, alpha, delta, accessionA, accessionB);
66+
const shareUrl = generateShareableUrl(descriptorA, descriptorB, alpha, delta, accessionA, accessionB, gapCost, startGap, costMatrixType);
4567

4668
if (!shareUrl) {
4769
return null;
@@ -123,6 +145,15 @@ const ShareUrlPanel: React.FC<ShareUrlPanelProps> = ({
123145
<li>UniProt sequences A & B</li>
124146
<li>Alpha = {alpha}</li>
125147
<li>Delta = {delta}</li>
148+
{gapCost !== undefined && gapCost !== -1 && (
149+
<li>Gap Cost = {gapCost}</li>
150+
)}
151+
{startGap !== undefined && startGap !== -11 && (
152+
<li>Start Gap = {startGap}</li>
153+
)}
154+
{costMatrixType !== undefined && costMatrixType !== 2 && (
155+
<li>Cost Matrix = {getCostMatrixName(costMatrixType)}</li>
156+
)}
126157
</ul>
127158
</div>
128159
</div>

0 commit comments

Comments
 (0)