Team:UCSF/lily2

From 2013.igem.org

(Difference between revisions)
 
(163 intermediate revisions not shown)
Line 1: Line 1:
{{Template:UCSF/MainHeader}}
{{Template:UCSF/MainHeader}}
 +
{{Template:UCSF/SlideShow}}
<html>
<html>
<head>
<head>
-
<script type="text/javascript" async="" src="https://2013.igem.org/Team:USTC-Software/js/camera?action=raw&ctype=text/javascript"></script>
+
<!--CSS styles: global-->
 +
<style type="text/css">
 +
/***
 +
Minimal header: removes the search bar and header image and readjusts font colours in the menus.
-
<link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:USTC-Software/css/camera?action=raw&ctype=text/css" media="all">
+
Thanks a lot to the 2011 Brown-Stanford and 2012 Lethbridge iGEM teams for snippets of their code!
-
 
+
Check out their wikis at:
-
 
+
https://2011.igem.org/Team:Brown-Stanford
-
<!--<script type="text/javascript" async="" src="https://2013.igem.org/Team:USTC-Software/js/camera?action=raw&ctype=text/javascript"></script>
+
https://2012.igem.org/Team:Lethbridge
-
-->
+
***/
-
<!--
+
-
<script type="text/javascript">
+
-
 
+
-
    jQuery.easing['jswing'] = jQuery.easing['swing'];
+
-
 
