I hereby claim:
- I am nallenanderson on github.
- I am nallan (https://keybase.io/nallan) on keybase.
- I have a public key ASDgkWk2icTpkKjGJ1RaYd5Wtzpva9Puqf77AFkmDeOe2Ao
To claim this, I am signing this object:
I hereby claim:
To claim this, I am signing this object:
var HelloMessage = React.createClass({ | |
render: function() { | |
return <div>Hello {this.props.name}</div>; | |
} | |
}); | |
ReactDOM.render(<HelloMessage name="John" />, mountNode); |
<head> | |
<link rel="stylesheet" type="text/css" href="tooltipster/dist/css/tooltipster.bundle.min.css" /> | |
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.0.min.js"></script> | |
<script type="text/javascript" src="tooltipster/dist/js/tooltipster.bundle.min.js"></script> | |
</head> | |
<body> | |
<div class="container"> | |
// Putting a tooltip on an image: | |
<img src="my-image.png" class="tooltip" title="This is my image's tooltip message!" /> |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<!-- Required meta tags always come first --> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
<meta http-equiv="x-ua-compatible" content="ie=edge"> | |
<!-- Bootstrap CSS --> | |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" integrity="sha384-MIwDKRSSImVFAZCVLtU0LMDdON6KVCrZHyVQQj6e8wIEJkW4tvwqXrbMIya1vriY" crossorigin="anonymous"> |
// This needs to be placed within the final .then() block | |
const imagesDiv = document.querySelector('#images'); | |
imagesDiv.innerHTML = showImages; |
// Chain this onto the end of the AJAX request. | |
.then( () => { | |
// Create an array of <div>s and then map over each element to create a div with image and title. | |
const showImages = ` | |
${jsonData.map( card => { | |
return ` | |
<div class="col-md-6"> | |
<div class="card"> | |
<img src=${card.covers[0]} class="img-responsive" /> |
// After the first JSON is returned, we are going to convert the URL string by mapping over the array of objects and replacing the default cover image size. | |
.then( data => { | |
data.media.map( media => { | |
if(media.covers[0]){ | |
// Check if original image is one being served. | |
if(!media.covers[0].includes('original')){ | |
// Replace the cover image size with "original" image size. | |
media.covers[0] = media.covers[0].replace('R320x240', 'original'); |