From 60919bf1a0eea85d2139c69537c2cdf42c830918 Mon Sep 17 00:00:00 2001 From: Thomas Willheim Date: Tue, 4 Jun 2024 11:50:50 -0700 Subject: [PATCH] starting to play around with some aa gap rendering --- .../src/exampleData/exampleSequenceData.js | 602 +++++++++--------- .../src/RowItem/Translations/Translation.js | 40 +- 2 files changed, 340 insertions(+), 302 deletions(-) diff --git a/packages/ove/demo/src/exampleData/exampleSequenceData.js b/packages/ove/demo/src/exampleData/exampleSequenceData.js index ef1d433b..09416d23 100644 --- a/packages/ove/demo/src/exampleData/exampleSequenceData.js +++ b/packages/ove/demo/src/exampleData/exampleSequenceData.js @@ -1,301 +1,313 @@ -// export default { -// sequence: 'aaa', -// parts: [{name: 'hello there', start: 0,end:3, id: '1241i'}], -// features: [{name: 'oh hi', start: 0,end:3, id: '12kkoo'}], -// } export default { - parts: [ - { - name: "pj5_00001", - start: 0, - end: 5298, - id: "10", - tags: ["1:2", "5"] - }, - { - start: 10, - end: 30, - name: "Part 0", - id: "0", - tags: ["8"] - }, - { - start: 1000, - end: 3000, - name: "Curtis' Part", - id: "9", - tags: ["1:2", "5"] - } - ], - primers: [ - { - name: "Example Primer 1", - start: 280, - end: 300, - type: "primer_bind", - forward: true - } - ], - afeatures: [ - // { - // notes: {}, - // type: "promoter", - // strand: 1, - // name: "I'm a nice Long Sentence wahooo hahahahaha", - // // start: 4900, - // // end: 440 - // start: 4163, - // end: 2650 - // }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""] - }, - arrowheadType: "NONE", - type: "misc_feature", - strand: 1, - name: "CmR I'm a real long label", - start: 4513, - end: 5172 - } - // { - // notes: {}, - // type: "promoter", - // strand: 1, - // name: "I'm a nice Long Sentence wahooo hahahahaha", - // // start: 4900, - // // end: 440 - // start: 1590, - // end: 2650 - // }, - // { - // notes: {}, - // type: "promoter", - // strand: 1, - // name: "I'm a nice Long Sentence wahooo hahahahaha", - // // start: 4900, - // // end: 440 - // start: 1590, - // end: 2650 - // }, - // { - // notes: {}, - // type: "promoter", - // strand: 1, - // name: "I'm a nice Long Sentence wahooo hahahahaha", - // // start: 4900, - // // end: 440 - // start: 1590, - // end: 2650 - // }, - ], + sequence: "aaaaaaaaaaaaaaa", features: [ { - notes: {}, - type: "CDS", - strand: -1, - name: "araC", - start: 6, - end: 884, + name: "oh hi", + start: 0, + end: 10, + forward: true, locations: [ - { start: 6, end: 24 }, - { start: 28, end: 48 }, - { start: 500, end: 884 } - ] - }, - { - notes: {}, - type: "protein_bind", - strand: 1, - name: "Operator I2 and I1", - start: 1123, - end: 1161 - }, - { - notes: { vntifkey: ["4"] }, - type: "CDS", - strand: 1, - name: "signal_peptide", - start: 1952, - end: 2014 - }, - { - notes: {}, - type: "terminator", - strand: 1, - name: "dbl term", - start: 2033, - end: 2161 - }, - { - notes: {}, - type: "protein_bind", - strand: 1, - name: "operator O1", - start: 1071, - end: 1092 - }, - { - notes: {}, - type: "misc_binding", - strand: 1, - name: "CAP site", - start: 1114, - end: 1127 - }, - { - notes: {}, - type: "promoter", - strand: 1, - name: "pBAD promoter", - start: 1160, - end: 1187 - }, - { - notes: { vntifkey: ["4"] }, - type: "CDS", - strand: 1, - name: "GFPuv", - start: 1235, - end: 2017 - }, - { - notes: {}, - type: "misc_feature", - strand: 1, - name: "XhoI_silent_mutation", - start: 1660, - end: 1660 - }, - { notes: {}, type: "RBS", strand: 1, name: "RBS", start: 1215, end: 1234 }, - { - notes: {}, - type: "protein_bind", - strand: 1, - name: "operator O2", - start: 913, - end: 930 - }, - { - notes: {}, - type: "misc_feature", - strand: 1, - name: "BamHI_silent_mutation", - start: 1759, - end: 1759 - }, - { - notes: {}, - type: "misc_marker", - strand: -1, - name: "CmR", - start: 4513, - end: 5172 - }, - { - notes: {}, - type: "rep_origin", - strand: -1, - name: "pSC101**", - start: 2163, - end: 4391 - }, - { - notes: {}, - type: "terminator", - strand: 1, - name: "T0", - start: 4392, - end: 4497 - }, - { - notes: {}, - type: "promoter", - strand: -1, - name: "araE promoter", - start: 1035, - end: 1063 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""] - }, - type: "misc_feature", - strand: -1, - name: "araD", - start: 6, - end: 884 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""], - tag: ["terminator"] - }, - type: "misc_feature", - strand: 1, - name: "dbl term", - start: 2033, - end: 2161 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""] - }, - type: "misc_feature", - strand: -1, - name: "CmR I'm a real long label", - start: 4513, - end: 5172 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""], - tag: ["cds"] - }, - type: "misc_feature", - strand: 1, - name: "GFPuv", - start: 1241, - end: 1951 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""] - }, - type: "misc_feature", - strand: -1, - name: "pSC101**", - start: 2163, - end: 4391 - }, - { - notes: { - preferred5PrimeOverhangs: [""], - preferred3PrimeOverhangs: [""] - }, - type: "misc_feature", - strand: 1, - name: "pS8c-vector_backbone", - start: 2015, - end: 1237 + { start: 0, end: 3 }, + { start: 7, end: 10 } + ], + id: "12kkoo", + type: "CDS" } - ], - name: "pj5_00001", - sequence: - "gacgtcttatgacaacttgacggctacatcattcactttttcttcacaaccggcacggaactcgctcgggctggccccggtgcattttttaaatacccgcgagaaatagagttgatcgtcaaaaccaacattgcgaccgacggtggcgataggcatccgggtggtgctcaaaagcagcttcgcctggctgatacgttggtcctcgcgccagcttaagacgctaatccctaactgctggcggaaaagatgtgacagacgcgacggcgacaagcaaacatgctgtgcgacgctggcgatatcaaaattgctgtctgccaggtgatcgctgatgtactgacaagcctcgcgtacccgattatccatcggtggatggagcgactcgttaatcgcttccatgcgccgcagtaacaattgctcaagcagatttatcgccagcagctccgaatagcgcccttccccttgcccggcgttaatgatttgcccaaacaggtcgctgaaatgcggctggtgcgcttcatccgggcgaaagaaccccgtattggcaaatattgacggccagttaagccattcatgccagtaggcgcgcggacgaaagtaaacccactggtgataccattcgcgagcctccggatgacgaccgtagtgatgaatctctcctggcgggaacagcaaaatatcacccggtcggcaaacaaattctcgtccctgatttttcaccaccccctgaccgcgaatggtgagattgagaatataacctttcattcccagcggtcggtcgataaaaaaatcgagataaccgttggcctcaatcggcgttaaacccgccaccagatgggcattaaacgagtatcccggcagcaggggatcattttgcgcttcagccatacttttcatactcccgccattcagagaagaaaccaattgtccatattgcatcagacattgccgtcactgcgtcttttactggctcttctcgctaaccaaaccggtaaccccgcttattaaaagcattctgtaacaaagcgggaccaaagccatgacaaaaacgcgtaacaaaagtgtctataatcacggcagaaaagtccacattgattatttgcacggcgtcacactttgctatgccatagcatttttatccataagattagcggattctacctgacgctttttatcgcaactctctactgtttctccatacccgtttttttgggaatttttaagaaggagatatacatatgagtaaaggagaagaacttttcactggagttgtcccaattcttgttgaattagatggtgatgttaatgggcacaaattttctgtcagtggagagggtgaaggtgatgcaacatacggaaaacttacccttaaatttatttgcactactggaaaactacctgttccatggccaacacttgtcactactttctcttatggtgttcaatgcttttcccgttatccggatcatatgaaacggcatgactttttcaagagtgccatgcccgaaggttatgtacaggaacgcactatatctttcaaagatgacgggaactacaagacgcgtgctgaagtcaagtttgaaggtgatacccttgttaatcgtatcgagttaaaaggtattgattttaaagaagatggaaacattctcggacacaaactcgaatacaactataactcacacaatgtatacatcacggcagacaaacaaaagaatggaatcaaagctaacttcaaaattcgccacaacattgaagatggatctgttcaactagcagaccattatcaacaaaatactccaattggcgatggccctgtccttttaccagacaaccattacctgtcgacacaatctgccctttcgaaagatcccaacgaaaagcgtgaccacatggtccttcttgagtttgtaactgctgctgggattacacatggcatggatgagctcggcggcggcggcagcaaggtctacggcaaggaacagtttttgcggatgcgccagagcatgttccccgatcgctaaatcgagtaaggatctccaggcatcaaataaaacgaaaggctcagtcgaaagactgggcctttcgttttatctgttgtttgtcggtgaacgctctctactagagtcacactggctcaccttcgggtgggcctttctgcgtttatacctagggtacgggttttgctgcccgcaaacgggctgttctggtgttgctagtttgttatcagaatcgcagatccggcttcagccggtttgccggctgaaagcgctatttcttccagaattgccatgattttttccccacgggaggcgtcactggctcccgtgttgtcggcagctttgattcgataagcagcatcgcctgtttcaggctgtctatgtgtgactgttgagctgtaacaagttgtctcaggtgttcaatttcatgttctagttgctttgttttactggtttcacctgttctattaggtgttacatgctgttcatctgttacattgtcgatctgttcatggtgaacagctttgaatgcaccaaaaactcgtaaaagctctgatgtatctatcttttttacaccgttttcatctgtgcatatggacagttttccctttgatatgtaacggtgaacagttgttctacttttgtttgttagtcttgatgcttcactgatagatacaagagccataagaacctcagatccttccgtatttagccagtatgttctctagtgtggttcgttgtttttgcgtgagccatgagaacgaaccattgagatcatacttactttgcatgtcactcaaaaattttgcctcaaaactggtgagctgaatttttgcagttaaagcatcgtgtagtgtttttcttagtccgttatgtaggtaggaatctgatgtaatggttgttggtattttgtcaccattcatttttatctggttgttctcaagttcggttacgagatccatttgtctatctagttcaacttggaaaatcaacgtatcagtcgggcggcctcgcttatcaaccaccaatttcatattgctgtaagtgtttaaatctttacttattggtttcaaaacccattggttaagccttttaaactcatggtagttattttcaagcattaacatgaacttaaattcatcaaggctaatctctatatttgccttgtgagttttcttttgtgttagttcttttaataaccactcataaatcctcatagagtatttgttttcaaaagacttaacatgttccagattatattttatgaatttttttaactggaaaagataaggcaatatctcttcactaaaaactaattctaatttttcgcttgagaacttggcatagtttgtccactggaaaatctcaaagcctttaaccaaaggattcctgatttccacagttctcgtcatcagctctctggttgctttagctaatacaccataagcattttccctactgatgttcatcatctgagcgtattggttataagtgaacgataccgtccgttctttccttgtagggttttcaatcgtggggttgagtagtgccacacagcataaaattagcttggtttcatgctccgttaagtcatagcgactaatcgctagttcatttgctttgaaaacaactaattcagacatacatctcaattggtctaggtgattttaatcactataccaattgagatgggctagtcaatgataattactagtccttttcccgggtgatctgggtatctgtaaattctgctagacctttgctggaaaacttgtaaattctgctagaccctctgtaaattccgctagacctttgtgtgttttttttgtttatattcaagtggttataatttatagaataaagaaagaataaaaaaagataaaaagaatagatcccagccctgtgtataactcactactttagtcagttccgcagtattacaaaaggatgtcgcaaacgctgtttgctcctctacaaaacagaccttaaaaccctaaaggcttaagtagcaccctcgcaagctcgggcaaatcgctgaatattccttttgtctccgaccatcaggcacctgagtcgctgtctttttcgtgacattcagttcgctgcgctcacggctctggcagtgaatgggggtaaatggcactacaggcgccttttatggattcatgcaaggaaactacccataatacaagaaaagcccgtcacgggcttctcagggcgttttatggcgggtctgctatgtggtgctatctgactttttgctgttcagcagttcctgccctctgattttccagtctgaccacttcggattatcccgtgacaggtcattcagactggctaatgcacccagtaaggcagcggtatcatcaacaggcttacccgtcttactgtccctagtgcttggattctcaccaataaaaaacgcccggcggcaaccgagcgttctgaacaaatccagatggagttctgaggtcattactggatctatcaacaggagtccaagcgagctcgatatcaaattacgccccgccctgccactcatcgcagtactgttgtaattcattaagcattctgccgacatggaagccatcacaaacggcatgatgaacctgaatcgccagcggcatcagcaccttgtcgccttgcgtataatatttgcccatggtgaaaacgggggcgaagaagttgtccatattggccacgtttaaatcaaaactggtgaaactcacccagggattggctgagacgaaaaacatattctcaataaaccctttagggaaataggccaggttttcaccgtaacacgccacatcttgcgaatatatgtgtagaaactgccggaaatcgtcgtggtattcactccagagcgatgaaaacgtttcagtttgctcatggaaaacggtgtaacaagggtgaacactatcccatatcaccagctcaccgtctttcattgccatacgaaattccggatgagcattcatcaggcgggcaagaatgtgaataaaggccggataaaacttgtgcttatttttctttacggtctttaaaaaggccgtaatatccagctgaacggtctggttataggtacattgagcaactgactgaaatgcctcaaaatgttctttacgatgccattgggatatatcaacggtggtatatccagtgatttttttctccattttagcttccttagctcctgaaaatctcgataactcaaaaaatacgcccggtagtgatcttatttcattatggtgaaagttggaacctcttacgtgccgatcaacgtctcattttcgccagatatc", - date: "24-APR-2018", - circular: true, - // cutsiteLabelColors: { single: "#984d00", double: "#810000" , multi: "#797a00" }, - comments: [], - teselagen_unique_id: "5adf735aa1811801e17d8aac", - extraLines: [], - type: "DNA", - size: 5299, - id: "jdosjio81" + ] }; +// export default { +// parts: [ +// { +// name: "pj5_00001", +// start: 0, +// end: 5298, +// id: "10", +// tags: ["1:2", "5"] +// }, +// { +// start: 10, +// end: 30, +// name: "Part 0", +// id: "0", +// tags: ["8"] +// }, +// { +// start: 1000, +// end: 3000, +// name: "Curtis' Part", +// id: "9", +// tags: ["1:2", "5"] +// } +// ], +// primers: [ +// { +// name: "Example Primer 1", +// start: 280, +// end: 300, +// type: "primer_bind", +// forward: true +// } +// ], +// afeatures: [ +// // { +// // notes: {}, +// // type: "promoter", +// // strand: 1, +// // name: "I'm a nice Long Sentence wahooo hahahahaha", +// // // start: 4900, +// // // end: 440 +// // start: 4163, +// // end: 2650 +// // }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""] +// }, +// arrowheadType: "NONE", +// type: "misc_feature", +// strand: 1, +// name: "CmR I'm a real long label", +// start: 4513, +// end: 5172 +// } +// // { +// // notes: {}, +// // type: "promoter", +// // strand: 1, +// // name: "I'm a nice Long Sentence wahooo hahahahaha", +// // // start: 4900, +// // // end: 440 +// // start: 1590, +// // end: 2650 +// // }, +// // { +// // notes: {}, +// // type: "promoter", +// // strand: 1, +// // name: "I'm a nice Long Sentence wahooo hahahahaha", +// // // start: 4900, +// // // end: 440 +// // start: 1590, +// // end: 2650 +// // }, +// // { +// // notes: {}, +// // type: "promoter", +// // strand: 1, +// // name: "I'm a nice Long Sentence wahooo hahahahaha", +// // // start: 4900, +// // // end: 440 +// // start: 1590, +// // end: 2650 +// // }, +// ], +// features: [ +// { +// notes: {}, +// type: "CDS", +// strand: -1, +// name: "araC", +// start: 6, +// end: 884, +// locations: [ +// { start: 6, end: 24 }, +// { start: 28, end: 48 }, +// { start: 500, end: 884 } +// ] +// }, +// { +// notes: {}, +// type: "protein_bind", +// strand: 1, +// name: "Operator I2 and I1", +// start: 1123, +// end: 1161 +// }, +// { +// notes: { vntifkey: ["4"] }, +// type: "CDS", +// strand: 1, +// name: "signal_peptide", +// start: 1952, +// end: 2014 +// }, +// { +// notes: {}, +// type: "terminator", +// strand: 1, +// name: "dbl term", +// start: 2033, +// end: 2161 +// }, +// { +// notes: {}, +// type: "protein_bind", +// strand: 1, +// name: "operator O1", +// start: 1071, +// end: 1092 +// }, +// { +// notes: {}, +// type: "misc_binding", +// strand: 1, +// name: "CAP site", +// start: 1114, +// end: 1127 +// }, +// { +// notes: {}, +// type: "promoter", +// strand: 1, +// name: "pBAD promoter", +// start: 1160, +// end: 1187 +// }, +// { +// notes: { vntifkey: ["4"] }, +// type: "CDS", +// strand: 1, +// name: "GFPuv", +// start: 1235, +// end: 2017 +// }, +// { +// notes: {}, +// type: "misc_feature", +// strand: 1, +// name: "XhoI_silent_mutation", +// start: 1660, +// end: 1660 +// }, +// { notes: {}, type: "RBS", strand: 1, name: "RBS", start: 1215, end: 1234 }, +// { +// notes: {}, +// type: "protein_bind", +// strand: 1, +// name: "operator O2", +// start: 913, +// end: 930 +// }, +// { +// notes: {}, +// type: "misc_feature", +// strand: 1, +// name: "BamHI_silent_mutation", +// start: 1759, +// end: 1759 +// }, +// { +// notes: {}, +// type: "misc_marker", +// strand: -1, +// name: "CmR", +// start: 4513, +// end: 5172 +// }, +// { +// notes: {}, +// type: "rep_origin", +// strand: -1, +// name: "pSC101**", +// start: 2163, +// end: 4391 +// }, +// { +// notes: {}, +// type: "terminator", +// strand: 1, +// name: "T0", +// start: 4392, +// end: 4497 +// }, +// { +// notes: {}, +// type: "promoter", +// strand: -1, +// name: "araE promoter", +// start: 1035, +// end: 1063 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""] +// }, +// type: "misc_feature", +// strand: -1, +// name: "araD", +// start: 6, +// end: 884 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""], +// tag: ["terminator"] +// }, +// type: "misc_feature", +// strand: 1, +// name: "dbl term", +// start: 2033, +// end: 2161 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""] +// }, +// type: "misc_feature", +// strand: -1, +// name: "CmR I'm a real long label", +// start: 4513, +// end: 5172 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""], +// tag: ["cds"] +// }, +// type: "misc_feature", +// strand: 1, +// name: "GFPuv", +// start: 1241, +// end: 1951 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""] +// }, +// type: "misc_feature", +// strand: -1, +// name: "pSC101**", +// start: 2163, +// end: 4391 +// }, +// { +// notes: { +// preferred5PrimeOverhangs: [""], +// preferred3PrimeOverhangs: [""] +// }, +// type: "misc_feature", +// strand: 1, +// name: "pS8c-vector_backbone", +// start: 2015, +// end: 1237 +// } +// ], +// name: "pj5_00001", +// sequence: +// "gacgtcttatgacaacttgacggctacatcattcactttttcttcacaaccggcacggaactcgctcgggctggccccggtgcattttttaaatacccgcgagaaatagagttgatcgtcaaaaccaacattgcgaccgacggtggcgataggcatccgggtggtgctcaaaagcagcttcgcctggctgatacgttggtcctcgcgccagcttaagacgctaatccctaactgctggcggaaaagatgtgacagacgcgacggcgacaagcaaacatgctgtgcgacgctggcgatatcaaaattgctgtctgccaggtgatcgctgatgtactgacaagcctcgcgtacccgattatccatcggtggatggagcgactcgttaatcgcttccatgcgccgcagtaacaattgctcaagcagatttatcgccagcagctccgaatagcgcccttccccttgcccggcgttaatgatttgcccaaacaggtcgctgaaatgcggctggtgcgcttcatccgggcgaaagaaccccgtattggcaaatattgacggccagttaagccattcatgccagtaggcgcgcggacgaaagtaaacccactggtgataccattcgcgagcctccggatgacgaccgtagtgatgaatctctcctggcgggaacagcaaaatatcacccggtcggcaaacaaattctcgtccctgatttttcaccaccccctgaccgcgaatggtgagattgagaatataacctttcattcccagcggtcggtcgataaaaaaatcgagataaccgttggcctcaatcggcgttaaacccgccaccagatgggcattaaacgagtatcccggcagcaggggatcattttgcgcttcagccatacttttcatactcccgccattcagagaagaaaccaattgtccatattgcatcagacattgccgtcactgcgtcttttactggctcttctcgctaaccaaaccggtaaccccgcttattaaaagcattctgtaacaaagcgggaccaaagccatgacaaaaacgcgtaacaaaagtgtctataatcacggcagaaaagtccacattgattatttgcacggcgtcacactttgctatgccatagcatttttatccataagattagcggattctacctgacgctttttatcgcaactctctactgtttctccatacccgtttttttgggaatttttaagaaggagatatacatatgagtaaaggagaagaacttttcactggagttgtcccaattcttgttgaattagatggtgatgttaatgggcacaaattttctgtcagtggagagggtgaaggtgatgcaacatacggaaaacttacccttaaatttatttgcactactggaaaactacctgttccatggccaacacttgtcactactttctcttatggtgttcaatgcttttcccgttatccggatcatatgaaacggcatgactttttcaagagtgccatgcccgaaggttatgtacaggaacgcactatatctttcaaagatgacgggaactacaagacgcgtgctgaagtcaagtttgaaggtgatacccttgttaatcgtatcgagttaaaaggtattgattttaaagaagatggaaacattctcggacacaaactcgaatacaactataactcacacaatgtatacatcacggcagacaaacaaaagaatggaatcaaagctaacttcaaaattcgccacaacattgaagatggatctgttcaactagcagaccattatcaacaaaatactccaattggcgatggccctgtccttttaccagacaaccattacctgtcgacacaatctgccctttcgaaagatcccaacgaaaagcgtgaccacatggtccttcttgagtttgtaactgctgctgggattacacatggcatggatgagctcggcggcggcggcagcaaggtctacggcaaggaacagtttttgcggatgcgccagagcatgttccccgatcgctaaatcgagtaaggatctccaggcatcaaataaaacgaaaggctcagtcgaaagactgggcctttcgttttatctgttgtttgtcggtgaacgctctctactagagtcacactggctcaccttcgggtgggcctttctgcgtttatacctagggtacgggttttgctgcccgcaaacgggctgttctggtgttgctagtttgttatcagaatcgcagatccggcttcagccggtttgccggctgaaagcgctatttcttccagaattgccatgattttttccccacgggaggcgtcactggctcccgtgttgtcggcagctttgattcgataagcagcatcgcctgtttcaggctgtctatgtgtgactgttgagctgtaacaagttgtctcaggtgttcaatttcatgttctagttgctttgttttactggtttcacctgttctattaggtgttacatgctgttcatctgttacattgtcgatctgttcatggtgaacagctttgaatgcaccaaaaactcgtaaaagctctgatgtatctatcttttttacaccgttttcatctgtgcatatggacagttttccctttgatatgtaacggtgaacagttgttctacttttgtttgttagtcttgatgcttcactgatagatacaagagccataagaacctcagatccttccgtatttagccagtatgttctctagtgtggttcgttgtttttgcgtgagccatgagaacgaaccattgagatcatacttactttgcatgtcactcaaaaattttgcctcaaaactggtgagctgaatttttgcagttaaagcatcgtgtagtgtttttcttagtccgttatgtaggtaggaatctgatgtaatggttgttggtattttgtcaccattcatttttatctggttgttctcaagttcggttacgagatccatttgtctatctagttcaacttggaaaatcaacgtatcagtcgggcggcctcgcttatcaaccaccaatttcatattgctgtaagtgtttaaatctttacttattggtttcaaaacccattggttaagccttttaaactcatggtagttattttcaagcattaacatgaacttaaattcatcaaggctaatctctatatttgccttgtgagttttcttttgtgttagttcttttaataaccactcataaatcctcatagagtatttgttttcaaaagacttaacatgttccagattatattttatgaatttttttaactggaaaagataaggcaatatctcttcactaaaaactaattctaatttttcgcttgagaacttggcatagtttgtccactggaaaatctcaaagcctttaaccaaaggattcctgatttccacagttctcgtcatcagctctctggttgctttagctaatacaccataagcattttccctactgatgttcatcatctgagcgtattggttataagtgaacgataccgtccgttctttccttgtagggttttcaatcgtggggttgagtagtgccacacagcataaaattagcttggtttcatgctccgttaagtcatagcgactaatcgctagttcatttgctttgaaaacaactaattcagacatacatctcaattggtctaggtgattttaatcactataccaattgagatgggctagtcaatgataattactagtccttttcccgggtgatctgggtatctgtaaattctgctagacctttgctggaaaacttgtaaattctgctagaccctctgtaaattccgctagacctttgtgtgttttttttgtttatattcaagtggttataatttatagaataaagaaagaataaaaaaagataaaaagaatagatcccagccctgtgtataactcactactttagtcagttccgcagtattacaaaaggatgtcgcaaacgctgtttgctcctctacaaaacagaccttaaaaccctaaaggcttaagtagcaccctcgcaagctcgggcaaatcgctgaatattccttttgtctccgaccatcaggcacctgagtcgctgtctttttcgtgacattcagttcgctgcgctcacggctctggcagtgaatgggggtaaatggcactacaggcgccttttatggattcatgcaaggaaactacccataatacaagaaaagcccgtcacgggcttctcagggcgttttatggcgggtctgctatgtggtgctatctgactttttgctgttcagcagttcctgccctctgattttccagtctgaccacttcggattatcccgtgacaggtcattcagactggctaatgcacccagtaaggcagcggtatcatcaacaggcttacccgtcttactgtccctagtgcttggattctcaccaataaaaaacgcccggcggcaaccgagcgttctgaacaaatccagatggagttctgaggtcattactggatctatcaacaggagtccaagcgagctcgatatcaaattacgccccgccctgccactcatcgcagtactgttgtaattcattaagcattctgccgacatggaagccatcacaaacggcatgatgaacctgaatcgccagcggcatcagcaccttgtcgccttgcgtataatatttgcccatggtgaaaacgggggcgaagaagttgtccatattggccacgtttaaatcaaaactggtgaaactcacccagggattggctgagacgaaaaacatattctcaataaaccctttagggaaataggccaggttttcaccgtaacacgccacatcttgcgaatatatgtgtagaaactgccggaaatcgtcgtggtattcactccagagcgatgaaaacgtttcagtttgctcatggaaaacggtgtaacaagggtgaacactatcccatatcaccagctcaccgtctttcattgccatacgaaattccggatgagcattcatcaggcgggcaagaatgtgaataaaggccggataaaacttgtgcttatttttctttacggtctttaaaaaggccgtaatatccagctgaacggtctggttataggtacattgagcaactgactgaaatgcctcaaaatgttctttacgatgccattgggatatatcaacggtggtatatccagtgatttttttctccattttagcttccttagctcctgaaaatctcgataactcaaaaaatacgcccggtagtgatcttatttcattatggtgaaagttggaacctcttacgtgccgatcaacgtctcattttcgccagatatc", +// date: "24-APR-2018", +// circular: true, +// // cutsiteLabelColors: { single: "#984d00", double: "#810000" , multi: "#797a00" }, +// comments: [], +// teselagen_unique_id: "5adf735aa1811801e17d8aac", +// extraLines: [], +// type: "DNA", +// size: 5299, +// id: "jdosjio81" +// }; diff --git a/packages/ove/src/RowItem/Translations/Translation.js b/packages/ove/src/RowItem/Translations/Translation.js index 4408a640..f198fbe2 100644 --- a/packages/ove/src/RowItem/Translations/Translation.js +++ b/packages/ove/src/RowItem/Translations/Translation.js @@ -57,12 +57,37 @@ class Translation extends React.Component { ); //we then loop over all the amino acids in the sub range and draw them onto the row + let prevAaSliver; + let nextAaSliver = aminoAcidsForSubrange[1]; const translationSVG = aminoAcidsForSubrange.map( function (aminoAcidSliver, index) { + if (aminoAcidSliver.positionInCodon === null) { + prevAaSliver = aminoAcidSliver; + nextAaSliver = aminoAcidsForSubrange[index + 2]; + return ( + + ); + } const isEndFiller = - index === 0 && - aminoAcidSliver.positionInCodon === (annotation.forward ? 2 : 0); - // const isStartFiller = false + (prevAaSliver?.positionInCodon === null && + aminoAcidSliver.positionInCodon === 1) || + (index === 0 && + aminoAcidSliver.positionInCodon === (annotation.forward ? 2 : 0)); + + const isStartFiller = + (nextAaSliver?.positionInCodon === null && + aminoAcidSliver.positionInCodon === 0) || + (index === aminoAcidsForSubrange.length - 1 && + aminoAcidSliver.positionInCodon === (annotation.forward ? 0 : 2)); + let isTruncatedEnd = index === 0 && aminoAcidSliver.positionInCodon === 1; let isTruncatedStart = @@ -73,15 +98,13 @@ class Translation extends React.Component { isTruncatedEnd = isTruncatedStart; isTruncatedStart = holder; } - const isStartFiller = - index === aminoAcidsForSubrange.length - 1 && - aminoAcidSliver.positionInCodon === (annotation.forward ? 0 : 2); - if ( aminoAcidSliver.positionInCodon !== 1 && !isStartFiller && !isEndFiller ) { + prevAaSliver = aminoAcidSliver; + nextAaSliver = aminoAcidsForSubrange[index + 2]; return null; } const { gapsInside, gapsBefore } = getGaps(aminoAcidSliver.codonRange); @@ -103,6 +126,9 @@ class Translation extends React.Component { } else { color = aminoAcid.color; } + prevAaSliver = aminoAcidSliver; + nextAaSliver = aminoAcidsForSubrange[index + 2]; + return (