+
-
    jQuery.extend(jQuery.easing,
+
-
{
+
-
    def: 'easeOutQuad',
+
-
    swing: function (x, t, b, c, d) {
+
-
        //alert(jQuery.easing.default);
+
-
        return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
+
-
    },
+
-
    easeInQuad: function (x, t, b, c, d) {
+
-
        return c * (t /= d) * t + b;
+
-
    },
+
-
    easeOutQuad: function (x, t, b, c, d) {
+
-
        return -c * (t /= d) * (t - 2) + b;
+
-
    },
+
-
    easeInOutQuad: function (x, t, b, c, d) {
+
-
        if ((t /= d / 2) < 1) return c / 2 * t * t + b;
+
-
        return -c / 2 * ((--t) * (t - 2) - 1) + b;
+
-
    },
+
-
    easeInCubic: function (x, t, b, c, d) {
+
-
        return c * (t /= d) * t * t + b;
+
-
    },
+
-
    easeOutCubic: function (x, t, b, c, d) {
+
-
        return c * ((t = t / d - 1) * t * t + 1) + b;
+
-
    },
+
-
    easeInOutCubic: function (x, t, b, c, d) {
+
-
        if ((t /= d / 2) < 1) return c / 2 * t * t * t + b;
+
-
        return c / 2 * ((t -= 2) * t * t + 2) + b;
+
-
    },
+
-
    easeInQuart: function (x, t, b, c, d) {
+
-
        return c * (t /= d) * t * t * t + b;
+
-
    },
+
-
    easeOutQuart: function (x, t, b, c, d) {
+
-
        return -c * ((t = t / d - 1) * t * t * t - 1) + b;
+
-
    },
+
-
    easeInOutQuart: function (x, t, b, c, d) {
+
-
        if ((t /= d / 2) < 1) return c / 2 * t * t * t * t + b;
+
-
        return -c / 2 * ((t -= 2) * t * t * t - 2) + b;
+
-
    },
+
-
    easeInQuint: function (x, t, b, c, d) {
+
-
        return c * (t /= d) * t * t * t * t + b;
+
-
    },
+
-
    easeOutQuint: function (x, t, b, c, d) {
+
-
        return c * ((t = t / d - 1) * t * t * t * t + 1) + b;
+
-
    },
+
-
    easeInOutQuint: function (x, t, b, c, d) {
+
-
        if ((t /= d / 2) < 1) return c / 2 * t * t * t * t * t + b;
+
-
        return c / 2 * ((t -= 2) * t * t * t * t + 2) + b;
+
-
    },
+
-
    easeInSine: function (x, t, b, c, d) {
+
-
        return -c * Math.cos(t / d * (Math.PI / 2)) + c + b;
+
-
    },
+
-
    easeOutSine: function (x, t, b, c, d) {
+
-
        return c * Math.sin(t / d * (Math.PI / 2)) + b;
+
-
    },
+
-
    easeInOutSine: function (x, t, b, c, d) {
+
-
        return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
+
-
    },
+
-
    easeInExpo: function (x, t, b, c, d) {
+
-
        return (t == 0) ? b : c * Math.pow(2, 10 * (t / d - 1)) + b;
+
-
    },
+
-
    easeOutExpo: function (x, t, b, c, d) {
+
-
        return (t == d) ? b + c : c * (-Math.pow(2, -10 * t / d) + 1) + b;
+
-
    },
+
-
    easeInOutExpo: function (x, t, b, c, d) {
+
-
        if (t == 0) return b;
+
-
        if (t == d) return b + c;
+
-
        if ((t /= d / 2) < 1) return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
+
-
        return c / 2 * (-Math.pow(2, -10 * --t) + 2) + b;
+
-
    },
+
-
    easeInCirc: function (x, t, b, c, d) {
+
-
        return -c * (Math.sqrt(1 - (t /= d) * t) - 1) + b;
+
-
    },
+
-
    easeOutCirc: function (x, t, b, c, d) {
+
-
        return c * Math.sqrt(1 - (t = t / d - 1) * t) + b;
+
-
    },
+
-
    easeInOutCirc: function (x, t, b, c, d) {
+
-
        if ((t /= d / 2) < 1) return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b;
+
-
        return c / 2 * (Math.sqrt(1 - (t -= 2) * t) + 1) + b;
+
-
    },
+
-
    easeInElastic: function (x, t, b, c, d) {
+
-
        var s = 1.70158; var p = 0; var a = c;
+
-
        if (t == 0) return b; if ((t /= d) == 1) return b + c; if (!p) p = d * .3;
+
-
        if (a < Math.abs(c)) { a = c; var s = p / 4; }
+
-
        else var s = p / (2 * Math.PI) * Math.asin(c / a);
+
-
        return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
+
-
    },
+
-
    easeOutElastic: function (x, t, b, c, d) {
+
-
        var s = 1.70158; var p = 0; var a = c;
+
-
        if (t == 0) return b; if ((t /= d) == 1) return b + c; if (!p) p = d * .3;
+
-
        if (a < Math.abs(c)) { a = c; var s = p / 4; }
+
-
        else var s = p / (2 * Math.PI) * Math.asin(c / a);
+
-
        return a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b;
+
-
    },
+
-
    easeInOutElastic: function (x, t, b, c, d) {
+
-
        var s = 1.70158; var p = 0; var a = c;
+
-
        if (t == 0) return b; if ((t /= d / 2) == 2) return b + c; if (!p) p = d * (.3 * 1.5);
+
-
        if (a < Math.abs(c)) { a = c; var s = p / 4; }
+
-
        else var s = p / (2 * Math.PI) * Math.asin(c / a);
+
-
        if (t < 1) return -.5 * (a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b;
+
-
        return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * .5 + c + b;
+
-
    },
+
-
    easeInBack: function (x, t, b, c, d, s) {
+
-
        if (s == undefined) s = 1.70158;
+
-
        return c * (t /= d) * t * ((s + 1) * t - s) + b;
+
-
    },
+
-
    easeOutBack: function (x, t, b, c, d, s) {
+
-
        if (s == undefined) s = 1.70158;
+
-
        return c * ((t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b;
+
-
    },
+
-
    easeInOutBack: function (x, t, b, c, d, s) {
+
-
        if (s == undefined) s = 1.70158;
+
-
        if ((t /= d / 2) < 1) return c / 2 * (t * t * (((s *= (1.525)) + 1) * t - s)) + b;
+
-
        return c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b;
+
-
    },
+
-
    easeInBounce: function (x, t, b, c, d) {
+
-
        return c - jQuery.easing.easeOutBounce(x, d - t, 0, c, d) + b;
+
-
    },
+
-
    easeOutBounce: function (x, t, b, c, d) {
+
-
        if ((t /= d) < (1 / 2.75)) {
+
-
            return c * (7.5625 * t * t) + b;
+
-
        } else if (t < (2 / 2.75)) {
+
-
            return c * (7.5625 * (t -= (1.5 / 2.75)) * t + .75) + b;
+
-
        } else if (t < (2.5 / 2.75)) {
+
-
            return c * (7.5625 * (t -= (2.25 / 2.75)) * t + .9375) + b;
+
-
        } else {
+
-
            return c * (7.5625 * (t -= (2.625 / 2.75)) * t + .984375) + b;
+
-
        }
+
-
    },
+
-
    easeInOutBounce: function (x, t, b, c, d) {
+
-
        if (t < d / 2) return jQuery.easing.easeInBounce(x, t * 2, 0, c, d) * .5 + b;
+
-
        return jQuery.easing.easeOutBounce(x, t * 2 - d, 0, c, d) * .5 + c * .5 + b;
+
-
    }
+
-
});
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
    ; (function (a) { a.fn.camera = function (b, c) { function e() { if (navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPad/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i)) { return true } } function H() { var b = a(s).width(); a("li", s).removeClass("camera_visThumb"); a("li", s).each(function () { var c = a(this).position(), d = a("ul", s).outerWidth(), e = a("ul", s).offset().left, f = a("> div", s).offset().left, g = f - e; if (g > 0) { a(".camera_prevThumbs", V).removeClass("hideNav") } else { a(".camera_prevThumbs", V).addClass("hideNav") } if (d - g > b) { a(".camera_nextThumbs", V).removeClass("hideNav") } else { a(".camera_nextThumbs", V).addClass("hideNav") } var h = c.left, i = c.left + a(this).width(); if (i - g <= b && h - g >= 0) { a(this).addClass("camera_visThumb") } }) } function K() { function d() { t = f.width(); if (b.height.indexOf("%") != -1) { var c = Math.round(t / (100 / parseFloat(b.height))); if (b.minHeight != "" && c < parseFloat(b.minHeight)) { u = parseFloat(b.minHeight) } else { u = c } f.css({ height: u }) } else if (b.height == "auto") { u = f.height() } else { u = parseFloat(b.height); f.css({ height: u }) } a(".camerarelative", k).css({ width: t, height: u }); a(".imgLoaded", k).each(function () { var c = a(this), d = c.attr("width"), e = c.attr("height"), f = c.index(), g, h, i = c.attr("data-alignment"), j = c.attr("data-portrait"); if (typeof i === "undefined" || i === false || i === "") { i = b.alignment } if (typeof j === "undefined" || j === false || j === "") { j = b.portrait } if (j == false || j == "false") { if (d / e < t / u) { var k = t / d; var l = Math.abs(u - e * k) * .5; switch (i) { case "topLeft": g = 0; break; case "topCenter": g = 0; break; case "topRight": g = 0; break; case "centerLeft": g = "-" + l + "px"; break; case "center": g = "-" + l + "px"; break; case "centerRight": g = "-" + l + "px"; break; case "bottomLeft": g = "-" + l * 2 + "px"; break; case "bottomCenter": g = "-" + l * 2 + "px"; break; case "bottomRight": g = "-" + l * 2 + "px"; break } c.css({ height: e * k, "margin-left": 0, "margin-top": g, position: "absolute", visibility: "visible", width: t }) } else { var k = u / e; var l = Math.abs(t - d * k) * .5; switch (i) { case "topLeft": h = 0; break; case "topCenter": h = "-" + l + "px"; break; case "topRight": h = "-" + l * 2 + "px"; break; case "centerLeft": h = 0; break; case "center": h = "-" + l + "px"; break; case "centerRight": h = "-" + l * 2 + "px"; break; case "bottomLeft": h = 0; break; case "bottomCenter": h = "-" + l + "px"; break; case "bottomRight": h = "-" + l * 2 + "px"; break } c.css({ height: u, "margin-left": h, "margin-top": 0, position: "absolute", visibility: "visible", width: d * k }) } } else { if (d / e < t / u) { var k = u / e; var l = Math.abs(t - d * k) * .5; switch (i) { case "topLeft": h = 0; break; case "topCenter": h = l + "px"; break; case "topRight": h = l * 2 + "px"; break; case "centerLeft": h = 0; break; case "center": h = l + "px"; break; case "centerRight": h = l * 2 + "px"; break; case "bottomLeft": h = 0; break; case "bottomCenter": h = l + "px"; break; case "bottomRight": h = l * 2 + "px"; break } c.css({ height: u, "margin-left": h, "margin-top": 0, position: "absolute", visibility: "visible", width: d * k }) } else { var k = t / d; var l = Math.abs(u - e * k) * .5; switch (i) { case "topLeft": g = 0; break; case "topCenter": g = 0; break; case "topRight": g = 0; break; case "centerLeft": g = l + "px"; break; case "center": g = l + "px"; break; case "centerRight": g = l + "px"; break; case "bottomLeft": g = l * 2 + "px"; break; case "bottomCenter": g = l * 2 + "px"; break; case "bottomRight": g = l * 2 + "px"; break } c.css({ height: e * k, "margin-left": 0, "margin-top": g, position: "absolute", visibility: "visible", width: t }) } } }) } var c; if (I == true) { clearTimeout(c); c = setTimeout(d, 200) } else { d() } I = true } function X(a) { for (var b, c, d = a.length; d; b = parseInt(Math.random() * d), c = a[--d], a[d] = a[b], a[b] = c); return a } function Y(a) { return Math.ceil(a) == Math.floor(a) } function hb() { if (a(s).length && !a(r).length) { var b = a(s).outerWidth(), c = a("ul > li", s).outerWidth(), d = a("li.cameracurrent", s).length ? a("li.cameracurrent", s).position() : "", e = a("ul > li", s).length * a("ul > li", s).outerWidth(), g = a("ul", s).offset().left, h = a("> div", s).offset().left, i; if (g < 0) { i = "-" + (h - g) } else { i = h - g } if (gb == true) { a("ul", s).width(a("ul > li", s).length * a("ul > li", s).outerWidth()); if (a(s).length && !a(r).lenght) { f.css({ marginBottom: a(s).outerHeight() }) } H(); a("ul", s).width(a("ul > li", s).length * a("ul > li", s).outerWidth()); if (a(s).length && !a(r).lenght) { f.css({ marginBottom: a(s).outerHeight() }) } } gb = false; var j = a("li.cameracurrent", s).length ? d.left : "", k = a("li.cameracurrent", s).length ? d.left + a("li.cameracurrent", s).outerWidth() : ""; if (j < a("li.cameracurrent", s).outerWidth()) { j = 0 } if (k - i > b) { if (j + b < e) { a("ul", s).animate({ "margin-left": "-" + j + "px" }, 500, H) } else { a("ul", s).animate({ "margin-left": "-" + (a("ul", s).outerWidth() - b) + "px" }, 500, H) } } else if (j - i < 0) { a("ul", s).animate({ "margin-left": "-" + j + "px" }, 500, H) } else { a("ul", s).css({ "margin-left": "auto", "margin-right": "auto" }); setTimeout(H, 100) } } } function ib() { bb = 0; var c = a(".camera_bar_cont", V).width(), d = a(".camera_bar_cont", V).height(); if (h != "pie") { switch (U) { case "leftToRight": a("#" + i).css({ right: c }); break; case "rightToLeft": a("#" + i).css({ left: c }); break; case "topToBottom": a("#" + i).css({ bottom: d }); break; case "bottomToTop": a("#" + i).css({ top: d }); break } } else { db.clearRect(0, 0, b.pieDiameter, b.pieDiameter) } } function jb(c) { j.addClass("camerasliding"); R = false; var d = parseFloat(a("div.cameraSlide.cameracurrent", k).index()); if (c > 0) { var l = c - 1 } else if (d == B - 1) { var l = 0 } else { var l = d + 1 } var m = a(".cameraSlide:eq(" + l + ")", k); var n = a(".cameraSlide:eq(" + (l + 1) + ")", k).addClass("cameranext"); if (d != l + 1) { n.hide() } a(".cameraContent", g).fadeOut(600); a(".camera_caption", g).show(); a(".camerarelative", m).append(a("> div ", j).eq(l).find("> div.camera_effected")); a(".camera_target_content .cameraContent:eq(" + l + ")", f).append(a("> div ", j).eq(l).find("> div")); if (!a(".imgLoaded", m).length) { var o = v[l]; var p = new Image; p.src = o + "?" + (new Date).getTime(); m.css("visibility", "hidden"); m.prepend(a(p).attr("class", "imgLoaded").css("visibility", "hidden")); var q, w; if (!a(p).get(0).complete || q == "0" || w == "0" || typeof q === "undefined" || q === false || typeof w === "undefined" || w === false) { a(".camera_loader", f).delay(500).fadeIn(400); p.onload = function () { q = p.naturalWidth; w = p.naturalHeight; a(p).attr("data-alignment", z[l]).attr("data-portrait", y[l]); a(p).attr("width", q); a(p).attr("height", w); k.find(".cameraSlide_" + l).hide().css("visibility", "visible"); K(); jb(l + 1) } } } else { if (v.length > l + 1 && !a(".imgLoaded", n).length) { var x = v[l + 1]; var A = new Image; A.src = x + "?" + (new Date).getTime(); n.prepend(a(A).attr("class", "imgLoaded").css("visibility", "hidden")); A.onload = function () { q = A.naturalWidth; w = A.naturalHeight; a(A).attr("data-alignment", z[l + 1]).attr("data-portrait", y[l + 1]); a(A).attr("width", q); a(A).attr("height", w); K() } } b.onLoaded.call(this); if (a(".camera_loader", f).is(":visible")) { a(".camera_loader", f).fadeOut(400) } else { a(".camera_loader", f).css({ visibility: "hidden" }); a(".camera_loader", f).fadeOut(400, function () { a(".camera_loader", f).css({ visibility: "visible" }) }) } var C = b.rows, D = b.cols, F = 1, G = 0, H, I, J, N, O, P = new Array("simpleFade", "curtainTopLeft", "curtainTopRight", "curtainBottomLeft", "curtainBottomRight", "curtainSliceLeft", "curtainSliceRight", "blindCurtainTopLeft", "blindCurtainTopRight", "blindCurtainBottomLeft", "blindCurtainBottomRight", "blindCurtainSliceBottom", "blindCurtainSliceTop", "stampede", "mosaic", "mosaicReverse", "mosaicRandom", "mosaicSpiral", "mosaicSpiralReverse", "topLeftBottomRight", "bottomRightTopLeft", "bottomLeftTopRight", "topRightBottomLeft", "scrollLeft", "scrollRight", "scrollTop", "scrollBottom", "scrollHorz"); marginLeft = 0, marginTop = 0, opacityOnGrid = 0; if (b.opacityOnGrid == true) { opacityOnGrid = 0 } else { opacityOnGrid = 1 } var Q = a(" > div", j).eq(l).attr("data-fx"); if (e() && b.mobileFx != "" && b.mobileFx != "default") { N = b.mobileFx } else { if (typeof Q !== "undefined" && Q !== false && Q !== "default") { N = Q } else { N = b.fx } } if (N == "random") { N = X(P); N = N[0] } else { N = N; if (N.indexOf(",") > 0) { N = N.replace(/ /g, ""); N = N.split(","); N = X(N); N = N[0] } } dataEasing = a(" > div", j).eq(l).attr("data-easing"); mobileEasing = a(" > div", j).eq(l).attr("data-mobileEasing"); if (e() && b.mobileEasing != "" && b.mobileEasing != "default") { if (typeof mobileEasing !== "undefined" && mobileEasing !== false && mobileEasing !== "default") { O = mobileEasing } else { O = b.mobileEasing } } else { if (typeof dataEasing !== "undefined" && dataEasing !== false && dataEasing !== "default") { O = dataEasing } else { O = b.easing } } H = a(" > div", j).eq(l).attr("data-slideOn"); if (typeof H !== "undefined" && H !== false) { T = H } else { if (b.slideOn == "random") { var T = new Array("next", "prev"); T = X(T); T = T[0] } else { T = b.slideOn } } var Y = a(" > div", j).eq(l).attr("data-time"); if (typeof Y !== "undefined" && Y !== false && Y !== "") { I = parseFloat(Y) } else { I = b.time } var Z = a(" > div", j).eq(l).attr("data-transPeriod"); if (typeof Z !== "undefined" && Z !== false && Z !== "") { J = parseFloat(Z) } else { J = b.transPeriod } if (!a(j).hasClass("camerastarted")) { N = "simpleFade"; T = "next"; O = ""; J = 400; a(j).addClass("camerastarted") } switch (N) { case "simpleFade": D = 1; C = 1; break; case "curtainTopLeft": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "curtainTopRight": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "curtainBottomLeft": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "curtainBottomRight": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "curtainSliceLeft": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "curtainSliceRight": if (b.slicedCols == 0) { D = b.cols } else { D = b.slicedCols } C = 1; break; case "blindCurtainTopLeft": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "blindCurtainTopRight": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "blindCurtainBottomLeft": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "blindCurtainBottomRight": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "blindCurtainSliceTop": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "blindCurtainSliceBottom": if (b.slicedRows == 0) { C = b.rows } else { C = b.slicedRows } D = 1; break; case "stampede": G = "-" + J; break; case "mosaic": G = b.gridDifference; break; case "mosaicReverse": G = b.gridDifference; break; case "mosaicRandom": break; case "mosaicSpiral": G = b.gridDifference; F = 1.7; break; case "mosaicSpiralReverse": G = b.gridDifference; F = 1.7; break; case "topLeftBottomRight": G = b.gridDifference; F = 6; break; case "bottomRightTopLeft": G = b.gridDifference; F = 6; break; case "bottomLeftTopRight": G = b.gridDifference; F = 6; break; case "topRightBottomLeft": G = b.gridDifference; F = 6; break; case "scrollLeft": D = 1; C = 1; break; case "scrollRight": D = 1; C = 1; break; case "scrollTop": D = 1; C = 1; break; case "scrollBottom": D = 1; C = 1; break; case "scrollHorz": D = 1; C = 1; break } var _ = 0; var ab = C * D; var eb = t - Math.floor(t / D) * D; var fb = u - Math.floor(u / C) * C; var gb; var kb; var lb = 0; var mb = 0; var nb = new Array; var ob = new Array; var pb = new Array; while (_ < ab) { nb.push(_); ob.push(_); E.append('<div class="cameraappended" style="display:none; overflow:hidden; position:absolute; z-index:1000" />'); var qb = a(".cameraappended:eq(" + _ + ")", k); if (N == "scrollLeft" || N == "scrollRight" || N == "scrollTop" || N == "scrollBottom" || N == "scrollHorz") { S.eq(l).clone().show().appendTo(qb) } else { if (T == "next") { S.eq(l).clone().show().appendTo(qb) } else { S.eq(d).clone().show().appendTo(qb) } } if (_ % D < eb) { gb = 1 } else { gb = 0 } if (_ % D == 0) { lb = 0 } if (Math.floor(_ / D) < fb) { kb = 1 } else { kb = 0 } qb.css({ height: Math.floor(u / C + kb + 1), left: lb, top: mb, width: Math.floor(t / D + gb + 1) }); a("> .cameraSlide", qb).css({ height: u, "margin-left": "-" + lb + "px", "margin-top": "-" + mb + "px", width: t }); lb = lb + qb.width() - 1; if (_ % D == D - 1) { mb = mb + qb.height() - 1 } _++ } switch (N) { case "curtainTopLeft": break; case "curtainBottomLeft": break; case "curtainSliceLeft": break; case "curtainTopRight": nb = nb.reverse(); break; case "curtainBottomRight": nb = nb.reverse(); break; case "curtainSliceRight": nb = nb.reverse(); break; case "blindCurtainTopLeft": break; case "blindCurtainBottomLeft": nb = nb.reverse(); break; case "blindCurtainSliceTop": break; case "blindCurtainTopRight": break; case "blindCurtainBottomRight": nb = nb.reverse(); break; case "blindCurtainSliceBottom": nb = nb.reverse(); break; case "stampede": nb = X(nb); break; case "mosaic": break; case "mosaicReverse": nb = nb.reverse(); break; case "mosaicRandom": nb = X(nb); break; case "mosaicSpiral": var rb = C / 2, sb, tb, ub, vb = 0; for (ub = 0; ub < rb; ub++) { tb = ub; for (sb = ub; sb < D - ub - 1; sb++) { pb[vb++] = tb * D + sb } sb = D - ub - 1; for (tb = ub; tb < C - ub - 1; tb++) { pb[vb++] = tb * D + sb } tb = C - ub - 1; for (sb = D - ub - 1; sb > ub; sb--) { pb[vb++] = tb * D + sb } sb = ub; for (tb = C - ub - 1; tb > ub; tb--) { pb[vb++] = tb * D + sb } } nb = pb; break; case "mosaicSpiralReverse": var rb = C / 2, sb, tb, ub, vb = ab - 1; for (ub = 0; ub < rb; ub++) { tb = ub; for (sb = ub; sb < D - ub - 1; sb++) { pb[vb--] = tb * D + sb } sb = D - ub - 1; for (tb = ub; tb < C - ub - 1; tb++) { pb[vb--] = tb * D + sb } tb = C - ub - 1; for (sb = D - ub - 1; sb > ub; sb--) { pb[vb--] = tb * D + sb } sb = ub; for (tb = C - ub - 1; tb > ub; tb--) { pb[vb--] = tb * D + sb } } nb = pb; break; case "topLeftBottomRight": for (var tb = 0; tb < C; tb++) for (var sb = 0; sb < D; sb++) { pb.push(sb + tb) } ob = pb; break; case "bottomRightTopLeft": for (var tb = 0; tb < C; tb++) for (var sb = 0; sb < D; sb++) { pb.push(sb + tb) } ob = pb.reverse(); break; case "bottomLeftTopRight": for (var tb = C; tb > 0; tb--) for (var sb = 0; sb < D; sb++) { pb.push(sb + tb) } ob = pb; break; case "topRightBottomLeft": for (var tb = 0; tb < C; tb++) for (var sb = D; sb > 0; sb--) { pb.push(sb + tb) } ob = pb; break } a.each(nb, function (c, e) { function o() { a(this).addClass("cameraeased"); if (a(".cameraeased", k).length >= 0) { a(s).css({ visibility: "visible" }) } if (a(".cameraeased", k).length == ab) { hb(); a(".moveFromLeft, .moveFromRight, .moveFromTop, .moveFromBottom, .fadeIn, .fadeFromLeft, .fadeFromRight, .fadeFromTop, .fadeFromBottom", g).each(function () { a(this).css("visibility", "hidden") }); S.eq(l).show().css("z-index", "999").removeClass("cameranext").addClass("cameracurrent"); S.eq(d).css("z-index", "1").removeClass("cameracurrent"); a(".cameraContent", g).eq(l).addClass("cameracurrent"); if (d >= 0) { a(".cameraContent", g).eq(d).removeClass("cameracurrent") } b.onEndTransition.call(this); if (a("> div", j).eq(l).attr("data-video") != "hide" && a(".cameraContent.cameracurrent .imgFake", g).length) { a(".cameraContent.cameracurrent .imgFake", g).click() } var c = S.eq(l).find(".fadeIn").length; var e = a(".cameraContent", g).eq(l).find(".moveFromLeft, .moveFromRight, .moveFromTop, .moveFromBottom, .fadeIn, .fadeFromLeft, .fadeFromRight, .fadeFromTop, .fadeFromBottom").length; if (c != 0) { a(".cameraSlide.cameracurrent .fadeIn", g).each(function () { if (a(this).attr("data-easing") != "") { var b = a(this).attr("data-easing") } else { var b = O } var d = a(this); if (typeof d.attr("data-outerWidth") === "undefined" || d.attr("data-outerWidth") === false || d.attr("data-outerWidth") === "") { var e = d.outerWidth(); d.attr("data-outerWidth", e) } else { var e = d.attr("data-outerWidth") } if (typeof d.attr("data-outerHeight") === "undefined" || d.attr("data-outerHeight") === false || d.attr("data-outerHeight") === "") { var f = d.outerHeight(); d.attr("data-outerHeight", f) } else { var f = d.attr("data-outerHeight") } var g = d.position(); var h = g.left; var i = g.top; var j = d.attr("class"); var k = d.index(); var l = d.parents(".camerarelative").outerHeight(); var m = d.parents(".camerarelative").outerWidth(); if (j.indexOf("fadeIn") != -1) { d.animate({ opacity: 0 }, 0).css("visibility", "visible").delay(I / c * .1 * (k - 1)).animate({ opacity: 1 }, I / c * .15, b) } else { d.css("visibility", "visible") } }) } a(".cameraContent.cameracurrent", g).show(); if (e != 0) { a(".cameraContent.cameracurrent .moveFromLeft, .cameraContent.cameracurrent .moveFromRight, .cameraContent.cameracurrent .moveFromTop, .cameraContent.cameracurrent .moveFromBottom, .cameraContent.cameracurrent .fadeIn, .cameraContent.cameracurrent .fadeFromLeft, .cameraContent.cameracurrent .fadeFromRight, .cameraContent.cameracurrent .fadeFromTop, .cameraContent.cameracurrent .fadeFromBottom", g).each(function () { if (a(this).attr("data-easing") != "") { var b = a(this).attr("data-easing") } else { var b = O } var c = a(this); var d = c.position(); var f = d.left; var g = d.top; var h = c.attr("class"); var i = c.index(); var j = c.outerHeight(); if (h.indexOf("moveFromLeft") != -1) { c.css({ left: "-" + t + "px", right: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ left: d.left }, I / e * .15, b) } else if (h.indexOf("moveFromRight") != -1) { c.css({ left: t + "px", right: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ left: d.left }, I / e * .15, b) } else if (h.indexOf("moveFromTop") != -1) { c.css({ top: "-" + u + "px", bottom: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ top: d.top }, I / e * .15, b, function () { c.css({ top: "auto", bottom: 0 }) }) } else if (h.indexOf("moveFromBottom") != -1) { c.css({ top: u + "px", bottom: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ top: d.top }, I / e * .15, b) } else if (h.indexOf("fadeFromLeft") != -1) { c.animate({ opacity: 0 }, 0).css({ left: "-" + t + "px", right: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ left: d.left, opacity: 1 }, I / e * .15, b) } else if (h.indexOf("fadeFromRight") != -1) { c.animate({ opacity: 0 }, 0).css({ left: t + "px", right: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ left: d.left, opacity: 1 }, I / e * .15, b) } else if (h.indexOf("fadeFromTop") != -1) { c.animate({ opacity: 0 }, 0).css({ top: "-" + u + "px", bottom: "auto" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ top: d.top, opacity: 1 }, I / e * .15, b, function () { c.css({ top: "auto", bottom: 0 }) }) } else if (h.indexOf("fadeFromBottom") != -1) { c.animate({ opacity: 0 }, 0).css({ bottom: "-" + j + "px" }); c.css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ bottom: "0", opacity: 1 }, I / e * .15, b) } else if (h.indexOf("fadeIn") != -1) { c.animate({ opacity: 0 }, 0).css("visibility", "visible").delay(I / e * .1 * (i - 1)).animate({ opacity: 1 }, I / e * .15, b) } else { c.css("visibility", "visible") } }) } a(".cameraappended", k).remove(); j.removeClass("camerasliding"); S.eq(d).hide(); var f = a(".camera_bar_cont", V).width(), m = a(".camera_bar_cont", V).height(), o; if (h != "pie") { o = .05 } else { o = .005 } a("#" + i).animate({ opacity: b.loaderOpacity }, 200); L = setInterval(function () { if (j.hasClass("stopped")) { clearInterval(L) } if (h != "pie") { if (bb <= 1.002 && !j.hasClass("stopped") && !j.hasClass("paused") && !j.hasClass("hovered")) { bb = bb + o } else if (bb <= 1 && (j.hasClass("stopped") || j.hasClass("paused") || j.hasClass("stopped") || j.hasClass("hovered"))) { bb = bb } else { if (!j.hasClass("stopped") && !j.hasClass("paused") && !j.hasClass("hovered")) { clearInterval(L); W(); a("#" + i).animate({ opacity: 0 }, 200, function () { clearTimeout(M); M = setTimeout(ib, n); jb(); b.onStartLoading.call(this) }) } } switch (U) { case "leftToRight": a("#" + i).animate({ right: f - f * bb }, I * o, "linear"); break; case "rightToLeft": a("#" + i).animate({ left: f - f * bb }, I * o, "linear"); break; case "topToBottom": a("#" + i).animate({ bottom: m - m * bb }, I * o, "linear"); break; case "bottomToTop": a("#" + i).animate({ bottom: m - m * bb }, I * o, "linear"); break } } else { cb = bb; db.clearRect(0, 0, b.pieDiameter, b.pieDiameter); db.globalCompositeOperation = "destination-over"; db.beginPath(); db.arc(b.pieDiameter / 2, b.pieDiameter / 2, b.pieDiameter / 2 - b.loaderStroke, 0, Math.PI * 2, false); db.lineWidth = b.loaderStroke; db.strokeStyle = b.loaderBgColor; db.stroke(); db.closePath(); db.globalCompositeOperation = "source-over"; db.beginPath(); db.arc(b.pieDiameter / 2, b.pieDiameter / 2, b.pieDiameter / 2 - b.loaderStroke, 0, Math.PI * 2 * cb, false); db.lineWidth = b.loaderStroke - b.loaderPadding * 2; db.strokeStyle = b.loaderColor; db.stroke(); db.closePath(); if (bb <= 1.002 && !j.hasClass("stopped") && !j.hasClass("paused") && !j.hasClass("hovered")) { bb = bb + o } else if (bb <= 1 && (j.hasClass("stopped") || j.hasClass("paused") || j.hasClass("hovered"))) { bb = bb } else { if (!j.hasClass("stopped") && !j.hasClass("paused") && !j.hasClass("hovered")) { clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 200, function () { clearTimeout(M); M = setTimeout(ib, n); jb(); b.onStartLoading.call(this) }) } } } }, I * o) } } if (e % D < eb) { gb = 1 } else { gb = 0 } if (e % D == 0) { lb = 0 } if (Math.floor(e / D) < fb) { kb = 1 } else { kb = 0 } switch (N) { case "simpleFade": height = u; width = t; opacityOnGrid = 0; break; case "curtainTopLeft": height = 0, width = Math.floor(t / D + gb + 1), marginTop = "-" + Math.floor(u / C + kb + 1) + "px"; break; case "curtainTopRight": height = 0, width = Math.floor(t / D + gb + 1), marginTop = "-" + Math.floor(u / C + kb + 1) + "px"; break; case "curtainBottomLeft": height = 0, width = Math.floor(t / D + gb + 1), marginTop = Math.floor(u / C + kb + 1) + "px"; break; case "curtainBottomRight": height = 0, width = Math.floor(t / D + gb + 1), marginTop = Math.floor(u / C + kb + 1) + "px"; break; case "curtainSliceLeft": height = 0, width = Math.floor(t / D + gb + 1); if (e % 2 == 0) { marginTop = Math.floor(u / C + kb + 1) + "px" } else { marginTop = "-" + Math.floor(u / C + kb + 1) + "px" } break; case "curtainSliceRight": height = 0, width = Math.floor(t / D + gb + 1); if (e % 2 == 0) { marginTop = Math.floor(u / C + kb + 1) + "px" } else { marginTop = "-" + Math.floor(u / C + kb + 1) + "px" } break; case "blindCurtainTopLeft": height = Math.floor(u / C + kb + 1), width = 0, marginLeft = "-" + Math.floor(t / D + gb + 1) + "px"; break; case "blindCurtainTopRight": height = Math.floor(u / C + kb + 1), width = 0, marginLeft = Math.floor(t / D + gb + 1) + "px"; break; case "blindCurtainBottomLeft": height = Math.floor(u / C + kb + 1), width = 0, marginLeft = "-" + Math.floor(t / D + gb + 1) + "px"; break; case "blindCurtainBottomRight": height = Math.floor(u / C + kb + 1), width = 0, marginLeft = Math.floor(t / D + gb + 1) + "px"; break; case "blindCurtainSliceBottom": height = Math.floor(u / C + kb + 1), width = 0; if (e % 2 == 0) { marginLeft = "-" + Math.floor(t / D + gb + 1) + "px" } else { marginLeft = Math.floor(t / D + gb + 1) + "px" } break; case "blindCurtainSliceTop": height = Math.floor(u / C + kb + 1), width = 0; if (e % 2 == 0) { marginLeft = "-" + Math.floor(t / D + gb + 1) + "px" } else { marginLeft = Math.floor(t / D + gb + 1) + "px" } break; case "stampede": height = 0; width = 0; marginLeft = t * .2 * (c % D - (D - Math.floor(D / 2))) + "px"; marginTop = u * .2 * (Math.floor(c / D) + 1 - (C - Math.floor(C / 2))) + "px"; break; case "mosaic": height = 0; width = 0; break; case "mosaicReverse": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) + "px"; marginTop = Math.floor(u / C + kb + 1) + "px"; break; case "mosaicRandom": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) * .5 + "px"; marginTop = Math.floor(u / C + kb + 1) * .5 + "px"; break; case "mosaicSpiral": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) * .5 + "px"; marginTop = Math.floor(u / C + kb + 1) * .5 + "px"; break; case "mosaicSpiralReverse": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) * .5 + "px"; marginTop = Math.floor(u / C + kb + 1) * .5 + "px"; break; case "topLeftBottomRight": height = 0; width = 0; break; case "bottomRightTopLeft": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) + "px"; marginTop = Math.floor(u / C + kb + 1) + "px"; break; case "bottomLeftTopRight": height = 0; width = 0; marginLeft = 0; marginTop = Math.floor(u / C + kb + 1) + "px"; break; case "topRightBottomLeft": height = 0; width = 0; marginLeft = Math.floor(t / D + gb + 1) + "px"; marginTop = 0; break; case "scrollRight": height = u; width = t; marginLeft = -t; break; case "scrollLeft": height = u; width = t; marginLeft = t; break; case "scrollTop": height = u; width = t; marginTop = u; break; case "scrollBottom": height = u; width = t; marginTop = -u; break; case "scrollHorz": height = u; width = t; if (d == 0 && l == B - 1) { marginLeft = -t } else if (d < l || d == B - 1 && l == 0) { marginLeft = t } else { marginLeft = -t } break } var m = a(".cameraappended:eq(" + e + ")", k); if (typeof L !== "undefined") { clearInterval(L); clearTimeout(M); M = setTimeout(ib, J + G) } if (a(r).length) { a(".camera_pag li", f).removeClass("cameracurrent"); a(".camera_pag li", f).eq(l).addClass("cameracurrent") } if (a(s).length) { a("li", s).removeClass("cameracurrent"); a("li", s).eq(l).addClass("cameracurrent"); a("li", s).not(".cameracurrent").find("img").animate({ opacity: .5 }, 0); a("li.cameracurrent img", s).animate({ opacity: 1 }, 0); a("li", s).hover(function () { a("img", this).stop(true, false).animate({ opacity: 1 }, 150) }, function () { if (!a(this).hasClass("cameracurrent")) { a("img", this).stop(true, false).animate({ opacity: .5 }, 150) } }) } var n = parseFloat(J) + parseFloat(G); if (N == "scrollLeft" || N == "scrollRight" || N == "scrollTop" || N == "scrollBottom" || N == "scrollHorz") { b.onStartTransition.call(this); n = 0; m.delay((J + G) / ab * ob[c] * F * .5).css({ display: "block", height: height, "margin-left": marginLeft, "margin-top": marginTop, width: width }).animate({ height: Math.floor(u / C + kb + 1), "margin-top": 0, "margin-left": 0, width: Math.floor(t / D + gb + 1) }, J - G, O, o); S.eq(d).delay((J + G) / ab * ob[c] * F * .5).animate({ "margin-left": marginLeft * -1, "margin-top": marginTop * -1 }, J - G, O, function () { a(this).css({ "margin-top": 0, "margin-left": 0 }) }) } else { b.onStartTransition.call(this); n = parseFloat(J) + parseFloat(G); if (T == "next") { m.delay((J + G) / ab * ob[c] * F * .5).css({ display: "block", height: height, "margin-left": marginLeft, "margin-top": marginTop, width: width, opacity: opacityOnGrid }).animate({ height: Math.floor(u / C + kb + 1), "margin-top": 0, "margin-left": 0, opacity: 1, width: Math.floor(t / D + gb + 1) }, J - G, O, o) } else { S.eq(l).show().css("z-index", "999").addClass("cameracurrent"); S.eq(d).css("z-index", "1").removeClass("cameracurrent"); a(".cameraContent", g).eq(l).addClass("cameracurrent"); a(".cameraContent", g).eq(d).removeClass("cameracurrent"); m.delay((J + G) / ab * ob[c] * F * .5).css({ display: "block", height: Math.floor(u / C + kb + 1), "margin-top": 0, "margin-left": 0, opacity: 1, width: Math.floor(t / D + gb + 1) }).animate({ height: height, "margin-left": marginLeft, "margin-top": marginTop, width: width, opacity: opacityOnGrid }, J - G, O, o) } } }) } } var d = { alignment: "center", autoAdvance: true, mobileAutoAdvance: true, barDirection: "leftToRight", barPosition: "bottom", cols: 6, easing: "easeInOutExpo", mobileEasing: "", fx: "random", mobileFx: "", gridDifference: 250, height: "50%", imagePath: "images/", hover: true, loader: "pie", loaderColor: "#eeeeee", loaderBgColor: "#222222", loaderOpacity: .8, loaderPadding: 2, loaderStroke: 7, minHeight: "200px", navigation: true, navigationHover: true, mobileNavHover: true, opacityOnGrid: false, overlayer: true, pagination: true, playPause: true, pauseOnClick: true, pieDiameter: 38, piePosition: "rightTop", portrait: false, rows: 4, slicedCols: 12, slicedRows: 8, slideOn: "random", thumbnails: false, time: 7e3, transPeriod: 1500, onEndTransition: function () { }, onLoaded: function () { }, onStartLoading: function () { }, onStartTransition: function () { } }; var b = a.extend({}, d, b); var f = a(this).addClass("camera_wrap"); f.wrapInner('<div class="camera_src" />').wrapInner('<div class="camera_fakehover" />'); var g = a(".camera_fakehover", f); g.append('<div class="camera_target"></div>'); if (b.overlayer == true) { g.append('<div class="camera_overlayer"></div>') } g.append('<div class="camera_target_content"></div>'); var h; if (b.loader == "pie" && a.browser.msie && a.browser.version < 9) { h = "bar" } else { h = b.loader } if (h == "pie") { g.append('<div class="camera_pie"></div>') } else if (h == "bar") { g.append('<div class="camera_bar"></div>') } else { g.append('<div class="camera_bar" style="display:none"></div>') } if (b.playPause == true) { g.append('<div class="camera_commands"></div>') } if (b.navigation == true) { g.append('<div class="camera_prev"><span></span></div>').append('<div class="camera_next"><span></span></div>') } if (b.thumbnails == true) { f.append('<div class="camera_thumbs_cont" />') } if (b.thumbnails == true && b.pagination != true) { a(".camera_thumbs_cont", f).wrap("<div />").wrap('<div class="camera_thumbs" />').wrap("<div />").wrap('<div class="camera_command_wrap" />') } if (b.pagination == true) { f.append('<div class="camera_pag"></div>') } f.append('<div class="camera_loader"></div>'); a(".camera_caption", f).each(function () { a(this).wrapInner("<div />") }); var i = "pie_" + f.index(), j = a(".camera_src", f), k = a(".camera_target", f), l = a(".camera_target_content", f), m = a(".camera_pie", f), n = a(".camera_bar", f), o = a(".camera_prev", f), p = a(".camera_next", f), q = a(".camera_commands", f), r = a(".camera_pag", f), s = a(".camera_thumbs_cont", f); var t, u; var v = new Array; a("> div", j).each(function () { v.push(a(this).attr("data-src")) }); var w = new Array; a("> div", j).each(function () { if (a(this).attr("data-link")) { w.push(a(this).attr("data-link")) } else { w.push("") } }); var x = new Array; a("> div", j).each(function () { if (a(this).attr("data-target")) { x.push(a(this).attr("data-target")) } else { x.push("") } }); var y = new Array; a("> div", j).each(function () { if (a(this).attr("data-portrait")) { y.push(a(this).attr("data-portrait")) } else { y.push("") } }); var z = new Array; a("> div", j).each(function () { if (a(this).attr("data-alignment")) { z.push(a(this).attr("data-alignment")) } else { z.push("") } }); var A = new Array; a("> div", j).each(function () { if (a(this).attr("data-thumb")) { A.push(a(this).attr("data-thumb")) } else { A.push("") } }); var B = v.length; a(l).append('<div class="cameraContents" />'); var C; for (C = 0; C < B; C++) { a(".cameraContents", l).append('<div class="cameraContent" />'); if (w[C] != "") { var D = a("> div ", j).eq(C).attr("data-box"); if (typeof D !== "undefined" && D !== false && D != "") { D = 'data-box="' + a("> div ", j).eq(C).attr("data-box") + '"' } else { D = "" } a(".camera_target_content .cameraContent:eq(" + C + ")", f).append('<a class="camera_link" href="' + w[C] + '" ' + D + ' target="' + x[C] + '"></a>') } } a(".camera_caption", f).each(function () { var b = a(this).parent().index(), c = f.find(".cameraContent").eq(b); a(this).appendTo(c) }); k.append('<div class="cameraCont" />'); var E = a(".cameraCont", f); var F; for (F = 0; F < B; F++) { E.append('<div class="cameraSlide cameraSlide_' + F + '" />'); var G = a("> div:eq(" + F + ")", j); k.find(".cameraSlide_" + F).clone(G) } a(window).bind("load resize pageshow", function () { hb(); H() }); E.append('<div class="cameraSlide cameraSlide_' + F + '" />'); var I; f.show(); var t = k.width(); var u = k.height(); var J; a(window).bind("resize pageshow", function () { if (I == true) { K() } a("ul", s).animate({ "margin-top": 0 }, 0, hb); if (!j.hasClass("paused")) { j.addClass("paused"); if (a(".camera_stop", V).length) { a(".camera_stop", V).hide(); a(".camera_play", V).show(); if (h != "none") { a("#" + i).hide() } } else { if (h != "none") { a("#" + i).hide() } } clearTimeout(J); J = setTimeout(function () { j.removeClass("paused"); if (a(".camera_play", V).length) { a(".camera_play", V).hide(); a(".camera_stop", V).show(); if (h != "none") { a("#" + i).fadeIn() } } else { if (h != "none") { a("#" + i).fadeIn() } } }, 1500) } }); var L, M; var N, O, P, q, r; var Q, R; if (e() && b.mobileAutoAdvance != "") { O = b.mobileAutoAdvance } else { O = b.autoAdvance } if (O == false) { j.addClass("paused") } if (e() && b.mobileNavHover != "") { P = b.mobileNavHover } else { P = b.navigationHover } if (j.length != 0) { var S = a(".cameraSlide", k); S.wrapInner('<div class="camerarelative" />'); var T; var U = b.barDirection; var V = f; a("iframe", g).each(function () { var b = a(this); var c = b.attr("src"); b.attr("data-src", c); var d = b.parent().index(".camera_src > div"); a(".camera_target_content .cameraContent:eq(" + d + ")", f).append(b) }); function W() { a("iframe", g).each(function () { a(".camera_caption", g).show(); var c = a(this); var d = c.attr("data-src"); c.attr("src", d); var e = b.imagePath + "blank.gif"; var h = new Image; h.src = e; if (b.height.indexOf("%") != -1) { var i = Math.round(t / (100 / parseFloat(b.height))); if (b.minHeight != "" && i < parseFloat(b.minHeight)) { u = parseFloat(b.minHeight) } else { u = i } } else if (b.height == "auto") { u = f.height() } else { u = parseFloat(b.height) } c.after(a(h).attr({ "class": "imgFake", width: t, height: u })); var j = c.clone(); c.remove(); a(h).bind("click", function () { if (a(this).css("position") == "absolute") { a(this).remove(); if (d.indexOf("vimeo") != -1 || d.indexOf("youtube") != -1) { if (d.indexOf("?") != -1) { autoplay = "&autoplay=1" } else { autoplay = "?autoplay=1" } } else if (d.indexOf("dailymotion") != -1) { if (d.indexOf("?") != -1) { autoplay = "&autoPlay=1" } else { autoplay = "?autoPlay=1" } } j.attr("src", d + autoplay); R = true } else { a(this).css({ position: "absolute", top: 0, left: 0, zIndex: 10 }).after(j); j.css({ position: "absolute", top: 0, left: 0, zIndex: 9 }) } }) }) } W(); if (b.hover == true) { if (!e()) { g.hover(function () { j.addClass("hovered") }, function () { j.removeClass("hovered") }) } } if (P == true) { a(o, f).animate({ opacity: 0 }, 0); a(p, f).animate({ opacity: 0 }, 0); a(q, f).animate({ opacity: 0 }, 0); if (e()) { g.live("vmouseover", function () { a(o, f).animate({ opacity: 1 }, 200); a(p, f).animate({ opacity: 1 }, 200); a(q, f).animate({ opacity: 1 }, 200) }); g.live("vmouseout", function () { a(o, f).delay(500).animate({ opacity: 0 }, 200); a(p, f).delay(500).animate({ opacity: 0 }, 200); a(q, f).delay(500).animate({ opacity: 0 }, 200) }) } else { g.hover(function () { a(o, f).animate({ opacity: 1 }, 200); a(p, f).animate({ opacity: 1 }, 200); a(q, f).animate({ opacity: 1 }, 200) }, function () { a(o, f).animate({ opacity: 0 }, 200); a(p, f).animate({ opacity: 0 }, 200); a(q, f).animate({ opacity: 0 }, 200) }) } } a(".camera_stop", V).live("click", function () { O = false; j.addClass("paused"); if (a(".camera_stop", V).length) { a(".camera_stop", V).hide(); a(".camera_play", V).show(); if (h != "none") { a("#" + i).hide() } } else { if (h != "none") { a("#" + i).hide() } } }); a(".camera_play", V).live("click", function () { O = true; j.removeClass("paused"); if (a(".camera_play", V).length) { a(".camera_play", V).hide(); a(".camera_stop", V).show(); if (h != "none") { a("#" + i).show() } } else { if (h != "none") { a("#" + i).show() } } }); if (b.pauseOnClick == true) { a(".camera_target_content", g).mouseup(function () { O = false; j.addClass("paused"); a(".camera_stop", V).hide(); a(".camera_play", V).show(); a("#" + i).hide() }) } a(".cameraContent, .imgFake", g).hover(function () { Q = true }, function () { Q = false }); a(".cameraContent, .imgFake", g).bind("click", function () { if (R == true && Q == true) { O = false; a(".camera_caption", g).hide(); j.addClass("paused"); a(".camera_stop", V).hide(); a(".camera_play", V).show(); a("#" + i).hide() } }) } if (h != "pie") { n.append('<span class="camera_bar_cont" />'); a(".camera_bar_cont", n).animate({ opacity: b.loaderOpacity }, 0).css({ position: "absolute", left: 0, right: 0, top: 0, bottom: 0, "background-color": b.loaderBgColor }).append('<span id="' + i + '" />'); a("#" + i).animate({ opacity: 0 }, 0); var Z = a("#" + i); Z.css({ position: "absolute", "background-color": b.loaderColor }); switch (b.barPosition) { case "left": n.css({ right: "auto", width: b.loaderStroke }); break; case "right": n.css({ left: "auto", width: b.loaderStroke }); break; case "top": n.css({ bottom: "auto", height: b.loaderStroke }); break; case "bottom": n.css({ top: "auto", height: b.loaderStroke }); break } switch (U) { case "leftToRight": Z.css({ left: 0, right: 0, top: b.loaderPadding, bottom: b.loaderPadding }); break; case "rightToLeft": Z.css({ left: 0, right: 0, top: b.loaderPadding, bottom: b.loaderPadding }); break; case "topToBottom": Z.css({ left: b.loaderPadding, right: b.loaderPadding, top: 0, bottom: 0 }); break; case "bottomToTop": Z.css({ left: b.loaderPadding, right: b.loaderPadding, top: 0, bottom: 0 }); break } } else { m.append('<canvas id="' + i + '"></canvas>'); var _; var Z = document.getElementById(i); Z.setAttribute("width", b.pieDiameter); Z.setAttribute("height", b.pieDiameter); var ab; switch (b.piePosition) { case "leftTop": ab = "left:0; top:0;"; break; case "rightTop": ab = "right:0; top:0;"; break; case "leftBottom": ab = "left:0; bottom:0;"; break; case "rightBottom": ab = "right:0; bottom:0;"; break } Z.setAttribute("style", "position:absolute; z-index:1002; " + ab); var bb; var cb; if (Z && Z.getContext) { var db = Z.getContext("2d"); db.rotate(Math.PI * (3 / 2)); db.translate(-b.pieDiameter, 0) } } if (h == "none" || O == false) { a("#" + i).hide(); a(".camera_canvas_wrap", V).hide() } if (a(r).length) { a(r).append('<ul class="camera_pag_ul" />'); var eb; for (eb = 0; eb < B; eb++) { a(".camera_pag_ul", f).append('<li class="pag_nav_' + eb + '" style="position:relative; z-index:1002"><span><span>' + eb + "</span></span></li>") } a(".camera_pag_ul li", f).hover(function () { a(this).addClass("camera_hover"); if (a(".camera_thumb", this).length) { var b = a(".camera_thumb", this).outerWidth(), c = a(".camera_thumb", this).outerHeight(), d = a(this).outerWidth(); a(".camera_thumb", this).show().css({ top: "-" + c + "px", left: "-" + (b - d) / 2 + "px" }).animate({ opacity: 1, "margin-top": "-3px" }, 200); a(".thumb_arrow", this).show().animate({ opacity: 1, "margin-top": "-3px" }, 200) } }, function () { a(this).removeClass("camera_hover"); a(".camera_thumb", this).animate({ "margin-top": "-20px", opacity: 0 }, 200, function () { a(this).css({ marginTop: "5px" }).hide() }); a(".thumb_arrow", this).animate({ "margin-top": "-20px", opacity: 0 }, 200, function () { a(this).css({ marginTop: "5px" }).hide() }) }) } if (a(s).length) { var fb; if (!a(r).length) { a(s).append("<div />"); a(s).before('<div class="camera_prevThumbs hideNav"><div></div></div>').before('<div class="camera_nextThumbs hideNav"><div></div></div>'); a("> div", s).append("<ul />"); a.each(A, function (b, c) { if (a("> div", j).eq(b).attr("data-thumb") != "") { var d = a("> div", j).eq(b).attr("data-thumb"), e = new Image; e.src = d; a("ul", s).append('<li class="pix_thumb pix_thumb_' + b + '" />'); a("li.pix_thumb_" + b, s).append(a(e).attr("class", "camera_thumb")) } }) } else { a.each(A, function (b, c) { if (a("> div", j).eq(b).attr("data-thumb") != "") { var d = a("> div", j).eq(b).attr("data-thumb"), e = new Image; e.src = d; a("li.pag_nav_" + b, r).append(a(e).attr("class", "camera_thumb").css({ position: "absolute" }).animate({ opacity: 0 }, 0)); a("li.pag_nav_" + b + " > img", r).after('<div class="thumb_arrow" />'); a("li.pag_nav_" + b + " > .thumb_arrow", r).animate({ opacity: 0 }, 0) } }); f.css({ marginBottom: a(r).outerHeight() }) } } else if (!a(s).length && a(r).length) { f.css({ marginBottom: a(r).outerHeight() }) } var gb = true; if (a(q).length) { a(q).append('<div class="camera_play"></div>').append('<div class="camera_stop"></div>'); if (O == true) { a(".camera_play", V).hide(); a(".camera_stop", V).show() } else { a(".camera_stop", V).hide(); a(".camera_play", V).show() } } ib(); a(".moveFromLeft, .moveFromRight, .moveFromTop, .moveFromBottom, .fadeIn, .fadeFromLeft, .fadeFromRight, .fadeFromTop, .fadeFromBottom", g).each(function () { a(this).css("visibility", "hidden") }); b.onStartLoading.call(this); jb(); if (a(o).length) { a(o).click(function () { if (!j.hasClass("camerasliding")) { var c = parseFloat(a(".cameraSlide.cameracurrent", k).index()); clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", f).animate({ opacity: 0 }, 0); ib(); if (c != 0) { jb(c) } else { jb(B) } b.onStartLoading.call(this) } }) } if (a(p).length) { a(p).click(function () { if (!j.hasClass("camerasliding")) { var c = parseFloat(a(".cameraSlide.cameracurrent", k).index()); clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 0); ib(); if (c == B - 1) { jb(1) } else { jb(c + 2) } b.onStartLoading.call(this) } }) } if (e()) { g.bind("swipeleft", function (c) { if (!j.hasClass("camerasliding")) { var d = parseFloat(a(".cameraSlide.cameracurrent", k).index()); clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 0); ib(); if (d == B - 1) { jb(1) } else { jb(d + 2) } b.onStartLoading.call(this) } }); g.bind("swiperight", function (c) { if (!j.hasClass("camerasliding")) { var d = parseFloat(a(".cameraSlide.cameracurrent", k).index()); clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 0); ib(); if (d != 0) { jb(d) } else { jb(B) } b.onStartLoading.call(this) } }) } if (a(r).length) { a(".camera_pag li", f).click(function () { if (!j.hasClass("camerasliding")) { var c = parseFloat(a(this).index()); var d = parseFloat(a(".cameraSlide.cameracurrent", k).index()); if (c != d) { clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 0); ib(); jb(c + 1); b.onStartLoading.call(this) } } }) } if (a(s).length) { a(".pix_thumb img", s).click(function () { if (!j.hasClass("camerasliding")) { var c = parseFloat(a(this).parents("li").index()); var d = parseFloat(a(".cameracurrent", k).index()); if (c != d) { clearInterval(L); W(); a("#" + i + ", .camera_canvas_wrap", V).animate({ opacity: 0 }, 0); a(".pix_thumb", s).removeClass("cameracurrent"); a(this).parents("li").addClass("cameracurrent"); ib(); jb(c + 1); hb(); b.onStartLoading.call(this) } } }); a(".camera_thumbs_cont .camera_prevThumbs", V).hover(function () { a(this).stop(true, false).animate({ opacity: 1 }, 250) }, function () { a(this).stop(true, false).animate({ opacity: .7 }, 250) }); a(".camera_prevThumbs", V).click(function () { var b = 0, c = a(s).outerWidth(), d = a("ul", s).offset().left, e = a("> div", s).offset().left, f = e - d; a(".camera_visThumb", s).each(function () { var c = a(this).outerWidth(); b = b + c }); if (f - b > 0) { a("ul", s).animate({ "margin-left": "-" + (f - b) + "px" }, 500, H) } else { a("ul", s).animate({ "margin-left": 0 }, 500, H) } }); a(".camera_thumbs_cont .camera_nextThumbs", V).hover(function () { a(this).stop(true, false).animate({ opacity: 1 }, 250) }, function () { a(this).stop(true, false).animate({ opacity: .7 }, 250) }); a(".camera_nextThumbs", V).click(function () { var b = 0, c = a(s).outerWidth(), d = a("ul", s).outerWidth(), e = a("ul", s).offset().left, f = a("> div", s).offset().left, g = f - e; a(".camera_visThumb", s).each(function () { var c = a(this).outerWidth(); b = b + c }); if (g + b + b < d) { a("ul", s).animate({ "margin-left": "-" + (g + b) + "px" }, 500, H) } else { a("ul", s).animate({ "margin-left": "-" + (d - c) + "px" }, 500, H) } }) } } })(jQuery); (function (a) { a.fn.cameraStop = function () { var b = a(this), c = a(".camera_src", b), d = "pie_" + b.index(); c.addClass("stopped"); if (a(".camera_showcommands").length) { var e = a(".camera_thumbs_wrap", b) } else { var e = b } } })(jQuery); (function (a) { a.fn.cameraPause = function () { var b = a(this); var c = a(".camera_src", b); c.addClass("paused") } })(jQuery); (function (a) { a.fn.cameraResume = function () { var b = a(this); var c = a(".camera_src", b); if (typeof autoAdv === "undefined" || autoAdv !== true) { c.removeClass("paused") } } })(jQuery);
+
-
 
+
-
 
+
-
 
+
-
 
+
-
    jQuery(function () {
+
-
 
+
-
        jQuery('#camera_wrap_1').camera({
+
-
            thumbnails: true
+
-
        });
+
-
    });
+
-
</script>
+
-
-->
+
-
<!--<link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:USTC-Software/css/camera?action=raw&ctype=text/css" media="all">-->
+
-
<!--<style type="text/css">
+
-
    .camera_wrap a, .camera_wrap img,
+
-
.camera_wrap ol, .camera_wrap ul, .camera_wrap li,
+
-
.camera_wrap table, .camera_wrap tbody, .camera_wrap tfoot, .camera_wrap thead, .camera_wrap tr, .camera_wrap th, .camera_wrap td
+
-
.camera_thumbs_wrap a, .camera_thumbs_wrap img,
+
-
.camera_thumbs_wrap ol, .camera_thumbs_wrap ul, .camera_thumbs_wrap li,
+
-
.camera_thumbs_wrap table, .camera_thumbs_wrap tbody, .camera_thumbs_wrap tfoot, .camera_thumbs_wrap thead, .camera_thumbs_wrap tr, .camera_thumbs_wrap th, .camera_thumbs_wrap td {
+
-
background: none;
+
-
border: 0;
+
-
font: inherit;
+
-
font-size: 100%;
+
-
margin: 0;
+
-
padding: 0;
+
-
vertical-align: baseline;
+
-
list-style: none;
+
-
text-align: center !important;
+
 +
#content h1.firstHeading {
 +
visibility:hidden;
}
}
-
.camera_wrap {
+
#p-logo {
-
top:60px;
+
-
        margin: 0 auto;
+
display: none;
display: none;
-
position: relative;
 
-
z-index: 0;
 
-
}/*调整位置*/
 
-
.camera_wrap img {
 
-
max-width: none!important;
 
}
}
-
.camera_fakehover {
+
#searchform {
-
height: 85%;
+
     display: none;
-
min-height: 60px;
+
-
position: relative;
+
-
width:100%;
+
-
z-index: 1;
+
-
}/* 调整camera高度*/
+
-
.camera_wrap {
+
-
width: 100%;
+
-
} /*调整camera宽度*/
+
-
.camera_src {
+
-
display: none;
+
-
}
+
-
.cameraCont, .cameraContents {
+
-
height: 100%;
+
-
position: relative;
+
-
width: 100%;
+
-
z-index: 1;
+
-
}
+
-
.cameraSlide {
+
-
bottom: 0;
+
-
left: 0;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 0;
+
-
width: 100%;
+
-
}
+
-
.cameraContent {
+
-
bottom: 0;
+
-
display: none;
+
-
left: 0;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 0;
+
-
width: 100%;
+
-
}
+
-
.camera_target {
+
-
bottom: 0;
+
-
height: 100%;
+
-
left: 0;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
right: 0;
+
-
text-align: left;
+
-
top: 0;
+
-
width: 100%;
+
-
z-index: 0;
+
-
}
+
-
.camera_overlayer {
+
-
bottom: 0;
+
-
height: 100%;
+
-
left: 0;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 0;
+
-
width: 100%;
+
-
z-index: 0;
+
-
}
+
-
.camera_target_content {
+
-
bottom: 0;
+
-
left: 0;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 0;
+
-
z-index: 2;
+
-
}
+
-
.camera_target_content .camera_link {
+
-
     background: url url(https://static.igem.org/mediawiki/2013/3/3e/USTC-Software_Blank.gif);
+
-
display: block;
+
-
height: 100%;
+
-
text-decoration: none;
+
-
}
+
-
.camera_loader {
+
-
    background: #fff url(https://static.igem.org/mediawiki/2013/1/14/USTC-Software_Camera-loader.gif) no-repeat center;
+
-
background: rgba(255, 255, 255, 0.9) url(https://static.igem.org/mediawiki/2013/1/14/USTC-Software_Camera-loader.gif) no-repeat center;
+
-
border: 1px solid #ffffff;
+
-
-webkit-border-radius: 18px;
+
-
-moz-border-radius: 18px;
+
-
border-radius: 18px;
+
-
height: 36px;
+
-
left: 50%;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
margin: -18px 0 0 -18px;
+
-
top: 50%;
+
-
width: 36px;
+
-
z-index: 3;
+
-
}
+
-
.camera_bar {
+
-
bottom: 0;
+
-
left: 0;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 0;
+
-
z-index: 3;
+
-
}
+
-
.camera_thumbs_wrap.camera_left .camera_bar, .camera_thumbs_wrap.camera_right .camera_bar {
+
-
height: 100%;
+
-
position: absolute;
+
-
width: auto;
+
-
}
+
-
.camera_thumbs_wrap.camera_bottom .camera_bar, .camera_thumbs_wrap.camera_top .camera_bar {
+
-
height: auto;
+
-
position: absolute;
+
-
width: 100%;
+
-
}
+
-
.camera_nav_cont {
+
-
height: 65px;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
right: 9px;
+
-
top: 15px;
+
-
width: 100%;
+
-
z-index: 4;
+
-
}
+
-
.camera_caption {
+
-
bottom: 0;
+
-
display: block;
+
-
position: absolute;
+
-
width: 100%;
+
-
font-family:'Open Sans',"Helvetica Neue",arial,serif;
+
}
}
-
.camera_caption em {
+
.left-menu {
-
font-family: "Helvetica Neue","Arial",sans-serif;
+
background-color: #555;
-
font-style:normal;
+
-
font-size: 12px;
+
-
/*margin-left:0px;*/
+
-
}
+
-
 
+
-
 
+
-
.camera_caption > div {
+
-
padding: 10px 20px;
+
-
}
+
-
.camerarelative {
+
-
overflow: hidden;
+
-
position: relative;
+
-
}
+
-
.imgFake {
+
-
cursor: pointer;
+
-
}
+
-
.camera_prevThumbs {
+
-
bottom: 4px;
+
-
cursor: pointer;
+
-
left: 0;
+
-
position: absolute;
+
-
top: 4px;
+
-
visibility: hidden;
+
-
width: 30px;
+
-
z-index: 10;
+
-
}
+
-
.camera_prevThumbs div {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat -160px 0;
+
-
display: block;
+
-
height: 40px;
+
-
margin-top: -20px;
+
-
position: absolute;
+
-
top: 50%;
+
-
width: 30px;
+
-
}
+
-
.camera_nextThumbs {
+
-
bottom: 4px;
+
-
cursor: pointer;
+
-
position: absolute;
+
-
right: 0;
+
-
top: 4px;
+
-
visibility: hidden;
+
-
width: 30px;
+
-
z-index: 10;
+
-
}
+
-
.camera_nextThumbs div {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat -190px 0;
+
-
display: block;
+
-
height: 40px;
+
-
margin-top: -20px;
+
-
position: absolute;
+
-
top: 50%;
+
-
width: 30px;
+
-
}
+
-
.camera_command_wrap .hideNav {
+
-
display: none;
+
-
}
+
-
.camera_command_wrap {
+
-
left: 0;
+
-
position: relative;
+
-
right:0;
+
-
z-index: 4;
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul {
+
-
list-style: none;
+
-
margin: 0;
+
-
padding: 0;
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li {
+
-
-webkit-border-radius: 8px;
+
-
-moz-border-radius: 8px;
+
-
border-radius: 8px;
+
-
cursor: pointer;
+
-
display: inline-block;
+
-
height: 16px;
+
-
margin: 20px 5px;
+
-
position: relative;
+
-
text-align: left;
+
-
text-indent: -9999px;
+
-
width: 16px;
+
-
}
+
-
.camera_commands_emboss .camera_pag .camera_pag_ul li {
+
-
-moz-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
-webkit-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li > span {
+
-
-webkit-border-radius: 5px;
+
-
-moz-border-radius: 5px;
+
-
border-radius: 5px;
+
-
height: 8px;
+
-
left: 4px;
+
-
overflow: hidden;
+
-
position: absolute;
+
-
top: 4px;
+
-
width: 8px;
+
-
}
+
-
.camera_commands_emboss .camera_pag .camera_pag_ul li:hover > span {
+
-
-moz-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
-webkit-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {
+
-
-moz-box-shadow: 0;
+
-
-webkit-box-shadow: 0;
+
-
box-shadow: 0;
+
-
}
+
-
.camera_pag_ul li img {
+
-
display: none;
+
-
position: absolute;
+
-
}
+
-
.camera_pag_ul .thumb_arrow {
+
-
    border-left: 4px solid transparent;
+
-
    border-right: 4px solid transparent;
+
-
    border-top: 4px solid;
+
-
top: 0;
+
-
left: 50%;
+
-
margin-left: -4px;
+
-
position: absolute;
+
-
}
+
-
.camera_prev, .camera_next, .camera_commands {
+
-
cursor: pointer;
+
-
height: 40px;
+
-
margin-top: -20px;
+
-
position: absolute;
+
-
top: 50%;
+
-
width: 40px;
+
-
z-index: 2;
+
-
}
+
-
.camera_prev {
+
-
left: 0;
+
-
}
+
-
.camera_prev > span {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat 0 0;
+
-
display: block;
+
-
height: 40px;
+
-
width: 40px;
+
-
}
+
-
.camera_next {
+
-
right: 0;
+
-
}
+
-
.camera_next > span {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat -40px 0;
+
-
display: block;
+
-
height: 40px;
+
-
width: 40px;
+
-
}
+
-
.camera_commands {
+
-
right: 41px;
+
-
}
+
-
.camera_commands > .camera_play {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat -80px 0;
+
-
height: 40px;
+
-
width: 40px;
+
-
}
+
-
.camera_commands > .camera_stop {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/33/USTC-Software_Camera_skins.png) no-repeat -120px 0;
+
-
display: block;
+
-
height: 40px;
+
-
width: 40px;
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li {
+
-
-webkit-border-radius: 8px;
+
-
-moz-border-radius: 8px;
+
-
border-radius: 8px;
+
-
cursor: pointer;
+
-
display: inline-block;
+
-
height: 16px;
+
-
margin: 20px 5px;
+
-
position: relative;
+
-
text-indent: -9999px;
+
-
width: 16px;
+
-
}
+
-
.camera_thumbs_cont {
+
-
-webkit-border-bottom-right-radius: 4px;
+
-
-webkit-border-bottom-left-radius: 4px;
+
-
-moz-border-radius-bottomright: 4px;
+
-
-moz-border-radius-bottomleft: 4px;
+
-
border-bottom-right-radius: 4px;
+
-
border-bottom-left-radius: 4px;
+
-
overflow: hidden;
+
-
position: relative;
+
-
width: 100%;
+
-
}
+
-
.camera_commands_emboss .camera_thumbs_cont {
+
-
-moz-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
-webkit-box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
box-shadow:
+
-
0px 1px 0px rgba(255,255,255,1),
+
-
inset 0px 1px 1px rgba(0,0,0,0.2);
+
-
}
+
-
.camera_thumbs_cont > div {
+
-
float: left;
+
-
width: 100%;
+
-
}
+
-
.camera_thumbs_cont ul {
+
-
overflow: hidden;
+
-
padding: 3px 4px 8px;
+
-
position: relative;
+
-
text-align: center;
+
-
}
+
-
.camera_thumbs_cont ul li {
+
-
display: inline;
+
-
padding: 0 4px;
+
-
}
+
-
.camera_thumbs_cont ul li > img {
+
-
border: 1px solid;
+
-
cursor: pointer;
+
-
margin-top: 5px;
+
-
vertical-align:bottom;
+
-
}
+
-
.camera_clear {
+
-
display: block;
+
-
clear: both;
+
-
}
+
-
.showIt {
+
-
display: none;
+
-
}
+
-
.camera_clear {
+
-
clear: both;
+
-
display: block;
+
-
height: 1px;
+
-
margin: -1px 0 25px;
+
-
position: relative;
+
-
}
+
-
 
+
-
 
+
-
 
+
-
.pattern_1 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/7/7f/USTC-Software_Overlay1.png) repeat;
+
-
}
+
-
.pattern_2 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/4/44/USTC-Software_Overlay2.png) repeat;
+
-
}
+
-
.pattern_3 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/c/c9/USTC-Software_Overlay3.png) repeat;
+
-
}
+
-
.pattern_4 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/e/ec/USTC-Software_Overlay4.png) repeat;
+
-
}
+
-
.pattern_5 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/f/f3/USTC-Software_Overlay5.png) repeat;
+
-
}
+
-
.pattern_6 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/4/41/USTC-Software_Overlay6.png) repeat;
+
-
}
+
-
.pattern_7 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/2/28/USTC-Software_Overlay7.png) repeat;
+
-
}
+
-
.pattern_8 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/3/3a/USTC-Software_Overlay8.png) repeat;
+
-
}
+
-
.pattern_9 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/b/b3/USTC-Software_Overlay9.png) repeat;
+
-
}
+
-
.pattern_10 .camera_overlayer {
+
-
background: url(https://static.igem.org/mediawiki/2013/4/4e/USTC-Software_Overlay10.png) repeat;
+
-
}
+
-
.camera_caption {
+
-
color: #FFF;
+
-
text-shadow: none;
+
-
}
+
-
 
+
-
.camera_caption > div {
+
-
background: #000;
+
-
background: rgba(0, 0, 0, 0.8);
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li {
+
-
background: #b7b7b7;
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li:hover > span {
+
-
background: #b7b7b7;
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li.cameracurrent > span {
+
-
background: #434648;
+
-
}
+
-
.camera_pag_ul li img {
+
-
border: 4px solid #e6e6e6;
+
-
-moz-box-shadow: 0px 3px 6px rgba(0,0,0,.5);
+
-
-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,.5);
+
-
box-shadow: 0px 3px 6px rgba(0,0,0,.5);
+
-
}
+
-
.camera_pag_ul .thumb_arrow {
+
-
    border-top-color: #e6e6e6;
+
-
}
+
-
.camera_prevThumbs, .camera_nextThumbs, .camera_prev, .camera_next, .camera_commands, .camera_thumbs_cont {
+
-
background: #d8d8d8;
+
-
background: rgba(216, 216, 216, 0.85);
+
-
}
+
-
.camera_wrap .camera_pag .camera_pag_ul li {
+
-
background: #b7b7b7;
+
-
}
+
-
.camera_thumbs_cont ul li > img {
+
-
border-color: 1px solid #000;
+
-
}
+
-
 
+
-
 
+
-
.camera_azure_skin .camera_prevThumbs div {
+
-
background-position: -160px -240px;
+
-
}
+
-
.camera_azure_skin .camera_nextThumbs div {
+
-
background-position: -190px -240px;
+
-
}
+
-
.camera_azure_skin .camera_prev > span {
+
-
background-position: 0 -240px;
+
-
}
+
-
.camera_azure_skin .camera_next > span {
+
-
background-position: -40px -240px;
+
-
}
+
-
.camera_azure_skin .camera_commands > .camera_play {
+
-
background-position: -80px -240px;
+
-
}
+
-
.camera_azure_skin .camera_commands > .camera_stop {
+
-
background-position: -120px -240px;
+
-
}
+
-
</style>-->
+
-
 
+
-
<!--<link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:USTC-Software/css?action=raw&ctype=text/css" media="all">-->
+
-
<!--<style type="text/css">
+
-
    body{
+
-
    background:#32608b;
+
-
    }
+
-
#home_1 {
+
-
    margin: 0 auto;
+
-
    position: relative;
+
-
    height:522px;
+
-
    background: rgba(255,255,255,1);
+
-
    width:960px;
+
-
    /*margin-left:172px;*/
+
-
    margin-top:55px;
+
-
    -moz-border-radius:15px;
+
-
    -webkit-border-radius:15px;
+
-
    border-radius: 15px;
+
-
    /*display:block;*/
+
-
    border-bottom: 1px #fff dashed;
+
-
}
+
-
 
+
-
#home_1 .line {
+
-
    border-bottom: 1px dotted #CCCCCC;
+
-
    background:#fff;
+
-
    width:100%;
+
-
    height:35px;
+
-
    position: absolute;
+
-
    top:15px;
+
-
}
+
-
 
+
-
#home_1 .line h1{
+
-
    position: relative;
+
-
    font-family:"Times New Roman", Times, serif;
+
-
    color:#0b83d3;
+
-
    /*margin-top:0px;*/
+
-
    margin-left:5px;
+
-
}
+
-
 
