Software Architect at Genzeon Corporation in Malvern, Pennsylvania, Microsoft .NET MVP, Husband, Dad and Geek.
10355 stories
·
22 followers

.NET Core: Finding out SDK-, installed runtime-, and Framework Host versions

1 Share
I was going to do a longer writeup on this, but I’ll just share the script with a very simple explanation for now and do the writing later. I’m not pleased with my explanation below, its written in a hurry- so please let me know what is unclear and I’ll make sure to amend the [...]
Read the whole story
alvinashcraft
5 minutes ago
reply
West Grove, PA
Share this story
Delete

Organic Shape Animations with SVG clipPath

1 Share

After playing with some on-scroll morphing background shapes, we wanted to explore some hover effects in this demo. By morphing SVG paths we can create some organic, flowy movements on hover. Doing so on an SVG clipPath allows us to use this effect on an image.

For the animations in this demo we are using anime.js.

Attention: Some modern techniques at work, so please use a capable browser to view the demo.

For the hover effect on an item, we are doing several things. Let’s just look at the actual shape manipulations we do. These are performed on the clip path, the image that is being clipped and a decorative path element that is behind the image.

Here is an example item:

<div class="item item--style-1" 
		data-animation-path-duration="800" 
		data-animation-path-easing="easeInOutCubic" 
		data-path-elasticity="300" 
		data-morph-path="M 189,80.37 C 232.6,46.67 352.5,67.06 350.9,124.1 349.5,173.4 311.7,168 312.4,248.1 312.9,301.1 382.5,319.2 368.5,379.1 349.4,460.6 137.7,467.5 117.6,386.3 98.68,309.7 171.5,292.2 183.6,240.1 195.7,188.2 123.8,130.7 189,80.37 Z" 
		data-path-scaleX="0.8" 
		data-path-scaleY="1.1" 
		data-path-translateX="0" 
		data-path-translateY="30" 
		data-path-rotate="5" 
		data-animation-image-duration="800" 
		data-animation-image-easing="easeInOutQuart" 
		data-image-elasticity="300" 
		data-image-scaleX="1.2" 
		data-image-scaleY="1.2" 
		data-image-translateX="-20" 
		data-image-translateY="-45" 
		data-image-rotate="-5" 
		data-animation-deco-duration="1300" 
		data-animation-deco-easing="easeOutQuad" 
		data-deco-elasticity="300" 
		data-deco-scaleX="0.8" 
		data-deco-scaleY="0.9" 
		data-deco-translateX="-5" 
		data-deco-translateY="-5" 
		data-deco-rotate="2">
	<svg class="item__svg" width="500px" height="500px" viewBox="0 0 500 500">
		<clipPath id="clipShape1">
			<path class="item__clippath" d="M 189,80.37 C 243,66.12 307.3,87.28 350.9,124.1 389.3,156.6 417,211.2 418.1,263.4 419.1,305.7 401.8,355.6 368.5,379.1 298.8,428 179.2,446.4 117.6,386.3 65.4,335.3 78.55,230.3 105.5,160.5 119.7,123.6 152.6,89.85 189,80.37 Z" />
		</clipPath>
		<g class="item__deco">
			<use xlink:href="#deco1" />
		</g>
		<g clip-path="url(#clipShape1)">
			<image class="item__img" xlink:href="img/1.png" x="0" y="0" height="500px" width="500px" />
		</g>
	</svg>
	<div class="item__meta">
		<div class="item__number">
			<span class="item__specimen">21</span>
			<span class="item__reference">BX3</span>
		</div>
		<h2 class="item__title">Codium fasciculatus</h2>
		<h3 class="item__subtitle">Exoplanet Gliese 180 b</h3>
	</div>
</div>

We are using a clipPath on an image in the SVG. The deco element is taken from outside; we’ve included all of the paths at the beginning of the HTML file and reference to them with use. You can also directly add it as well, but it allows for re-use which in our case makes sense. The path that the initial clip path will morph to is stored in the data-morph-path data attribute. The other data attributes are for setting the durations, easings, etc. for the path, the image and the deco element. The only one missing here is the delay, which you can also add for each of the elements. Of course you don’t have to specify all these data attributes as there are default values for each one of them (see main.js).

OrganicShapeAnimations_01

We hope you enjoy this little effect and find it useful!

References and Credits

Organic Shape Animations with SVG clipPath was written by Mary Lou and published on Codrops.

Read the whole story
alvinashcraft
5 minutes ago
reply
West Grove, PA
Share this story
Delete

Real-World Angular Series - Part 1: MEAN Setup & Angular Architecture

1 Share
Build and deploy a real-world app with MongoDB, Express, Angular, and Node (MEAN): MEAN setup and Angular architecture.
Read the whole story
alvinashcraft
5 minutes ago
reply
West Grove, PA
Share this story
Delete

GitHub for Unity is now open source

1 Share

GitHub for Unity is now open source

The GitHub for Unity extension we announced at the Game Developers Conference last March is now open source! Download the latest release for Windows and OS X for free, and enjoy the benefits of Git and features of GitHub without leaving Unity.

