codersrank-org / summary-widget Goto Github PK
View Code? Open in Web Editor NEWIntegrate your CodersRank profile summary to your personal website
Home Page: https://codersrank.io
License: MIT License
Integrate your CodersRank profile summary to your personal website
Home Page: https://codersrank.io
License: MIT License
When I try to use any CodersRank widget in app with js built by webpack, I get following error:
app.js:5132 Uncaught TypeError: Failed to execute 'define' on 'CustomElementRegistry': parameter 2 is not of type 'Function'.
at Module../resources/js/app.js (app.js:5132)
at __webpack_require__ (app.js:52999)
....
Surprisingly, widgets (mostly) work, but due to code errors caused by this other stuff (like Vue components) doesn't work.
How can I get around it?
Full code can be seen here:
https://github.com/apsg/gackowski.edu.pl/blob/main/resources/js/app.js
Let the user decide which badges to show. Displaying only the highlighted 3 badge makes the widget not very informative.
Proposal:
I may help to implement this if someone gives me a hand initially to understand how the codebase/project is structured/intended. Thank you.
I tried adding the widget to my Github profile, but only a broken image shows up.
When I use the URL in the browser directly, the image loads but only after quite a while, which is I guess why it doesn't work on github profiles, since Github camouflages links.
https://cr-ss-service.azurewebsites.net/api/ScreenShot?widget=summary&username=Zenoo&badges=3
v
https://camo.githubusercontent.com/9314b853ceb50726a52464c11d3130dc1fd14f4f1e4024617c4799407a89af63/68747470733a2f2f63722d73732d736572766963652e617a75726577656273697465732e6e65742f6170692f53637265656e53686f743f7769646765743d73756d6d61727926757365726e616d653d5a656e6f6f266261646765733d33
Following https://docs.codersrank.io/widgets/summary-widget when I create a page with
<script src="https://unpkg.com/@codersrank/[email protected]/codersrank-summary.min.js"></script>
<codersrank-summary username="fwolfst" badges=2 branding="false" layout="vertical"></codersrank-summary>
The widget using the link below does not work for GitHub README and it doesnt work from browser:
https://cr-ss-service.azurewebsites.net/api/ScreenShot?widget=summary&username=GITHUB_USERNAME
I tried working with issue #5 and the solution for the the issue doesnt work either - neither does caching as I do not control request headers, I just want to use in the README.
How can I make it work in a basic implementation using my username?
The widgets can't be used with React and Typescript
<img
src="https://cr-ss-service.azurewebsites.net/api/ScreenShot?widget=summary&username=YOUR_USERNAME&badges=2&show-avatar=false&style=--header-bg-color:%23000;--border-radius:10px"
/>
is no longer working and the Error Fetching Resource pops up
Hi,
I'm trying to add the image to my profile but it is not working.
Based on your docs, this url should return it, but it isn't: https://cr-ss-service.azurewebsites.net/api/ScreenShot?widget=summary&username=bellini666
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.