-
 
-
 
-
#home_2 {
 
-
    margin: 0 auto;
 
-
    position: relative;
 
-
    height:1200px;
 
-
    /*background: rgba(255,255,255,0.2); */
 
-
    display:block;
 
-
    width:960px;
 
-
    margin-top:10px;
 
-
    /*-moz-border-radius: 1em;
 
-
    -webkit-border-radius: 1em;
 
-
    border-radius: 1em;*/
 
-
    border-bottom: 1px #fff dashed;
 
}
}
-
 
+
.left-menu a {
-
 
+
    color: #000;
-
#home_3 {  
+
-
    position: relative;
+
-
    height:auto;
+
-
    overflow: hidden;
+
-
    background:#36526c;
+
-
    display: block;
+
-
    width:960px;
+
-
    margin:0 auto; 
+
-
    margin-top:0px;
+
-
    border-bottom: 1px dashed #fff;
+
}
}
-
 
-
 
-
/*.sprite {
+
div#top-section{ /*the div containing the entire top bar*/
-
    position: absolute;
+
height: 20px;
-
    height: 100%;
+
margin-bottom: 0px !important;
-
    z-index: 200;
+
border: none;
-
    padding: 0;
+
-
    width: 960px;
+
}
}
-
.screen {
 
-
    position: absolute;
 
-
    height: 100%;
 
-
    z-index: 500;
 
-
    padding: 0;
 
-
    width: 960px;
 
-
}*/
 
-
 
+
#content{
-
 
+
margin-top: 0px;
-
/*#home2 .sprite {
+
-
    background: url(../pictures/Logo2.png) 50% 0 no-repeat fixed;
+
-
    opacity:0.05;
+
-
    width:100%;
+
}
}
-
#home2 .screen {
 
-
    perspective: 50%;
 
-
    margin-left:0px;
 
-
    margin-top:5px;
 
-
}*/
 
 +
#search-controls {
 +
overflow:hidden;
 +
display:none;
 +
background: none;
 +
position: absolute;
 +
top: 170px;
 +
right: 40px;
 +
}
-
/*#home3 .sprite {
 
-
    background: url(../b-bg.png) 50% no-repeat fixed;
 
-
    margin-left:210px;
 
-
    margin-top:0px;
 
-
}
 
 +
div#header {
 +
width: 975px;
 +
text-align: left;
 +
margin-left: auto;
 +
margin-right: auto;
 +
margin-bottom: 0px !important;
 +
-
#home3 .screen {
+
#menubar {
-
    background: url(../2.png) 50% no-repeat;
+
position: absolute;
-
    margin-left:0px;
+
background: none;
-
    margin-top:5px;
+
color: black;
-
}*/
+
-
 
+
-
 
+
-
 
+
-
 
