Skip to content
This repository has been archived by the owner on Jan 22, 2024. It is now read-only.

Commit

Permalink
Merge pull request #131 from TeselaGen/iceIntegration
Browse files Browse the repository at this point in the history 
Ice integration
  • Loading branch information
@jakecoble
jakecoble committed Mar 23, 2016
2 parents 10ec6fe + f7aa2bb commit 0f711b3
Show file tree
Hide file tree
Showing 42 changed files with 339 additions and 125 deletions.
2 changes: 1 addition & 1 deletion app/AASliver.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ let AASliver = React.createClass({
strokeWidth="5"
// stroke="black"
opacity={0.5}
fill={this.props.color || 'orange'}>
fill={this.props.color || 'gray'}>
</polyline>
{this.props.positionInCodon === 1 &&
<text
Expand Down
1 change: 1 addition & 0 deletions app/App.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
var ac = require('ve-api-check');

import controller from './cerebral/controller.js';
import React from 'react';
import {Container} from 'cerebral-view-react';
Expand Down
46 changes: 23 additions & 23 deletions app/CircularView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,9 @@ import styles from './circular-view.css';
sequenceLength: PropTypes.number.isRequired,
sequenceName: PropTypes.string.isRequired
})

class CircularView extends React.Component {

getNearestCursorPositionToMouseEvent(event, sequenceLength, callback) {
var boundingRect = this.refs.circularView.getBoundingClientRect();
//get relative click positions
Expand Down Expand Up @@ -162,7 +164,6 @@ class CircularView extends React.Component {
<path
style={ { opacity: .4} }
d={ sector.path.print() }

fill="blue" />
</PositionAnnotationOnCircle>
);
Expand Down Expand Up @@ -206,16 +207,16 @@ class CircularView extends React.Component {
right: 0,
bottom: 0
}}
onDrag={
(event) => {
this.getNearestCursorPositionToMouseEvent(event, sequenceLength, signals.editorDragged);
onDrag={
(event) => {
this.getNearestCursorPositionToMouseEvent(event, sequenceLength, signals.editorDragged);
}
}
}
onStart={
(event) => {
this.getNearestCursorPositionToMouseEvent(event, sequenceLength, signals.editorDragStarted);
onStart={
(event) => {
this.getNearestCursorPositionToMouseEvent(event, sequenceLength, signals.editorDragStarted);
}
}
}
onStop={
signals.editorDragStopped
} >
Expand Down Expand Up @@ -279,26 +280,25 @@ function Caret({
y1={-innerRadius}
x2={0}
y2={-outerRadius}

stroke="black" />
</PositionAnnotationOnCircle>
);
}

var PositionAnnotationOnCircle = function({
children,
height = 0,
sAngle = 0,
eAngle = 0,
forward = true
}) {
const sAngleDegs = sAngle * 360 / Math.PI / 2;
const eAngleDegs = eAngle * 360 / Math.PI / 2;
var transform;
if (forward) {
transform = `translate(0,${-height}) rotate(${sAngleDegs},0,${height})`;
} else {
transform = `scale(-1,1) translate(0,${-height}) rotate(${-eAngleDegs},0,${height}) `;
children,
height = 0,
sAngle = 0,
eAngle = 0,
forward = true
}) {
const sAngleDegs = sAngle * 360 / Math.PI / 2;
const eAngleDegs = eAngle * 360 / Math.PI / 2;
var transform;
if (forward) {
transform = `translate(0,${-height}) rotate(${sAngleDegs},0,${height})`;
} else {
transform = `scale(-1,1) translate(0,${-height}) rotate(${-eAngleDegs},0,${height}) `;
}
return (
<g transform={ transform }>
Expand Down
2 changes: 1 addition & 1 deletion app/Clipboard.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ var Clipboard = React.createClass({

render: function() {
var value = this.props.value;
console.log('value: ' + JSON.stringify(value,null,4));
// console.log('value: ' + JSON.stringify(value,null,4));
var style = {
position: 'fixed',
// width: 0, //tnr: commented these out because they seem to be messing thing up if used...
Expand Down
7 changes: 3 additions & 4 deletions app/SequenceEditor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ class SequenceEditor extends React.Component {
//bind a bunch of keyboard shortcuts we're interested in catching
//we're using the "mousetrap" library (available thru npm: https://www.npmjs.com/package/br-mousetrap)
//documentation: https://craig.is/killing/mice
combokeys.bind(['a', 'c', 'g', 't'], function(event) { // type in bases
combokeys.bind(['a', 'b', 'c', 'd', 'g', 'h', 'k', 'm', 'n', 'r', 's', 't', 'v', 'w', 'y'], function(event) { // type in bases
sequenceDataInserted({newSequenceData: {sequence: String.fromCharCode(event.charCode)}});
});
combokeys.bind(['left','shift+left'] , function(event) { // Handle shortcut
Expand Down Expand Up @@ -186,14 +186,13 @@ class SequenceEditor extends React.Component {
</div>

<div className={styles.content}>
<div className={styles.sideBarSlot} style={(table) ? {} : {display: 'none'}}>
<div className={styles.sideBarSlot} id="sideBar" style={(table) ? {} : {display: 'none'}}>
{table}
</div>

<div className={styles.circularViewSlot} style={(showCircular) ? {} : {display: 'none'}}>
<div className={styles.circularViewSlot} id="circularView" style={(showCircular) ? {} : {display: 'none'}}>
<CircularView />
</div>

<div className={styles.rowViewSlot} style={(showRow) ? {} : {display: 'none'}}>
<RowView sequenceData={sequenceData} columnWidth={10} />
</div>
Expand Down
4 changes: 2 additions & 2 deletions app/StyleFeature.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@ export default function StyleFeature({children, color, annotation, signals}) {
}
}
strokeWidth="1"
stroke={ color || 'orange'}
stroke={ color || 'gray'}
fillOpacity={ 0.4 }
fill={ color || 'orange' }
fill={ color || 'gray' }
>
{ children }
</g>
Expand Down
91 changes: 71 additions & 20 deletions app/ToolBar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,16 @@ import IconMenu from 'material-ui/lib/menus/icon-menu';
import IconButton from 'material-ui/lib/icon-button';
import RaisedButton from 'material-ui/lib/raised-button';
import SettingsIcon from 'material-ui/lib/svg-icons/action/settings';
import FileIcon from 'material-ui/lib/svg-icons/editor/insert-drive-file';
import SaveIcon from 'material-ui/lib/svg-icons/action/backup';
import downloadIcon from 'material-ui/lib/svg-icons/file/file-download';
import uploadIcon from 'material-ui/lib/svg-icons/file/file-upload';
import PrintIcon from 'material-ui/lib/svg-icons/action/print';
import MenuItem from 'material-ui/lib/menus/menu-item';
import TextField from 'material-ui/lib/text-field';

@Cerebral({
readOnly: ['readOnly'],
showOrfs: ['showOrfs'],
showCutsites: ['showCutsites'],
showParts: ['showParts'],
Expand All @@ -24,6 +30,7 @@ import TextField from 'material-ui/lib/text-field';
showSidebar: ['showSidebar']
})
@propTypes({
readOnly: PropTypes.bool.isRequired,
showOrfs: PropTypes.bool.isRequired,
showCutsites: PropTypes.bool.isRequired,
showParts: PropTypes.bool.isRequired,
Expand All @@ -42,6 +49,7 @@ export default class ToolBar extends React.Component {

render() {
var {
readOnly,
showFeatures,
showParts,
showTranslations,
Expand Down Expand Up @@ -83,6 +91,29 @@ export default class ToolBar extends React.Component {
}
];

var fileMenuItems = (
<div>
<MenuItem key={1} primaryText="Download SBOL" insetChildren={true} onClick={function () {
signals.clickSaveFile({fileExt: 'sbol'});
}} />
<MenuItem key={2} primaryText="Download GenBank" insetChildren={true} onClick={function () {
signals.clickSaveFile({fileExt: 'genbank'});
}} />
<MenuItem key={3} primaryText="Download Fasta" insetChildren={true} onClick={function () {
signals.clickSaveFile({fileExt: 'fasta'});
}} />
<MenuItem key={4} primaryText="Upload from file ..." insetChildren={true} onClick={function () {
signals.clickLoadFile();
}} />
</div>
);

var fileButtonElement = (
<IconButton tooltip="File">
<FileIcon />
</IconButton>
);

var toggleMenuItems = annotationList.map(function(annotationType, index){
return (
<MenuItem key={index} primaryText={annotationType.label} insetChildren={true} checked={annotationType.state} onClick={function () {
Expand All @@ -100,33 +131,53 @@ export default class ToolBar extends React.Component {
return (
<Toolbar>
<ToolbarGroup key={0}>
<RaisedButton
label='Features'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'features' });
}}
/>
<RaisedButton
label='Cutsites'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'cutsites' });
}}
/>
<RaisedButton
label='ORFs'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'orfs' });
}}
/>
<IconButton
disabled={ readOnly }
label='Save to Server'
onTouchTap={function() {
signals.saveChanges();
}}
>
<SaveIcon />
</IconButton>
<IconButton
label='Print Current View'
onTouchTap={function() {
window.print();
}}
>
<PrintIcon />
</IconButton>
<RaisedButton
label='Features'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'features' });
}}
/>
<RaisedButton
label='Cutsites'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'cutsites' });
}}
/>
<RaisedButton
label='ORFs'
onTouchTap={function() {
signals.toggleAnnotationTable({ annotationType: 'orfs' });
}}
/>
<IconMenu iconButtonElement={fileButtonElement} openDirection="bottom-right">
{fileMenuItems}
</IconMenu>
<IconMenu iconButtonElement={iconButtonElement} openDirection="bottom-right">
{toggleMenuItems}
</IconMenu>

<TextField ref="searchField" hintText="search" />
<RaisedButton label='Search' onClick={this.search.bind(this)}/>
<RaisedButton label='Clear Search' onClick={this.clearSearch.bind(this)}/>
</ToolbarGroup>
</Toolbar>
);
}
}

}
10 changes: 6 additions & 4 deletions app/cerebral/actions/addAnnotations.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ var ac = require('ve-api-check');
var areNonNegativeIntegers = require('validate.io-nonnegative-integer-array');
var isBoolean = require('validate.io-boolean');

import ObjectID from 'bson-objectid';
// import ObjectID from 'bson-objectid';

export default function addAnnotations({input: {annotationType, annotationsToInsert, throwErrors}, state, output}) {
ac.throw(ac.annotationType, annotationType);
Expand Down Expand Up @@ -35,9 +35,11 @@ export default function addAnnotations({input: {annotationType, annotationsToIns
}
}

if (annotationToInsert.id === undefined) {
annotationToInsert.id = ObjectID().str;
}
delete annotationToInsert.id;

// if (annotationToInsert.id === undefined) {
// annotationToInsert.id = ObjectID().str;
// }

state.push(['sequenceData', annotationType], annotationToInsert);
});
Expand Down
36 changes: 36 additions & 0 deletions app/cerebral/actions/loadFromFile.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
// load info in from a genbank, sbol, or fasta file
// uses npmjs library bio-parsers
// uses superagent to post the file back to node server
// do we need to do that though? can we just slam it into the state tree?
import request from 'superagent/lib/client';

var query = location.search;
var cookie = document.cookie;
var id = query.match(/entryId=[\d]+/) + "";
id = id.replace(/entryId=/, "");
var sid = cookie.match(/sessionId=%22[0-9a-z\-]+%22/) + "";
sid = sid.replace(/sessionId=|%22/g, "");

export default function loadFromFile({input, state, output}) {
var seqFileParser = require('bio-parsers/parsers/anyToJSON');

console.log("did it. :3");

if(id && sid)
{
request
.post('rest/parts/sequence')
.set('X-ICE-Authentication-sessionId', sid)
.set('Content-Type', 'application/json')
.send(/* results of seqfileparser? or is that on node server*/)
.end(function(err, result) {
if(err) {
console.log("unable to load file, something went wrong: " + err)
}
}
);
} else {
console.log("something went wrong, unable to upload file");
}

}
Loading

0 comments on commit 0f711b3

Please sign in to comment.