Large files? No problem!

GitHub for Unity supports Git LFS, the open source Git extension for versioning large files.

Add file locking to your workflow

With the introduction of file locking in Git LFS 2.2.0, locking files to avoid merge conflicts is a simple as a few clicks. No more shouting at your colleagues from across the room (or sending them messages in ALL CAPS) telling them to leave your scene alone.

Large files and file locking in GitHub for Unity extension

Bring the GitHub workflow to Unity

Ditch the command line and view your project history, experiment in branches, craft a commit from your changes, and push your code to GitHub—all within Unity.

GitHub for Unity extension repository history

Known issues and bugs

GitHub for Unity is still alpha quality. Please check out the known issues, and make sure you have backups of your work before trying it out.

Find a bug? Want to suggest a feature? Look over our Contributing Guide. We're focused on triaging reported issues as we work towards a 1.0 milestone, and we'd love your help. All contributions are welcome.

If you have any questions or comments, email us at unity@github.com.

Kudos

Thank you to all of the preview release participants for your feedback. And of course, our friends on the Git LFS team and at Unity.

Read the whole story
alvinashcraft
6 minutes ago
reply
West Grove, PA
Share this story
Delete

Infrastructure Blueprints – Adding Pre-deployment Validations

1 Share

In one of my earlier articles here, I wrote about the Infrastructure Blueprints project. Over the weekend, I published an update this project.

  • Renamed Hyper-VConfigurations composite resource module to HyperVConfigurations. This is a breaking change.
  • Added SystemConfigurations composite resource module containing one composite configuration that includes domain join, remote desktop, timezone, and IE enhanced security configurations.
  • Added Pre-Deploy tests under Diagnostics for each composite resource.

Here is a summary of all composite resources in this repository:

Module Name Composite Resources
HyperVConfigurations HyperVSwitchEmbeddedTeam
HyperVSwitchEmbeddedTeamForS2D
HyperVSwitchNativeTeam
SystemConfigurations SystemDomainJoinWithCustomTimezone

Let’s come to the subject of today’s post. In any infrastructure that you are deploying, even f you are no automation guy, there will be a set of prerequisite checks you would perform. For example, if your goal is to deploy a switch embedded team for a Hyper-V host configuration, you will have to check for the existence of physical network adapters in the system that you plan to use within the SET configuration. And, there will be many such pre-deployment checks that you need to perform. So, when using these infrastructure blueprints, it is ideal to package the pre-deployment tests as well into the composite resource module itself.

To address this need, I added PreDeploy scripts under diagnostics tests for each composite resource.

The PreDeploy folder is where all my pre-deployment tests are stored. Here is the pre-deployment test script for the SET team.

Describe 'Predeploy tests for Hyper-V Deployment with Switch Embedded Teaming and related network Configuration' {
    Context "Operating System verison tests" {
        $OS = Get-CimInstance -Class Win32_OperatingSystem
        It "Should have the OSType as WinNT" {
            $OS.OSType | Should Be 18
        }
        
        It "Should have server 2016 installed" {
           $OS.Caption | Should BeLike '*Server 2016*'
        }        
    }

    Context 'Network adapters should exist' {
        Foreach ($adapter in $configurationData.AllNodes.NetAdapterName)
        {
            It "Network adapter named '$adapter' should exist" {
                Get-NetAdapter -Name $adapter -ErrorAction SilentlyContinue | Should Not BeNullOrEmpty
            }
        }
    }
}

In the above test scripts, we check that the OS version is indeed Windows Server 2016 to ensure SET configuration can be deployed. Also, we check for the presence of physical network adapters listed in the configuration data to ensure that the SET configuration completes with no errors.

The above flow summarizes the deployment workflow. We execute the pre-deployment tests first and perform deployment only once these tests are all successful. Once the deployment is complete, we run either comprehensive or simple operations tests and put the system into operations only when these tests are successful.

Whatever orchestration script or method that you plan to use, putting this workflow into the process will certainly help you build a resilient deployment pipeline.

Read the whole story
alvinashcraft
7 minutes ago
reply
West Grove, PA
Share this story
Delete

Securing a Digital Battlefield

1 Share
In this episode, we examine a new battlefield: the cloud. The information we store in the cloud makes it especially vulnerable to attack. So, what it takes to create a safeguard against bad actors? We explore how a digital Geneva Convention could be the solution.

You can wait for the future to happen to you or engage with it right now and ahead of the curve on .future — a branded podcast from Microsoft, produced in partnership with Gimlet Creative.

This episode features:

Steven Petrow — a journalist who writes about digital life

Scott Charney — a security expert at Microsoft

Cyrus Farivar — editor at Ars Technica

Brad Smith — Microsoft’s president and chief legal officer

Heidi Tworek — professor who writes about the history of media and technology



Download audio: https://traffic.megaphone.fm/GLT4373816692.mp3
Read the whole story
alvinashcraft
7 minutes ago
reply
West Grove, PA
Share this story
Delete
Next Page of Stories