{"id":19976634,"url":"https://github.com/erossini/blazorclippy","last_synced_at":"2025-05-04T03:30:31.410Z","repository":{"id":150092955,"uuid":"501951640","full_name":"erossini/BlazorClippy","owner":"erossini","description":"Clippy Blazor component","archived":false,"fork":false,"pushed_at":"2022-06-10T09:37:53.000Z","size":2010,"stargazers_count":5,"open_issues_count":0,"forks_count":2,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-08T02:43:02.175Z","etag":null,"topics":["blazor","blazor-component","blazor-components","blazor-server","blazor-webassembly","clippy"],"latest_commit_sha":null,"homepage":"","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/erossini.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":"FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":"erossini"}},"created_at":"2022-06-10T07:54:41.000Z","updated_at":"2023-09-16T16:33:49.000Z","dependencies_parsed_at":"2023-06-05T08:00:20.672Z","dependency_job_id":null,"html_url":"https://github.com/erossini/BlazorClippy","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/erossini%2FBlazorClippy","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/erossini%2FBlazorClippy/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/erossini%2FBlazorClippy/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/erossini%2FBlazorClippy/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/erossini","download_url":"https://codeload.github.com/erossini/BlazorClippy/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252283518,"owners_count":21723485,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["blazor","blazor-component","blazor-components","blazor-server","blazor-webassembly","clippy"],"created_at":"2024-11-13T03:24:47.573Z","updated_at":"2025-05-04T03:30:31.404Z","avatar_url":"https://github.com/erossini.png","language":"C#","funding_links":["https://github.com/sponsors/erossini"],"categories":[],"sub_categories":[],"readme":"![Clippy](https://user-images.githubusercontent.com/9497415/173037488-4f7fc446-9ef5-4480-b4d2-f842887e9410.png)\n\n# Clippy for Blazor\nDo you remember Clippy? If the answer is no, please go away!\n\nThis is a component for [Blazor WebAssembly](https://www.puresourcecode.com/tag/blazor-webassembly/) and [Blazor Server](https://www.puresourcecode.com/tag/blazor-server/). The component is built with .NET6.\n\nSome useful link:\n- Source code available on [GitHub](https://github.com/erossini/BlazorClippy)\n- Demo website [here](https://clippy.puresourcecode.com/)\n- More info about this component on [PureSourceCode.com](https://www.puresourcecode.com/dotnet/blazor/clippy-blazor-component/)\n- Support and forum [here](https://www.puresourcecode.com/forum/clippy/)\n\n## Who is Clippy?\n\nClippy is an Office assistant that helped users when they were using any of the Microsoft Office applications. \nClippy's role was to communicate with users and give corresponding actions. The original name was Clippit, but it was later nicknamed \"Clippy\".\n\nThe name came as a result of its resemblance to a paperclip. It was one of the notable assistants that helped users when using any MS applications. \nUnfortunately, Clippy got some negative feedback from certain users that led to its removal in later Microsoft Office applications versions.\n\nClippy is a paperclip that was created by Kevan J. Atterberry. It was made to create a social interface to make it easier for people to understand the computer.\n\nGenerally, the idea behind Clippy was to assist users in understanding how to use the operating system. Thereby, users could access certain features on Microsoft programs and applications quickly.\n\nThe Clippy used a series of Bayesian algorithms to determine the users' needs. In a big way, it also helped in typing cues, autoformat, and other features. However, people later complained that it was intrusive ad annoying, which led to its removal.\n\n## Add Clippy library\nIn your Blazor project, add the Clippy package from [Nuget](https://www.nuget.org/packages/PSC.Blazor.Components.Clippy/). \nIn the `Import.razor` add the reference to the package\n\n```csharp\n@using PSC.Blazor.Components.Clippy\n```\n\nThen, you have to add the **Clippy** service to your project. In your `Program.cs`, add the following line\n\n```csharp\nusing PSC.Blazor.Components.Clippy\n...\nbuilder.Services.AddScoped\u003cClippyService\u003e();\n```\n\nbefore\n\n```csharp\nawait builder.Build().RunAsync();\n```\n\n### Add scripts\nNow, you have to add the CSS style and the scripts for Clippy. Go to your `index.html` under `wwwroot`. In the `HEAD` section, add the folloing line\n\n```html\n\u003clink rel=\"stylesheet\" type=\"text/css\" href=\"_content/PSC.Blazor.Components.Clippy/clippy.css\" media=\"all\"\u003e\n```\n\nThen, at the bottom of the page before closing the tag `BODY` add the following scripts:\n\n```html\n\u003cscript src=\"_content/PSC.Blazor.Components.Clippy/clippy.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"_content/PSC.Blazor.Components.Clippy/clippyInterop.js\"\u003e\u003c/script\u003e\n```\n\nIf your application doesn't have `jQuery`, you have to add this line\n\n```html\n\u003cscript src=\"_content/PSC.Blazor.Components.Clippy/jquery.slim.min.js\"\u003e\u003c/script\u003e\n```\n\n## Use Clippy\nTo use Clippy in a Razor page, inject `ClippyService` in the page adding this code in the `@code` section\n\n```csharp\n[Inject] \npublic ClippyService clippy { get; set; }\n```\n\nor at the top of the page\n\n```csharp\n@inject ClippyService clippy\n```\n\nNow, you can use `clippy` service in the page. To load an agent, use this code\n\n```csharp\nawait clippy.Load(agentName);\n```\n\n`agentName` is one of the following from the enum `AgentName`\n\n- Bonzi\n- Clippy (default)\n- F1\n- Genie\n- Genius\n- Links\n- Merlin\n- Peedy\n- Rocky\n- Rover\n\n![Clippy agents](https://user-images.githubusercontent.com/9497415/173025842-4b6b42e7-4dec-45ef-a3e6-e7ddfb107ce2.png)\n\n## Clippy functions\n\n| Name              | Parameters                 | Return       | Description                                      |\n|-------------------|----------------------------|--------------|--------------------------------------------------|\n| AnimateRandom     |                            |              | Play an randon animation for the list            |\n| GestureAt         | int x, int y               |              | The agent points in the direction of the x and y |\n| GetAnimationsList |                            | List\u0026lt;string\u003e | List of animation for an agent                   |\n| Hide              |                            |              | Hide and dispose the agent                       |\n| Load              | AgentName agentName        |              | Load an agent. By default the agent is `Clippy`. Select another agent using the enum `AgentName` |\n| PlayAnimation     | ClippyAnimations animation |              | Play one of the animation for the agent. Choose from the enum `ClippyAnimations`. See below the list of available animations |\n| Speak             | string text                |              | Show the `text` in the baloon                    | \n| Stop              |                            |              | Stop all actions in the queue and go back to idle mode |\n| StopCurrent       |                            |              | Stop the current action in the queue             |\n\n## Animation list\n\n- Congratulate\n- LookRight\n- SendMail\n- Thinking\n- Explain\n- IdleRopePile\n- IdleAtom\n- Print\n- Hide\n- GetAttention\n- Save\n- GetTechy\n- GestureUp\n- Idle1_1\n- Processing\n- Alert\n- LookUpRight\n- IdleSideToSide\n- GoodBye\n- LookLeft\n- IdleHeadScratch\n- LookUpLeft\n- CheckingSomething\n- Hearing_1\n- GetWizardy\n- IdleFingerTap\n- GestureLeft\n- Wave\n- GestureRight\n- Writing\n- IdleSnooze\n- LookDownRight\n- GetArtsy\n- Show\n- LookDown\n- Searching\n- EmptyTrash\n- Greeting\n- LookUp\n- GestureDown\n- RestPose\n- IdleEyeBrowRaise\n- LookDownLeft\n\n## Example\n\n```csharp\nawait clippy.Load(AgentName.Clippy);\nawait clippy.PlayAnimation(ClippyAnimations.GetAttention);\nawait clippy.Speak(\"Hello Blazor! Do you like it?\");\nawait clippy.Speak(\"I can help your users. You know I can do that :)\");\nawait clippy.PlayAnimation(ClippyAnimations.CheckingSomething);\nawait clippy.Speak(\"I helped whole generation of people with PC :)\");\nawait clippy.PlayAnimation(ClippyAnimations.GoodBye);\n```\n\n## Screenshot demo\nThe demo application shows all the functionalities offer from the component. Select an agent from the list and then click *Load*.\n\n![Screenshot demo](https://user-images.githubusercontent.com/9497415/173026049-e29bd8d2-689f-4830-8e48-65447b2bd202.png)\n\nHere the list of agents available.\n\n![Screenshot demo](https://user-images.githubusercontent.com/9497415/173026144-73c5594e-c85f-4365-aa53-442c9cede671.png)\n\n---\n    \n## Other Blazor components\n\n| Component name | Forum | Description |\n|---|---|---|\n| [DataTable for Blazor](https://www.puresourcecode.com/dotnet/net-core/datatable-component-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/forum/datatables/) | DataTable component for Blazor WebAssembly and Blazor Server |\n| [Markdown editor for Blazor](https://www.puresourcecode.com/dotnet/blazor/markdown-editor-with-blazor/) | [Forum](https://www.puresourcecode.com/forum/forum/markdown-editor-for-blazor/) |  This is a Markdown Editor for use in Blazor. It contains a live preview as well as an embeded help guide for users. |\n| [Browser Detect for Blazor](https://www.puresourcecode.com/dotnet/blazor/browser-detect-component-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/browser-detect-for-blazor/) | Browser detect for Blazor WebAssembly and Blazor Server |\n| [CodeSnipper for Blazor](https://www.puresourcecode.com/dotnet/blazor/code-snippet-component-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/codesnippet-for-blazor/) | Add code snippet in your Blazor pages for 196 programming languages with 243 styles |\n| [Copy To Clipboard](https://www.puresourcecode.com/dotnet/blazor/copy-to-clipboard-component-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/copytoclipboard/) | Add a button to copy text in the clipbord | \n| SVG Icons and flags for Blazor | [Forum](https://www.puresourcecode.com/forum/icons-and-flags-for-blazor/) | Library with a lot of SVG icons and SVG flags to use in your Razor pages |\n| [Modal dialog for Blazor](https://www.puresourcecode.com/dotnet/blazor/modal-dialog-component-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/forum/modal-dialog-for-blazor/) |  Simple Modal Dialog for Blazor WebAssembly |\n| [PSC.Extensions](https://www.puresourcecode.com/dotnet/net-core/a-lot-of-functions-for-net5/) | [Forum](https://www.puresourcecode.com/forum/forum/psc-extensions/) |  A lot of functions for .NET5 in a NuGet package that you can download for free. We collected in this package functions for everyday work to help you with claim, strings, enums, date and time, expressions... |\n| [Quill for Blazor](https://www.puresourcecode.com/dotnet/blazor/create-a-blazor-component-for-quill/) | [Forum](https://www.puresourcecode.com/forum/forum/quill-for-blazor/) |  Quill Component is a custom reusable control that allows us to easily consume Quill and place multiple instances of it on a single page in our Blazor application |\n| [Segment for Blazor](https://www.puresourcecode.com/dotnet/blazor/segment-control-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/forum/segments-for-blazor/) |  This is a Segment component for Blazor Web Assembly and Blazor Server |\n| [Tabs for Blazor](https://www.puresourcecode.com/dotnet/blazor/tabs-control-for-blazor/) | [Forum](https://www.puresourcecode.com/forum/forum/tabs-for-blazor/) |  This is a Tabs component for Blazor Web Assembly and Blazor Server |\n| [WorldMap for Blazor]() | [Forum](https://www.puresourcecode.com/forum/worldmap-for-blazor/) | Show world maps with your data |\n\n## More examples and documentation\n*   [Write a reusable Blazor component](https://www.puresourcecode.com/dotnet/blazor/write-a-reusable-blazor-component/)\n*   [Getting Started With C# And Blazor](https://www.puresourcecode.com/dotnet/net-core/getting-started-with-c-and-blazor/)\n*   [Setting Up A Blazor WebAssembly Application](https://www.puresourcecode.com/dotnet/blazor/setting-up-a-blazor-webassembly-application/)\n*   [Working With Blazor Component Model](https://www.puresourcecode.com/dotnet/blazor/working-with-blazors-component-model/)\n*   [Secure Blazor WebAssembly With IdentityServer4](https://www.puresourcecode.com/dotnet/blazor/secure-blazor-webassembly-with-identityserver4/)\n*   [Blazor Using HttpClient With Authentication](https://www.puresourcecode.com/dotnet/blazor/blazor-using-httpclient-with-authentication/)\n*   [InputSelect component for enumerations in Blazor](https://www.puresourcecode.com/dotnet/blazor/inputselect-component-for-enumerations-in-blazor/)\n*   [Use LocalStorage with Blazor WebAssembly](https://www.puresourcecode.com/dotnet/blazor/use-localstorage-with-blazor-webassembly/)\n*   [Modal Dialog component for Blazor](https://www.puresourcecode.com/dotnet/blazor/modal-dialog-component-for-blazor/)\n*   [Create Tooltip component for Blazor](https://www.puresourcecode.com/dotnet/blazor/create-tooltip-component-for-blazor/)\n*   [Consume ASP.NET Core Razor components from Razor class libraries | Microsoft Docs](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/class-libraries?view=aspnetcore-5.0\u0026tabs=visual-studio)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ferossini%2Fblazorclippy","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ferossini%2Fblazorclippy","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ferossini%2Fblazorclippy/lists"}