Commit a6a349ce authored by Timo Martin's avatar Timo Martin

Added light box for bootstrap library and created function to show images in a...

Added light box for bootstrap library and created function to show images in a light box in a cardset.
parent b8d3e04c
...@@ -56,3 +56,4 @@ jshint@1.1.7 ...@@ -56,3 +56,4 @@ jshint@1.1.7
browser-policy@1.0.9 browser-policy@1.0.9
check@1.2.4 check@1.2.4
shell-server shell-server
tsega:bootstrap3-lightbox
...@@ -216,6 +216,7 @@ templating-runtime@1.2.15 ...@@ -216,6 +216,7 @@ templating-runtime@1.2.15
templating-tools@1.0.5 templating-tools@1.0.5
themeteorchef:bert@2.1.1 themeteorchef:bert@2.1.1
tracker@1.1.1 tracker@1.1.1
tsega:bootstrap3-lightbox@0.2.0
twbs:bootstrap@3.3.6 twbs:bootstrap@3.3.6
twitter@1.1.14 twitter@1.1.14
ui@1.0.12 ui@1.0.12
......
...@@ -422,10 +422,12 @@ Template.cardsetDetails.helpers({ ...@@ -422,10 +422,12 @@ Template.cardsetDetails.helpers({
cardDetailsMarkdown: function (front, back, index) { cardDetailsMarkdown: function (front, back, index) {
Meteor.promise("convertMarkdown", front) Meteor.promise("convertMarkdown", front)
.then(function (html) { .then(function (html) {
html = setLightBoxes(html);
$(".detailfront" + index).html(html); $(".detailfront" + index).html(html);
}); });
Meteor.promise("convertMarkdown", back) Meteor.promise("convertMarkdown", back)
.then(function (html) { .then(function (html) {
html = setLightBoxes(html);
$(".detailback" + index).html(html); $(".detailback" + index).html(html);
}); });
}, },
...@@ -448,6 +450,28 @@ Template.cardsetDetails.helpers({ ...@@ -448,6 +450,28 @@ Template.cardsetDetails.helpers({
} }
}); });
function setLightBoxes(html) {
//Check if images are available
if($(html).find('img').length !== 0) {
//If yes iterate over every image
$(html).find('img').each(function(index, value) {
//Get image description
var imageDescription = $(this).attr('alt');
//Get image url
var imageUrl = $(this).attr('src');
//Wrap image tag with an anchor tag with specific attributes and set click function to show the light box
html = $(this).wrap('<a href="' + imageUrl + '" data-type="image" data-toggle="lightbox" data-title="' + imageDescription +'"></a>').parent().click(function(event) {
event.preventDefault();
return $(this).ekkoLightbox();
}).parent();
});
}
return html;
}
Template.cardsetDetails.events({ Template.cardsetDetails.events({
"click .box": function () { "click .box": function () {
ifCardset(); ifCardset();
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
}, },
"dependencies": { "dependencies": {
"babel-runtime": "^6.18.0", "babel-runtime": "^6.18.0",
"chart.js": "^2.3.0", "chart.js": "^2.4.0",
"meteor-node-stubs": "~0.2.0", "meteor-node-stubs": "~0.2.0",
"react": "^15.0.2" "react": "^15.0.2"
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment