Difference between revisions of "Template:Greece/Javascript8"
CharisKomos (Talk | contribs) |
CharisKomos (Talk | contribs) |
||
| Line 50: | Line 50: | ||
right.push('<div class="pages_div" id="page_' + page + '"><a href="#page/' + page + '">' + tabs[page] + '</a></div>'); | right.push('<div class="pages_div" id="page_' + page + '"><a href="#page/' + page + '">' + tabs[page] + '</a></div>'); | ||
}else{ | }else{ | ||
| − | right.push("<div class='pages_div' id='page_" + page +"'><svg id='sticky_note' class='svg-graphic | + | right.push("<div class='pages_div' id='page_" + page +"'><svg id='sticky_note' class='svg-graphic' width='250' height='250' viewBox='0 0 250 250' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' version='1.1'>" + |
"<g><clipPath id='hexagonal-mask'><polygon points='0,187 0,250 250,250 250,0 120,0 116,175 115,177 114,179 113,180 112,181' style='fill:lime;stroke:purple;stroke-width:1'/></clipPath></g>" + | "<g><clipPath id='hexagonal-mask'><polygon points='0,187 0,250 250,250 250,0 120,0 116,175 115,177 114,179 113,180 112,181' style='fill:lime;stroke:purple;stroke-width:1'/></clipPath></g>" + | ||
"<image x='0' y='0' clip-path='url(#hexagonal-mask)' height='250px' width='250px' xlink:href='https://static.igem.org/mediawiki/2017/5/5b/GreeKom_post_it.png' /></svg>" + | "<image x='0' y='0' clip-path='url(#hexagonal-mask)' height='250px' width='250px' xlink:href='https://static.igem.org/mediawiki/2017/5/5b/GreeKom_post_it.png' /></svg>" + | ||
Revision as of 22:37, 21 September 2017
/* Documentation sample */
function loadPage(page) {
var img = $('<img />'); img.load(function() { var container = $('.sample-docs .p'+page); img.css({width: container.width(), height: container.height()}); img.appendTo($('.sample-docs .p'+page)); container.find('.loader').remove(); }); //Source of images //img.attr('src', 'pages/' + (page-2) + '.png'); img.attr('src', 'http://users.auth.gr/komodromo/iGEM%20Greece%202017/Flipbook/pages/' + (page-2) + '.jpg');
}
function addPage(page, book) {
var id, pages = book.turn('pages');
var element = $('<div />', {});
if (book.turn('addPage', element, page)) { if (page <= pages) {
element.html('');loadPage(page); }else{ console.log('Error on line 28: page > 28 ? Page: '+page) } } }
function updateTabs() { //The numbers next to the tab names is the page where the tabs change dynamically var tabs = {7: 'Protocols', 12:'Experiments', 14:'Timeline'}, left = [], right = [], book = $('.sample-docs'), actualPage = book.turn('page'), view = book.turn('view');
for (var page in tabs) { var isHere = $.inArray(parseInt(page, 10), view)!=-1;
if(tabs[page] != 'Timeline'){ if (page > actualPage && !isHere)
right.push('else if (isHere) {
right.push('} else
right.push('}else{
right.push(""<g><clipPath id='hexagonal-mask'><polygon points='0,187 0,250 250,250 250,0 120,0 116,175 115,177 114,179 113,180 112,181' style='fill:lime;stroke:purple;stroke-width:1'/></clipPath></g>" + "<image x='0' y='0' clip-path='url(#hexagonal-mask)' height='250px' width='250px' xlink:href='https://static.igem.org/mediawiki/2017/5/5b/GreeKom_post_it.png' /></svg>" +
"<a id='secondLink' href='#page/" + page + "'>" + tabs[page] + "</a>if(isHere){ $('#secondLink').addClass('on'); } } } $('.sample-docs .tabs .left').html(left.join()); $('.sample-docs .tabs .right').html(right.join());
}
function numberOfViews(book) { return book.turn('pages') / 2 + 1; }
function getViewNumber(book, page) { return parseInt((page || book.turn('page'))/2 + 1, 10); }
function moveBar(yes) { if (Modernizr && Modernizr.csstransforms) { $('#slider .ui-slider-handle').css({zIndex: yes ? -1 : 10000}); } }
function setPreview(view) {
var previewWidth = 115, previewHeight = 73, previewSrc = 'pics/preview.jpg', preview = $(_thumbPreview.children(':first')), numPages = (view==1 || view==$('#slider').slider('option', 'max')) ? 1 : 2, width = (numPages==1) ? previewWidth/2 : previewWidth;
_thumbPreview. addClass('no-transition'). css({width: width + 15, height: previewHeight + 15, top: -previewHeight - 30, left: ($($('#slider').children(':first')).width() - width - 15)/2 });
preview.css({ width: width, height: previewHeight });
if (preview.css('background-image')=== || preview.css('background-image')=='none') {
preview.css({backgroundImage: 'url(' + previewSrc + ')'});
setTimeout(function(){ _thumbPreview.removeClass('no-transition'); }, 0);
}
preview.css({backgroundPosition: '0px -'+((view-1)*previewHeight)+'px' }); }