+
-
#video {
+
-
    float:left;
+
-
    background: #fff /*url(https://static.igem.org/mediawiki/2013/4/42/USTC-Software_Video.jpg) repeat-x*/;
+
-
    margin-top:16px;
+
-
    margin-right:0px;
+
-
    margin-left:15px;
+
-
    width:420px;
+
-
    height:270px;
+
-
    -moz-border-radius: 0.5em;
+
-
    -webkit-border-radius:0.5em;
+
-
    border-radius: 0.5em;
+
}
}
-
 
+
.left-menu, .right-menu{
-
#abstract {
+
position: absolute;
-
    float: right;
+
background: none;
-
    width:470px;
+
color: black;
-
    margin-right:15px;
+
-
    margin-top:15px;
+
-
    height:270px;  
+
-
    background: #fff url(https://static.igem.org/mediawiki/2013/9/96/USTC-Software_Box_header.png) repeat-x;
+
-
    padding:13px;
+
-
    padding-top:0px;
+
-
    -moz-border-radius: 0.5em;
+
-
    -webkit-border-radius:0.5em;
+
-
    border-radius: 0.5em;
+
}
}
-
 
+
.left-menu li a, .right-menu li a {
-
#abstract p {
+
color: #000 !important;
-
    font-family: "Helvetica Neue","Arial",sans-serif;
+
-
    font-size: 13.5px;
+
-
    margin-bottom: 0px;
+
}
}
-
#abstract p:first-letter { font-size: 20px;}
 
