articles-videos.html - gerrit/www.eclipse.org/sirius - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 	<meta http-equiv="Content-language" content="en">
 	<meta name="description" content="Graphical Editors for your DSL">

 	<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
 	<script type="text/javascript" src="js/magnific-popup.video.js"></script>
 	<script type="text/javascript" src="js/magnific-popup.min.js"></script>
 	<script type="application/json" src="json/articles.json"></script>
 	<script type="application/json" src="json/videos.json"></script>
 	<script type="application/json" src="json/presentations.json"></script>
 	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
 	<script src="angular/sirius.js"></script>

 	<link rel="icon" type="image/png" href="favicon.ico" />
 	<title>Sirius - Articles & Videos</title>
 	<link type="text/css" rel="stylesheet" href="css/style.css" />
 	<link type="text/css" rel="stylesheet" href="css/media.css" />
 	<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
 	<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300italic,700,300' rel='stylesheet' type='text/css'>
 	<link rel="stylesheet" href="https://use.fontawesome.com/ef6567f233.css">

 	<!-- Eclipse Foundation Google Tag Manager -->
 	<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
 	new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
 	j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
 	'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
 	})(window,document,'script','dataLayer','GTM-5WLCZXC');</script>
 	<!-- End Google Tag Manager -->

 	<!-- Eclipse Foundation cookie consent: -->
 	<link rel="stylesheet" type="text/css" href="//www.eclipse.org/eclipse.org-common/themes/solstice/public/stylesheets/vendor/cookieconsent/cookieconsent.min.css" />
 	<script src="//www.eclipse.org/eclipse.org-common/themes/solstice/public/javascript/vendor/cookieconsent/default.min.js"></script>
 	<script type="text/javascript" src="js/ga.js"></script>
 </head>

 <body ng-app="sirius" ng-controller="main" class="cloak">
 <ng-include src="'angular/blocks/header.html'"></ng-include>

 <div id="body_wrapper">
 	<h1 class="page_title">Articles & Videos</h1>
 </div>

 <section class="first_item">
 	<article class="row">
 		<header>
 			<h2 class="centered uppercase">Articles</h2>
 		</header>

 		<div id="articles"></div>
 		<script type="text/javascript">
 	  		jQuery.getJSON('json/articles.json', function(data) {

 	  			var output = " " ;

 		        for (var i=0; i< 3; i++) {
 		        	var blogger = " ";
 		        	var header = " ";
 		        	var title = " ";
 		        	var readmore = " ";
 		        	var descr = " ";
 		        	var photo = " ";
 		        	var name = " ";
 		        	var mail = " ";
 		        	var twitter = " ";
 		        	var google = " ";
 		        	var github = " ";

 					for (var j in data.articles[i].aside.lnks) {
 						photo += "<span class='left photo'><a href='" + data.articles[i].aside.lnks[j].blog + "' target='_blank'><img src='" + data.articles[i].aside.photoSrc + "' alt='" + data.articles[i].aside.imgAlt + "' /></a></span>";
 						name += "<span class='left name'><a class='indigo' href='" + data.articles[i].aside.lnks[j].blog + "' target='_blank'>" + data.articles[i].aside.imgAlt + "</a><br />";
 						if(data.articles[i].aside.lnks[j].mail){
 							mail += "<a href='" + data.articles[i].aside.lnks[j].mail + "' class='social' target='_blank'><i class='fa fa-fw fa-envelope-square'></i></a>";
 						}
 						if(data.articles[i].aside.lnks[j].twitter){
 							twitter += "<a href='" + data.articles[i].aside.lnks[j].twitter + "' class='social' target='_blank'><i class='fa fa-fw fa-twitter-square'></i></a>";
 						}
 						if(data.articles[i].aside.lnks[j].google){
 							google += "<a href='" + data.articles[i].aside.lnks[j].google + "' class='social' target='_blank'><i class='fa fa-fw fa-google-plus-square'></i></a>";
 						}
 						if(data.articles[i].aside.lnks[j].github){
 							github += "<a href='" + data.articles[i].aside.lnks[j].github + "' class='social' target='_blank'><i class='fa fa-fw fa-github'></i></a>";
 						}
 					}

 					name += mail + twitter + google + github +"</span>";
 					blogger += "<div class='blogger bg_gray'><p>" + photo + name + "</p></div>";
 					title += "<h3><a class='indigo' href='" + data.articles[i].header.lnk + "' target='_blank'>" + data.articles[i].header.title + "</a></h3>";
 					readmore += "<p><a href='" + data.articles[i].header.lnk + "' target='_blank'>Read more <i class='fa fa-arrow-circle-right'>&nbsp;</i></a></p>";
 					descr += data.articles[i].header.description + readmore;
 					header += "<header>" + title + descr + "</header>";

 					output += "<div class='blog_post col_3 bg_light_gray'>" + header + blogger + "</div>";
 				}

 		        document.getElementById("articles").innerHTML=output;
 	 		 });
 	   	</script>

 		<div class="clear" ></div>
 		<p class="centered"><a class="btn" href="articles.html">View All</a></p>

 	</article>
 </section>

 <section class="bg_light_gray videos">
 	<article class="row">
 		<header>
 			<h2 class="centered uppercase">Videos</h2>
 		</header>

 		<div id="videos"></div>
 		<script type="text/javascript">

 	  		jQuery.getJSON('json/videos.json', function(data) {
 	  			var output = " " ;

 		        for (var k in data.videos) {
 		        	 if(k<3) {
 			        	var thumb = " ";
 			        	var header = " ";
 			        	var title = " ";

 						thumb += "<div class='video_thumbnail'><a class='popup-youtube' href='" + data.videos[k].header.lnk + "'><img src='" + data.videos[k].thumb.photoSrc + "'  /></a></div>";

 						title += "<h3><a class='popup-youtube' href='" + data.videos[k].header.lnk + "'>" + data.videos[k].header.title + "</a></h3>";

 						header += "<header class='video_title centered'>" + title + "</header>";

 						output += "<div class='col_3'>" + thumb + header + "</div>";

 		        	 }
 		        }

 		        document.getElementById("videos").innerHTML=output;

 		        $('.popup-youtube').magnificPopup({
 		    		disableOn: 700,
 		    		type: 'iframe',
 		    		mainClass: 'mfp-fade',
 		    		removalDelay: 160,
 		    		preloader: false,

 		    		fixedContentPos: false
 		    	});

 	 		 });

 	   	</script>

 		<div class="clear" ></div>
 		<p class="centered"><a class="btn" href="videos.html">View All</a></p>

 	</article>
 </section>

 <section class="videos">
 	<article class="row">
 		<header>
 			<h2 class="centered uppercase">Presentations</h2>
 		</header>

 		<div id="presentations"></div>
 		<script type="text/javascript">

 	  		jQuery.getJSON('json/presentations.json', function(data) {
 	  			var output = " " ;

 		        for (var k in data.presentations) {
 		        	 if(k<3) {
 			        	var thumb = " ";
 			        	var header = " ";
 			        	var title = " ";

 						thumb += "<div class='video_thumbnail'><a class='popup-youtube' href='" + data.presentations[k].header.lnk + "'><img src='" + data.presentations[k].thumb.photoSrc + "'  /></a></div>";

 						title += "<h3><a class='popup-youtube' href='" + data.presentations[k].header.lnk + "'>" + data.presentations[k].header.title + "</a></h3>";

 						header += "<header class='video_title centered'>" + title + "</header>";

 						output += "<div class='col_3'>" + thumb + header + "</div>";
 		        	 }
 		        }

 		        document.getElementById("presentations").innerHTML=output;

 		        $('.popup-youtube').magnificPopup({
 		    		disableOn: 700,
 		    		type: 'iframe',
 		    		mainClass: 'mfp-fade',
 		    		removalDelay: 160,
 		    		preloader: false,

 		    		fixedContentPos: false
 		    	});

 	 		 });

 	   	</script>

 		<div class="clear" ></div>
 		<p class="centered"><a class="btn" href="presentations.html">View All</a></p>

 	</article>
 </section>

 <section class="bg_light_gray">
 	<article class="row">
 		<header>
 			<h2 class="centered uppercase">Best Practices</h2>
 			<p class="centered">Sirius committers have shared some of their best practices to help you take advantage of their experience<br /> and implement efficient graphical modeling tools (registration required)
 			</p>
 		</header>

 		<div class="clear" ></div>

 		<p class="centered"><a class="btn" href="https://www.obeodesigner.com/en/best-practices" target="_blank">Improve Your Sirius Practices</a></p>

 	</article>
 </section>

 <div class="clear"></div>
 <ng-include src="'angular/blocks/footer.html'"></ng-include>
 <ng-include src="'angular/blocks/call2action.html'"></ng-include>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="Content-language" content="en">
	<meta name="description" content="Graphical Editors for your DSL">

	<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
	<script type="text/javascript" src="js/magnific-popup.video.js"></script>
	<script type="text/javascript" src="js/magnific-popup.min.js"></script>
	<script type="application/json" src="json/articles.json"></script>
	<script type="application/json" src="json/videos.json"></script>
	<script type="application/json" src="json/presentations.json"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
	<script src="angular/sirius.js"></script>

	<link rel="icon" type="image/png" href="favicon.ico" />
	<title>Sirius - Articles & Videos</title>
	<link type="text/css" rel="stylesheet" href="css/style.css" />
	<link type="text/css" rel="stylesheet" href="css/media.css" />
	<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
	<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300italic,700,300' rel='stylesheet' type='text/css'>
	<link rel="stylesheet" href="https://use.fontawesome.com/ef6567f233.css">

	<!-- Eclipse Foundation Google Tag Manager -->
	<script>(function(w,d,s,l,i){w[l]=w[l]\|\|[];w[l].push({'gtm.start':
	new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
	j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
	'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
	})(window,document,'script','dataLayer','GTM-5WLCZXC');</script>
	<!-- End Google Tag Manager -->

	<!-- Eclipse Foundation cookie consent: -->
	<link rel="stylesheet" type="text/css" href="//www.eclipse.org/eclipse.org-common/themes/solstice/public/stylesheets/vendor/cookieconsent/cookieconsent.min.css" />
	<script src="//www.eclipse.org/eclipse.org-common/themes/solstice/public/javascript/vendor/cookieconsent/default.min.js"></script>
	<script type="text/javascript" src="js/ga.js"></script>
	</head>

	<body ng-app="sirius" ng-controller="main" class="cloak">
	<ng-include src="'angular/blocks/header.html'"></ng-include>

	<div id="body_wrapper">
	<h1 class="page_title">Articles & Videos</h1>
	</div>

	<section class="first_item">
	<article class="row">
	<header>
	<h2 class="centered uppercase">Articles</h2>
	</header>

	<div id="articles"></div>
	<script type="text/javascript">
	jQuery.getJSON('json/articles.json', function(data) {

	var output = " " ;

	for (var i=0; i< 3; i++) {
	var blogger = " ";
	var header = " ";
	var title = " ";
	var readmore = " ";
	var descr = " ";
	var photo = " ";
	var name = " ";
	var mail = " ";
	var twitter = " ";
	var google = " ";
	var github = " ";

	for (var j in data.articles[i].aside.lnks) {
	photo += "<span class='left photo'><a href='" + data.articles[i].aside.lnks[j].blog + "' target='_blank'><img src='" + data.articles[i].aside.photoSrc + "' alt='" + data.articles[i].aside.imgAlt + "' /></a></span>";
	name += "<span class='left name'><a class='indigo' href='" + data.articles[i].aside.lnks[j].blog + "' target='_blank'>" + data.articles[i].aside.imgAlt + "</a><br />";
	if(data.articles[i].aside.lnks[j].mail){
	mail += "<a href='" + data.articles[i].aside.lnks[j].mail + "' class='social' target='_blank'><i class='fa fa-fw fa-envelope-square'></i></a>";
	}
	if(data.articles[i].aside.lnks[j].twitter){
	twitter += "<a href='" + data.articles[i].aside.lnks[j].twitter + "' class='social' target='_blank'><i class='fa fa-fw fa-twitter-square'></i></a>";
	}
	if(data.articles[i].aside.lnks[j].google){
	google += "<a href='" + data.articles[i].aside.lnks[j].google + "' class='social' target='_blank'><i class='fa fa-fw fa-google-plus-square'></i></a>";
	}
	if(data.articles[i].aside.lnks[j].github){
	github += "<a href='" + data.articles[i].aside.lnks[j].github + "' class='social' target='_blank'><i class='fa fa-fw fa-github'></i></a>";
	}
	}

	name += mail + twitter + google + github +"</span>";
	blogger += "<div class='blogger bg_gray'><p>" + photo + name + "</p></div>";
	title += "<h3><a class='indigo' href='" + data.articles[i].header.lnk + "' target='_blank'>" + data.articles[i].header.title + "</a></h3>";
	readmore += "<p><a href='" + data.articles[i].header.lnk + "' target='_blank'>Read more <i class='fa fa-arrow-circle-right'> </i></a></p>";
	descr += data.articles[i].header.description + readmore;
	header += "<header>" + title + descr + "</header>";

	output += "<div class='blog_post col_3 bg_light_gray'>" + header + blogger + "</div>";
	}

	document.getElementById("articles").innerHTML=output;
	});
	</script>

	<div class="clear" ></div>
	<p class="centered"><a class="btn" href="articles.html">View All</a></p>

	</article>
	</section>

	<section class="bg_light_gray videos">
	<article class="row">
	<header>
	<h2 class="centered uppercase">Videos</h2>
	</header>

	<div id="videos"></div>
	<script type="text/javascript">

	jQuery.getJSON('json/videos.json', function(data) {
	var output = " " ;

	for (var k in data.videos) {
	if(k<3) {
	var thumb = " ";
	var header = " ";
	var title = " ";

	thumb += "<div class='video_thumbnail'><a class='popup-youtube' href='" + data.videos[k].header.lnk + "'><img src='" + data.videos[k].thumb.photoSrc + "' /></a></div>";

	title += "<h3><a class='popup-youtube' href='" + data.videos[k].header.lnk + "'>" + data.videos[k].header.title + "</a></h3>";

	header += "<header class='video_title centered'>" + title + "</header>";

	output += "<div class='col_3'>" + thumb + header + "</div>";

	}
	}

	document.getElementById("videos").innerHTML=output;

	$('.popup-youtube').magnificPopup({
	disableOn: 700,
	type: 'iframe',
	mainClass: 'mfp-fade',
	removalDelay: 160,
	preloader: false,

	fixedContentPos: false
	});

	});

	</script>

	<div class="clear" ></div>
	<p class="centered"><a class="btn" href="videos.html">View All</a></p>

	</article>
	</section>

	<section class="videos">
	<article class="row">
	<header>
	<h2 class="centered uppercase">Presentations</h2>
	</header>

	<div id="presentations"></div>
	<script type="text/javascript">

	jQuery.getJSON('json/presentations.json', function(data) {
	var output = " " ;

	for (var k in data.presentations) {
	if(k<3) {
	var thumb = " ";
	var header = " ";
	var title = " ";

	thumb += "<div class='video_thumbnail'><a class='popup-youtube' href='" + data.presentations[k].header.lnk + "'><img src='" + data.presentations[k].thumb.photoSrc + "' /></a></div>";

	title += "<h3><a class='popup-youtube' href='" + data.presentations[k].header.lnk + "'>" + data.presentations[k].header.title + "</a></h3>";

	header += "<header class='video_title centered'>" + title + "</header>";

	output += "<div class='col_3'>" + thumb + header + "</div>";
	}
	}

	document.getElementById("presentations").innerHTML=output;

	$('.popup-youtube').magnificPopup({
	disableOn: 700,
	type: 'iframe',
	mainClass: 'mfp-fade',
	removalDelay: 160,
	preloader: false,

	fixedContentPos: false
	});

	});

	</script>

	<div class="clear" ></div>
	<p class="centered"><a class="btn" href="presentations.html">View All</a></p>

	</article>
	</section>

	<section class="bg_light_gray">
	<article class="row">
	<header>
	<h2 class="centered uppercase">Best Practices</h2>
	<p class="centered">Sirius committers have shared some of their best practices to help you take advantage of their experience<br /> and implement efficient graphical modeling tools (registration required)
	</p>
	</header>

	<div class="clear" ></div>

	<p class="centered"><a class="btn" href="https://www.obeodesigner.com/en/best-practices" target="_blank">Improve Your Sirius Practices</a></p>

	</article>
	</section>

	<div class="clear"></div>
	<ng-include src="'angular/blocks/footer.html'"></ng-include>
	<ng-include src="'angular/blocks/call2action.html'"></ng-include>
	</body>
	</html>