BlazorClippy 0.1.0

.NET 6.0
dotnet add package BlazorClippy --version 0.1.0
NuGet\Install-Package BlazorClippy -Version 0.1.0
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="BlazorClippy" Version="0.1.0" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add BlazorClippy --version 0.1.0
#r "nuget: BlazorClippy, 0.1.0"
#r directive can be used in F# Interactive, C# scripting and .NET Interactive. Copy this into the interactive tool or source code of the script to reference the package.
// Install BlazorClippy as a Cake Addin
#addin nuget:?package=BlazorClippy&version=0.1.0

// Install BlazorClippy as a Cake Tool
#tool nuget:?package=BlazorClippy&version=0.1.0

BlazorClippy

Our hero...Mr. Clippy... is back to help us in the Blazor 😃 The simple wrapper for the clippyjs package.

I would like to thanks to Clippyjs project. Next thanks goes to my old colleague Ondrej Vicar, who found the clippyjs before few years for me and created simple wrapper in electron in that days. I still was waiting when I will get back to the Clippy 😄 Thanks a lot Ondro 😃

Supported framework

The library and demo is built with .NET 6.0. Project was created in Microsoft Visual Studio 2022 (17.2.0 Preview 4).

Basic usage

Demo project

Please explore the demo project.

image

Create Blazor Application and load library

Create Blazor empty project in Visual Studio

Add BlazorClippy nuget package

dotnet add package BlazorClippy

Add dependencies

Add this to the header

<link rel="stylesheet" type="text/css" href="_content/BlazorClippy/clippy.css" media="all">

Add this to the body behind the <div id="app>Loading...</div>

    <script src="_content/BlazorClippy/jquery.slim.min.js"></script>
    <script src="_content/BlazorClippy/clippy.min.js"></script>
    <script src="_content/BlazorClippy/clippyInterop.js"></script>

Add using and BlazorClippy service in the Program.cs

  using BlazorClippy;
 
  .....
  
  builder.Services.AddScoped<ClippyService>();

Load clippy

At start you need to initialized the Clippy. You can do it with call of clippy.Load() function. You can call this function during the load of the app also. But call it just once!

@inject ClippyService clippy
  
<div class="row">
    <div class="col">
        <button class="btn btn-primary" onclick="@(async () => await clippy.Load())">Load</button>
    </div>
</div>

Call other functions you need

// play random animation
await clippy.AnimateRandom();

// Play specific animation - check ClippyAnimations enum to know all
await clippy.PlayAnimation(ClippyAnimations.GoodBye);

// Display text
await clippy.Speak("Hello All Blazor Lovers :)");

// Show gesture in some direction
await clippy.GestureAt(50,50);

More commands you can find in the ClippyService.

Product Versions
.NET net6.0 net6.0-android net6.0-ios net6.0-maccatalyst net6.0-macos net6.0-tvos net6.0-windows net7.0 net7.0-android net7.0-ios net7.0-maccatalyst net7.0-macos net7.0-tvos net7.0-windows
Compatible target framework(s)
Additional computed target framework(s)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
0.1.0 195 5/8/2022