Template:SDU-Denmark/js/simple/app
// default/src/index.jsx $fsx.f[146] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const ReactDOM = $fsx.r(7); const Application_1 = $fsx.r(141); $fsx.r(142); $fsx.r(143); $fsx.r(144); $fsx.r(145); ReactDOM.render(React.createElement(Application_1.Application, null), document.getElementById("root")); //# sourceMappingURL=index.js.map } // default/src/components/application/Application.jsx $fsx.f[141] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const react_router_dom_1 = $fsx.r(29); const react_transition_group_1 = $fsx.r(43); const ScrollToTop_1 = $fsx.r(44); const SubwayMenu_1 = $fsx.r(78); const sitemap_1 = $fsx.r(126); $fsx.r(127); const timelines_1 = $fsx.r(140); const renderMergedProps = (component, ...rest) => {
const finalProps = Object.assign({}, ...rest);
return (React.createElement(component, finalProps));
}; const PropsRoute = (_a) => {
var { component } = _a, rest = tslib_1.__rest(_a, ["component"]);
return (React.createElement(react_router_dom_1.Route, Object.assign({}, rest, { render: routeProps => {
return renderMergedProps(component, routeProps, rest);
} })));
}; class Application extends React.Component {
render() {
return (React.createElement("div", { className: "Application" },
React.createElement(react_router_dom_1.BrowserRouter, { basename: "/Team:SDU-Denmark/simple" },
React.createElement("div", { className: "top" },
React.createElement("div", { className: "logo" })),
React.createElement(SubwayMenu_1.SubwayMenu, Object.assign({}, { sitemap: sitemap_1.default, flatSitemap: sitemap_1.FlatSitemap })),
React.createElement(react_router_dom_1.Route, { render: ({ location }) => {
const { pathname, key } = location;
return (React.createElement(react_transition_group_1.TransitionGroup, { component: null },
React.createElement(react_transition_group_1.Transition, { key: key, appear: true, onEnter: (node, appears) => timelines_1.play(pathname, node, appears), onExit: ((node, appears) => timelines_1.exit(node)), timeout: { enter: 750, exit: 150 } },
React.createElement(React.Fragment, null,
React.createElement(ScrollToTop_1.default, null,
React.createElement(react_router_dom_1.Switch, { location: location }, sitemap_1.FlatSitemap.map((item, index) => {
let nextStation = sitemap_1.FlatSitemap.length > index ? sitemap_1.FlatSitemap[index + 1] : sitemap_1.FlatSitemap[0];
return React.createElement(PropsRoute, { exact: true, key: index, path: item.path, component: item.comp, nextStation: nextStation, nextChapter: false });
})))))));
} }))));
}
} exports.Application = Application; //# sourceMappingURL=Application.js.map } // default/src/components/application/ScrollToTop.jsx $fsx.f[44] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const react_router_1 = $fsx.r(28); class ScrollToTop extends React.Component {
componentDidUpdate(prevProps) {
if (this.props.location !== prevProps.location) {
window.scrollTo(0, 0);
}
}
render() {
return this.props.children;
}
} exports.default = react_router_1.withRouter(ScrollToTop); //# sourceMappingURL=ScrollToTop.js.map } // default/src/components/application/SubwayMenu.jsx $fsx.f[78] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const react_router_1 = $fsx.r(28); const _ = $fsx.r(45); const react_pose_1 = $fsx.r(57); const isMobile_1 = $fsx.r(58); const react_burger_menu_1 = $fsx.r(76); let styles = {
bmBurgerButton: {
position: 'fixed',
width: '36px',
height: '30px',
left: '36px',
top: '36px'
},
bmBurgerBars: {
background: '#193443'
},
bmBurgerBarsHover: {
background: '#3E6D8F'
},
bmCrossButton: {
height: '24px',
width: '24px'
},
bmCross: {
background: 'white',
},
bmMenuWrap: {
position: 'fixed',
height: '100%'
},
bmMenu: {
background: '#345B78',
padding: '2.5em 1.5em 0',
fontSize: '1.15em'
},
bmMorphShape: {
fill: '#345B78'
},
bmItemList: {
color: '#b8b7ad',
padding: '0.8em'
},
bmItem: {
display: 'inline-block'
},
bmOverlay: {
background: 'rgba(0, 0, 0, 0.3)'
}
}; const Menu = react_pose_1.default.div({
hidden: { top: "-200px" },
visible: { top: "0" }
}); const SubMenuContainer = react_pose_1.default.div({
closedSubMenu: {
width: 0,
opacity: 0,
transition: {
duration: 100,
width: { ease: 'easeOut', duration: 500 },
opacity: { ease: 'easeOut', duration: 300 },
}
},
openSubMenu: {
width: "auto",
opacity: 1,
transition: {
width: { ease: 'easeOut', duration: 400 },
opacity: { ease: 'easeOut', duration: 500 },
delay: 200
}
}
}); const SubMenuItem = react_pose_1.default.div({
hoverable: true,
pressable: true,
press: { scale: 0.9 },
init: {
scale: 1
},
hover: {
scale: 1.1
},
normal: { width: "auto" },
expanded: { width: "auto" }
}); const SubMenuItemBall = react_pose_1.default.div({
closedSubMenu: {
width: 0,
height: 0,
transition: {
duration: 300,
ease: "easeOut"
}
},
openSubMenu: {
width: "1.0rem",
height: "1.0rem",
transition: {
duration: 300,
ease: "easeOut"
}
}
}); class MenuComponent extends React.Component {
componentDidMount() {
setTimeout(() => {
this.setState({ isVisible: !this.state.isVisible });
}, 200);
}
constructor(props) {
super(props);
this.state = {
openSubMenu: false,
isVisible: false,
mobileMenuOpen: false
};
}
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(77);
});
}
handleStateChange(state) {
window.document.body.style.overflowY = state.isOpen ? "hidden" : "visible";
this.setState({ mobileMenuOpen: state.isOpen });
}
redirect(item) {
if (isMobile_1.default) {
this.setState({
mobileMenuOpen: false
});
}
this.props.history.push(item);
}
isPredecessor(item) {
let props = this.props;
let currentIndex = _.findIndex(props.flatSitemap, (page, index) => {
return page.path == props.location.pathname;
});
let itemIndex = _.findIndex(props.flatSitemap, (page, index) => {
return page.path == item.path;
});
return itemIndex < currentIndex;
}
render() {
let props = this.props;
let activeClass = "active";
const { isVisible } = this.state;
const { openSubMenu } = this.state;
return (React.createElement(React.Fragment, null,
isMobile_1.default &&
React.createElement(react_burger_menu_1.bubble, { styles: styles, width: '100%', id: "mobile-menu", isOpen: this.state.mobileMenuOpen, onStateChange: (state) => this.handleStateChange(state) }, props.sitemap.map((item, index) => {
return (React.createElement(React.Fragment, { key: index },
React.createElement("div", { onClick: () => {
this.redirect(item.path);
}, className: (props.location.pathname == item.path) ? activeClass + " item" : "item" }, item.displayName),
item.children && item.children.length &&
React.createElement(SubMenuContainer, { className: "sub-container", pose: "openSubMenu" }, item.children.map((subItem, index) => {
return (React.createElement(SubMenuItem, { pose: props.location.pathname == subItem.path ? "expanded" : "normal", onClick: () => {
this.redirect(subItem.path);
}, key: index, className: (props.location.pathname == subItem.path) ? activeClass + " sub-item" : "sub-item" },
React.createElement("span", { className: "item-label" }, subItem.displayName)));
}))));
})),
!isMobile_1.default &&
React.createElement(Menu, { className: "top-menu", pose: isVisible ? 'visible' : 'hidden' },
React.createElement("div", { className: "subway-menu" }, props.sitemap.map((item, index) => {
let upperActiveClass = props.location.pathname == item.path ? activeClass + " item" : "item";
let upperSeenClass = this.isPredecessor(item) ? " seen" : "";
let upperClasses = upperActiveClass + upperSeenClass;
let submenuState = ((props.location.pathname == item.path) || !_.isUndefined(_.find(item.children, (i) => { return props.location.pathname == i.path; })));
return (React.createElement(React.Fragment, { key: index },
React.createElement("div", { onClick: () => {
this.redirect(item.path);
this.setState({ openSubMenu: true });
}, className: upperClasses },
React.createElement("span", { className: "item-ball" }),
React.createElement("span", { className: "item-label" }, item.displayName)),
((props.location.pathname != item.path) || !item.children) && index !== props.sitemap.length - 1 && _.isUndefined(_.find(item.children, (i) => { return props.location.pathname == i.path; })) &&
React.createElement("div", { className: "stripe" + (this.isPredecessor(item) ? " seen" : "") }),
item.children && item.children.length &&
React.createElement(React.Fragment, null,
React.createElement("div", { className: (submenuState ? "open" : "close") + " stripe post-ball" + (this.isPredecessor(item) ? " seen" : "") }),
React.createElement(SubMenuContainer, { className: "sub-container", pose: submenuState ? "openSubMenu" : "closedSubMenu" },
React.createElement("div", { className: "rotated rotatedown progress" },
React.createElement("div", null)),
React.createElement("div", { className: "rotated rotatedown" + (this.isPredecessor(item) ? " seen" : ""), style: { marginRight: "24px", } },
React.createElement("div", null)),
item.children.map((subItem, subIndex) => {
let firstClass = index == 0 ? "first" : "";
let lastClass = index !== item.children.length - 1 ? "" : "last";
let active = (props.location.pathname == subItem.path) ? activeClass : "";
let subSeenClass = this.isPredecessor(subItem) ? " seen" : "";
let classes = `sub-item ${firstClass} ${lastClass} ${active} ${subSeenClass}`;
return (React.createElement(React.Fragment, { key: subIndex },
React.createElement(SubMenuItem, { pose: props.location.pathname == subItem.path ? "expanded" : "normal", onClick: () => {
this.redirect(subItem.path);
}, key: index, className: classes },
React.createElement(SubMenuItemBall, { className: "item-ball" },
React.createElement("span", { className: "item-label" }, subItem.displayName))),
index !== item.children.length - 1 &&
React.createElement("div", { className: "stripe" + (this.isPredecessor(subItem) ? " seen" : ""), style: {
width: 60,
} })));
}),
React.createElement("div", { className: "rotated rotateup", style: { marginRight: "20px", } },
React.createElement("div", null))),
React.createElement("div", { className: (submenuState ? "open" : "close") + " stripe post-ball" }))));
})),
React.createElement("div", { id: "circle" }))));
}
} exports.SubwayMenu = react_router_1.withRouter(MenuComponent); //# sourceMappingURL=SubwayMenu.js.map } // default/src/isMobile.js $fsx.f[58] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = window.outerWidth < 1027; //# sourceMappingURL=isMobile.js.map } // default/src/sitemap.js $fsx.f[126] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const _ = $fsx.r(45); const Home_1 = $fsx.r(84); const Description_1 = $fsx.r(89); const Results_1 = $fsx.r(90); const Attributions_1 = $fsx.r(92); const PublicEngagement_1 = $fsx.r(94); const Bioethics_1 = $fsx.r(95); const partners_1 = $fsx.r(97); const Parts_1 = $fsx.r(99); const Design_1 = $fsx.r(101); const Model_1 = $fsx.r(102); const Protocols_1 = $fsx.r(104); const Safety_1 = $fsx.r(105); const Notebook_1 = $fsx.r(107); const IHP_1 = $fsx.r(108); const Future_1 = $fsx.r(110); const Team_1 = $fsx.r(112); const Collaborations_1 = $fsx.r(113); const ProjectOverview_1 = $fsx.r(120); const LabProcessOverview_1 = $fsx.r(121); const HumanPracticesOverview_1 = $fsx.r(123); const PeopleInvolvedOverview_1 = $fsx.r(124); const Introduction_1 = $fsx.r(125); let items = [
{
path: "/",
comp: Home_1.Home,
displayName: "Home"
},
{
path: "/Introduction",
comp: Introduction_1.Introduction,
displayName: "Introduction"
},
{
path: "/Description",
comp: Description_1.Description,
displayName: "Description & Inspiration"
},
{
path: "/Project_Overview",
comp: ProjectOverview_1.ProjectOverview,
displayName: "Project & Results",
children: [
{
path: "/Design",
comp: Design_1.Design,
displayName: "Design"
},
{
path: "/Demonstrate",
comp: Results_1.Results,
displayName: "But Does it Work?"
},
{
path: "/Model",
comp: Model_1.Model,
displayName: "Conjugation Model"
}
]
},
{
path: "/Lab_Process_Overview",
comp: LabProcessOverview_1.LabProcessOverview,
displayName: "Lab Process & Parts",
children: [
{
path: "/Parts",
comp: Parts_1.Parts,
displayName: "Parts Catalogue"
},
{
path: "/Experiments",
comp: Protocols_1.Protocols,
displayName: "Protocols & SOPs"
},
{
path: "/Safety",
comp: Safety_1.Safety,
displayName: "Safety"
},
{
path: "/Notebook",
comp: Notebook_1.Notebook,
displayName: "Notebook"
}
]
},
{
path: "/Human_Practices_Overview",
comp: HumanPracticesOverview_1.HumanPracticesOverview,
displayName: "Human Practices",
children: [
{
path: "/Bioethics",
comp: Bioethics_1.Bioethics,
displayName: "Bioethics"
},
{
path: "/Human_Practices",
comp: IHP_1.IHP,
displayName: "Integrated Human Practices"
},
{
path: "/Public_Engagement",
comp: PublicEngagement_1.PublicEngagement,
displayName: "Education & Public Engagement"
}
]
},
{
path: "/Future",
comp: Future_1.Future,
displayName: "What's Next for Conjugaid?"
},
{
path: "/People_Involved_Overview",
comp: PeopleInvolvedOverview_1.PeopleInvolvedOverview,
displayName: "People Involved",
children: [
{
path: "/Team",
comp: Team_1.Team,
displayName: "Team"
},
{
path: "/Attributions",
comp: Attributions_1.Attributions,
displayName: "Attributions"
},
{
path: "/Collaborations",
comp: Collaborations_1.Collaborations,
displayName: "Collaborations"
},
{
path: "/Sponsors",
comp: partners_1.PartnersSponsors,
displayName: "Sponsors & Partners"
}
]
},
]; exports.default = items; exports.FlatSitemap = _.chain(items).map((station, stationIndex) => {
if (!station.children)
return station;
else {
if (stationIndex !== items.length - 1) {
station.nextChapter = items[stationIndex + 1];
}
let adoptedKids = _.map(station.children, (kid) => {
if (stationIndex !== items.length - 1) {
kid.nextChapter = items[stationIndex + 1];
}
return kid;
});
return _.concat(station, adoptedKids);
}
}).flatten().value(); //# sourceMappingURL=sitemap.js.map } // default/src/components/Content/home/Home.jsx $fsx.f[84] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); const WavesWidget_1 = $fsx.r(82); const Intro = () => {
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "logo-container" },
React.createElement("img", { className: "mx-auto", src: "
" }),
React.createElement("p", null)),
React.createElement("div", { className: "problem-container" },
React.createElement("div", { className: "problem-item" },
React.createElement("p", { className: "cancer-statement" }, "In 2050, the number of deaths caused by infections with antibiotic-resistant bacteria is predicted to exceed that of cancer"),
React.createElement("img", { className: "", src: "
" }),
React.createElement("img", { className: "", src: "
" })))));
}; const middleWaves = [
{
color: "#1d3c4d",
offset: 0,
path: "M0,224L60,224C120,224,240,224,360,192C480,160,600,96,720,80C840,64,960,96,1080,128C1200,160,1320,192,1380,208L1440,224L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z",
content: Intro,
},
{
color: "#1d3c4d",
reversed: true,
offset: 2250,
path: "M0,32L60,58.7C120,85,240,139,360,144C480,149,600,107,720,112C840,117,960,171,1080,208C1200,245,1320,267,1380,277.3L1440,288L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
},
{
color: "#193443",
reversed: true,
offset: 2300,
path: "M0,32L48,26.7C96,21,192,11,288,53.3C384,96,480,192,576,202.7C672,213,768,139,864,122.7C960,107,1056,149,1152,144C1248,139,1344,85,1392,58.7L1440,32L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"
},
{
color: "#1d3c4d",
reversed: true,
offset: 2300,
path: "M0,32L60,58.7C120,85,240,139,360,144C480,149,600,107,720,112C840,117,960,171,1080,208C1200,245,1320,267,1380,277.3L1440,288L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
},
{
color: "#204356",
reversed: true,
offset: 2330,
path: "M0,32L60,58.7C120,85,240,139,360,144C480,149,600,107,720,112C840,117,960,171,1080,208C1200,245,1320,267,1380,277.3L1440,288L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
},
{
color: "#254e63",
reversed: true,
offset: 2340,
path: "M0,32L48,58.7C96,85,192,139,288,149.3C384,160,480,128,576,96C672,64,768,32,864,48C960,64,1056,128,1152,149.3C1248,171,1344,149,1392,138.7L1440,128L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"
},
{
color: "#345b78",
reversed: true,
offset: 2350,
path: "M0,32L48,58.7C96,85,192,139,288,149.3C384,160,480,128,576,96C672,64,768,32,864,48C960,64,1056,128,1152,149.3C1248,171,1344,149,1392,138.7L1440,128L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"
},
{
color: "#3d6d90",
reversed: true,
offset: 2360,
path: "M0,128L24,122.7C48,117,96,107,144,106.7C192,107,240,117,288,149.3C336,181,384,235,432,240C480,245,528,203,576,170.7C624,139,672,117,720,112C768,107,816,117,864,122.7C912,128,960,128,1008,112C1056,96,1104,64,1152,74.7C1200,85,1248,139,1296,133.3C1344,128,1392,64,1416,32L1440,0L1440,0L1416,0C1392,0,1344,0,1296,0C1248,0,1200,0,1152,0C1104,0,1056,0,1008,0C960,0,912,0,864,0C816,0,768,0,720,0C672,0,624,0,576,0C528,0,480,0,432,0C384,0,336,0,288,0C240,0,192,0,144,0C96,0,48,0,24,0L0,0Z"
},
{
color: "#1a84ab",
reversed: true,
offset: 2360,
path: "M0,128L24,122.7C48,117,96,107,144,106.7C192,107,240,117,288,149.3C336,181,384,235,432,240C480,245,528,203,576,170.7C624,139,672,117,720,112C768,107,816,117,864,122.7C912,128,960,128,1008,112C1056,96,1104,64,1152,74.7C1200,85,1248,139,1296,133.3C1344,128,1392,64,1416,32L1440,0L1440,0L1416,0C1392,0,1344,0,1296,0C1248,0,1200,0,1152,0C1104,0,1056,0,1008,0C960,0,912,0,864,0C816,0,768,0,720,0C672,0,624,0,576,0C528,0,480,0,432,0C384,0,336,0,288,0C240,0,192,0,144,0C96,0,48,0,24,0L0,0Z"
},
{
color: "#19b2b1",
reversed: true,
offset: 2380,
path: "M0,32L34.3,74.7C68.6,117,137,203,206,229.3C274.3,256,343,224,411,197.3C480,171,549,149,617,128C685.7,107,754,85,823,106.7C891.4,128,960,192,1029,224C1097.1,256,1166,256,1234,234.7C1302.9,213,1371,171,1406,149.3L1440,128L1440,0L1405.7,0C1371.4,0,1303,0,1234,0C1165.7,0,1097,0,1029,0C960,0,891,0,823,0C754.3,0,686,0,617,0C548.6,0,480,0,411,0C342.9,0,274,0,206,0C137.1,0,69,0,34,0L0,0Z"
},
{
color: "#82cac9",
reversed: true,
offset: 2400,
path: "M0,128L24,122.7C48,117,96,107,144,106.7C192,107,240,117,288,149.3C336,181,384,235,432,240C480,245,528,203,576,170.7C624,139,672,117,720,112C768,107,816,117,864,122.7C912,128,960,128,1008,112C1056,96,1104,64,1152,74.7C1200,85,1248,139,1296,133.3C1344,128,1392,64,1416,32L1440,0L1440,0L1416,0C1392,0,1344,0,1296,0C1248,0,1200,0,1152,0C1104,0,1056,0,1008,0C960,0,912,0,864,0C816,0,768,0,720,0C672,0,624,0,576,0C528,0,480,0,432,0C384,0,336,0,288,0C240,0,192,0,144,0C96,0,48,0,24,0L0,0Z"
},
{
color: "#bee1e3",
reversed: true,
offset: 2410,
trueOffset: 100,
path: "M0,32L34.3,74.7C68.6,117,137,203,206,229.3C274.3,256,343,224,411,197.3C480,171,549,149,617,128C685.7,107,754,85,823,106.7C891.4,128,960,192,1029,224C1097.1,256,1166,256,1234,234.7C1302.9,213,1371,171,1406,149.3L1440,128L1440,320L1405.7,320C1371.4,320,1303,320,1234,320C1165.7,320,1097,320,1029,320C960,320,891,320,823,320C754.3,320,686,320,617,320C548.6,320,480,320,411,320C342.9,320,274,320,206,320C137.1,320,69,320,34,320L0,320Z"
}
]; const logoWaves = [
{
color: "red",
offset: 0,
path: "M0,224L60,224C120,224,240,224,360,192C480,160,600,96,720,80C840,64,960,96,1080,128C1200,160,1320,192,1380,208L1440,224L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"
},
{
color: "orange",
offset: 10,
path: "M0,256L60,229.3C120,203,240,149,360,138.7C480,128,600,160,720,181.3C840,203,960,213,1080,213.3C1200,213,1320,203,1380,197.3L1440,192L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"
},
{
color: "yellow",
offset: 20,
path: "M0,64L60,53.3C120,43,240,21,360,53.3C480,85,600,171,720,170.7C840,171,960,85,1080,58.7C1200,32,1320,64,1380,80L1440,96L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"
},
{
color: "green",
offset: 30,
reversed: true,
path: "M0,96L80,117.3C160,139,320,181,480,192C640,203,800,181,960,149.3C1120,117,1280,75,1360,53.3L1440,32L1440,320L1360,320C1280,320,1120,320,960,320C800,320,640,320,480,320C320,320,160,320,80,320L0,320Z"
},
{
color: "blue",
offset: 40,
reversed: true,
path: "M0,32L60,69.3C120,107,240,181,360,181.3C480,181,600,107,720,85.3C840,64,960,96,1080,90.7C1200,85,1320,43,1380,21.3L1440,0L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z"
}
]; class Home extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(83);
});
}
render() {
return (React.createElement(React.Fragment, null,
React.createElement("div", { id: "home" },
React.createElement(WavesWidget_1.Waves, Object.assign({}, { waves: middleWaves, top: "-150", concurrentZDelta: -1 })),
React.createElement("div", { className: "home-content" },
React.createElement("div", { className: "problem-container" },
React.createElement("div", { className: "home-item" },
React.createElement("p", { className: "text-2xl" },
"Existing therapeutic strategies cannot keep pace with the rapid progression of antibiotic resistance. To combat this challenge, ",
React.createElement("span", { className: "" }, " innovative approaches must be developed"),
"... (en figur her kunne v\u00E6re l\u00E6kkert)"))),
React.createElement("div", { className: "solution-container" },
React.createElement("div", { className: "solution-item" },
React.createElement("p", { className: "text-2xl font-black" }, "Fighting antibiotic resistance in the lab..."),
React.createElement("p", { className: "text-lg" }, "In collaboration with our local hospital, we have designed a plasmid-based CRISPR/Cas-system targeting antibiotic resistance in E. coli. This system is delivered using an E. coli vehicle, which transfers the plasmid to the target in the gastrointestinal tract by bacterial conjugation. Thus, our system can be used to sensitize pathogens to antibiotics."),
React.createElement("img", { src: "
" })),
React.createElement("div", { className: "solution-item" },
React.createElement("p", { className: "text-2xl font-black" }, "... and in classrooms"),
React.createElement("p", { className: "text-lg" }, "We believe that antibiotic resistance cannot be resolved by scientific solutions alone. Therefore, we aim to provide future generations with tools to creatively solve this global challenge. For this purpose, we have collaborated with students and teachers to develop a 5E model-based teaching material to supplement the Danish high school curriculum."),
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "wiki-intro-container" },
React.createElement("p", { className: "text-2xl font-black" }, "Welcome to our wiki!"),
React.createElement("p", { className: "text-lg" },
"We are Conjugaid, the 2019 iGEM-team from University of Southern Denmark, and we can\u2019t wait to tell you about the things we\u2019ve been up to for the past year. Keep pressing our next-button and we'll guide you through our ",
React.createElement("span", { className: "underline" }, " entire"),
" wiki :)"),
React.createElement("img", { className: "", src: "
" }),
React.createElement("img", { className: "mx-auto pt-10 w-1/6", src: "
" }),
React.createElement("p", { className: "text-xl" }, "FANCY_NEXT_BUTTON.JPG"))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(WavesWidget_1.Waves, Object.assign({}, { waves: logoWaves, top: "50", concurrentZDelta: -1 })),
React.createElement("div", null, "hejsa"))));
}
} exports.Home = Home; //# sourceMappingURL=Home.js.map } // default/src/components/widgets/Buttons.jsx $fsx.f[80] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const react_router_dom_1 = $fsx.r(29); exports.NextStationButton = react_router_dom_1.withRouter(class NextStationButton extends React.Component {
constructor(props) {
super(props);
this.nextStation = () => {
this.props.history.push(this.props.nextStation.path);
};
this.state = {
next: props.nextStation
};
}
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(79);
});
}
render() {
return (React.createElement("button", { className: " text-red-900", onClick: this.nextStation }, "NEXT STATION"));
}
}); exports.NextChapterButton = react_router_dom_1.withRouter(class NextChapterButton extends React.Component {
constructor(props) {
super(props);
this.nextChapter = () => {
this.props.history.push(this.props.nextChapter.path);
};
this.state = {
next: props.nextStation
};
}
render() {
return (React.createElement("button", { className: "text-red-900", onClick: this.nextChapter }, "NEXT CHAPTER"));
}
}); //# sourceMappingURL=Buttons.js.map } // default/src/components/widgets/WavesWidget.jsx $fsx.f[82] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const react_1 = $fsx.r(3); const _ = $fsx.r(45); { } const WIDTH_SCALING_FACTOR = Math.pow(10, 6); const getInterWaveOffsetFactor = (index) => {
let responsiveFactor = 4.5; return (index + 1) / responsiveFactor;
}; const getWaveSectionHeight = (waves, svgRefs) => {
let values = [];
return _.chain(waves).map((svg, index) => {
let interWaveOffsetFactor = getInterWaveOffsetFactor(index);
let responsiveHeight = (WIDTH_SCALING_FACTOR / window.innerWidth) * interWaveOffsetFactor;
let divHeight = svg.offset + responsiveHeight + svgRefs[index].current.height.baseVal.value;
if (index !== 0) {
_.each(values, (val) => {
divHeight -= val;
});
}
values.push(divHeight);
return divHeight;
}).reduce((sum, svg) => sum + svg).value();
}; const getWaveTrueOffset = (waves, index) => {
return _.chain(waves.slice(0, index + 1)).map((wave) => {
return wave.trueOffset ? wave.trueOffset : 0;
}).reduce((sum, val) => sum + val).value();
}; const updateDimensions = (setSectionHeight, setBlockHeights, svgRefs, heightRefs, waves) => {
let allSvgLoaded = true;
_.each(svgRefs, (svg, index) => {
if (!svg.current) {
allSvgLoaded = false;
}
else {
}
let height = svg.current.height.baseVal.value;
if (height <= 0) {
allSvgLoaded = false;
}
});
if (!allSvgLoaded) {
setTimeout(updateDimensions.bind(this, setSectionHeight, setBlockHeights, svgRefs, heightRefs, waves), 50);
}
else {
setSectionHeight(getWaveSectionHeight(waves, svgRefs));
let isUpdated = false;
let diffs = _.map(heightRefs, (ref, index, refs) => {
let isLast = parseInt(index) == (refs.length - 1);
let blockSizing = ref.current.getBoundingClientRect();
let firstParent = ref.current.parentElement;
let nextElement = isLast ? firstParent.parentElement.nextElementSibling : firstParent.nextElementSibling;
if (nextElement) {
let nextElementSizing = nextElement.getBoundingClientRect();
if (isLast) {
isUpdated = (nextElementSizing.top - (blockSizing.top + blockSizing.height)) <= 0.1;
}
let diff = Math.abs(nextElementSizing.top - blockSizing.top);
return diff > 0 ? diff : 0;
}
});
setBlockHeights(diffs);
if (!isUpdated) {
setTimeout(updateDimensions.bind(this, setSectionHeight, setBlockHeights, svgRefs, heightRefs, waves), 100);
}
}
}; exports.Waves = function (props) {
$fsx.r(81);
const [sectionHeight, setSectionHeight] = react_1.useState(0);
const [blockHeights, setBlockHeights] = react_1.useState([]);
const trueOffsets = _.map(props.waves, (wave, index, waves) => {
return getWaveTrueOffset(waves, index);
});
let svgRefs = _.map(props.waves, () => react_1.useRef());
let heightRefs = _.map(props.waves, () => react_1.useRef());
let zIndexBase = props.waves.length + (props.concurrentZDelta ? -props.concurrentZDelta : 1) * 10;
react_1.useEffect(() => {
}, []);
react_1.useLayoutEffect(() => {
let update = updateDimensions.bind(this, setSectionHeight, setBlockHeights, svgRefs, heightRefs, props.waves);
window.addEventListener('resize', _.throttle(update, 100));
update();
console.log(sectionHeight, blockHeights);
return () => {
window.removeEventListener('resize', _.throttle(update, 100));
};
}, []);
return (React.createElement("div", { style: {
height: sectionHeight,
overflow: "hidden",
position: "relative",
top: props.top ? props.top : 0
} },
props.children &&
React.createElement("div", { className: "overlap", style: { top: getWaveTrueOffset(props.waves, 1), } }, props.children),
props.waves.map((svg, index) => {
const sign = (props.concurrentZDelta ? props.concurrentZDelta : 0);
let zIndex = zIndexBase + index * sign + (svg.reversed ? (sign ? -sign : sign) : sign);
return (React.createElement("div", { key: index, className: "wave", style: { zIndex: zIndex, top: trueOffsets[index] + svg.offset, } },
svg.reversed &&
React.createElement("div", { ref: heightRefs[index], style: {
height: blockHeights[index],
backgroundColor: svg.color,
} }, svg.content &&
React.createElement(svg.content, null)),
React.createElement("svg", { ref: svgRefs[index], xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 1440 320" },
React.createElement("path", { fill: svg.color, fillOpacity: "1", d: svg.path })),
!svg.reversed &&
React.createElement("div", { ref: heightRefs[index], style: {
height: blockHeights[index],
backgroundColor: svg.color,
} }, svg.content &&
React.createElement(svg.content, null))));
})));
}; //# sourceMappingURL=WavesWidget.js.map } // default/src/components/Content/Project_Description/Description.jsx $fsx.f[89] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class Description extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Project & Inspiration References",
content: `
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4520913/" target="_blank" class="references">Tan, S. Y. and Tatsumura, Y. (2015). Alexander Fleming (1881-1950): Discoverer of penicillin . Singapore Med J. 2015; 56(7): 366-367.</a>
- <a href="http://www.cdc.gov/drugresistance/threat-report-2013" target="_blank" class="references">Centers for Disease Control and Prevention, Office of Infectious Disease Antibiotic resistance threats in the United States. (2013). Biggest threats and Data. Accessed October 1, 2019.</a>
- <a href="https://www.who.int/antimicrobial-resistance/interagency-coordination-group/IACG_final_report_EN.pdf?ua=1" target="_blank" class="references">World Health Organization (WHO) Interagency Coordination Group on Antimicrobial Resistance (IACG) (2019). No time to wait: Securing the future from drug-resistant infections. Report to the secretary-general of the United Nations.</a>
- <a href="https://doi.org/10.1016/j.ijmm.2010.04.003" target="_blank" class="references">Hulscher, M. E. J. L. et al. (2010). Antibiotic use: How to improve it? Int. J. of Med. Microbiology, Vol. 300, Issue 6, 351-356, August, 2010.</a>
- <a href="https://www.nature.com/articles/s41564-018-0327-z" target="_blank" class="references">Peters, J. M. et al. (2019). Enabling genetic analysis of diverse bacteria with Mobile-CRISPRi. Nature Microbiology 4, 244-250. .</a>
`
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "Dykketid", img: "
" }),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Project Description & Inspiration"),
React.createElement("p", { className: "italic intro_quote" }, "\"You wanna fight?\""),
React.createElement("p", null, "This is essentially the question we ask bacteria every time we expose them to antibiotics. Wouldn\u2019t you defend yourself if someone asked you the same question? When it comes to bacteria, they don\u2019t have much of a choice. On the other hand, fighting back is something they do all the time - naturally. "),
React.createElement("p", null, "Ever since Alexander Fleming\u2019s discovery of penicillin in 1928, antibiotics have been the weapon of choice in the fight against pathogenic bacteria (1). However, bacteria quickly learned what mankind was up to, and they became resistant to the newly developed antibiotics. ."),
React.createElement("p", null, "But then human ingenuity fought back. With the discovery of new antibiotics we thought we had the bacteria under control. Nevertheless, no matter how many different antibiotics we develop, bacteria will inevitably become resistant and cause potentially lethal infections that cannot be treated in the long-term (2). "),
React.createElement("p", null, "Consequently, the World Health Organization (WHO) has estimated that in 2050, antimicrobial resistant infections could be the cause of 10 million deaths per year if action is not taken now. Furthermore, the economical toll this will have on society could potentially resemble that of the 2008-2009 global financial crisis (3)."),
React.createElement("p", null, "Thus, it is crucial that we develop novel and innovative strategies that can help in the quest for combating antibiotic resistance."),
React.createElement("p", null, "The vision for Conjugaid is to aid society in finding a successful solution to antibiotic resistance. We view antibiotic resistance as a multifaceted problem that needs to be addressed from more than one aspect. Therefore, Conjugaid takes both a therapeutic and an educational approach when addressing new solutions."),
React.createElement("p", null, "Therapeutically, we aimed at designing donor bacteria with a conjugative plasmid containing a CRISPR/Cas-system. By conjugative delivery, the CRISPR/Cas-system is designed to downregulate the expression of specific resistance genes in E. coli in the gastrointestinal tract. As a result, these acceptor E. coli will become sensitive to antibiotics. This has a broad clinical potential when it comes to limiting the spread of antibiotic resistance."),
React.createElement("p", null, "Educationally, we tackled the issue by actively increasing public information about the implications of antibiotic resistance and the potential of synthetic biology to help alleviate it. Our main focus has been the creation of a lesson plan involving a 5E model-inspired teaching material consisting of a 7-chapter e-book, teaching manuals and laboratory protocols. The material has been tested and evaluated in collaboration with high-school students and teachers."),
React.createElement("p", null, "By focusing on education and public information as well as our scientific idea to help solve the problem, we can not just develop novel technologies, but also shape the scientists of tomorrow. This creates the potential of solving the problem of antibiotic resistance in a more efficient manner (4). "),
React.createElement("p", null, "The 2019 paper \u201CEnabling genetic analysis of diverse bacteria with Mobile-CRISPRi\u201D by Jason et al. published by Nature (5) initially inspired us to realize the potential of CRISPR in revolutionising the therapeutic strategies used to combat antibiotic resistance. With the CRISPR-technology in mind, our team were drawn to the thought of \u201Cturning back time\u201D to the days where antibiotic agents could still successfully treat infected patients. We imagined a world in which antibiotic resistance was not an issue anymore - a world in which resistance genes could simply be downregulated. This thought inspired us greatly and paved the way for defining Conjugaid as a project."),
React.createElement("p", null, "Click next to read more about our project and results.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.Description = Description; //# sourceMappingURL=Description.js.map } // default/src/components/widgets/AccordionWidget.jsx $fsx.f[85] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const _ = $fsx.r(45); function AccordionWidget(props) {
let id = _.uniqueId();
return (React.createElement("nav", { className: "accordion arrows" },
React.createElement("header", { className: "box ".concat(props.model.backgroundColor) },
React.createElement("label", { htmlFor: `acc-close${id}`, className: "box-title" }, props.model.title)),
props.model.items.map((element, index) => {
return (React.createElement("div", { key: index },
React.createElement("input", { type: "radio", name: `accordion${id}`, id: `${id}${index}` }),
React.createElement("section", { className: "box" },
React.createElement("label", { className: "box-title ".concat(props.model.itemTitleColor), htmlFor: `${id}${index}` }, element.title),
React.createElement("label", { className: "box-close", htmlFor: `acc-close${id}` }),
React.createElement("div", { className: "box-content", dangerouslySetInnerHTML: { __html: element.content } }))));
}),
React.createElement("input", { type: "radio", name: `accordion${id}`, id: `acc-close${id}` })));
} exports.AccordionWidget = AccordionWidget;
//# sourceMappingURL=AccordionWidget.js.map } // default/src/components/widgets/BulgeWidget.jsx $fsx.f[88] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const _ = $fsx.r(45); const $ = $fsx.r(86); class BulgeWidget extends React.Component {
constructor(props) {
super(props);
this.topWaveRef = React.createRef();
this.listener = _.throttle(this.updateDimensions.bind(this), 50);
this.state = { overlayHeight: "auto", captionBottom: 0 };
}
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(87);
});
}
componentDidMount() {
window.addEventListener('scroll', this.listener);
window.addEventListener('resize', this.listener);
this.updateDimensions();
}
componentWillUnmount() {
window.removeEventListener('scroll', this.listener);
window.removeEventListener('resize', this.listener);
}
inViewport(ref) {
var H = $(window).height(), r = ref.getBoundingClientRect(), t = r.top, b = r.bottom;
return Math.max(0, t > 0 ? H - t : (b < H ? b : H));
}
updateDimensions() {
let ref = this.topWaveRef.current;
if (ref) {
let window_offset = this.inViewport(ref);
this.setState({
overlayHeight: window_offset,
captionBottom: window_offset / 4
});
}
}
render() {
return (React.createElement("div", { className: "top-wave", ref: this.topWaveRef },
React.createElement("img", { src: this.props.img, alt: "" }),
React.createElement("figcaption", { className: "caption", style: {
bottom: this.state.captionBottom
} },
React.createElement("h1", null, this.props.title)),
React.createElement("span", { className: "overlay", style: {
height: this.state.overlayHeight,
} },
React.createElement("svg", { version: "1.1", id: "circle", xmlns: "http://www.w3.org/2000/svg", x: "0px", y: "0px", viewBox: "0 0 500 250", enableBackground: "new 0 0 500 250", preserveAspectRatio: "none" },
React.createElement("path", { fill: "#FFFFFF", d: "M250,246.5c-97.85,0-186.344-40.044-250-104.633V250h500V141.867C436.344,206.456,347.85,246.5,250,246.5z" })))));
}
} exports.BulgeWidget = BulgeWidget;
//# sourceMappingURL=BulgeWidget.js.map } // default/src/components/Content/Project/But_Does_It_work/Results.jsx $fsx.f[90] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class Results extends React.Component {
render() {
return (React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "But does it work?"),
React.createElement("div", { className: "under-rubrik" }, "Results"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, " After getting to know our project design, you must be curious to see how it went! Keep reading to see our results and demonstrations of our functioning system."))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation })));
}
} exports.Results = Results; //# sourceMappingURL=Results.js.map } // default/src/components/Content/People_Involved/Attributions/Attributions.jsx $fsx.f[92] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); class Attributions extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(91);
});
}
render() {
let accordionData = {
backgroundColor: "bg-green-400",
title: "Attributors to Conjugaid",
itemTitleColor: "text-green-800",
items: [
{
title: "Supervisors",
content: `
A special thanks to our supervisors:
Contents
- 1 Mikkel Girke Jørgensen
- 2 Frederik Bartholdy Flensmark Neergaard
- 3 Felix Boel Pedersen
- 4 The Department of Biochemistry and Molecular Biology, University of Southern Denmark
- 5 Laboratory technician Simon Rose
- 6 Former iGEM-participant Patrick Rosendahl Andreassen
- 7 Former iGEM participant Thøger Jensen Krogh
- 8 Academic Assistant at SDU’s Department of Biochemistry and Molecular Biology Tina Kronborg
- 9 Eric van der Helm and Andreas Porse From SNIPR Biome
- 10 PhD and associate professor at the Department of Biochemistry and Molecular Biology at the University of Southern Denmark Finn Kirpekar
- 11 The Academy of Talented Youths
- 12 The Team
- 13 Odense Katedralskole (a local high-school) and biotechnology-teacher Jesper Terp
- 14 Msc student Flemming Nielsen
- 15 PhD, associate professor and head of Department of Biochemistry and Molecular Biology Jakob Møller-Jensen
- 16 Forensic chemist and science communicator with UNF Martin Worm-Leonhard
- 17 Biotechnology-teacher at Odense Technical High-school (OTG) Jesper Houmann Kattai
- 18 Students at Aalborg Katedralskole (a high school)
- 19 www.Biologiformidling.dk
- 20 SciShow and Kurzgesagt
- 21 www.Visme.com
- 22 The Team
- 23 Chief physician at Statens Serum Institut (SSI) Ute Wolff Sönksen
- 24 MD and specialist in pediatric infectious diseases Alexandra Kruse from Doctors Without Borders (MSF)
- 25 Professor, chief physician and Dr.Med. Hans Jørn Kolmos
- 26 PhD, researcher and associate professor at the Department of Clinical Microbiology at the University of Southern Denmark Janne Kudsk Klitgaard
- 27 Odense University Hospital
- 28 The Team
- 29 Outreach Coordinator at the Department of Biochemistry and Molecular Biology Lise Junker Nielsen
- 30 Svendborg High School and teachers Jørgen Dinesen (Biotechnology) and Christian Maaløv Andreasen (Physics and chemistry)
- 31 UNF Biotech Camps
- 32 The Danish Science Festival
- 33 The Team
- 34 The Municipality of Odense
- 35 The People’s Democratic Festival
- 36 The Team
- 37 Former iGEM participant Thøger Jensen Krogh
- 38 SDU & Bikubenfonden
- 39 IDA Student Union
- 40 Pharmadanmark Student Union
- 41 The Team
- 42 Jakob Møller-Jensen, Head of Department of Biochemistry and Molecular Biology at the University of Southern Denmark,
- 43 Marianne Holmer Dean of The Faculty of Science at the University of Southern Denmark,
- 44 Henrik Dam Vice-Cancellor at University of Southern Denmark,
- 45 IDA Student Union and Pharmadanmark Student Union
- 46 Our project supervisors
- 47 All former iGEM participants at SDU
- 48 DTU Biobuilders
- 49 Ovulaid, the iGEM Team Copenhagen
- 50 Nina Bjørnskov
- 51 Anders Boe
- 52 Arvid Larsson
- 53 DTU Biobuilders, BioBrick Tutorial, April 2019
- 54 iGEM Team Copenhagen, Nordic iGEM Conference, May 2019
Mikkel Girke Jørgensen
Mikkel has been the primary supervisor throughout our project, and he’s been responsible for handling iGEM on SDU for many years now - so he’s really good at it! Mikkel has been of assistance to us within every aspect of our project, but always makes it a point to never tell us no. Whatever we wanted to do, we could do - Mikkel has merely been gently guiding us.
Frederik Bartholdy Flensmark Neergaard
Frederik is an MSc student and a former iGEM participant. From teaching us how to make LB media in the very beginning to helping perfect our wiki-text just before the freeze, Frederik has been of great help to our team throughout our entire project
Felix Boel Pedersen
Like Frederik, Felix is an MSc student and a former iGEM participant. Felix has been of assistance in all areas of our project, from the beginning till the end, but his wisdom when it comes to creating the perfect iGEM-wiki has been especially influential.
Indsæt fællesbillede af supervisors
`
},
{
title: "Laboratory and Technical Support",
content: `
The Department of Biochemistry and Molecular Biology, University of Southern Denmark
for providing us with lab space and equipment.
Laboratory technician Simon Rose
for general lab support, technical assistance and introduction to safety and practicalities in the lab. Simon has especially been of great assistance when introducing us to various difficult techniques in the lab, such as qPCR and purification of chromosomal DNA.
Former iGEM-participant Patrick Rosendahl Andreassen
for troubleshooting and assistance in the lab and in the development of fluorescence microscope.
Former iGEM participant Thøger Jensen Krogh
for troubleshooting when problems arose in the lab.
Academic Assistant at SDU’s Department of Biochemistry and Molecular Biology Tina Kronborg
For assisting us with performing quantitative FACS-analysis and introduction to fluorescent microscopy.
Eric van der Helm and Andreas Porse From SNIPR Biome
for letting us visit them and giving general and technical feedback and advice on our project.
PhD and associate professor at the Department of Biochemistry and Molecular Biology at the University of Southern Denmark Finn Kirpekar
for conjugation advice.
The Academy of Talented Youths
for visiting our facility and helping us purify some of our plasmids.
`
},
{
title: "Human Practices",
content: `
Educational Material
The Team
Our team has independently written all text in our e-book, “What’s up with antibiotics?”. Furthermore, we have made every illustration present in the book ourselves. We have also filmed and edited start-of-chapter introductory videos by ourselves. By using the online graphical design software tool Visme.com, our team members have designed the entire book. We have also created the teaching guides and the laboratory protocols independently. Lastly, we have created evaluation forms and processed these based on the testing of our material on high school students. We would, however, like to thank the following contributors for helping us shape and create our educational material:
Odense Katedralskole (a local high-school) and biotechnology-teacher Jesper Terp
for collaborating with us, providing us with 800 minutes of educational hours in his class and for input on the content of our educational material.
Msc student Flemming Nielsen
for creating an educational video about BLAST for our educational material.
PhD, associate professor and head of Department of Biochemistry and Molecular Biology Jakob Møller-Jensen
for appearing in educational videos created for each chapter of our educational material.
Forensic chemist and science communicator with UNF Martin Worm-Leonhard
for inspiration and valuable insights to creating educational material for high-school students.
Biotechnology-teacher at Odense Technical High-school (OTG) Jesper Houmann Kattai
for valuable input on the shortcomings regarding microbiology and synthetic biology in the Danish high-school curriculum.
Students at Aalborg Katedralskole (a high school)
for surveying preliminary chapters and reporting opinions on difficulty and readability.
www.Biologiformidling.dk
for insights into the practical aspects behind the creation of an educational e-book about science.
SciShow and Kurzgesagt
for allowing us to refer to their educational videos throughout the text in our e-book, “What’s up with antibiotics?”
www.Visme.com
for discounts on their software, which we used to design our e-book.
Symposium
The Team
Regarding our symposium on antibiotic resistance, hosted at the University Hospital of Odense on Wednesday the 4th of September, our team has independently planned the entire event. We contacted the four speakers (see below) and arranged every practicality and we arranged our own talk at the event. In collaboration with the hospital, we arranged catering of coffee, tea and snacks and organized a live-streaming of the event. We would like to thank the following contributors:
Chief physician at Statens Serum Institut (SSI) Ute Wolff Sönksen
for speaking at our symposium.
MD and specialist in pediatric infectious diseases Alexandra Kruse from Doctors Without Borders (MSF)
For speaking at our symposium.
Professor, chief physician and Dr.Med. Hans Jørn Kolmos
For speaking at our symposium.
PhD, researcher and associate professor at the Department of Clinical Microbiology at the University of Southern Denmark Janne Kudsk Klitgaard
For speaking at our symposium.
Odense University Hospital
for providing the facilities, catering and live-streaming services for our symposium on antibiotic resistance.
Public Engagement
The Team
Our team has independently arranged multiple outreach-events and talks throughout our project. We would, however, like to thank the following contributors for providing us with the opportunities to engage in outreach:
Outreach Coordinator at the Department of Biochemistry and Molecular Biology Lise Junker Nielsen
for providing us with opportunities to engage with high school students via multiple outreach-events.
Svendborg High School and teachers Jørgen Dinesen (Biotechnology) and Christian Maaløv Andreasen (Physics and chemistry)
for reaching out and coordinating a day of workshops at our workspaces at SDU.
UNF Biotech Camps
for inviting us to speak at their events.
The Danish Science Festival
for providing us with a booth at their annual event. Thank you all the visitors attending our booth, especially the kids and youngsters who drew their own “Superbacterium”.
Sustainable Development Goals
The Team
Our team has had the UN’s 17 SDGs in mind throughout our entire project, but we would like to thank the following contributors for creating opportunities to engage with the SDGs in our community:
The Municipality of Odense
for hosting an event on the UN’s 17 Sustainable Development Goals and thereby giving us the opportunity to engage within this field.
The People’s Democratic Festival
for hosting their 9th annual People’s Democratic Festival at the island of Bornholm in Denmark. With the festival they created the perfect foundation for debating democracy and opportunities for sustainable development in many ways.
Danish iGEM Weekend
The Team
Our team independently planned and executed the Danish iGEM Weekend in its entirety, but we would like to thank the following contributors for helping us making the meetup a reality:
Former iGEM participant Thøger Jensen Krogh
for hosting a workshop during the Danish iGEM Weekend on creating a successful iGEM-wiki.
SDU & Bikubenfonden
For providing accommodation for all attending teams during the Danish iGEM Weekend.
IDA Student Union
for sponsoring the Danish iGEM Weekend
Pharmadanmark Student Union
for sponsoring the Danish iGEM Weekend
</div `
},
{
title: "Fundraising",
content: `
The Team
Our team has independently written each fundraising application that we’ve sent out. However, we would like to thank the following contributors for assisting and supporting us along the way:
Jakob Møller-Jensen, Head of Department of Biochemistry and Molecular Biology at the University of Southern Denmark,
for supporting our iGEM project.
Marianne Holmer Dean of The Faculty of Science at the University of Southern Denmark,
for supporting our iGEM project.
Henrik Dam Vice-Cancellor at University of Southern Denmark,
for supporting our iGEM project.
IDA Student Union and Pharmadanmark Student Union
for sponsoring our Danish iGEM Weekend.
Our project supervisors
for proof-reading our fundraising applications and guiding us along the way.
`
},
{
title: "Other General Support",
content: `
All former iGEM participants at SDU
for attending our preliminary presentation and providing us with valuable feedback before the Giant Jamboree.
DTU Biobuilders
For hosting their 7th annual BioBrick Tutorial and for participating in our Danish iGEM Weekend.
Ovulaid, the iGEM Team Copenhagen
for hosting this year’s Nordic iGEM Conference and for participating in our Danish iGEM Weekend.
Nina Bjørnskov
For giving us the opportunity to promote our project by allowing us to take over the Faculty of Science’s Instagram page (@sduscience) for a week.
Anders Boe
for creating our final team video.
Arvid Larsson
from the 2019 iGEM team Lund, for providing valuable advice and support in designing our modeling system.
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { id: "attributions" },
React.createElement("div", { className: "header header_img_attributions" },
React.createElement("div", { className: "header-overlay bg-green-400" }),
React.createElement("svg", { className: "curve", "data-name": "Lag 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 1406 438.14" },
React.createElement("path", { className: "cls-1", d: "M1397.41,606.36H0V168.23c145.82,162,264.74,203,353.91,211.58,155.45,14.95,175.12-70,385.51-57.2,132.72,8.09,282.8,50.72,357.17,80.85a1224,1224,0,0,1,298.86,173.86L1406,591v15.41h-8.59Z", transform: "translate(0 -168.23)" })),
React.createElement("div", { className: "inner-header" },
React.createElement("h1", { className: "text-6xl" }, "Attributions")))),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Attributions"),
React.createElement("div", { className: "under-rubrik" }, "Thank you\u2019s"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Our team began our project by brainstorming project ideas in January 2019. We had many initial ideas, but ultimately chose to work on Conjugaid - an idea thought up solely by our team-members. "),
React.createElement("p", null, "In March 2019 we begun working in the lab after an introductory safety and practicalities course. We have accomplished many things on our own, including the formulation, design and execution of our laboratory experiments as well as the writing, designing and planning of our educational material and lesson plan (e-book, illustrations, teaching guides, laboratory protocols and evaluations included). Additionally, we have independently managed and dealt with all communications regarding Integrated Human Practices, Fundraising and promotion of our project. All work within modelling and data processing has been carried out by Conjugaid team members."),
React.createElement("p", null, "However, there are limitations to what one can accomplish alone, which is why our team would like to say a huge \u201Cthank you!\u201D to everyone involved in our project. Keep reading to get to know the people who helped us make Conjugaid a reality."))),
React.createElement("div", { className: "row" },
React.createElement("p", null, "Our team began our project by brainstorming project ideas in January 2019. We had many initial ideas, but ultimately chose to work on Conjugaid - an idea thought up solely by our team-members. "),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", src: "
" })),
React.createElement("p", null, "In March 2019 we begun working in the lab after an introductory safety and practicalities course. We have accomplished many things on our own, including the formulation, design and execution of our laboratory experiments as well as the writing, designing and planning of our educational material and lesson plan (e-book, illustrations, teaching guides, laboratory protocols and evaluations included). Additionally, we have independently managed and dealt with all communications regarding Integrated Human Practices, Fundraising and promotion of our project. All work within modelling and data processing has been carried out by Conjugaid team members."),
React.createElement("p", null, "However, there are limitations to what one can accomplish alone, which is why our team would like to say a huge \u201Cthank you!\u201D to everyone involved in our project. Keep reading to get to know the people who helped us make Conjugaid a reality.")),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Attributions = Attributions; //# sourceMappingURL=Attributions.js.map } // default/src/components/Content/Human_Practices/Public_Engagement/PublicEngagement.jsx $fsx.f[94] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const WavesWidget_1 = $fsx.r(82); const Buttons_1 = $fsx.r(80); const topWaves = [
{
color: "#193443",
offset: 500,
path: "M0,96L48,90.7C96,85,192,75,288,69.3C384,64,480,64,576,80C672,96,768,128,864,160C960,192,1056,224,1152,208C1248,192,1344,128,1392,96L1440,64L1440,0L1392,0C1344,0,1248,0,1152,0C1056,0,960,0,864,0C768,0,672,0,576,0C480,0,384,0,288,0C192,0,96,0,48,0L0,0Z"
}
]; class PublicEngagement extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(93);
});
}
render() {
let accordionData = {
backgroundColor: "bg-pink-600",
title: "Public Engagement Activities",
itemTitleColor: "text-yellow-600",
items: [
{
title: "Quotes on educational material",
content: `
“It’s nice to watch videos once in a while, since I can get tired of reading.”
“I think the level of difficulty was good. Some things were complicated but we need challenges. I think it was a really good book and a really good course. It has been educative and most of the [c]lass liked it.”
“Now that I’ve gained knowledge of something new, I can reflect upon it. Maybe I have an idea that’s worth working on…”
“I really enjoyed the introductions to each chapters, the ones about Peter. They made it easy to grasp the situation and made me understand the material better.”
“[...] I also really liked that you made glossaries, so I could actually understand what I was reading about without having to google everything all the time.”
},
{
title: 'Overskrift 2',
content: "bla bla bla text 2"
},
{
title: "Overskrift 3",
content: 'Bla bla bla bla text 3'
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement(WavesWidget_1.Waves, Object.assign({}, { waves: topWaves })),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("p", null,
"In a time of rising scientific scepticism [K], it is more important than ever to maintain the integrity of the scientific community. Without the support of governments and the public, we as scientists cannot combat societal problems like antibiotic resistance. One way to help maintain this integrity is by opening up the scientific community to the public and engage them in our work. ",
React.createElement("br", null),
"We have tried to achieve this engagement through five actions: "),
React.createElement("ol", null,
React.createElement("li", null, "Coming up with novel ideas to achieve the Sustainable Development Goals"),
React.createElement("li", null, "Assessing the need for knowledge amongst legislators"),
React.createElement("li", null, "Engaging with high school students"),
React.createElement("li", null, "Engaging with the general public"),
React.createElement("li", null, "Being active on social media")),
React.createElement("p", null, "All of which can be read about in the following section. ")),
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Education"),
React.createElement("p", { className: "intro_quote" }, "\u201CThe goal of education is not to increase the amount of knowledge but to create the possibilities for a child to invent and discover, to create men who are capable of doing new things.\u201D - Jean Piaget"),
React.createElement("p", { className: "italic" }, "There once was a boy named Peter. He lived an ordinary life, but one day it took a turn for the worse, when Peter got very ill. The doctors told him, \u201CPeter, bacteria are making you sick, our antibiotics won\u2019t work and we don\u2019t know what to do!\u201D Luckily for Peter, an alternative solution was found.."),
React.createElement("p", null,
"This is the story of \u2018What\u2019s up with antibiotics?\u2019, the open-source, case-oriented e-book produced by our team. The e-book is a part of a longer lesson-plan created by our team in collaboration with Danish high school students and teachers. The lesson-plan is supported by teaching manuals and laboratory protocols, and it addresses fundamental microbiology, the use of antibiotic agents, the aspects of antibiotic resistance and the current and future prospects of the CRISPR-technology. It is aimed at Danish high school students majoring in biotechnology, and it supports (rather than expands) the current curriculum for these studies. You can read an English excerpt of the first two chapters here, and you can view the e-book in its entirety in Danish here.",
React.createElement("br", null),
"According to the first objective of the WHO Global Action Plan on Antimicrobial Resistance [K], awareness about antibiotic resistance through public communication and education is needed. This requires continuous effort, and therefore we wanted to create a sustainable resource, available and easy to adopt by others in the future.",
React.createElement("br", null),
"We aimed at making the scientific theory as relatable as possible for the students reading it. Thus, we decided to frame the e-book as a clinical case at a hospital\u2019s Department of Microbiology, in which the students act as molecular biologists diagnosing and treating Peter, a patient suffering from a multi-resistant bacterial infection. The e-book frequently refers to educational videos (some filmed by us and some used with permission from SciShow and Kurzgesagt) and covers the following topics: "),
React.createElement("ul", null,
React.createElement("li", null, "Bacteriology"),
React.createElement("li", null, "DNA sequencing"),
React.createElement("li", null, "DNA Blasting"),
React.createElement("li", null, "Antibiotics and antibiotic resistance"),
React.createElement("li", null, "The CRISPR-technology and the bioethics behind it"),
React.createElement("li", null, "Creation of scientific posters"),
React.createElement("li", null, "Constructive feedback-methods")),
React.createElement("p", null,
"Using the accompanying laboratory protocols, the students will try out PCR and gel electrophoresis as well as performing two digital exercises elaborating on DNA BLAST and CRISPR. The lesson plan is rounded off with the students creating a scientific poster of their discoveries and their teacher hosting a small poster session in which the students present their findings and provide feedback to their peers.",
React.createElement("br", null),
"When creating our educational material we have been inspired by the 5E Teaching Model, which allows students to learn new concepts through a cycle of 5 steps. The 5 steps and our use of them are as follows:"),
React.createElement("ol", null,
React.createElement("li", null, "Engage: The concept of interest is introduced to the students and any knowledge gaps are filled. This is done by giving a relatable introduction to microbiology (through the story of Peter) in the first parts of \u201CWhat\u2019s up with antibiotics?\u201D"),
React.createElement("li", null, "Explore: The students broaden their knowledge through hands-on learning about some of the scientific methods behind microbiology when visiting our laboratory facilities."),
React.createElement("li", null, "Explain: Based on their work in the laboratory during the Explore-phase, the teacher aids the students in understanding and explaining the results (eg. the significance of the bands on their gels)."),
React.createElement("li", null, "Elaborate: In order for the students to gain a deeper understanding of their work, they are asked to elaborate their obtained knowledge by creating a scientific poster about the course and presenting it to their peers."),
React.createElement("li", null, "Evaluate: The students perform self- and peer-assessment of each other\u2019s scientific presentations using the BIO-feedback model, which is presented to them in the last chapter of \u201CWhat\u2019s up with antibiotics?\u201D")),
React.createElement("p", null,
"The entire lesson plan, including the e-book, the teaching guides and the laboratory manuals, were fully tested on a class of students from the Danish high school Odense Katedralskole. This high school class is majoring in biotechnology and was our primary test group, and we tested our materials throughout a total of 800 minutes of class time. ",
React.createElement("br", null),
"With \u2018What\u2019s up with antibiotics?\u2019 we hope to inform young minds all over the world about antibiotics and the issues the world will face if new strategies to combat emerging resistance are not implemented. By learning about the opportunities that lie within the fields of synthetic biology and biotechnology, perhaps we can help shape the scientists of tomorrow. Click here to read some of the feedback we received from the students.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.PublicEngagement = PublicEngagement; //# sourceMappingURL=PublicEngagement.js.map } // default/src/components/Content/Human_Practices/Bioethics/Bioethics.jsx $fsx.f[95] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); class Bioethics extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Project & Inspiration References",
content: `
- <a href="" target="_blank" class="references">Filosofisk etik: Normativ etik, praktisk etik og metaetik. Aarhus universitetsforlag, 2011. 2. edition, 2014. Edited by Christensen, A-M. S.</a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Bioethics"),
React.createElement("p", { className: "intro_quote" },
"\u201CThe power to control our species\u2019 genetic future is awesome and terrifying. Deciding how to handle it may be the biggest challenge we have ever faced.\u201D ",
React.createElement("span", null, "\u2015 Jennifer A. Doudna. ")),
React.createElement("p", null,
"During our project we had many ethical considerations, but we did not always know how to express these considerations. At that point we talked to Rikke Friis Bentzon, a former iGEM team member from ",
React.createElement("a", null, "SDU-Denmark 2016 "),
" and a master\u2019s student in philosophy. She has a special interest in bioethics, and provided us with the necessary tools needed to further consider and understand the ethics of our project from different points of views. In this section we will present and discuss our bioethical considerations."),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", className: "", src: "
" })),
React.createElement("p", null, "Bioethics is a philosophical branch of ethics that deals with the ethical considerations regarding biotechnology and its methods (1). "),
React.createElement("p", null, "In bioethics, there are different theories and arguments that help us reflect upon our project. One of the principles we use to justify the concept of our project is the appeal to well-being. Here, the argument is that we should strive to create a happier life, a life we are more content with, and we should be positive towards the things that can help accomplish this (1). "),
React.createElement("p", null, "Here, our thoughts are that if our donor bateria works, it would potentially improve the lives of millions of people. Consequently, our project is positive in the light of the principle of no harm. This principle states that if something does not hurt anyone else, and if the user is informed of the practise, the use of it should not be prevented (1)."),
React.createElement("p", null, "However, there are also arguments which object to our project and the technologies that we use. "),
React.createElement("p", null, "The first argument is the appeal to naturalness. This argument states that it is ethically wrong to tamper with nature or to change a natural process (1). When we modify an organism by changing its DNA, we are tampering with nature. When we are preventing the death of people resulting from antibiotic resistant bacterial infections we are changing the natural process of evolution. "),
React.createElement("p", null, "The problem with this argument, however, is that something might not be ethically wrong just because it is not natural. Can it not just be ethically neutral (1)? Furthermore, we humans are already performing such unnatural deeds, e.g. by using vaccinations, medicine, and assisted reproduction (1). If we are already doing unnatural things that most people do not find morally and ethically wrong, why should we then find other things (such as genetically modified organisms) wrong?"),
React.createElement("p", null, "Another important point is that we do not yet know the consequences of using our donor bacteria in the human gut microbiome. Right now we do not know if there would be any implications for the individual patient that might affect their health, or if we are affecting evolution negatively. "),
React.createElement("p", null, "The question of potentially affecting the microbiome, however, could be answered by making clinical trials testing whether or not the donor bacteria has the desired effect without any severe side effects. "),
React.createElement("p", null, "The big concern is the long term consequences and effects of our donor bacteria. Will it mutate and create something worse than the antibiotic resistance crisis we are trying to combat? Will it disrupt the delicate balance in an ecosystem or in nature? Will it take over the human microbiome and outnumber the \u201Cgood\u201D bacteria? "),
React.createElement("p", null, "These are all questions that we cannot answer through clinical trials, but must look towards observations and qualified guesses for answers. These considerations are referred to as the precautionary principle. "),
React.createElement("p", null, "The precautionary principle states that if there is any reason to believe that a practise will cause harm, one should take precautions and progress slowly or not at all with it (1). "),
React.createElement("p", null, "The precautionary principle, however, does not always take into account the damage it could potentially cause, if a practise is omitted. "),
React.createElement("p", null, "Perhaps our donor bacteria could save the lives of many people and not cause damage. However, we have no way of knowing before the technology has been tried and tested. It would therefore be clever to take safety precautions into account when developing and testing our donor bacteria, but we should not be so paralyzed that we do not act with the technology we have at our disposal at this moment. "),
React.createElement("p", null, "Through this discussion it might be apparent that we are pro-technology and optimistic about new discoveries. Our belief is that as long as the technology is used on a voluntary and informed basis, it should be allowed (1). This means that we see the use of CRISPR/Cas from a pro-technology point of view and thus as a good thing. "),
React.createElement("p", null, "As a concluding remark, we would like to point out that it is not possible to know the long term consequences of using genetically engineered E. coli to fight antibiotic resistance. It is our belief, however, that we should, with safety precautions in mind, at least make an effort to use the technology we have available to us, in order to avoid a major catastrophe, which antibiotic resistance without a doubt has the potential to become.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.Bioethics = Bioethics; //# sourceMappingURL=Bioethics.js.map } // default/src/components/Content/People_Involved/Partners/partners.jsx $fsx.f[97] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class PartnersSponsors extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(96);
});
}
render() {
return (React.createElement("div", { id: "sponsors", className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Sponsors & Partners"),
React.createElement("div", { className: "under-rubrik" }, "Without you, no us"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "We would like to say a special thank you to all of our sponsors - without them, Conjugaid would never have become what it is today."))),
React.createElement("div", { className: "row" },
React.createElement("h2", null, "We would like to thank our sponsors:")),
React.createElement("h3", null, "The Faculty of Science at University of Southern Denmark"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.sdu.dk/en/", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, " for providing us with the fundamental financial support needed in order to create and fulfill Conjugaid, and for providing us with laboratory facilities. "))),
React.createElement("h3", null, "Integrated DNA Technologies"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "www.idtdna.com", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Integrated DNA Technologies, Inc. (IDT) develops, manufactures, and markets nucleic acid products for the life sciences industry in the areas of academic research, biotechnology, agriculture, medical diagnostics, and pharmaceutical development. The company's primary business is the production of custom oligonucleotides for molecular biology applications."))),
React.createElement("h3", null, "Snapgene"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.snapgene.com/", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "SnapGene offers the fastest, easiest way to plan, visualize, document, and share your everyday molecular biology procedures. The software is used in more than sixty-five countries, in virtually every major research institution, and in most of the largest pharmaceutical and biotech companies worldwide. Free trials are available from the SnapGene website."))),
React.createElement("h3", null, "New England Biolabs"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.neb.com/", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "New England Biolabs (NEB) is renowned for consistently providing exceptional product quality and unsurpassed technical support. In addition to NEB\u2019s commitment to scientific innovation and customer relations, NEB notably ensures the environmental sustainability of the company\u2019s business practices. For nearly four decades, NEB has been shaping the landscape of bioscience research by discovering, developing and supporting superior research reagents. Our passion is our promise."))),
React.createElement("h3", null, "Browserstack"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.browserstack.com/", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Browserstack is an online platform used by web developers and mobile app developers to test how their website or app would work on different browsers, operating systems and mobile devices. This makes it a lot easier to develop a functioning website or app that is functional to all of its users. "))),
React.createElement("h3", null, "Codecademy"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.codecademy.com", target: "_blank" },
React.createElement("img", { src: "https://static.igem.org/mediawiki/2019/7/71/T--SDU-Denmark--codecademy-logo-new.svg" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, " Codecademy has helped over 45 million people upgrade their careers with engaging, accessible, and flexible education on programming and data skills. We provide over 200 hands-on interactive lessons ranging from Python to R to Javascript and everything in between. Our learners have gone on to start companies, new jobs, and new lives thanks to what they\u2019ve learned with Codecademy."))),
React.createElement("h3", null, "Webflow"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.webflow.com", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Webflow is an online platform where you can design, develop, and manage completely custom websites, harnessing all the power of HTML, CSS, and JavaScript in a visual canvas. Webflow is the only design tool that lets you create production-level code."))),
React.createElement("h3", null, "IDA"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://english.ida.dk/", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "IDA is Denmark\u2019s largest interest group and trade union with more than 30,000 students in the fields of IT, natural Science and engineering. A membership of IDA gives you access to cheap insurances, academic and social events and plenty of opportunities to build networks."))),
React.createElement("h3", null, "Pharmadanmark"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.pharmadanmark.dk/en", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Pharmadanmark is a union for professionals and students of life sciences. As specialists in the field, we ensure the best advice for our members both within career and legal counseling. With professional networks and events gives you plenty of opportunities to meet like-minded people within the life science industry."))),
React.createElement("h3", null, "Visme"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.visme.co", target: "_blank" },
React.createElement("img", { src: "https://static.igem.org/mediawiki/2019/f/f5/T--SDU-Denmark--visme-logo.svg" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Visme is an easy to use app that allows anyone create better visual content.They empower anyone to visualize ideas into professional Presentations & Infographics. Visme gives you easy (and powerful) tools to manage and empower your online presence. Visme is the tool of choice to create better Visual Content."))),
React.createElement("h3", null, "SciShow"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.youtube.com/user/scishow", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "SciShow is a youtube channel that discusses science news and history and concepts. With equal parts skepticism and enthusiasm, they go a little deeper without going off the deep end. Most of the time, anyway."))),
React.createElement("h3", null, "Crash Course"),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("a", { href: "https://www.youtube.com/user/crashcourse", target: "_blank" },
React.createElement("img", { src: "
" }))),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", null, "Tons of awesome courses in one awesome channel! Nicole Sweeney teaches you sociology, Carrie Anne Philbin teaches you computer science, Craig Benzine teaches film history, and Mike Rugnetta is teaching mythology."))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation })));
}
} exports.PartnersSponsors = PartnersSponsors; //# sourceMappingURL=partners.js.map } // default/src/components/Content/Lab_Process_And_Parts/Parts/Parts.jsx $fsx.f[99] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class Parts extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(98);
});
}
render() {
return (React.createElement("div", { id: "parts", className: "overflow-x-auto" },
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Parts Catalog"),
React.createElement("div", { className: "under-rubrik" }, "BioBricks used throughout Conjugaid"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Below you will find a complete list of all the parts that have been used throughout the development of the project. Additionally, a short explanation on the constructions of the sgRNA, the dCas, the Cas9, a GFP and an RFP fluorescent library, along with a short description on the choice of backbones is recorded. ")))),
React.createElement("table", { className: "basic_parts" },
React.createElement("caption", null, "Basic Parts"),
React.createElement("thead", null,
React.createElement("tr", null,
React.createElement("th", null, "No."),
React.createElement("th", null, "Name"),
React.createElement("th", null, "Type"),
React.createElement("th", null, "Description"),
React.createElement("th", null, "Designer"),
React.createElement("th", null, "Length (bp)"))),
React.createElement("tbody", null,
React.createElement("tr", null,
React.createElement("td", null, "1"),
React.createElement("td", null,
React.createElement("a", { href: "https://www.facebook.com", target: "_blank" }, "BBa_K873003")),
React.createElement("td", null, "Conjugation"),
React.createElement("td", null, "Conjugative transfer of RFG"),
React.createElement("td", null, "Christian Gejl Christensen"),
React.createElement("td", null, "1302")),
React.createElement("tr", null,
React.createElement("td", null, "1"),
React.createElement("td", null,
React.createElement("a", { href: "https://www.w3schools.com", target: "_blank" }, "BBa_K873003")),
React.createElement("td", null, "Conjugation"),
React.createElement("td", null, "Conjugative transfer of RFG"),
React.createElement("td", null, "Christian Gejl Christensen"),
React.createElement("td", null, "1302")),
React.createElement("tr", null,
React.createElement("td", null, "1"),
React.createElement("td", null,
React.createElement("a", { href: "https://www.w3schools.com", target: "_blank" }, "BBa_K873003")),
React.createElement("td", null, "Conjugation"),
React.createElement("td", null, "Conjugativeasdasd transfer of RFG Conjugative transadsfer of RFG"),
React.createElement("td", null, "Christian Gejl Christensend naksdnasdnakjndkansdkas jndkjasdnas kjdnjkasnd"),
React.createElement("td", null, "1302")),
React.createElement("tr", null,
React.createElement("td", null, "1"),
React.createElement("td", null,
React.createElement("a", { href: "https://www.w3schools.com", target: "_blank" }, "BBa_K873003")),
React.createElement("td", null, "Conjugation"),
React.createElement("td", null, "Conjugative transfer of RFG"),
React.createElement("td", null, "Christian Gejl Christensen"),
React.createElement("td", null, "1302")))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation })));
}
} exports.Parts = Parts; //# sourceMappingURL=Parts.js.map } // default/src/components/Content/Project/System_Design/Design.jsx $fsx.f[101] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); const WavesWidget_1 = $fsx.r(82); const delivery = () => {
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Donor Design"),
React.createElement("p", null,
" ",
React.createElement("img", { className: "icon", src: "
" }),
" In order to safely and efficiently deliver our CRISPR/(d)Cas9-system to E. coli in the human intestine, we have designed a donor bacteria. "),
React.createElement("p", null, "The phrase \u201Cdonor\u201D arises from its ability to transfer its own genetic information to other neighboring bacteria. The donor bacteria is designed to contain two separate genetic elements; a plasmid carrying our CRISPR/(d)Cas9-system and a plasmid carrying information required for cell-to-cell transfer of DNA. Thus, the CRISPR/(d)Cas9-system can be efficiently transferred to acceptor E. coli."),
React.createElement("div", { className: "figure_container" },
React.createElement("img", { id: "", className: "", src: "
" })),
React.createElement("p", null,
"When designing our resistant target bacteria, we have had the occurrence of resistant genes in bacterial populations in mind. Bacteria often carry resistance genes on plasmids, typically ones with a low copy number (1, 2). This is also the case for genes encoding OXA-48. Since it is ",
React.createElement("a", { href: "http://localhost:4444/Team:SDU-Denmark/simple/Safey", target: "_blank" }, " not safe to work with actual OXA-48 genes in the laboratory "),
", we designed our target bacteria to resemble it as closely as possible by having it contain CML resistance on a low copy number plasmid."),
React.createElement("div", { className: "figure_container" },
React.createElement("img", { id: "", className: "", src: "
" }))))));
}; const crispr = () => {
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "CRISPR Action"),
React.createElement("h3", null, "CRISPR/(d)Cas9 for precision gene targeting"),
React.createElement("p", null, "To ensure specific targeting of antibiotic resistance genes, we decided to rely on the precise gene editing system, CRISPR/Cas."),
React.createElement("p", null, "When utilizing the CRISPR/Cas-system as a gene editing tool, two components are required; an sgRNA and a Cas-enzyme. Cas-enzymes are DNA specific endonucleases which perform double stranded breaks in the target DNA. To identify the target, the protein uses an RNA molecule referred to as a single guide RNA (sgRNA) which forms a complex with Cas (9). Multiple Cas-enzymes exist, and within our project we have chosen to utilize Cas9 and dCas9. "),
React.createElement("p", null, "The Cas9 enzyme is catalytically active, meaning it will directly cleave the target DNA. However, Cas9 also exists in an inactive form, which is known as dead Cas9 (dCas9). In contrast to Cas9, dCas9 does not cleave the DNA. Instead, it sterically blocks the elongation of transcription as a result of the sgRNA-DNA interaction. This will only repress the expression of the target gene thus avoiding the destruction of the gene (9)."),
React.createElement("h3", null, "Proof-of-concept through targeting fluorescence genes"),
React.createElement("p", null, "The goal of our project is to repress (using dCas9) and/or knockout (using Cas9) resistance genes. However, to achieve an initial proof-of-concept we began by targeting the fluorescence genes gfp (green) and rfp (red). "),
React.createElement("p", null, "Repression of fluorescence genes provide a visible result that can be easily measured by fluorescence microscopy. Data showing a decrease in fluorescence will provide an indication on how genes can be downregulated by the action of our CRISPR/(d)Cas9 system. "),
React.createElement("p", { className: "text-red-600" }, "Figur med CRISPR/Cas teknologien: Cas9 + sgRNA som interagerer med target)"),
React.createElement("h3", null, "How do we take advantage of the CRISPR technology?"),
React.createElement("p", null,
"Through our project, two CRISPR/Cas systems were created; one containing a Cas9 protein, another a dCas9 protein. Both proteins are codon optimized versions of part BBa_K1150000 for optimal expression in our E. coli K12 TOP10 and KG22 chassis, since the dCas9 protein already present in the iGEM 2019 kit was optimized for mammalian use. You can read more about our use of two different chassis in our ",
React.createElement("a", { href: "http://localhost:4444/Team:SDU-Denmark/simple/Parts", target: "_blank" }, " Parts-section "),
"."),
React.createElement("p", { className: "text-red-600" }, "Figur: Plasmid design, Illustration of the plasmid constructions (like SDU-2017)"),
React.createElement("p", null, "The first system is our CRISPR/Cas9 system. Here, the endonuclease activity of Cas9 is utilized by cutting the gene of interest and thus destroying it. The cut ensures that transcription and thereby translation of the gene is disrupted, thus preventing our chassis expressing the target gene (10)."),
React.createElement("p", null, "The second system is our CRISPR/dCas9. The catalytically inactive form of Cas9 induces repression of the target gene through sgRNA-DNA interaction, thus preventing the RNA polymerase to elongate during transcription. This means that the CRISPR/dCas9 system reduces the expression of the antibiotic resistance gene, but the gene is not destroyed. For this method to work efficiently, dCas9 has to be continuously expressed by the bacterium. "),
React.createElement("p", null, "The reason for using both Cas9 and dCas9 is to examine which protein is the most efficient at downregulating a particular target gene."),
React.createElement("p", null, "We designed different sgRNAs (parts nr. p\u00E5 sgRNA\u2019erne) to target different areas of the gfp, rfp and cml genes. The sgRNAs were designed as described in the protocol \u201CCRISPR interference (CRISPRi) for sequence-specific control of gene expression\u201D published in Nature (10). "),
React.createElement("p", null, "The plasmids were constructed to contain both a sgRNA with an Anderson constitutive promoter with activity 1 (BBa_J23100) and a Cas9 protein with either the constitutively active Anderson promoter or an IPTG inducible promoter (BBa_R0011) on a pSB1K3 backbone. Furthermore, an oriT (BBa_J01003) was inserted into the plasmid to make it transferable by conjugation."),
React.createElement("p", null, "With the system working efficiently, it will be possible to alter the sgRNA and transfer to any bacterium containing any resistance gene, thus making the bacteria sensitive to antibiotics again. "),
React.createElement("p", null, "Are you excited to see how it went? Hit the \u201CNext\u201D button and have a look. ")))));
}; const donorWaves = [
{
color: "#DCEEF2",
offset: 0,
path: "M0,224L60,224C120,224,240,224,360,192C480,160,600,96,720,80C840,64,960,96,1080,128C1200,160,1320,192,1380,208L1440,224L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z",
content: delivery
},
{
color: "#DCEEF2",
offset: 1400,
reversed: true,
path: "M0,32L60,58.7C120,85,240,139,360,144C480,149,600,107,720,112C840,117,960,171,1080,208C1200,245,1320,267,1380,277.3L1440,288L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
},
{
color: "white",
offset: 1250,
path: "M0,160L40,160C80,160,160,160,240,181.3C320,203,400,245,480,218.7C560,192,640,96,720,74.7C800,53,880,107,960,138.7C1040,171,1120,181,1200,176C1280,171,1360,149,1400,138.7L1440,128L1440,320L1400,320C1360,320,1280,320,1200,320C1120,320,1040,320,960,320C880,320,800,320,720,320C640,320,560,320,480,320C400,320,320,320,240,320C160,320,80,320,40,320L0,320Z"
}
]; const crisprWaves = [
{
color: "#DCEEF2",
offset: 0,
path: "M0,224L60,224C120,224,240,224,360,192C480,160,600,96,720,80C840,64,960,96,1080,128C1200,160,1320,192,1380,208L1440,224L1440,320L1380,320C1320,320,1200,320,1080,320C960,320,840,320,720,320C600,320,480,320,360,320C240,320,120,320,60,320L0,320Z",
content: crispr
},
{
color: "#DCEEF2",
offset: 1900,
reversed: true,
path: "M0,32L60,58.7C120,85,240,139,360,144C480,149,600,107,720,112C840,117,960,171,1080,208C1200,245,1320,267,1380,277.3L1440,288L1440,0L1380,0C1320,0,1200,0,1080,0C960,0,840,0,720,0C600,0,480,0,360,0C240,0,120,0,60,0L0,0Z"
},
{
color: "white",
offset: 1850,
path: "M0,160L40,160C80,160,160,160,240,181.3C320,203,400,245,480,218.7C560,192,640,96,720,74.7C800,53,880,107,960,138.7C1040,171,1120,181,1200,176C1280,171,1360,149,1400,138.7L1440,128L1440,320L1400,320C1360,320,1280,320,1200,320C1120,320,1040,320,960,320C880,320,800,320,720,320C640,320,560,320,480,320C400,320,320,320,240,320C160,320,80,320,40,320L0,320Z"
}
]; class Design extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(100);
});
}
constructor(props) {
super(props);
this.state = { visible: false };
}
show() {
document.body.classList.add("rodal-open");
this.setState({ visible: true });
}
hide() {
document.body.classList.remove("rodal-open");
this.setState({ visible: false });
}
render() {
let accordionData = {
backgroundColor: "design-accordion-bg",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "System Design References",
content: `
- <a href="https://aac.asm.org/content/53/6/2227" target="_blank" class="references">Carattoli, A. (2009). Minireview: Resistance Plasmid Families in Enterobacteriaceae. Antimicrobial Agents and Chemotherapy, 53(6), 2227-2238. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC5545573/" target="_blank" class="references">Hoffman, M. et al. (2017). Comparative Sequence Analysis of Multidrug-Resistant IncA/C Plasmids from Salmonella enterica. Front. Microbiol., 8: 1459. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/11212334" target="_blank" class="references">Mazel, D. and J. Davies (1999). Antibiotic resistance in microbes. Cell Mol Life Sci. 56(9), 742-754.</a>
- <a href="Huddleston, J. R. (2014). Horizontal gene transfer in the human gastrointestinal tract: potential spread of antibiotic resistance genes. Dovepress, 7, 167-176. " target="_blank" class="references">Huddleston, J. R. (2014). Horizontal gene transfer in the human gastrointestinal tract: potential spread of antibiotic resistance genes. Dovepress, 7, 167-176. </a>
- <a href="https://www.annualreviews.org/doi/10.1146/annurev.ge.25.120191.001051" target="_blank" class="references">Mazodier, P. and J. Davies (1991). Gene transfer between distantly related bacteria. Annual Review of Genetics, 25, 147-171. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/15636742" target="_blank" class="references">Llosa, M. and F. de la Cruz (2005). Bacterial conjugation: a potential tool for genomic engineering. Res Microbiol, 156(1), 1-6. </a>
- <a href="https://www.sciencedirect.com/science/article/pii/S0168160508003279?via%3Dihub" target="_blank" class="references">Lampkowska, J. et al. (2008). A standardized conjugation protocol to assess antibiotic resistance transfer between lactococcal species. Int J of Food Microbiology, 127(1-2), 172-175. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/8950812" target="_blank" class="references">Berg, R. D. (1996). The indigenous gastrointestinal microflora. Trends Microbiol, 4(11), 430-435.</a>
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4343198/" target="_blank" class="references">Hsu, P. D. et al. (2014). Development and Applications of CRISPR-Cas9 for Genome Engineering. Cell, 157(6), 1262-1278.</a>
- <a href="https://www.researchgate.net/publication/258055787_CRISPR_interference_CRISPRi_for_sequence-specific_control_of_gene_expression" target="_blank" class="references">Larson, M. H. et al. (2013). CRISPR interference (CRISPRi) for sequence-specific control of gene expression. Nature Protocol, 8(11), 2180-2196. </a>
- <a href="" target="_blank" class="references"></a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { id: "design" },
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Project Design"),
React.createElement("div", { className: "under-rubrik" }, "Three Steps"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "To guide you easily through our project design, we have chosen to split it into three sections:"),
React.createElement("ol", null,
React.createElement("li", null, "Donor Deisgn"),
React.createElement("li", null, "Delivery"),
React.createElement("li", null, "CRISPR Action")),
React.createElement("p", null, "Keep reading to be taken on a 3-step journey through our engineered system.")))),
React.createElement(WavesWidget_1.Waves, Object.assign({}, { waves: donorWaves, top: "0", concurrentZDelta: -1 })),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Delivery"),
React.createElement("p", null, "First of all, let\u2019s talk about the remarkable ability of bacteria to exchange genetic material, and how this is contributing to the vast genetic diversity and massive success of bacterial communities. "),
React.createElement("p", null, "From a bacterial standpoint, success is seen when the ability to overcome the effects of antibiotics arises as a consequence of horizontal gene transfer (HGT) (3). So far, three different mechanisms of HGT have evolved; (i) release and uptake of DNA fragments (transformation), (ii) transfer of DNA by viruses or phages (transduction) and (iii) direct transfer of DNA between two cells with temporary physical contact (conjugation)."),
React.createElement("h3", null, "Conjugation as bacterial delivering system "),
React.createElement("p", null, "One of the major advantages of using conjugation as our delivery system rather than other mechanisms of HGT is the fact that the acceptor bacteria themselves will become new donor cells. These new donor cells are capable to further deliver the DNA to other recipient bacteria. "),
React.createElement("p", null, "Thus, by combining conjugation with our CRISPR/(d)Cas9-system, we hypothesized that our donor bacteria will initiate a domino-effect leading to further dispersal of our CRISPR/(d)Cas9-system, thereby sensitizing microbiotic E. coli to common antibiotics. "),
React.createElement("p", null, "Other advantages of using conjugation as a delivery system include targeting a broad range of bacterial strains and furthermore allowing for a high carrying capacity of genetic material (4, 5). "),
React.createElement("p", null, "But what exactly is conjugation?"),
React.createElement("p", null, "Conjugation is the only method of HGT that involves direct cell-to-cell contact and requires the presence of mobilizing conjugative factors. These factors are often located on separate plasmids of which the most well-known are R- and F-plasmids, which are self-transmissible (conjugative) and can mediate their own transfer from one bacteria to another. Transfer of the plasmid is initiated at a region called origin of transfer (oriT) from which the DNA is transmitted by a process known as rolling circle replication (6). "),
React.createElement("p", null, "Besides mediating their own transfer, these conjugative plasmids can co-transfer non-selftransmissible (non-conjugative) plasmids containing a compatible oriT region. Therefore, to make our CRISPR/(d)Cas9-system transferable, we constructed a non-conjugative plasmid containing an oriT sequence along with the CRISPR/(d)Cas9-system. This enables our CRISPR/(d)Cas9 plasmid construct to be transferred by conjugation along with the appropriate conjugative plasmid. "),
React.createElement("p", null, "Three different conjugative plasmids have been tested; two R-plasmids (RP4-8 and pRK24) and one F\u2019-plasmid (from XL1-Blue strain). As different conjugative plasmids may contain different oriT sequences, the R-plasmids that we have been using were compatible with the oriT-R (BBa_J01003) and the F-plasmid was compatible with the oriT-F (BBa_I714030)."),
React.createElement("p", { className: "text-red-600" }, "(Illustration of bacteria containing the mobilizing plasmid and the non-conjugative plasmid incl. appropriate antibiotic resistance genes). "),
React.createElement("p", null, "Many traditional methods for examining the transfer of plasmids by conjugation have relied on the seeding of bacteria on 2D surfaces, such as filters (7). However, we sought to test conjugation in an environment resembling the 3D nature of the human intestine. This was done by performing conjugation experiments in solution. Likewise, we used a high bacterial density in our conjugation experiments, aiming to mimic the high density of bacteria found within the human gastrointestinal tract (8). "),
React.createElement("p", null, "We aimed to identify the conjugative plasmid with the highest transfer frequency for both plasmids, in order to ensure a self-transmissible delivery system. We constructed donor bacteria containing the conjugative plasmid as well as a non-conjugative plasmid containing only the compatible oriT sequence. Bacteria that have received either the conjugative plasmid (TC), non-conjugative plasmid (TN) or both (TCN) were selected using appropriate antibiotics. "),
React.createElement("div", { className: "figure_container" },
React.createElement("img", { id: "", className: "", src: "
" }),
React.createElement("p", { className: "figure_name text-blue-800" }, "Figure X"),
React.createElement("p", { className: "figure_text" }, "Depicts the proportion of recipient cells that have received either the conjugative plasmid (TC), the non-conjugative donor plasmid (TN) or both plasmids (TCN). The proportion of TC, TN and TCN were obtained by dividing the number of CFU with the total number of recipient cells. Both donor and recipient cells are E. coli K12 TOP10, with donor cells containing the pRK24, RP4-8 or F\u2019 conjugative plasmid along with a non-conjugative plasmid containing a compatible oriT sequence, and recipient cells containing a low-copy number plasmid. Data are represented as mean values with standard error of mean (SEM). A two-way ANOVA with Tukey\u2019s multiple comparisons test revealed no significant differences between groups (N=4-8). ")),
React.createElement("p", null, "The data in figure X indicates a slight increase in the conjugation efficiency of the RP4-8 plasmid compared to the F\u2019- and pRK24-plasmids. Based on these results we chose the RP4-8 as the optimal conjugative plasmid for transfer of our non-conjugative plasmid containing the CRISPR/(d)Cas9-system. "))),
React.createElement(WavesWidget_1.Waves, Object.assign({}, { waves: crisprWaves, top: "0", concurrentZDelta: -1 })),
React.createElement("div", { className: "content" },
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData })))));
}
} exports.Design = Design; //# sourceMappingURL=Design.js.map } // default/src/components/Content/Project/Conjugation_model/Model.jsx $fsx.f[102] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class Model extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Conjugation Model References",
content: `
- <a href="" target="_blank" class="references">MANGLER ET LINK TIL DENNE KILDE</a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Conjugation Model"),
React.createElement("div", { className: "under-rubrik" }, "Kinetics of Plasmid Transfer by Conjugation"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, " One of the primary objectives of our project is to efficiently deliver and establish the presence of the CRISPR/Cas9 plasmid in the microbiome, thus silencing the expression of resistance genes. However, actual testing of plasmid transfer in the microbiome of an individual provides several major challenges, and is beyond the scope of our project. "),
React.createElement("p", null, "Instead, we decided to build a model based on the kinetics of plasmid transfer by conjugation in a bacterial mixture that, to an extent, resembles the conditions of the human microbiome. Such a model provides valuable information of the expected treatment time required to sensitize a sufficient proportion of the colonizing gut bacteria, before the patient can be treated with common antibiotics. "),
React.createElement("p", null, "Furthermore, our model can potentially be used to predict the dosage of donor bacteria that should be administered in order to achieve a sufficient distribution of the CRISPR/(d)Cas9 plasmid within a limited timeframe."))),
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Conjugtion Model"),
React.createElement("h3", null, "Introduction"),
React.createElement("p", null, "One of the primary objectives of our project is to efficiently deliver and establish the presence of the CRISPR/Cas9 plasmid in the microbiome, thus silencing the expression of resistance genes. However, actual testing of plasmid transfer in the microbiome of an individual provides several major challenges, and is beyond the scope of our project. "),
React.createElement("p", null, "Instead, we decided to build a model based on the kinetics of plasmid transfer by conjugation in a bacterial mixture that, to an extent, resembles the conditions of the human microbiome. Such a model provides valuable information of the expected treatment time required to sensitize a sufficient proportion of the colonizing gut bacteria, before the patient can be treated with common antibiotics. "),
React.createElement("p", null, "Furthermore, our model can potentially be used to predict the dosage of donor bacteria that should be administered in order to achieve a sufficient distribution of the CRISPR/Cas9 plasmid within a limited timeframe."),
React.createElement("h3", null, "The system"),
React.createElement("p", null, "Our model is based on a paper by Levin & Rice (1980) describing the kinetics of transfer of conjugative and non-conjugative plasmids (1). The model is constructed as a series of partial differential equations, tracking the development of distinct bacterial populations based on the law of mass action. "),
React.createElement("p", null, "The five populations in our model include:"),
React.createElement("ul", null,
React.createElement("li", null, "R: Recipients only containing a resistance-conferring plasmid to distinguish them from donor cells (R)"),
React.createElement("li", null, "CN: Donors with both the conjugative and the oriT-compatible non-conjugative plasmids."),
React.createElement("li", null, "TC: Transconjugants having received only the conjugative plasmid"),
React.createElement("li", null, "TN: Transconjugants having received only the non-conjugative plasmid."),
React.createElement("li", null, "TCN: Transconjugants having received both the conjugative and the non-conjugative plasmid.")),
React.createElement("p", null, "The progress of the three types of transconjugants is probabilistic and determined by the proportion of all successful matings resulting in the transfer of either only the conjugative plasmid (C), only the non-conjugative plasmid (N), or both plasmids (CN). Of the transconjugants, only TN\u2019s still function as recipients for the conjugative plasmid, thus forming TCN\u2019s, whereas both TCN\u2019s and TC's are unable to function as recipients for future matings, but function as donors. Finally, governs the plasmid transfer rate constant (mL/cell*hr). A graphical illustration of the system is shown in the figure below. "),
React.createElement("p", { className: "text-red-600" }, "MATEMATISKE UDTRYK KAN IKKE INDS\u00C6TTES i ovenst\u00E5ende stykke eller nedst\u00E5ende stykker"),
React.createElement("p", { className: "text-red-600" }, "FIGUR MANGLER"),
React.createElement("p", null, "In order to simplify our modeling system, we made the following assumptions, some of which also are mentioned in the paper by Levin & Rice. Hold onto your hats\u2026"),
React.createElement("h3", null, "Assumptions"),
React.createElement("ol", null,
React.createElement("li", null, "All bacteria are at a sufficiently high density such that proliferation can be neglected."),
React.createElement("li", null, "Plasmid loss by segregation occurs at such a minimal rate due to selective pressure against plasmid loss that it is neglected."),
React.createElement("li", null, "Conjugation occurs randomly at a frequency proportional to the concentrations of cells containing the conjugative plasmid and the recipients (law of mass action).The rate of plasmid transfer is the same for all matings."),
React.createElement("li", null, "The rate of plasmid transfer is the same for all matings."),
React.createElement("li", null, "Cells carrying the conjugative plasmid cannot serve as recipients for either plasmid."),
React.createElement("li", null, "A constant proportion of all successful matings between CN\u2019s or TCN\u2019s and R\u2019s results in transfer of only the conjugative plasmid (C), and a constant proportion results in transfer of only the non-conjugative plasmid (N), and a constant proportion results in transfer of both plasmids (CN), and the sum of all these equal 1 (C+N+CN=1)."),
React.createElement("li", null, "A constant proportion of successful matings between CN\u2019s or TCN\u2019s and TN\u2019s results in transfer of the mobilizing plasmid (C+CN)."),
React.createElement("li", null, "The transfer of the plasmids and the transition from recipient cells to new donor cells are instantaneous processes."),
React.createElement("li", null, "The plasmid transfer rate constant is the same across the entire period.")),
React.createElement("p", null, "With these assumptions, we now express the following partial differential equations for each of the bacterial populations. CN\u2019s are not included in the equations, as these do not change over time."),
React.createElement("p", { className: "text-red-600" }, "inds\u00E6t ligninger n\u00E5r de er klar"),
React.createElement("p", null, "As the bacterial number is assumed to not change over time, the rate constant of plasmid transfer can simply be estimated by the change in total transconjugants, dT, (TN + TC - TCN) divided by the product of the average number of CN and R."),
React.createElement("p", { className: "text-red-600" }, "inds\u00E6t formel her"),
React.createElement("h3", null, "Results"),
React.createElement("p", null, "All of the parameters in equations (1)-(4) have been estimated based on the results of conjugation experiments with interrupted mating at different timepoints. The acquired values are listed in the table below."),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t tabel og tabel tekst n\u00E5r den er klar"),
React.createElement("p", null, "The model prediction is illustrated in the graph below, showing the change in cell concentration (cells/mL) over time (hours) for the R, TC, TN and TCN populations. As expected, the concentration of R decreases over time as these transform into the different transconjugants. The TN\u2019s experience an initial increase in concentration while the concentration of R remains high, followed by a decrease, as the number of R\u2019s able to turn into TN\u2019s diminish and the concentration of TN\u2019s functioning as recipients for the conjugative plasmid increases. Both TC and TCN experience an initial rapid increase in concentration followed by a fading of the curve as the concentration of R is decreased."),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t graf n\u00E5r den er klar"),
React.createElement("p", null, "One major observation from this model is the vast proportion of TC's formed. These are unable to function as recipients for the non-conjugative plasmid. With the aim of the project in mind, this proves as a major hurdle, as the non-conjugative plasmid supposedly contains our CRISPR/(d)Cas9-system to sensitize recipient bacteria in the gut. "),
React.createElement("p", null, "This means that a significant proportion of the recipient bacteria will never receive the CRISPR/(d)Cas9-system and thereby not become sensitive to antibiotics. Another important observation is the time required to reach a plateau in the concentration of transconjugants, approaching more than 300 hours in our model, corresponding to almost 13 days. This might pose as a potential issue if this treatment is to be used in patients that are already infected."),
React.createElement("h3", null, "System #2"),
React.createElement("p", null, "A solution to these problems could be to construct a system in which the expressions of the genes of the conjugative plasmids requires the presence of the non-conjugative plasmid in the same cell. Such a system would allow for TC's to continuously function as recipients for the non-conjugative plasmid, thus transforming into TCN\u2019s. As a consequence, this eliminates the ability of TC's to function as donors of the conjugative plasmid, providing one potentially limiting factor of this model. A graphical overview of the modified system is illustrated below."),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t figur her"),
React.createElement("p", null, "The system can now be described by a modified set of partial differential equations, accounting for the aforementioned alterations."),
React.createElement("p", { className: "text-red-600" }, "inds\u00E6t lignigner her"),
React.createElement("p", null, "We expect the modified system to show similar outcomes in terms of plasmid transfer rate and probabilistics as the original system, hence, the same parameters as listed in table x are used for modelling of the modified system. "),
React.createElement("p", null, "What is immediately apparent from the model prediction graph below is the vast change in the distribution of the TCN\u2019s and TC's compared to the previous model. The TC\u2019s seem to follow a trajectory similar to the TN\u2019s, which is expected, as the concentration of these cells will now be reflected by both the change in recipient concentration and the concentration of TC's that now function as recipients. "),
React.createElement("p", null, "As both TC's and TN\u2019s unavoidably will get exposed to conjugative mating and end up receiving both plasmids, the concentration of TCN\u2019s increases continuously, reaching a plateau at the level of the initial concentration of recipient cells."),
React.createElement("p", { className: "text-red-600" }, " inds\u00E6t figur her"),
React.createElement("p", null, "As such, the modified model seems to prove our proposed system as an effective solution to one of the major hurdles of the original system, being an inefficient delivery of the non-conjugative plasmid to the recipient bacteria. "),
React.createElement("p", null, "The modified model predicts that eventually all recipient bacteria will end up containing both the non-conjugative CRISPR/(d)Cas9 plasmid along with the conjugative plasmid. In the context of therapeutics, the theoretical outcome of such a system is the sensitizing of all recipient gut bacteria to common antibiotics. "),
React.createElement("p", null, "However, the potential issue of the time required to reach a plateau in TCN-concentration remains apparent from the modified system. Again, as the time required for an effective propagation of both plasmids surpasses 300 hours, this might prove as a limiting factor in treating patients that are already ill from an infection."),
React.createElement("h3", null, "System #3"),
React.createElement("p", null, "We proposed that it might be more efficient to combine the CRISPR/(d)Cas9-system with the conjugative plasmid, thus only requiring the conjugative transfer of a single plasmid containing both systems rather than relying on the transfer of two separate plasmids. "),
React.createElement("p", null, "Naturally, we decided to model such a system to see if our hypothesis holds true. We based the new model on the same principles of mass action as the previous models, proving a much simpler system when dealing with the transfer of only a single plasmid. "),
React.createElement("p", null, "The system still consists of R\u2019s, CN\u2019s as well as a single population of transconjugants, which we will still denote as TCN\u2019s. A graphical overview of the modified system is shown below."),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t figur"),
React.createElement("p", null, "As only a single transconjugant population is formed from conjugative mating between R\u2019s and CN\u2019s, this system does not deal with the probabilistics as the previous systems, as all successful matings will result in the transfer of the plasmid containing both the CRISPR/(d)Cas9-system and mobilizing conjugative factors. "),
React.createElement("p", null, "Based on these assumptions we now propose the following set of partial differential equations to describe our modified system:"),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t ligninger"),
React.createElement("p", null, "As we suspect the plasmid transfer rate constant () to be somewhat different when dealing with the conjugative transfer of only a single plasmid, we based this value on another conjugation experiment using only a single conjugative plasmid. The conjugative plasmid only contained mobilizing conjugative factors, based on the assumption that the lack of the CRISPR/(d)Cas9-system does not significantly alter the transfer rate of the plasmid. Based on these experiments we acquired the parameter values listed in table x below."),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t tabel"),
React.createElement("p", null, "The predicted development of the two distinct bacterial populations is shown in the graph below. From the graph we see a symmetrical relationship between the two populations, in which the concentration of TCN\u2019s increases directly proportional to the decrease in R\u2019s. This is also to be expected by simply observing the differential equation expressions above, as the expressions of the two populations are directly opposite. "),
React.createElement("p", { className: "text-red-600" }, "Inds\u00E6t graf"),
React.createElement("p", null, "The immediate benefit of using conjugative delivery of only a single plasmid is that all recipient bacteria eventually receive the plasmid by conjugation, which is also the case in this system as seen in the model prediction graph. "),
React.createElement("p", null, "Hence, besides overcoming the initial major hurdle of the original system (inefficient delivery of the CRISPR/Cas9 system), this model also seem to improve the predicted time of delivery. "),
React.createElement("p", null,
"The model predicts that almost all recipient bacteria will receive the conjugative plasmid within 200 hours, which is a significant improvement compared to the two previous systems. Although 200 hours still seems like a long time (approx. 8 days) in a therapeutic perspective, we believe other measures can be taken to further increase the efficiency of the conjugative delivery of the CRISPR/(d)Cas9-system to the gut bacteria ",
React.createElement("span", { className: "text-red-600" }, "[m\u00E5ske reference]."),
" "),
React.createElement("p", null, "Nonetheless, our modified model seems to confirm our proposed solution of combining the entire system, containing both the CRISPR/(d)Cas9-system and conjugative genes, on a single plasmid as a valid option for improving our system and project. "),
React.createElement("p", null, "Unfortunately, due to incompatibility between the conjugative plasmids and the iGEM BioBrick standards, we were unable to combine our system onto a single plasmid and are thereby prevented from confirming the model. Therefore, we highly encourage the iGEM committee to integrate conjugative plasmids into the parts catalog for the benefit of future iGEM teams. We believe that an increased availability of conjugative plasmids will expand the available options of gene transfer, and encourage future teams to who wish to utilize conjugation as a method of delivery."),
React.createElement("p", null, "To learn more about our specific laboratory procedures and the parts we have used in our project, click next.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Model = Model; //# sourceMappingURL=Model.js.map } // default/src/components/Content/Lab_Process_And_Parts/Protocols/Protocols.jsx $fsx.f[104] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); class Protocols extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(103);
});
}
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "Protocols and SOPs",
itemTitleColor: "text-blue-800",
items: [
{
title: "SOPs",
content: `
<img src="
"> </img>
<a href="https://static.igem.org/mediawiki/2019/3/3f/T--SDU-Denmark--SOP1-LA-plates-with-antibiotic.pdf" target="_blank">SOP01 - LA plates with antibiotic</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/a/a6/T--SDU-Denmark--SOP2.pdf" target="_blank">SOP 02 - ON Culture of E.coli</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/5/57/T--SDU-Denmark--SOP3.pdf" target="_blank">SOP 03 - Gel Purification</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/7/7a/T--SDU-Denmark--SOP4.pdf" target="_blank">SOP 04 - Colony PCR with MyTaq</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/1/12/T--SDU-Denmark--SOP5.pdf" target="_blank">SOP 05 - Plasmid Miniprep</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/f/f1/T--SDU-Denmark--SOP6.pdf" target="_blank">SOP 06 - TSB Transformation</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/3/35/T--SDU-Denmark--SOP7.pdf" target="_blank">SOP 07 - Fast Digest</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/c/c0/T--SDU-Denmark--SOP8.pdf" target="_blank">SOP 08 - Conjugation Experiment</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/3/38/T--SDU-Denmark--SOP9.pdf" target="_blank">SOP 09 - Ligation</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/f/fa/T--SDU-Denmark--SOP10.pdf" target="_blank">SOP 10 - Phusion PCR</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/b/b2/T--SDU-Denmark--SOP11.pdf" target="_blank">SOP 11 - Bacterial Freezing Stock</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/8/8a/T--SDU-Denmark--SOP12.pdf" target="_blank">SOP 12 - Making LB and LA Media</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/5/52/T--SDU-Denmark--SOP13.pdf" target="_blank">SOP 13 - Agarose Gel DNA</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/8/83/T--SDU-Denmark--SOP14.pdf" target="_blank">SOP 14 - Table Autoclave</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/3/36/T--SDU-Denmark--SOP15.pdf" target="_blank">SOP 15 - Preparing Primers</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/6/68/T--SDU-Denmark--SOP16.pdf" target="_blank">SOP 16 - Conjugation Time Experiment</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/f/f8/T--SDU-Denmark--SOP18.pdf" target="_blank">SOP 18 - Speedy Vac</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/3/3a/T--SDU-Denmark--SOP19.pdf" target="_blank">SOP 19 - Preparing Eurofins Sequencing Samples</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/d/df/T--SDU-Denmark--SOP20.pdf" target="_blank">SOP 20 - Antibiotic Stock Production</a>
<img src=""> </img>
<a href="https://static.igem.org/mediawiki/2019/1/1d/T--SDU-Denmark--SOP24.pdf" target="_blank">SOP 24 - Plasmid Miniprep Without Kit</a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { id: "protocols", className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Protocols"),
React.createElement("div", { className: "under-rubrik" }, "Tekst mangler"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Tekst mangler"))),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Protocols = Protocols; //# sourceMappingURL=Protocols.js.map } // default/src/components/Content/Lab_Process_And_Parts/Safety/Safety.jsx $fsx.f[105] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); class Safety extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Safety References",
content: `
- <a href="https://apps.who.int/iris/bitstream/handle/10665/312266/9789241515528-eng.pdf?ua=1" target="_blank" class="references">Critically important antimicrobials for human medicine, 6th revision. Geneva: World Health Organization; 2019. Licence: CC BY-NC-SA 3.0 IGO</a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/25380207" target="_blank" class="references">Różańska, D. et al. (2014). The role of Escherichia coli strain Nissle 1917 in the gastro-intestinal diseases. Postepy Hig Med Dosw, 68, 1251-1256. </a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "figure_container" },
React.createElement("img", { src: "" })),
React.createElement("div", { className: "rubrik" }, "Safety"),
React.createElement("div", { className: "under-rubrik" }, "In the laboratory"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Working in the laboratory every day is a lot of fun if done safely! Keep reading to learn how we addressed safety issues in our project."))),
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Safety in the Laboratory"),
React.createElement("p", null, "Working in the laboratory every day is a lot of fun if done safely! Keep reading to learn how we addressed safety issues in our project."),
React.createElement("h3", null, "General lab safety"),
React.createElement("p", null, "Even though all of our work was performed in a biosafety class 1 laboratory, we received safety training regarding work with GMO\u2019s, general lab safety and security procedures prior to beginning the work in the laboratory."),
React.createElement("p", null, "Laboratory technician Simon Rose held a course covering the basic safety rules concerning the aforementioned subjects as well as waste management. In addition to the course we received written safety guides and video materials about specific higher-risk procedures."),
React.createElement("p", null, "Lab coats were worn while in the laboratory, and harmful substances were handled wearing appropriate gloves in a fume hood. This was especially relevant when working with phenol and chloroform for DNA- and RNA-purification. "),
React.createElement("p", null, "When working with DNA on a UV table, additional safety equipment such as a facial screen was used to minimize UV exposure. "),
React.createElement("p", null, "Our laboratory is equipped with several types of emergency equipment, including multiple eye wash stations, water showers, and fire blankets to ensure an appropriate safety level. "),
React.createElement("p", null, "If questions regarding lab safety arose during the project, we could always get assistance and support from a laboratory technician. "),
React.createElement("h3", null, "Safety regarding our project design"),
React.createElement("p", null, "Treatment of patients using our solution could potentially include ingestion of our donor bacterium, whereafter the bacteria could be able to spread the CRISPR/(d)Cas9-system to other bacteria in the intestine by conjugation."),
React.createElement("p", null, "During our project, we worked on initial proof-of-concept experiments (targeting rfp and gpf) using a non-pathogenic chassis instead of performing the experiments on isolates directly from the University Hospital of Odense. This optimized the safety throughout our project. "),
React.createElement("p", null, "We designed and assembled a conjugative CRISPR/(d)Cas9-system which was inserted into our chassis (E. coli K12 TOP10 and KG22) with the RP4-8 conjugative plasmid. "),
React.createElement("p", null, "Instead of targeting critically important antibiotic resistance genes, our CRISPR/(d)Cas9-system was designed to repress the expression of the fluorescent proteins RFP and GFP as well as the gene encoding cml resistance. Since cml is commonly used in the laboratory as a selective factor, no considerable risk is associated with testing our system on it. "),
React.createElement("p", null, "The recipient bacteria was designed to imitate an OXA-48 carrying E. coli. However, since actual OXA-48 carbapenem producing Enterobacteriaceae are resistant to carbapenem, which is on the WHO's list of critically important antibiotics (1), it would not be responsible to work with that specific resistance through our laboratory work."),
React.createElement("h3", null, "Safety considerations regarding the potential future of our system"),
React.createElement("p", null, "Come risks about our fully developed product was considered. Questions like implementation of a kill switch and environmental risks associated with therapeutics have to be taken into account. "),
React.createElement("p", null,
"The treatment should be assisted by doctors to prevent excessive use, which could promote selective pressure of the target bacteria and thereby have the same outcome as the challenge we are facing today. A heat sensitive kill switch like the ",
React.createElement("a", { href: "https://2017.igem.org/Team:Michigan", target: "_blank" }, " iGEM team from Michigan made in 2017 "),
" (BBa_K2301000 - BBa_K2301003) could be implemented to our system, thereby reducing the environmental risks, since the bacteria would be killed at temperatures below 37 degrees. "),
React.createElement("p", null, "Another thing to note is the possibility for our donor bacterium to affect the human microbiome. To minimize this risk the design of the sgRNA sequence has to be done carefully. To prevent disease caused by the donor bacterium, a probiotic bacterium such as E. coli Nissle could be considered as a new chassis, since this would be safer for the patients and the microbiome would be affected to a lesser extent (2). "),
React.createElement("p", null,
"These reflections concerning safety of the final product are particularly important if we choose to continue working on our project, or if any ",
React.createElement("a", { href: "http://localhost:4444/Team:SDU-Denmark/simple/Future", target: "_blank" }, " future iGEM teams "),
" wishes to do so. Furthermore, it is highly relevant to consider the ethical issues related to our project. You can delve deeper into our considerations regarding bioethics in our ",
React.createElement("a", { href: "http://localhost:4444/Team:SDU-Denmark/simple/Human_Practices_Overview", target: "_blank" }, " Human Practices "),
" section")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.Safety = Safety; //# sourceMappingURL=Safety.js.map } // default/src/components/Content/Lab_Process_And_Parts/Notebook/Notebook.jsx $fsx.f[107] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class Notebook extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(106);
});
}
render() {
return (React.createElement(React.Fragment, null,
React.createElement("div", { id: "notebook", className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Notebook"),
React.createElement("div", { className: "under-rubrik" }, "Mangler tekst"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Mangler tekst."))),
React.createElement("div", { className: "row" },
React.createElement("h2", { className: "text-blue-800" }, "Introduction"),
React.createElement("p", null, "We see it as a necessary approach to enlighten students in high schools about antibiotic resistance, as they are the generation who will have to deal with the consequences of it. Thus, a great deal of effort has been applied to the Education and Public Engagement part of our project. We have hosted workshops for Danish high school students across the country in a multitude of ways, we have participated in The People's Democratic Festival in Denmark, we have hosted the Danish iGEM Weekend and we have participated in many other outreach events . However, something we pride ourselves in presenting is an open-source lesson plan consisting of educational material (an e-book), teaching manuals and laboratory protocols created solely by our team. This was developed for and tested by Danish high school students majoring in biotechnology as well as their teachers.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Notebook = Notebook; //# sourceMappingURL=Notebook.js.map } // default/src/components/Content/Human_Practices/IHP/IHP.jsx $fsx.f[108] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class IHP extends React.Component {
render() {
return (React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Integrated Human Practices"),
React.createElement("p", { className: "intro_quote" },
"\u201CHear one side and you will be in the dark. Hear both and all will be clear.\u201D ",
React.createElement("span", null, " - Thomas C. Haliburton")),
React.createElement("p", null, "One might have come up with a novel idea and begin pursuing it - but without input from relevant outside parties, this idea will never achieve greatness. We are confident that the creation of innovative solutions requires a two-way debate with people potentially implementing these solutions. This way, we can ensure that our proposed idea will take into account and implement anything relevant that these people might have to say. Keep reading to learn more about how we have integrated society during the creation of Conjugaid."),
React.createElement("h3", null, "Associate professor Ulrik S. Justesen"),
React.createElement("p", null, "There is no doubt that antibiotic resistance is a major concern for everyone on this Earth. Simple infections, that may still be curable today, quickly evolve into lethal infections that are challenging, if not impossible, to cure (2)."),
React.createElement("p", null, "The extent of the issue is immense, and after deciding to sensitize bacteria to antibiotics using CRISPR, it was difficult for our team to pinpoint where exactly to begin. Which resistance genes should we focus on, and which bacteria would be suitable chassis? To help us answer these questions, we reached out to Ulrik Stenz Justesen, Associate Professor and consultant at the Department of Clinical Microbiology at Odense University Hospital. "),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", className: "", src: "
" })),
React.createElement("p", null, "We began our meeting with professor Justesen by presenting to him our initial project idea; using the CRISPR/Cas-technology to sensitize bacteria to antibiotics. We had thought of working with urinary tract infections or MRSA (methicillin resistant Staphylococcus aureus). However, after presenting our initial project idea to professor Justesen, he stated the following points as critical:"),
React.createElement("ol", null,
React.createElement("li", null, "OXA48- and OXA48-like carbepenemase producing Enterobacteriaceae are becoming a critical burden for the University Hospital of Odense."),
React.createElement("li", null, "E. coli is a common carrier of OXA-48 (3). "),
React.createElement("li", null, "The target of a potential drug is the human intestine, home to a dense concentration of E. coli (4).")),
React.createElement("p", null, "All these points helped shape our project and based on them, we made the following considerations and decisions about what we should be working towards with Conjugaid: "),
React.createElement("ol", null,
React.createElement("li", null,
"We would aim at targeting OXA-48 resistance. ",
React.createElement("br", null),
"At the time of our first conversation with professor Justesen, we had never heard about OXA-48, but we soon learned that it is a specific resistance often found in pathogenic strains of E. coli and in other strains of Enterobacteriaceae. OXA-48 is a carbapenemase enzyme, capable of cleaving antibiotics of the carbapenem family. Carbapenem-antibiotics are commonly used and on WHO\u2019s list of critically important antibiotics (5). If bacteria develop the ability to produce OXA-48 carbapenemases, they become resistant to carbapenem-antibiotics. Due to safety concerns, we were not able to work with actual OXA-48 carrying bacteria. However, our acceptor bacteria was designed to mimic it in the best way possible. Since OXA-48 is located on low-copy number plasmid (6, 7), our target genes (rfp, gfp and cml resistance) were accordingly expressed on such plasmids. "),
React.createElement("li", null,
"We would use E. coli as a chassis. ",
React.createElement("br", null),
" We learned from professor Justesen that OXA-48 is prevalent in E. coli (3) Thus, it made sense to continue to work with E. coli as the chassis in our conjugation experiments."),
React.createElement("li", null,
"Our experiments should be designed with the environment of the human gastrointestinal tract in mind. ",
React.createElement("br", null),
" Since the gastrointestinal tract is a natural environment of E. coli and the place where the spread of OXA-48 occurs, we decided to design our experiments so that they mimic the human intestines in the best way possible. This was achieved by performing the conjugation experiments in solution with a high density of bacteria.")),
React.createElement("p", null, "In addition to contributing to our overall project design, professor Justesen also made us consider the potential aspects of our project regarding distribution to patients."),
React.createElement("p", null, "At first, our idea was that every person, carriers of resistant bacteria or not, could take supplements consisting of our donor bacteria, thus ensuring the efficiency of antibiotic treatment when needed."),
React.createElement("p", null, "Professor Justesen, however, pointed out that such a solution is not necessary. Instead, a preventive treatment aimed only at healthy carriers of OXA-48 carnapenemase producing bacteria was needed to a greater extent. As such, our solution could be provided to patients after successful treatment of a bacterial infection, thus eliminating their carrier state (OXA-48 producing bacteria are often present even after successful treatment). This can prevent unnecessary hospitalization in isolation, otherwise required whenever a carrier of OXA-48 producing bacteria is hospitalized. "),
React.createElement("h3", null, "SNIPR Biome"),
React.createElement("p", null, "SNIPR Biome is a young Danish company. They utilize the CRISPR/Cas-technology to selectively kill pathogenic bacteria in the human intestine. "),
React.createElement("p", null, "Since our main goal with Conjugaid is very similar to that of SNIPR Biome - the eradication of specific antibiotic resistant bacteria in the human intestine - we reached out to them. In the beginning of September we visited their offices in Copenhagen and met with Eric van der Helm and Andreas Porse."),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", className: "", src: "
" })),
React.createElement("p", null, "After presenting our work to them and learning about theirs, we discussed some of the aspects of our project. We talked about the delivery of our CRISPR/Cas-system and about the promising aspects of conjugation as a mode of delivery. "),
React.createElement("p", null, "Until our meeting with SNIPR Biome we had primarily worked with dCas9, the catalytically inactive Cas9 endonuclease, which enables repression of the target gene. However, during our conversation with Eric and Andreas, they made a significant point convincing us that we should work on finishing the assembly of our system containing the catalytically active Cas9. "),
React.createElement("p", null, "Since Cas9 will knock down (and not only repress) the target gene, the elimination of resistant bacteria might be more efficient using this protein instead of dCas9. "),
React.createElement("p", null, "Furthermore, implementing Cas9 instead of dCas9 is a more durable solution, since the system in this case does not need to be expressed simultaneously in order to inhibit the expression of the antibiotic resistance gene. After eradication of the resistance genes by the action of a Cas9 system, treatment with the conjugative CRISPR/Cas system can be terminated. Thus, after returning from SNIPR Biome we put extra effort into finishing our assembly of our Cas9 containing plasmid."),
React.createElement("p", null, "Before our meeting with SNIPR Biome our team had several discussions about the selective pressure we could potentially induce by selectively killing resistant bacteria. "),
React.createElement("p", null, "We thought about the risk of the sequence targeted by our sgRNA mutating as a result of selective pressure on the bacteria which contains it. Mutations in the target DNA will most likely prevent the recognition of the DNA by the sgRNA, in turn preventing cleavage of the target gene by Cas9. "),
React.createElement("p", null,
"Regarding this issue, we Eric and Andreas from SNIPR Biome suggested the idea of implementing more sgRNA\u2019s, or a whole CRISPR/Cas array, into our system. In that way, we can potentially target different sequences in the target gene and lower the risk of the target gene not being recognized, even if mutations occur. Even though we did not have the time to incorporate these thoughts into our system, it is something that can be implemented for ",
React.createElement("a", null, " future work"),
"."),
React.createElement("p", null, "In general, our visit at SNIPR Biome provided us with increased knowledge about the CRISPR/Cas technology and specific feedback about the endonucleases involved, which helped shape our project. ")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation })));
}
} exports.IHP = IHP; //# sourceMappingURL=IHP.js.map } // default/src/components/Content/Future/Future.jsx $fsx.f[110] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const rodal_1 = $fsx.r(109); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class Future extends React.Component {
constructor(props) {
super(props);
this.state = { visibleEdu: false, visiblePizza: false };
}
show(tag) {
document.body.classList.add("rodal-open");
if (tag == "edu") {
this.setState({ visibleEdu: true });
}
else if (tag == "pizza") {
this.setState({ visiblePizza: true });
}
}
hide(tag) {
document.body.classList.remove("rodal-open");
if (tag == "edu") {
this.setState({ visibleEdu: false });
}
else if (tag == "pizza") {
this.setState({ visiblePizza: false });
}
}
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Project & Inspiration References",
content: `
- <a href="https://academic.oup.com/nar/article/47/W1/W171/5491735" target="_blank" class="references">Labun, K. et al. (2019). CHOPCHOP v3: expanding the CRISPR web toolbox beyond genome editing. Nucleid Acids Research, 47(W1), W171-W174.</a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/10890397" target="_blank" class="references">Zhang, Z. et al. (2000). A greedy algorithm for aligning DNA sequences. J Comput Biol, 7(1-2), 203-14.</a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/29450193" target="_blank" class="references">Pedersen, R. M. et al. (2018). A Method for Quantification of Epithelium Colonization Capacity by Pathogenic Bacteria. Front Cell Infect Microbiol, 8:16. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pubmed/25380207" target="_blank" class="references">Różańska, D. et al. (2014). The role of Escherichia coli strain Nissle 1917 in the gastro-intestinal diseases. Postepy Hig Med Dosw, 68, 1251-1256. </a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "What's Next for Conjugaid?", img: "" }),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "What's Next for Conjugaid"),
React.createElement("p", { className: "intro_quote" },
"\u201CThere is nothing like a dream to create the future.\u201D ",
React.createElement("span", null, "\u2015 Victor Hugo ")),
React.createElement("p", null, "With Conjugaid, our team dared to dream big, and after finishing our iGEM-project, these dreams have only grown bigger. Keep reading to discover some of the plans we have for Conjugaid in the near future."),
React.createElement("p", null, "Based on the work our team has accomplished within public engagement and outreach, we have received several offers to develop our educational material and lesson plan further after the Giant Jamboree."),
React.createElement("p", null,
"After speaking at our ",
React.createElement("a", null, "symposium"),
" in September, chief physician at Statens Serum Institut (SSI) Ute Wolff S\u00F6nksen let us know of ",
React.createElement("a", null, "E-bug"),
". E-bug is an online educational hub about microbiology, hygiene, and antibiotics aimed at children and young people. It is based in England but is distributed throughout Europe in 22 different languages, and is partly funded by The Directorate-General for Health and Consumers (DG SANCO) of the European Commission. Ute encouraged us to reach out to E-bug in regards to our own ",
React.createElement("a", null, "educational material"),
". After doing so, E-bug offered to distribute \u201CWhat\u2019s up with antibiotics?\u201D on their Danish and international sites. "),
React.createElement("p", null, "This is an amazing opportunity to accomplish one of Conjugaid\u2019s biggest goals; increasing public awareness about antibiotic resistance. After attending the Giant Jamboree, we will prepare \u201CWhat\u2019s up with antibiotics?\u201D for international distribution by revising and enhancing it throughout."),
React.createElement("p", null,
"Furthermore, we have been contacted by Danish high school teachers requesting a similar course to the one we arranged with Odense Katedralskole when testing our educational material for the first time. Thus, we will be working closely with a technical high school in Fredericia when this years\u2019 iGEM Competition is over, in order to provide them with a fun and informative few weeks of antibiotic-education. When doing this we will be implementing the ",
React.createElement("a", null, "3D-printable microscope-attachment mentioned earlier"),
". We cannot wait!"),
React.createElement("p", null, "Our dream is that Conjugaid and \u201CWhat\u2019s up with antibiotics?\u201D can help shape the scientists and world heroes of tomorrow."),
React.createElement("p", null, "Keep reading for suggestions as to how future iGEM teams can take our project further.")),
React.createElement("div", { className: "row" },
React.createElement("h2", null, "To Future iGEM Teams"),
React.createElement("p", { className: "intro_quote" },
"\"Even if I knew that tomorrow the world would go to pieces, I would still plant my apple tree.\" ",
React.createElement("span", null, "- Martin Luther King")),
React.createElement("p", null, "Hello future iGEM team! Are you ready to begin your iGEM journey? You are going to have an absolutely amazing time and you will learn so much. "),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", className: "", src: "" })),
React.createElement("p", null, "The world is facing many problems in desperate need of solutions. Our team has set out to help solve just one of them. With Conjugaid, we have planted a seed in the hopes of it growing into a beautiful, fruit-bearing tree. But we cannot do this alone - we need the help of others to get there in time."),
React.createElement("p", null, "In this section you will find some ideas for further development of our project, Conjugaid, and tips and tricks for creating great educational material. We will also be giving you a super-secret tip which totally saved our team when the days got a little rough."),
React.createElement("h3", null, "Project Design"),
React.createElement("p", null, "One thing we are sure of when it comes to working in the laboratory is that you can always do more. If your team has been inspired by Conjugaid and you want to improve it, here are some suggestions as to how you could do that."),
React.createElement("div", { className: "img_container" },
React.createElement("img", { id: "", className: "", src: "
" })),
React.createElement("h4", null, "OXA-48 producing Enterobacteriaceae and sgRNA array"),
React.createElement("p", null, "We would have liked to work more on testing our CRISPR/Cas system in actual OXA-48 carbapenemase producing Enterobacteriaceae. Repressing resistance genes in these bacteria may improve and further support our proof-of-concept. "),
React.createElement("p", null, "For this purpose we have made alignments of different OXA-48-like carbapenems. Consensus sequences from the OXA-48-like carbapenem resistance genes were also identified, thus enabling us to create a hypothetical sgRNA which can be incorporated into our plasmid containing the dCas9 gene."),
React.createElement("p", { className: "text-red-600" }, "(Billede af plasmid med sgRNA som targer OXA-48-like gener)"),
React.createElement("p", null, "The final sgRNA sequence made to target a consistent sequence common for a lot of OXA-48-like carbapenem resistance genes have been aligned. The sgRNA sequence was designed by using the web tool CHOPCHOP (1)."),
React.createElement("p", null, "5\u2019-GAATATGGATATGCCCACAT-3\u2019"),
React.createElement("p", null, "We found several consistent areas amongst the OXA-48 gene sequences. This means it is possible to incorporate a sgRNA array into our system in the future, thus targeting different areas of the gene instead of one. "),
React.createElement("p", null, "Creating an sgRNA arraw lowers the risk of OXA-48 not being recognized - even if mutations in the gene occur. Thus, the final drug would be more efficient in downregulating OXA-48 resistance genes, resulting in fewer carriers of this resistance."),
React.createElement("p", null, "Furthermore, it was investigated whether the final sgRNA sequence was to be found in the core genome of common Enterobacteriaceae in the human intestine in order to minimize interaction with off-target sequences (2). "),
React.createElement("h4", null, "Integration of our system in a conjugative plasmid"),
React.createElement("p", null,
"Being able to assemble our designed CRISPR/dCas9 system in a conjugative plasmid could also adds another advantage to our project, based on our ",
React.createElement("a", null, "modeling"),
" results. Integrating our designed CRISPR/(d)Cas-system into the conjugative plasmid will increase the number of transconjugants leading to a higher success-rate regarding the propagation of the plasmid in a bacterial community. "),
React.createElement("h4", null, "Work with flow cells"),
React.createElement("p", null, "Insight into the required dosage of bacteria that should be given to a patient carrying OXA-48-like carbepenemases producing Enterobacteriaceae can roughly be estimated by mimicking the gastrointestinal environment using flow cells (3). "),
React.createElement("p", null, "Intestinal epithelial cells have to be grown to a confluent monolayer followed by the addition of a flow of an intestine-like medium in the flow chamber. OXA-48-like carbepenemases producing Eenterobacteriaceae can then be seeded onto the artificial intestine followed by inoculation of donor bacteria. "),
React.createElement("p", null, "The action of the CRISPR/dCas9-system will take place whereupon the intestine is exposed to a treatment with an antibiotic within the carbapenem family. Comparing the remaining bacteria to a control experiment will then give a rough estimate on how many OXA-48-like carbepenemases producing Eenterobacteriaceae that have been affected by the CRISPR/(d)Cas9-system. Such an experiment could add another opportunity to study of conjugation efficiency of a drug candidate like ours in a more in vivo-like environment. "),
React.createElement("h4", null, "E. coli Nissle"),
React.createElement("p", null, "When ingesting a bacterium it is imperative that it does not colonize the intestine and cause diseases. To avoid this, a non-pathogenic and probiotic bacterium such as E. coli Nissle could be used as a new donor bacterium of the system (4)."),
React.createElement("h4", null, "Implementation of a kill-switch"),
React.createElement("p", null,
"A heat sensitive kill switch like the one used by the ",
React.createElement("a", null, " iGEM team from Michigan made in 2017 "),
" (BBa_K2301000 - BBa_K2301003) could be implemented in our system, thus reducing any possible environmental risks, since the donor bacteria would be killed at temperatures below 37 degrees. "),
React.createElement("h3", null, "A recipe for a great educational material:"),
React.createElement("p", null, "If your team wants to create educational material as a part of your iGEM project, look no further! We have created, tried and tested a 10-step recipe that should help you get started."),
React.createElement("button", { className: "text-blue-600", onClick: this.show.bind(this, "edu") }, "10 steps to creating great educational material"),
React.createElement(rodal_1.default, { closeOnEsc: true, customStyles: {
width: "80vw",
height: "80vh"
}, visible: this.state.visibleEdu, onClose: this.hide.bind(this, "edu") },
React.createElement("div", { className: "rodal-box" },
React.createElement("div", { className: "border-solid border-gray-700 border-b " },
React.createElement("h3", null, "10 steps to creating great educational material")),
React.createElement("ol", null,
React.createElement("li", null,
React.createElement("h5", null, "Find out your target group"),
React.createElement("p", null, "It\u2019s imperative when creating educational material to know who your students are. Teaching kids in elementary schools about microbes requires something completely different than teaching high schoolers does. ")),
React.createElement("li", null,
React.createElement("h5", null, "Talk to your target group (and their teachers)"),
React.createElement("p", null, "Before you can develop great materials, you need to know the wants and needs of the recipients of that material. What do they lack, and what do they already have in abundance? Your way forward is to fill out the gaps.")),
React.createElement("li", null,
React.createElement("h5", null, "Tell a story"),
React.createElement("p", null, "One important rule of thumb about education is that learning is eased through storytelling. We taught antibiotic resistance through the story of Peter - how will you tell yours?")),
React.createElement("li", null,
React.createElement("h5", null, "Plan out everything in detail"),
React.createElement("p", null, "Before you can start writing and designing your educational material, you need a solid plan. How many subjects do you wish to cover - and what should they be? What kind of illustrations do you need for each chapter? Sort everything into chapters and write down what they should contain when finished. You could be inspired by different teaching and learning models, like we did with the 5E Teaching Model.")),
React.createElement("li", null,
React.createElement("h5", null, "Write, write and rewrite..."),
React.createElement("p", null, "Start writing your materials! And when you think you\u2019re done, look at it again - is it really done? Great! Now get someone else to read and comment on it, and then rewrite the whole thing to perfection.")),
React.createElement("li", null,
React.createElement("h5", null, "Make it look stunning!"),
React.createElement("p", null, "This is where you start taking your educational material to the next level. Does someone on your team love drawing? Ask them to create the illustrations and get designing - the options are endless, so have fun with it!")),
React.createElement("li", null,
React.createElement("h5", null, "Finishing touches"),
React.createElement("p", null, "When your educational material is all done - written, illustrated and designed - forward it to a group of people and get their final comments on it. Make sure to implement these comments before testing your material.")),
React.createElement("li", null,
React.createElement("h5", null, " Survey before..."),
React.createElement("p", null, "Congratulations! You have now created your very own educational material - that\u2019s amazing. All that\u2019s left now is to test it out on your target group and find out how they like it. But before you can test your material and evaluate it, you need to survey your test group. That way, you can compare how your educational material has directly affected the people using it.")),
React.createElement("li", null,
React.createElement("h5", null, "Put it to the test"),
React.createElement("p", null, "Go on - do it! You have nothing to worry about, you\u2019ve worked so hard and put so much effort into it, we\u2019re sure your educational material will do amazingly with your test group.")),
React.createElement("li", null,
React.createElement("h5", null, "\u2026 And evaluate after!"),
React.createElement("p", null, "This is the last, but definitely not least important, step of this recipe. You\u2019ve created this amazing educational resource, and you want more people to notice and use it - right? In order for them to do so, they need to see results. Ask your test group any questions that might be relevant for you to properly evaluate how your educational material did in practice."))))),
React.createElement("h3", null, "A recipe for something else that\u2019s also great\u2026"),
React.createElement("p", null, "Perhaps you\u2019re a new iGEM-team, innocent and unaware of the fact that you will soon be busier than ever. Perhaps your team has been going strong for some months now, you\u2019re starting to feel the pressure and now you\u2019ve come to us for advice. No matter the situation, you\u2019ve come to the right place! This is a recipe for the pizza that will save your lives when times are tough."),
React.createElement("button", { className: "text-blue-600", onClick: this.show.bind(this, "pizza") }, "6 steps to creating the greatest pizza"),
React.createElement(rodal_1.default, { closeOnEsc: true, customStyles: {
width: "80vw",
height: "80vh"
}, visible: this.state.visiblePizza, onClose: this.hide.bind(this, "pizza") },
React.createElement("div", { className: "rodal-box" },
React.createElement("div", { className: "border-solid border-gray-700 border-b " },
React.createElement("h3", null, "6 steps to creating the greatest pizza ")),
React.createElement("p", null, "Pi(GEM)zza (12 people/3 pizzas):"),
React.createElement("p", null, "Prep-time: 30 minutes"),
React.createElement("p", null, "Cooking time: 15 minutes"),
React.createElement("p", null, "Measuring units: Metric (as scientists we like to use the proper system)"),
React.createElement("h5", null, " Measuring units "),
React.createElement("ul", null,
React.createElement("li", null, "3 x Store bought pizza dough (you think you have time to make your own while doing iGEM? Just you wait and see\u2026)"),
React.createElement("li", null, "3 x Garlic cream cheese spread"),
React.createElement("li", null, "450 g shredded cheddar cheese"),
React.createElement("li", null, "1,5 kg potatoes, washed and thinly sliced"),
React.createElement("li", null, "3 red onions, thinly sliced"),
React.createElement("li", null, "3 packets of pepperoni"),
React.createElement("li", null, "A few sprigs of fresh rosemary"),
React.createElement("li", null, "Sea salt"),
React.createElement("li", null, "A teaspoon team-spirit and iGEM excellence")),
React.createElement("h5", null, " Directions"),
React.createElement("ol", null,
React.createElement("li", null, "Roll out the pizza doughs and spread one container of garlic cream cheese on each pizza"),
React.createElement("li", null, "Sprinkle 150g shredded cheddar cheese on each pizza"),
React.createElement("li", null, "Distribute the potato slices on the pizzas, then the pepperoni and then the slices of red onion"),
React.createElement("li", null, "Add a few sprigs of fresh rosemary to each pizza and sprinkle with sea salt, team-spirit and iGEM excellence to taste"),
React.createElement("li", null, "Bake in a 200\u00B0C pre-heated oven for 12-15 minutes or until golden and crispy"),
React.createElement("li", null, "Serve to your eager and hungry iGEM-team and prepare for everyone to compliment you on your great cooking skills!"))))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.Future = Future; //# sourceMappingURL=Future.js.map } // default/src/components/Content/People_Involved/Team/Team.jsx $fsx.f[112] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); class Team extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(111);
});
}
render() {
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content", id: "team" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Team"),
React.createElement("div", { className: "under-rubrik" }, "The Drops of the Ocean"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Welcome to the Team and Supervisors page! Our team consists of 11 students from two different faculties and 4 different studies. Since beginning our iGEM-journey in December 2018, we have gotten to know each other and developed an unbreakable \u201CiGEM-bond\u201D as friends - we think you deserve to get to know us on a more personal level, too. "))),
React.createElement("div", { className: "row" },
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("img", { src: "
" })),
React.createElement("div", { className: "flex-item text-item" },
React.createElement("p", { className: "font-black text-lg" }, "Anne Sofie L\u00F8gstrup "),
React.createElement("p", null, "Study: Biomedicine"),
React.createElement("p", null, "E-mail: anhen17@student.sdu.dk"),
React.createElement("p", null, "Hi folks! I\u2019m Anne Sofie, and for the past 10 months I\u2019ve been working as a middleman between our donor- and acceptor-bacteria, forcing them to be friendly and talk to each other via conjugation. When not in the lab being a bacterial couples therapist, my biggest challenge has been learning sarcasm - I mean, what kind of mysterious language is that?! Luckily my teammates learned to use jazz hands when being sarcastic, which makes it WAY easier to translate what they\u2019re saying! ")))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Team = Team; //# sourceMappingURL=Team.js.map } // default/src/components/Content/People_Involved/Collaborations/Collaborations.jsx $fsx.f[113] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); class Collaborations extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-green-400",
title: "Collaboration",
itemTitleColor: "text-green-800",
items: [
{
title: "The Danish iGEM Weekend",
content: `
In recent years, Danish iGEM-teams have participated in both the BioBrick Tutorial at the Technical University of Denmark and the Nordic iGEM Conference (NiC). Both of these meetups are international and participating teams come from all over Scandinavia. After meeting the two other Danish teams (Ovulaid from Copenhagen and DTU Biobuilders from DTU) we wished to further strengthen the bond between the Danish iGEM-teams. This lead to us organizing Denmark’s very first, own iGEM-meetup; the Danish iGEM Weekend.
The meetup tackled subjects such as wiki-building and public presentation skills. Through workshops and talks hosted by both our own team members and external mediators, all teams received the proper foundation needed to start building and telling the story of their iGEM projects. We hope that Ovulaid and the DTU Biobuilders returned home after our meetup and felt prepared to begin creating their wiki- and Jamboree presentation-storylines.
Furthermore, we hope to have started a new tradition of hosting the Danish iGEM Weekend for future iGEM teams from SDU. The bond between the Danish iGEM teams has been strengthened, and our aim is to carry this strong bond into the future.
<img src="
"> </img>
<img src="
"> </img>
<img src="
"> </img>
<img src="
"> </img>
Thus, we also spent time at the Danish iGEM Weekend to formulate ideas for a future Danish iGEM Network. Such a network has many possible outcomes, one being the initiation of new Danish iGEM-teams, both at universities (The universities of Aarhus and Aalborg lack iGEM-teams) and at high schools. The work with initiating the Danish iGEM Network will continue after the Giant Jamboree in 2019, in order for it to hopefully be of assistance to the 2020 iGEM teams. It was also at the Danish iGEM Weekend where we arranged for our team to walk in the <a> Copenhagen Pride Parade </a> with Ovulaid.
`
},
{
title: "LGBTQ+ Visbillity",
content: `
During the Danish iGEM Weekend the idea came up for our team to participate in the Copenhagen Pride Parade with Ovulaid, the iGEM-team from University of Copenhagen. On a lovely afternoon in mid-August, our team walked with Ovulaid in the Pride Parade as part of the University of Copenhagen float. We did this to promote more diversity in science (#diversityofcopenhagen).
<img id="box-img" src="
"> </img>
To further solidify our opinion on LGBTQ+ visibility in science, and being inspired by the ChemistryWorld opinion <a href="https://www.chemistryworld.com/opinion/no-sexuality-please-were-scientists/7197.article" target="_blank">“No sexuality please, we’re scientists”</a> and the New York Times opinion <a href="https://www.nytimes.com/2015/09/05/opinion/manil-suri-why-is-science-so-straight.html" target="_blank">“Why is science so straight?”</a>, a team-member of ours wrote a <a>two-piece post </a> for the iGEM blog with Landon Getz from the iGEM Diversity Committee. This also builds upon the <a href="https://2015.igem.org/Team:Yale/practices#lgbtq" target="_blank"> LGBTQ Survey </a> done by Team Yale in 2015, which showed that more than half of the respondents wanted iGEM to improve the discussion on how identity impacts one’s scientific career. We hope this contribution will inspire future iGEM teams and supervisors to achieve more accepting, including and open environments.
`
},
{
title: "Attending Meetups",
content: `
DTU Biobuilders, BioBrick Tutorial, April 2019
From the 12th to the 14th of April 2019, we traveled to the Technical University of Denmark, where DTU Biobuilders are based, in order to participate in their 7th annual BioBrick Tutorial. Here, we learned the basics of how to work with iGEM BioBricks. This was also the first time we were introduced to other iGEM teams, and it was a pleasure to get to know the teams of DTU Biobuilders, Copenhagen, Stockholm, Chalmers, Uppsala, Oslo, Lund and Helsinki better.
<img src="
"> </img>
<img src="
"> </img>
iGEM Team Copenhagen, Nordic iGEM Conference, May 2019
From the 17th to the 19th of May 2019, we visited the University of Copenhagen and their iGEM team, Ovulaid. Here, we participated in this years’ Nordic iGEM Conference, an annual event consisting of workshops on multiple subjects (this year science communication and sustainability was on the programme, amongst other things). Besides having a great time with the other nordic iGEM teams, we left the Conference with the award for “Best Poster.”
<img src="
"> </img>
<img src="
"> </img>
`
},
{
title: "iGEM Team Amazonas Brazil",
content: `
In July 2019 we were contacted by the iGEM team of Amazonas (Brazil). They reached out to iGEM teams all over the world through a common chat (‘Sharing iGEM Ideas’). Here, they asked if anyone had assembled a plasmid containing dCas9, since they required it for their project. At that time we were hard at work trying to design and assemble it ourselves, so we reached out to them and let them know that we would contact them when we succeeded. A few weeks later we had designed, assembled and sequenced our plasmid containing dCas9, and could send it their way.
`
},
{
title: "DTU Biobuilders",
content: `
After discussing our individual teams’ processes at the Danish iGEM Weekend, the DTU Biobuilders contacted us for technical assistance. Since they ran out of pSB1K3 backbone, we sent some of our pSB1K3 part from the iGEM kit to the DTU Biobuilders so they could continue their work.
`
},
{
title: "iGEM Team Lund",
content: `
During the summer we began working on our modelling, and we stumbled upon some initial troubles. We remembered talking to a Arvid Larsson, modelling-extraordinaire from the 2019 iGEM team Lund, at both the BioBrick Tutorial and the Nordic iGEM Conference. After reaching out to him we had a discussion via Skype in which we talked all things modelling. Arvid provided us with valuable advice and support in designing our modeling system.
`
},
{
title: "iGEM Teams’ Tas_Taipei, Costa Rica & Tuebingen iGEMxSDGs Instagram Challenge",
content: `
For this years’ iGEM Competition, the teams of TAS_Taipei (Taiwan), Costa Rica and Tuebingen (Germany) collaborated to create the iGEMxSDG’s Instagram Challenge. This challenge took advantage of the fact that each iGEM team communicates continuously with their communities, and took this opportunity to promote the UN’s 17 SDG’s. The SDG’s can only be achieved if we work on them collaboratively on a global scale, and what better way to help facilitate this than by working on the SDG’s within iGEM.
To participate in the challenge each team had to select up to 4 SDG’s targeted by their project and post them on Instagram with a short description. The challenge was then spread throughout the iGEM community when each team challenges 4 other teams to participate. Our team naturally participated and posted the following 4 SDG’s, which we directly target in our project:
- Illustration af SDG 3 No. 3: Good health and well-being
- Illustration af SDG 4 No. 4: Quality education
- Illustration af SDG 12 No. 12: Responsible consumption and production
- Illustration af SDG 17 No. 17: Partnerships for the goals
<img src="
"></img>
<img src="
"> </img>
<img src="
"> </img>
<img src="
"> </img>
You can read more about our work with the SDG’s <a> here </a>.
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("div", { className: "rubrik" }, "Collaborations"),
React.createElement("div", { className: "under-rubrik" }, "What can\u2019t we do together?"),
React.createElement("div", { className: "manchet" },
React.createElement("p", { className: "" }, "Our team has worked together with iGEM-teams from all over the world throughout this year\u2019s competition - and it has been so much fun! Keep reading to learn what exactly we\u2019ve been up to..."))),
React.createElement("div", { className: "row" },
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData })),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Collaborations = Collaborations; //# sourceMappingURL=Collaborations.js.map } // default/src/components/Content/Project/ProjectOverview.jsx $fsx.f[120] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); const react_mathjax_1 = $fsx.r(119); const BulgeWidget_1 = $fsx.r(88); const tex = `f(x) = \\int_{-\\infty}^\\infty
\\hat f(\\xi)\\,e^{2 \\pi i \\xi x}
\\,d\\xi`;
class ProjectOverview extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "References",
itemTitleColor: "text-blue-800",
items: [
{
title: "Project & Results References",
content: `
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4888801/" target="_blank" class="references">Munita, J. M. and Arias, C. A. (2016). Mechanisms of Antibiotic Resistance. Microbiol. Spectr., 4(2), April. </a>
- <a href="https://www.researchgate.net/publication/298640728_Laboratory_Detection_and_Clinical_Implication_of_Oxacillinase-48_like_Carbapenemase_The_Hidden_Threat" target="_blank" class="references">Yamuna, D. et al. (2016). Laboratory Detection and Clinical Implication of Oxacillinase-48 like Carbapenemase: The Hidden Threat. J. of global infectious diseases, 8, 41-50. </a>
- <a href="https://www.msdmanuals.com/professional/infectious-diseases/gram-negative-bacilli/escherichia-coli-infections" target="_blank" class="references">Bush, L. M. and Perez, M. T. (2018). Escherichia coli Infections. MSD Manual. Accessed October 1 2019.</a>
- <a href="https://www.sciencedirect.com/science/article/pii/S0140673603136446?fbclid=IwAR3UwlyPW-_xdzJDY39shKuxE5ZkApXBIQUuZGz7A0--8vf7LhxjO2viFF4" target="_blank" class="references">Vincent, J. L. (2003). Nosocomial infections in adult intensive-care units. The Lancet, 361(9374), 2068-2077.</a>
- <a href="https://www.sciencedirect.com/science/article/pii/S1438422113000167?via%3Dihub&fbclid=IwAR2I23U_mj_zfHGtWmjZdpso8TvCpv2_KWxWvZayRSuHsNd4HoaD0Zxe2Cs" target="_blank" class="references">Carattoli, A. (2013). Plasmids and the spread of resistance. Int. J. of Med. Microbiology, 303(6-7), 298-304.</a>
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4378521" target="_blank" class="references">Ventola, C. L. (2015). The Antibiotic Resistance Crisis, Part 1: Causes and Threats. PT, 40(4), 277-283.</a>
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC5330996" target="_blank" class="references">Tran, K. et al. (2017). The Effect of Hospital Isolation Precautions on Patient Outcomes and Cost of Care: A Multi-Site, Retrospective, Propensity Score-Matched Cohort Study. J Gen Intern Med., 32(3), 262-268. </a>
- <a href="https://www.sciencedirect.com/science/article/pii/S1021949819300122" target="_blank" class="references">Ding, R-x. et al. (2019). Revisit gut microbiota and its impact on human health and disease. J of Food and Drug Analysis, 3, 623-631. </a>
- <a href="https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4343198" target="_blank" class="references">Hsu, P. D. et al. (2014). Development and Applications of CRISPR-Cas9 for Genome Engineering. Cell, 157(6), 1262-1278.</a>
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "Project & Results", img: "" }),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Project & Results (Overview)"),
React.createElement(react_mathjax_1.default.Provider, null,
React.createElement("div", null,
"This is an inline math formula: ",
React.createElement(react_mathjax_1.default.Node, { inline: true, formula: 'a = b' }),
"And a block one:",
React.createElement(react_mathjax_1.default.Node, { formula: tex }))),
React.createElement("p", null, "Before delving deeper into the details of our project design, we would like to explain to you some of the terms that makes its foundation. Firstly, what is antibiotic resistance, and what makes it so dangerous?"),
React.createElement("p", null, "The immune system in humans protects us against threats to our health. Likewise, bacteria have developed skills that allow them to defend themselves against external threats such as viral infections and antibiotics. "),
React.createElement("p", null, "When it comes to fighting antibiotics, bacteria collect an arsenal of different genes making them capable of resisting the particular antibiotic. These genes may encode enzymes which alter the structure of the antibiotic and thereby inhibits its action, or they may encode efflux pumps which directly pumps out the antibiotic before it reaches its target (1). "),
React.createElement("img", { src: "
" }),
React.createElement("p", null, "One specific type of resistance is called oxacillinase 48 (OXA-48). OXA-48 is a carbapenemase enzyme that cleaves the class of antibiotics called carbapenems. The OXA-48 gene is located on a highly transferable plasmid and is often found in pathogens of the Enterobacteriaceae (2). OXA-48 plasmids are commonly carried by E. coli, which are natural residents of the human gut microbiome. Furthermore, E. coli is an opportunistic pathogen, which can cause a range of diseases (3). "),
React.createElement("p", null, "OXA-48 carbapenemase producing bacteria are able to spread this type of resistance to bacteria in their vicinity, primarily through the natural horizontal gene transfer process of conjugation. Conjugation occurs to a great extent in the human intestine, due to the high density of bacteria found herein (4, 5), and it leads to an increase in the number of resistant bacteria in the patient, which complicates medical therapy (6). Even after successful treatment of the patient, they may still be a carrier of the resistant bacteria. "),
React.createElement("p", null, "As a carrier of OXA-48 resistance, patients must be isolated during future hospitalization, leading to a restricted human contact. This is mentally straining for the patient, and may cause feelings of loneliness and stigmatization (7). Furthermore, having a patient in isolation requires more resources and is a financial burden to the hospital (7)."),
React.createElement("p", null, "So how do we deal with this increasing problem? "),
React.createElement("p", null, "With Conjugaid, we wish to create a solution by reverse-engineering native mechanisms in bacteria and use it against them. "),
React.createElement("p", null, "In order to sensitize resistant bacteria to antibiotics, we had to come up with a system that would target the resistant bacteria specifically, but at the same time not harm the healthy microbiome which is vital for human health (8). "),
React.createElement("p", null, "As the ability of bacteria to resist antimicrobials is obtained from their genetic information, we decided to develop a system that would target the resistance from its very source; the DNA. Hence, we looked to the most revolutionary tool in gene editing history, CRISPR/Cas. "),
React.createElement("p", null, "Ever since the discovery of CRISPR/Cas as a part of the natural defence in bacteria, it has been widely used as an efficient and precise tool for genetic editing (9). By equipping a CRISPR/(d)Cas9-system with the ability to specifically target and downregulate expression of antibiotic resistance genes, we have proven that resistant bacteria can be sensitized to antibiotics."),
React.createElement("p", null,
"Our system recognizes and downregulates specific genes in non-pathogenic E. coli K12 TOP10. We began by targeting genes encoding green and red fluorescent proteins (GFP and RFP, respectively) in an attempt to achieve proof-of-concept. After successfully downregulating both GFP and RFP, we moved on to targeting chloramphenicol (CML) resistance genes. CML was chosen based on ",
React.createElement("a", { href: "http://localhost:4444/Team:SDU-Denmark/simple/Safey", target: "_blank" }, " safety"),
" considerations."),
React.createElement("p", null, "To deliver our CRISPR/Cas-system from donor to recipient cells we utilize conjugation. The recipient cells are designed to imitate E. coli containing an OXA-48 plasmid. "),
React.createElement("p", null, "How would a system like ours be practically implemented in the future treatment of patients, then?"),
React.createElement("p", null, "Our final product could be an engineered donor bacterium incorporated into a drug, aiming at eliminating OXA-48 genes present in the gut of otherwise healthy carriers. Thus, forced isolation OXA-48 carriers during future hospitalizations is no longer necessary."),
React.createElement("p", null, "An orally administered tablet could be designed to release the E. coli donors in the gastrointestinal tract, from where conjugation would spread our designed CRISPR/Cas9-system to antibiotic resistant E. coli. After sensitizing them to specific antibiotics, the formerly resistant E. coli will be eradicated with antibiotics. "),
React.createElement("p", null, "To learn more about our system design, continue to the next page.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }))));
}
} exports.ProjectOverview = ProjectOverview; //# sourceMappingURL=ProjectOverview.js.map } // default/src/components/Content/Lab_Process_And_Parts/LabProcessOverview.jsx $fsx.f[121] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class LabProcessOverview extends React.Component {
render() {
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "Lab Process & Parts", img: "" }),
React.createElement("div", { className: "content" },
"Lab Process Overview",
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.LabProcessOverview = LabProcessOverview; //# sourceMappingURL=LabProcessOverview.js.map } // default/src/components/Content/Human_Practices/HumanPracticesOverview.jsx $fsx.f[123] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = $fsx.r(8); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class HumanPracticesOverview extends React.Component {
UNSAFE_componentWillMount() {
return tslib_1.__awaiter(this, void 0, void 0, function* () {
$fsx.r(122);
});
}
render() {
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "Human Practices", img: "" }),
React.createElement("div", { id: "humanPracticesOverview", className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Human Practices (Overview)"),
React.createElement("p", null, "Welcome to our Human Practices! This is where we\u2019ll tell you all about our work outside of the laboratory. We\u2019ve achieved many things within Human Practices, but the one thing that shines through is our belief that increased public information about antibiotic resistance can directly help solve the problem (1). We are convinced that an issue of this magnitude has to be dealt with by society as a whole just as much as scientists have to work on a solution in the laboratory. "),
React.createElement("p", null,
"Besides considering the ",
React.createElement("a", null, " bioethical implications of our project "),
", we reached out to Ulrik S. Justesen (clinical microbiologist from our local hospital in Odense) and Danish CRISPR-company SNIPR Biome. "),
React.createElement("p", null,
"We see it as a necessary approach to enlighten students in high schools about antibiotic resistance, as they are the generation who will have to deal with the consequences of it. Thus, a great deal of effort has been applied to the ",
React.createElement("a", null, " Education and Public Engagement "),
" part of our project. ",
React.createElement("a", null, "We have hosted workshops for Danish high school students"),
" across the country in a multitude of ways, we have ",
React.createElement("a", null, " participated in The People's Democratic Festival "),
" in Denmark, we have hosted the ",
React.createElement("a", null, " Danish iGEM Weekend "),
" and we have participated in many ",
React.createElement("a", null, " other outreach events "),
". However, something we pride ourselves in presenting is an open-source lesson plan consisting of educational material (an e-book), teaching manuals and laboratory protocols created solely by our team. This was developed for and tested by Danish high school students majoring in biotechnology as well as their teachers. "),
React.createElement("p", null, "From the very beginning of our project, we have been focusing on integrating the UN\u2019s 17 Sustainable Development Goals (SDGs) in a valuable way. Four of the SDGs have been imperative within our project: "),
React.createElement("div", { className: "flex-container" },
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("p", { className: "text-center" }, "No. 3: Good health and well-being"),
React.createElement("img", { src: "" })),
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("p", { className: "text-center" }, "No. 4: Quality education"),
React.createElement("img", { src: "" })),
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("p", { className: "text-center" }, "No. 12: Responsible consumption and production"),
React.createElement("img", { src: "" })),
React.createElement("div", { className: "flex-item logo-item" },
React.createElement("p", { className: "text-center" }, "No. 17: Partnerships for the goals"),
React.createElement("img", { src: "" })))),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.HumanPracticesOverview = HumanPracticesOverview; //# sourceMappingURL=HumanPracticesOverview.js.map } // default/src/components/Content/People_Involved/PeopleInvolvedOverview.jsx $fsx.f[124] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class PeopleInvolvedOverview extends React.Component {
render() {
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "People Involved", img: "" }),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "People Involved (Overview)"),
React.createElement("p", { className: "intro_quote" },
React.createElement("span", { className: "italic" }, "\u201CIndividually, we are one drop. Together, we are an ocean.\u201D"),
" - Ryunosuke Satoro"),
React.createElement("p", null,
"Something extraordinary happens when teamwork is done correctly. As Satoro writes, a team is like an ocean; constantly undergoing ups and downs, yet capable of achieving great things as a result of all of the powerful forces affecting it. ",
React.createElement("a", null, " Our team "),
" has indeed been affected by many great forces, and without them Conjugaid would never have seen the light of day. Please take a moment to appreciate our team supervisors, who were always there to save us when the seas got rough. Through external ",
React.createElement("a", null, "attributions "),
" we have been able to take our journey with Conjugaid even further, and by ",
React.createElement("a", null, " collaborating "),
" with various iGEM-teams we have broadened our knowledge and had so much fun along the way. Our sponsors have provided us with everything we needed to get Conjugaid going and to make sure we didn\u2019t drown along the way. ",
React.createElement("br", null),
"Finally, keep reading for a few final words from our team, as well as a few pictures from all of the fun times we\u2019ve spent together over the last year.")),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.PeopleInvolvedOverview = PeopleInvolvedOverview; //# sourceMappingURL=PeopleInvolvedOverview.js.map } // default/src/components/Content/Introduction/Introduction.jsx $fsx.f[125] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const React = $fsx.r(3); const AccordionWidget_1 = $fsx.r(85); const Buttons_1 = $fsx.r(80); const BulgeWidget_1 = $fsx.r(88); class Introduction extends React.Component {
render() {
let accordionData = {
backgroundColor: "bg-blue-800",
title: "Achievements",
itemTitleColor: "text-blue-800",
items: [
{
title: "Bronze",
content: `
- Registration and Giant Jamboree Attendance ✓
- Competition Deliverables: Convince the judges that you have completed the following Competition Deliverables:
#1 Wiki ✓
#2 Poster ✓
#3 Presentation ✓
#4 Judging Form ✓
- Attributions: Convince the judges that you have completed Competition Deliverable #5 <a>Attributions </a>. ✓
- Project Inspiration and Description: Convince the judges that you have completed Competition Deliverable #8 <a> Project Inspiration and Description</a>. ✓
- Characterization: Convince the judges that you have added quantitative experimental characterization data to an existing Part from the Registry of Standard Biological Parts. ✓
Our team has characterized the following part: <a href="http://parts.igem.org/Part:BBa_J01003" target="_blank">BBa_J01003.</a>
`
},
{
title: "Silver",
content: `
- <a>Validated Part</a>: Convince the judges that at least one new BioBrick Part of your own design that is related to your project works as expected. ✓
Our team has created the <a> part XXX </a>.
- <a>Collaboration</a>: Convince the judges you have significantly worked with one (or more) currently registered 2019 iGEM team(s) in a meaningful way. ✓
Throughout our project, our team has worked with the following iGEM teams: DTU Biobuilders, UCopenhagen, Amazonas Brazil, Lund, TAS_Taipei, Costa Rica & Tuebingen.
- <a>Human Practices</a>: Convince the judges you have thought carefully and creatively about whether your work is responsible and good for the world. ✓
Our team has created and tested a lesson-plan for high school students. Furthermore, we have engaged the public as well as legislators in regards to synthetic biology and antibiotic resistance.
`
},
{
title: "Gold",
content: `
- <a>Integrated Human Practices</a>: Expand on your silver medal activity by demonstrating how you have integrated the investigated issues into the purpose, design, and/or execution of your project. ✓
We have continuously altered our project purpose, design and execution after discussing our ideas with professor in clinical microbiology at our local hospital Ulrik S. Justesen and with SNIPR Biome.
- <a> Model Your Project</a>: Convince the judges that your project's design and/or implementation is based on insight you have gained from modeling. ✓
Through modelling the conjugation efficiency of our project, we have gained valuable knowledge about our project design.
- <a>Demonstration of Your Work </a>: Convince the judges that your engineered system works.
Based on our results within our two systems (conjugation and CRISPR/Cas), both separately and combined, we have determined our engineered system as successful.
`
}
]
};
return (React.createElement(React.Fragment, null,
React.createElement(BulgeWidget_1.BulgeWidget, { title: "Hello world", img: "" }),
React.createElement("div", { className: "content" },
React.createElement("div", { className: "row" },
React.createElement("h2", null, "Introduction"),
React.createElement("p", null, "Welcome to our wiki! We are Conjugaid, the 2019 iGEM-team from University of Southern Denmark, and we can\u2019t wait to tell you about the things we\u2019ve been up to for the past year."),
React.createElement("p", null, "Our story begins with the meeting of 11 people from four different studies. We are a multi-disciplinary team with different scientific and personal backgrounds. Together, we set out to push the boundaries for the use of synthetic biology by creating new, innovative, and biological solutions to global issues."),
React.createElement("p", null, "Soon after meeting we traveled to a cottage far away from our busy lives, with the aim of coming up with an incredible project idea. This was where we realized that our personal differences are in fact our biggest strength. By combining the unique skills and thoughts of each team member, Conjugaid was born. "),
React.createElement("div", { className: "img_container" },
React.createElement("img", { src: "
" }))),
React.createElement(AccordionWidget_1.AccordionWidget, { model: accordionData }),
React.createElement("p", null, "We are very excited to invite you on a journey through our iGEM-project! Just click \u2018next\u2019 and you will be guided on a tour telling you everything you need to know about Conjugaid."),
React.createElement(Buttons_1.NextStationButton, { nextStation: this.props.nextStation }))));
}
} exports.Introduction = Introduction; //# sourceMappingURL=Introduction.js.map } // default/src/components/application/timelines/index.js $fsx.f[140] = (module, exports) => { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const gsap_1 = $fsx.r(139); const getDefaultTimeline = (node, delay) => {
const timeline = new gsap_1.TimelineMax({ paused: true });
timeline
.from(node, 0.3, { display: "none", autoAlpha: 0, delay, ease: gsap_1.Power1.easeIn });
return timeline;
}; const getHomeTimeline = (node, delay) => {
const timeline = new gsap_1.TimelineMax({ paused: true });
return timeline;
}; exports.play = (pathname, node, appears) => {
const delay = appears ? 0 : 0.5;
let timeline;
if (pathname === "/")
timeline = getHomeTimeline(node, delay);
else
timeline = getDefaultTimeline(node, delay);
requestAnimationFrame(() => timeline.play());
}; exports.exit = (node) => {
const timeline = new gsap_1.TimelineMax({ paused: true });
timeline.to(node, 0.15, { autoAlpha: 0, ease: gsap_1.Power1.easeOut });
timeline.play();
}; //# sourceMappingURL=index.js.map } // Importing a single entry $fsx.r(146);
//# sourceMappingURL=078b6dd30-app.js.map