-
#abstract h1 {
+
.left-menu ul li, .right-menu ul li a{
-
    color: #0b83d3;
+
background: none;
-
    font-family: 'Open Sans',arial,serif;
+
color: #000 !important;
-
    text-align:center;
+
-
    font-size: 26px;
+
-
    margin-bottom: 0px;
+
}
}
-
 
+
.left-menu li a:hover, .right-menu li a:hover, .right-menu li a:visited, .right-menu li a:active {
-
 
+
    color: #000 !important;
-
#contain {
+
-
    position:absolute;
+
-
    float:left;
+
-
    width:620px;
+
-
    height:790px;
+
-
    background: #fff url(https://static.igem.org/mediawiki/2013/9/96/USTC-Software_Box_header.png) repeat-x;
+
-
    top:310px;
+
-
    left:15px;
+
-
    -moz-border-radius: 0.5em;
+
-
    -webkit-border-radius:0.5em;
+
-
    border-radius: 0.5em;
+
}
}
-
 
+
#catlinks{
-
 
+
display:none;
-
#contain h2 {
+
-
    font-size:18px;
+
-
    font-family: 'Open Sans',arial,serif;
+
-
    margin-left:10px;
+
}
}
-
 
+
/*important for background colours*/
-
 
+
.mediawiki{
-
#contain p {
+
background: #ffffff;
-
    font-size:12px;
+
-
    font-family: "Helvetica Neue","Arial",sans-serif;
+
}
}
 +
