whatsnew/whatsnew4.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/functions.js"></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 - What's New in Sirius 4.0</title>
 	<link type="text/css" rel="stylesheet" href="../css/bootstrap.min.css" />
 	<link type="text/css" rel="stylesheet" href="../css/style.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">What's New in Sirius 4.0</h1>

 		<p>What is making Eclipse Sirius so unique? That’s its capability to easily create custom graphical modeling tools adapted
 			to each specific need.</p>
 		<p>With Sirius 4.0 we wanted to bring you new customization features to represent and edit your data, so that you can manage
 			even more cases specific to your own business domain.</p>
 		<br />
 		<br />

 		<div class="section">
 			<h2>
 				<a name="properties_view"></a>Properties Views
 			</h2>
 			<p>You like how simple it is to define diagrams with Sirius? Now, you will love how to define beautiful and ergonomic custom
 				properties views! Sirius 4.0 comes with an integrated way to define your own properties views in the same way as you
 				are used to define the other parts of your representations: no need to code, it is dynamic and query based.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/properties.png" width="975" alt="" border="0" />
 			</p>

 			<p>Now, Sirius allows you to specify and group widgets to represent and edit your semantic elements: text, text area, checkbox,
 				select… on which you can also specify conditional styles and validation rules.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/properties1.png" alt="" border="0" />
 			</p>

 			<p>And the icing on the cake: if you don’t specify any specific property view, Sirius automatically provides dynamic views
 				that are already much better compared to those coming with EMF.</p>

 			<p>Provided as experimental, this feature will be officially available with Sirius 4.1, just after Neon.1. Meantime, you
 				can already install it and dramatically improve your graphical editors and help us streamline the feature with your feedback.</p>
 		</div>


 		<div class="section">
 			<h2>
 				<a name="customization"></a>More graphical customizations
 			</h2>
 			<p>Sirius 4.0 offers many new options to improve the user experience on your diagrams, such as you can build modeling tools
 				that better fit your business domain’s requirements.</p>

 			<h3>
 				<b>Preferred side for border nodes</b>
 			</h3>
 			<p>On a container having border nodes, now you can specify on which side each kind of border node should be placed: SOUTH,
 				WEST, NORTH or EAST.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/preferred-side2.png" alt="" border="0" />
 			</p>

 			<p>Sirius will automatically place the nodes on the right side and prevent the user to move a border on unwanted sides.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/preferred-side-sample.png" alt="" border="0" />
 			</p>
 			<p>&nbsp;</p>

 			<h3>
 				<b>Contribute customizable SVG shapes</b>
 			</h3>
 			<p>With Sirius 4.0 you can go further with SVG files: declare bundled image shapes and you will get a library of images that
 				you can dynamically customize!</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/bundle-image-spec.png" alt="" border="0" />
 			</p>

 			<p>You can change the color, the border color and the border size. By combining this new feature with conditional styles,
 				the same SVG image will change according to the properties of the diagram element.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/bundle-image-label.png" alt="" border="0" />
 			</p>
 			<p>&nbsp;</p>

 			<h3>
 				<b>User configurable filters</b>
 			</h3>
 			<p>Filters allow users to hide diagram elements according to predefined rules. With Sirius 4.0, it is possible to define
 				filters that can be configured by the user.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/filter.png" alt="" border="0" />
 			</p>


 			<p>When the user selects the filter, a dialog appears for each variable that lets him define its own value.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/filter-run.gif" alt="" border="0" />
 			</p>
 			<p>&nbsp;</p>

 			<h3>
 				<b>Fully customizable tabbar</b>
 			</h3>
 			<p>The content of the diagrams tabbar can be completely reorganized according to your needs. It was already possible to add
 				buttons, but now you can also remove default buttons or change their order. This can be done thanks to a new extension
 				point named org.eclipse.sirius.diagram.ui.tabbarContributor.
 			</p>

 			<h3>
 				<b>EMF.Edit customizations</b>
 			</h3>
 			<p>Now, when writing expressions, you can reuse customizations defined in the EMF.Edit plugin: label providers, property
 				descriptors, etc. This can be done by using a new class named org.eclipse.sirius.ext.emf.edit.EditingDomainServices
 			</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/emf_logo.png" alt="" border="0" />
 			</p>
 		</div>

 		<div class="section">
 			<h2>
 				<a name="internationalization"></a>Internationalization
 			</h2>
 			<p>With Sirius 4.0 your modeling tools become localizable! All the fields containing a value visible by the end user are
 				represented with a blue background in the Viewpoint Specification Model.
 			</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/internationalization.png" alt="" border="0" />
 			</p>

 			<p>They indicate that you can use keys (%myKey) that will be replaced at runtime with a value depending on the current language
 				(the values are defined in the files plugin_XX.properties).</p>

 			<h3>
 				<a name="ux_improvements"></a>UX improvements
 			</h3>
 			<p>Many other improvements come with this new release. Here is a glimpse of those that directly concern the users’ experience.</p>
 			<h3>
 				<b>Better SVG rendering</b>
 			</h3>
 			<p>The management of SVG files have been improved to keep a high-quality rendering when zooming or resizing an image.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/svg.gif" alt="" border="0" />
 			</p>
 			<p>&nbsp;</p>

 			<h3>
 				<b>Dragging the diagram</b>
 			</h3>
 			<p>Like tools such as Google Maps, you can now click and drag the diagram to change the visible area. With Sirius, this drag
 				mechanism is available with a middle click.</p>

 			<p>
 				<img class="shadow" src="../images/whatsnew4/drag.gif" alt="" border="0" />
 			</p>
 			<p>&nbsp;</p>
 			<h3>
 				<b>Quicker sessions closing</b>
 			</h3>
 			<p>A significant improvement has been brought in the 4.0 release to make large sessions unload almost immediately.</p>

 			<p>
 				Just
 				<a href="../download.html">download</a> this new version and try it right now!
 			</p>
 			<p>
 				The complete list of changes is available here:
 				<a href="http://www.eclipse.org/sirius/doc/Release_Notes.html#sirius4.0.0" title="New & Noteworthy">http://www.eclipse.org/sirius/doc/Release_Notes.html#sirius4.0.0</a>.
 			</p>
 			<p>Read
 				<a href="http://eclipse.org/sirius/whatsnew/whatsnew3-1.html" title="New & Noteworthy">What's new in Sirius 3.1</a> to see the new and noteworthy features of previous version.</p>
 			<br />
 		</div>
 	</div>
 	<!-- Fin body_wrapper -->

 	<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/functions.js"></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 - What's New in Sirius 4.0</title>
	<link type="text/css" rel="stylesheet" href="../css/bootstrap.min.css" />
	<link type="text/css" rel="stylesheet" href="../css/style.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">What's New in Sirius 4.0</h1>

	<p>What is making Eclipse Sirius so unique? That’s its capability to easily create custom graphical modeling tools adapted
	to each specific need.</p>
	<p>With Sirius 4.0 we wanted to bring you new customization features to represent and edit your data, so that you can manage
	even more cases specific to your own business domain.</p>
	<br />
	<br />

	<div class="section">
	<h2>
	<a name="properties_view"></a>Properties Views
	</h2>
	<p>You like how simple it is to define diagrams with Sirius? Now, you will love how to define beautiful and ergonomic custom
	properties views! Sirius 4.0 comes with an integrated way to define your own properties views in the same way as you
	are used to define the other parts of your representations: no need to code, it is dynamic and query based.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/properties.png" width="975" alt="" border="0" />
	</p>

	<p>Now, Sirius allows you to specify and group widgets to represent and edit your semantic elements: text, text area, checkbox,
	select… on which you can also specify conditional styles and validation rules.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/properties1.png" alt="" border="0" />
	</p>

	<p>And the icing on the cake: if you don’t specify any specific property view, Sirius automatically provides dynamic views
	that are already much better compared to those coming with EMF.</p>

	<p>Provided as experimental, this feature will be officially available with Sirius 4.1, just after Neon.1. Meantime, you
	can already install it and dramatically improve your graphical editors and help us streamline the feature with your feedback.</p>
	</div>


	<div class="section">
	<h2>
	<a name="customization"></a>More graphical customizations
	</h2>
	<p>Sirius 4.0 offers many new options to improve the user experience on your diagrams, such as you can build modeling tools
	that better fit your business domain’s requirements.</p>

	<h3>
	<b>Preferred side for border nodes</b>
	</h3>
	<p>On a container having border nodes, now you can specify on which side each kind of border node should be placed: SOUTH,
	WEST, NORTH or EAST.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/preferred-side2.png" alt="" border="0" />
	</p>

	<p>Sirius will automatically place the nodes on the right side and prevent the user to move a border on unwanted sides.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/preferred-side-sample.png" alt="" border="0" />
	</p>
	<p> </p>

	<h3>
	<b>Contribute customizable SVG shapes</b>
	</h3>
	<p>With Sirius 4.0 you can go further with SVG files: declare bundled image shapes and you will get a library of images that
	you can dynamically customize!</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/bundle-image-spec.png" alt="" border="0" />
	</p>

	<p>You can change the color, the border color and the border size. By combining this new feature with conditional styles,
	the same SVG image will change according to the properties of the diagram element.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/bundle-image-label.png" alt="" border="0" />
	</p>
	<p> </p>

	<h3>
	<b>User configurable filters</b>
	</h3>
	<p>Filters allow users to hide diagram elements according to predefined rules. With Sirius 4.0, it is possible to define
	filters that can be configured by the user.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/filter.png" alt="" border="0" />
	</p>


	<p>When the user selects the filter, a dialog appears for each variable that lets him define its own value.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/filter-run.gif" alt="" border="0" />
	</p>
	<p> </p>

	<h3>
	<b>Fully customizable tabbar</b>
	</h3>
	<p>The content of the diagrams tabbar can be completely reorganized according to your needs. It was already possible to add
	buttons, but now you can also remove default buttons or change their order. This can be done thanks to a new extension
	point named org.eclipse.sirius.diagram.ui.tabbarContributor.
	</p>

	<h3>
	<b>EMF.Edit customizations</b>
	</h3>
	<p>Now, when writing expressions, you can reuse customizations defined in the EMF.Edit plugin: label providers, property
	descriptors, etc. This can be done by using a new class named org.eclipse.sirius.ext.emf.edit.EditingDomainServices
	</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/emf_logo.png" alt="" border="0" />
	</p>
	</div>

	<div class="section">
	<h2>
	<a name="internationalization"></a>Internationalization
	</h2>
	<p>With Sirius 4.0 your modeling tools become localizable! All the fields containing a value visible by the end user are
	represented with a blue background in the Viewpoint Specification Model.
	</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/internationalization.png" alt="" border="0" />
	</p>

	<p>They indicate that you can use keys (%myKey) that will be replaced at runtime with a value depending on the current language
	(the values are defined in the files plugin_XX.properties).</p>

	<h3>
	<a name="ux_improvements"></a>UX improvements
	</h3>
	<p>Many other improvements come with this new release. Here is a glimpse of those that directly concern the users’ experience.</p>
	<h3>
	<b>Better SVG rendering</b>
	</h3>
	<p>The management of SVG files have been improved to keep a high-quality rendering when zooming or resizing an image.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/svg.gif" alt="" border="0" />
	</p>
	<p> </p>

	<h3>
	<b>Dragging the diagram</b>
	</h3>
	<p>Like tools such as Google Maps, you can now click and drag the diagram to change the visible area. With Sirius, this drag
	mechanism is available with a middle click.</p>

	<p>
	<img class="shadow" src="../images/whatsnew4/drag.gif" alt="" border="0" />
	</p>
	<p> </p>
	<h3>
	<b>Quicker sessions closing</b>
	</h3>
	<p>A significant improvement has been brought in the 4.0 release to make large sessions unload almost immediately.</p>

	<p>
	Just
	<a href="../download.html">download</a> this new version and try it right now!
	</p>
	<p>
	The complete list of changes is available here:
	<a href="http://www.eclipse.org/sirius/doc/Release_Notes.html#sirius4.0.0" title="New & Noteworthy">http://www.eclipse.org/sirius/doc/Release_Notes.html#sirius4.0.0</a>.
	</p>
	<p>Read
	<a href="http://eclipse.org/sirius/whatsnew/whatsnew3-1.html" title="New & Noteworthy">What's new in Sirius 3.1</a> to see the new and noteworthy features of previous version.</p>
	<br />
	</div>
	</div>
	<!-- Fin body_wrapper -->

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

	</html>