/***End minimal header***/
-
#description_l {
+
/*Base styles*/
-
    height:auto;
+
#content{
-
    width:300px;
+
border: none;
-
    float:left;
+
-
    clear:left;
+
-
    margin-left:10px;
+
}
}
-
 
+
h1, h2,h3, h4, #css-full, #css-mobi{
-
 
+
font-family: Myriad Pro, Gill Sans MT, Trebuchet MS, Arial, Sans-Serif;
-
#description_l h3 {
+
border: 0;
-
    font-size:16px;
+
font-weight: 400;
-
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;
+
}
}
-
 
+
p, div.thumb div div.thumbcaption{
-
 
+
font-family: Calibri, Sans-Serif;
-
#description_r {
+
font-weight: normal;
-
    height:auto;
+
color: black;
-
    width:300px;  
+
margin-bottom: 10px;
-
    float:right;
+
padding-left: 5px;
-
    margin-top:0px;
+
-
    margin-right:0px;
+
}
}
-
#description_r h3 {
+
#css-full, #css-mobi{
-
    font-size:16px;
+
position: absolute;
-
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;
+
float: right;
 +
color: black;
 +
font-size: 1.3em;
 +
top: 0px;
 +
right: 15px;
 +
display: block;
 +
padding: 10px;
}
}
-
 
+
#jsnotice{
-
#ash {
+
background-color: #4ED92F;
-
    position:absolute;
+
-
    float:right;
+
-
    width:300px;
+
-
    height:790px;
+
-
    background: #EBEBEB;
+
-
    right:15px;
+
-
    top:310px;
+
-
    -moz-border-radius: 0.5em;
+
-
    -webkit-border-radius:0.5em;
+
-
    border-radius: 0.5em;
+
}
}
-
 
+
#table{
-
 
+
margin: 10px;
-
#ash_container {
+
-
    position: relative;
+
-
    margin-left:30px;
+
-
    width:80%;
+
}
}
-
 
+
#textlink a:link,
-
 
+
a:visited{
-
#ash_container p {  
+
font-family: Calibri, Sans-Serif;
-
    font-family: "Helvetica Neue","Arial",sans-serif;  
+
font-weight: normal;
-
    font-size: 12px;  
+
color: #008000;
-
    line-height: 18px;
+
text-decoration:none;  
-
    margin: 6px 0 16px;
+
}
}
-
 
+
#textlink a:hover,
-
#ash_container span a {
+
a:active{
-
    color:#0b83d3;
+
font-family: Calibri, Sans-Serif;
-
    font-family: "Helvetica Neue","Arial",sans-serif;  
+
font-weight: normal;
-
    font-size: 12px;  
+
color: #008000;
-
    line-height: 18px;
+
text-decoration:underline;
-
    margin: 6px 0 16px;
+
-
    text-decoration: none;
+
}
}
-
 
+
/*======
-
#ash_container span:hover a { text-decoration:underline;}
+
Desktop Styling
-
 
+
======*/
-
#ash_container h3 {
+
-
    font-family:'Open Sans',"Helvetica Neue",arial,serif;
+
/***Body styling***/
-
    font-size: 18px;
+
h1{
-
    /*font-weight: 600;*/
+
font-size: 2.5em;
-
    line-height: 20px;
+
-
    margin-bottom: 15px;
+
-
    padding-top: 10px;
+
}
}
-
 
+
h2{
-
 
+
font-size: 1.7em;
-
#contain img {
+
-
    width:300px;
+
-
    height:185px;
+
}
}
-
 
+
h3{
-
 
+
font-size: 1.7em;
-
#footer-box{
+
-
    /*-moz-border-radius: 1em;
+
-
    -webkit-border-radius: 1em;
+
-
    border-radius: 1em;*/
+
-
    margin-left: 10px;
+
-
    width: 950px;
+
-
    padding: 5px;
+
-
    background-color:#36526c;
+
-
    margin: 0 auto;
+
-
    border:0px;
+
}
}
-
 
+
#box1{
-
#footer-box a{ color: #fff !important;}
+
width: 980px;
-
</style>-->
+
margin-top: -8px;
-
 
+
background: #fffff;
-
<!--<link rel="stylesheet" type="text/css" href="https://2013.igem.org/Team:USTC-Software/css/thanks?action=raw&ctype=text/css" media="all">-->
+
float: left;
-
<!--<style type="text/css">
+
padding-bottom: 10px;
-
    .img{
+
margin-bottom: 5px;
-
    -webkit-transform:scale(0.6);
+
-
    -moz-transform:scale(0.6);
+
-
    -o-transform:scale(0.6);
+
-
    -ms-transform:scale(0.6);
+
-
    float:left;
+
-
    margin-left:-50px;
+
-
    margin-right:-50px;
+
-
    margin-top:-10px;
+
-
    -webkit-transition-duration: 0.5s;
+
-
    -moz-transition-duration: 0.5s;
+
-
    -o-transition-duration: 0.5s;
+
-
    -ms-transition-duration: 0.5s;
+
}
}
 +
#box1 h2{
 +
}
 +
#box1 p{
 +
font-size: 1.25em;
 +
}
-
.img img{
+
#UCSFLogo{
-
    width:290px;
+
display: block;
-
    height: 65px;
+
float: left;
-
    padding-left:20px;
+
width: 250px;
-
    padding-right:20px;
+
height:200px;
-
}
+
background: url('https://static.igem.org/mediawiki/2013/6/6b/UCSF2013_Logonew.png');
 +
background-position: top;
 +
margin: 40px;
 +
}
 +
 +
/*Floatbox styling*/
 +
.floatbox
 +
              {
 +
                    width:980px;
 +
                    float:left;
 +
                    background-color: #fffff;
 +
                    margin-top: 10px;
 +
                    padding-bottom: 10px;
 +
                    margin-bottom: 5px;
 +
                    text-align:justify;
 +
              }
 +
/*Showbox Styling*/
-
.img:hover{
+
      .showbox tr:first-child td {  
-
    -webkit-transform:scale(0.8);
+
          border-top: 0px;
-
    -webkit-box-shadow:0px 0px 30px #36526C;
+
          padding-top: 1px
-
    -moz-transform:scale(0.8);
+
      }
-
    -moz-box-shadow:0px 0px 30px #36526C;
+
      .showbox tr:last-child td {
-
    -o-transform:scale(0.8);
+
          border-bottom: 0px;
-
    -o-box-shadow:0px 0px 30px #36526C;
+
          padding-bottom: 1px
-
    -ms-transform:scale(0.8);
+
      }
-
    -ms-box-shadow:0px 0px 30px #36526C;
+
      .showbox tr td:first-child {
-
}
+
          border-left: 0px;
 +
          padding-left: 1px;
 +
      }
 +
      .showbox tr td:last-child {
 +
          border-right: 0px;
 +
          padding-right: 1px;
 +
      }
-
+
      .showbox {
-
.img .mask1, .img .mask2, .img .mask3, .img .mask4,
+
          margin-top: -18px;    
-
.img .mask5, .img .mask6, .img .mask7, .img .mask8{
+
          background:none;
-
    background-color:#36526C;
+
          color:#ffffff;
-
    width:100%;
+
          vertical-align:baseline;
-
    height:65px;
+
          border-collapse:collapse;
-
    position: absolute;
+
          }
-
    cursor:pointer;
+
      .showbox td {
-
    -webkit-transition-duration: 0.5s;
+
          margin-top: -18px;         
-
    -moz-transition-duration: 0.5s;
+
          background:none;
-
    -o-transition-duration:0.5s;
+
          border:none;
-
    -ms-transition-duration:0.5s;
+
          padding:10px;
-
}
+
          width:50%;
-
+
          }
-
+
      .showbox p {
-
.img .mask1{background: url(https://static.igem.org/mediawiki/2013/6/60/USTC-Software_DB-mask.png) center no-repeat;}
+
          text-align:top;
-
.img .mask2{background: url(https://static.igem.org/mediawiki/2013/3/38/USTC-Software_Ustcif-mask.png) center no-repeat;}
+
          color:black;
-
.img .mask3{background: url(https://static.igem.org/mediawiki/2013/e/e0/USTC-Software_Teaching-mask.png) center no-repeat;}
+
          margin:0px;
-
.img .mask4{background: url(https://static.igem.org/mediawiki/2013/c/ce/USTC-Software_Life-mask.png) center no-repeat;}
+
          font-size: 1.25em;
-
.img .mask5{background: url(https://static.igem.org/mediawiki/2013/1/16/USTC-Software_Young-mask.png) center no-repeat;}
+
          }
-
.img .mask6{background: url(https://static.igem.org/mediawiki/2013/9/96/USTC-Software_Physics-mask.png) center no-repeat;}
+
      .showbox img {
-
.img .mask7{background: url(https://static.igem.org/mediawiki/2013/3/36/USTC-Software_Math-mask.png) center no-repeat;}
+
          height:150px;
-
.img .mask8{background: url(https://static.igem.org/mediawiki/2013/5/55/USTC-Software_Nuclear-mask.png) center no-repeat;}
+
          width:180px;
 +
          float:left;
 +
          border-radius:4px;
 +
          margin-right:10px;
 +
          }
 +
      a:hover {
 +
          text-decoration:none;
 +
          }
 +
  /*end showboxstyling */ 
 +
</style>
 +
</head>
-
#img:hover .mask1, #img:hover .mask2,  
+
<body>
-
#img:hover .mask3, #img:hover .mask4,
+
<!--Abstract-->
-
#img:hover .mask5, #img:hover .mask6,  
+
<div id="box1" align="justify">
-
#img:hover .mask7, #img:hover .mask8
+
<a id="UCSFLogo">
-
{
+
</a>
-
    height:0;
+
<h2><center>Operation CRISPR: Deploying precision guided tools to target unique species in a complex microbiome</h2></center>
-
    margin-top:35px;
+
<p>In microbial communities, bacterial populations are commonly controlled using indiscriminate, broad range antibiotics. There are few ways to target specific strains effectively without disrupting the entire microbiome and local environment. The goal of our project is to take advantage of a natural horizontal gene transfer mechanism in bacteria to precisely affect gene expression in selected strains. We combine bacterial conjugation with CRISPRi, an RNAi-like repression system developed from bacteria, to regulate gene expression in targeted strains within a complex microbial community. One possible application is to selectively repress pathogenic genes in a microbiome, leaving the community makeup unaffected. In addition, we use CRISPRi to lay the groundwork for transferring large circuits that enable complex functionality and decision-making in cells. </p>
-
}
+
-
#sponsors1 { margin-left:20px;}
+
</div>
-
#sponsors2 { margin-left:20px;}
+
 +
<!--Project Box-->
 +
<div class="floatbox">
 +
<table class="showbox">
 +
<tr>
 +
              <td>
-
#home_3 h2 {
+
                    <div><a href="https://2013.igem.org/Team:UCSF/About_Us">
-
    display: block;
+
<img src="https://static.igem.org/mediawiki/2013/2/29/2013UCSF_MainBox_Team.jpg" class="blur"></a>
-
    width:100%;
+
</div>
-
    font-family: "Helvetica Neue","Arial",sans-serif;
+
                    <a href="https://2013.igem.org/Team:UCSF/About_Us"><h3>Team</h3></a>
-
    font-size:24px;
+
                    <p>Meet our dedicated team of under-graduates who conceived of, planned, and carried out the whole project.</p></a>
-
    color: #fff;
+
              </td>
-
    border-bottom: 1px dashed #fff;
+
             
-
    padding-bottom:10px;
+
<td>
-
}
+
              <a href="https://2013.igem.org/Team:UCSF/Project/Background"><img src="https://static.igem.org/mediawiki/2013/c/c2/UCSF2013_MainBox_Project-1.jpg" class="blur"></a>
-
</style>-->
+
              <a href="https://2013.igem.org/Team:UCSF/Project/Background"><h3>Project</h3></a>
 +
                    <p>Discover our precision guided tools to target unique species in a complex microbiome and our groundwork for transferring large circuits that enable complex functionality and decision-making in cells.</p>           
 +
</td>       
 +
</tr>
-
</head>
+
<tr>
 +
            <td>
 +
                    <a href="https://2013.igem.org/Team:UCSF/Modeling">
 +
<img src="https://static.igem.org/mediawiki/2013/a/af/UCSF2013_MainBox_Modeling-1.jpg" class="blur" />
 +
<!--img src="https://static.igem.org/mediawiki/2013/9/97/UCD_2013_HO_Button.jpg" class="blur"--></a>
 +
                    <a href="https://2013.igem.org/Team:UCSF/Modeling"><h3>Modeling</h3></a>
 +
                    <p>Take a look at how we use mathematical modeling to facilitate the design and construct of our project.                    </p>
 +
              </td>
 +
<td>
 +
              <a href="https://2013.igem.org/Team:UCSF/Exploratorium"><img src="https://static.igem.org/mediawiki/2013/7/7c/UCSF2013_MainBox_HP.jpg" class="blur"</a>
 +
              <a href="https://2013.igem.org/Team:UCSF/Exploratorium"><h3>Human Practice</h3></a>
 +
                    <p>Examine how we teach Synthetic Biology to the general public through night event at Exploratorium and to high school students through a collaboration with Lincoln High School.</p>
 +
              </td>   
 +
      </tr>
 +
</table>
-
<body>
+
</div>
-
<div id="home_1">
 
-
 
+
<!--Sponsors-->
-
  <div class="camera_wrap camera_azure_skin" id="camera_wrap_1">
+
<div id="box1" align="justify">
-
    <div data-thumb="https://static.igem.org/mediawiki/2013/4/4a/USTC-Software_1.jpg" data-src="https://static.igem.org/mediawiki/2013/c/c4/USTC-Software_1.png">
+
<h2><center>Special Thanks to Our 2013 iGEM Team Sponsors!</h2></center>
-
            <div class="camera_caption fadeFromBottom"> <em>USTC-Software —— The unicorn consists "USTC".</em> </div>
+
<center><img style="margin-bottom:0px; width: 500px; padding:2;"src="https://dl.dropbox.com/u/24404809/iGEM%202012/igem%202012%20website%20photos/Logos/2012%20Sponsors.jpg" usemap="#sponsor">
-
        </div>
+
<map name="sponsor">
-
    <div data-thumb="https://static.igem.org/mediawiki/2013/1/19/Ustc-software_2s.jpg" data-src="https://static.igem.org/mediawiki/2013/0/0c/Ustc-software_2.jpg">
+
              <area shape="rect" coords="0,0,200,100" href="http://www.lifetechnologies.com/us/en/home.html" />
-
            <div class="camera_caption fadeFromBottom"><em>Having discussion with iGEM Software co-head judge, Gil Alterovitz.</em></div>
+
              <area shape="rect" coords="200,0,450,100" href="http://systemsbiology.ucsf.edu/" />
-
        </div>
+
              <area shape="rect" coords="0,95,180,200" href="http://www.qb3.org/" />
-
    <div data-thumb="https://static.igem.org/mediawiki/2013/9/9c/USTC-Software_3.jpg" data-src="https://static.igem.org/mediawiki/2013/f/fd/USTC-Software_3.png">
+
              <area shape="rect" coords="180,95,495,200" href="http://www.synberc.org/" />
-
            <div class="camera_caption fadeFromBottom"> <em>Team members were working.</em>            </div>
+
</map>
-
        </div>
+
</center>
-
    <div data-thumb="https://static.igem.org/mediawiki/2013/e/e0/USTC-Software_4.jpg" data-src="https://static.igem.org/mediawiki/2013/9/9a/USTC-Software_4.png">
+
</p>
-
            <div class="camera_caption fadeFromBottom"> <em>What's your opinion?</em>            </div>
+
<br>
-
        </div>
+
-
    <div data-thumb="https://static.igem.org/mediawiki/2013/e/ed/USTC-Software_5.jpg" data-src="https://static.igem.org/mediawiki/2013/2/26/USTC-Software_5.png">
+
-
            <div class="camera_caption fadeFromBottom"> <em>Come to see this ! ~</em>           </div>
+
-
      </div>
+
-
    </div>
+
-
   
+
</div>
</div>
-
 
-
</body>
 
</html>
</html>

Latest revision as of 19:15, 27 September 2013

UCSF Home

UCSF iGEM 2013 Group Photo
Brainstorming project ideas during our second week of Bootcamp
Presenting a poster at the UCSF Center for Systems and Synthetic Biology retreat
Having a skype meeting with one of our mentors!
Human Practices: Speaking about Synthetic Biology at the SF Exploratorium
Having fun outside of the lab making ice cream with dry ice

Operation CRISPR: Deploying precision guided tools to target unique species in a complex microbiome

In microbial communities, bacterial populations are commonly controlled using indiscriminate, broad range antibiotics. There are few ways to target specific strains effectively without disrupting the entire microbiome and local environment. The goal of our project is to take advantage of a natural horizontal gene transfer mechanism in bacteria to precisely affect gene expression in selected strains. We combine bacterial conjugation with CRISPRi, an RNAi-like repression system developed from bacteria, to regulate gene expression in targeted strains within a complex microbial community. One possible application is to selectively repress pathogenic genes in a microbiome, leaving the community makeup unaffected. In addition, we use CRISPRi to lay the groundwork for transferring large circuits that enable complex functionality and decision-making in cells.

Team

Meet our dedicated team of under-graduates who conceived of, planned, and carried out the whole project.

Project

Discover our precision guided tools to target unique species in a complex microbiome and our groundwork for transferring large circuits that enable complex functionality and decision-making in cells.

Modeling

Take a look at how we use mathematical modeling to facilitate the design and construct of our project.

Human Practice

Examine how we teach Synthetic Biology to the general public through night event at Exploratorium and to high school students through a collaboration with Lincoln High School.

Special Thanks to Our 2013 iGEM Team Sponsors!