screenly / playground Goto Github PK
View Code? Open in Web Editor NEWVarious examples of how developers can use Screenly and Screenly's API
Home Page: https://www.screenly.io
License: MIT License
Various examples of how developers can use Screenly and Screenly's API
Home Page: https://www.screenly.io
License: MIT License
Customers want to be able to log in to their Grafana dashboards.
Customer wants to be able to log in to their PRTG monitor dashboards. This is a private site integrated with AD.
I was looking at a sample app from Dark, and they show how to make a simple visitor check-in app.
The process is pretty easy:
ShipHero is a popular fulfillment software. I want to add a JavaScript Injection snippet for the user-facing site, shipping.shiphero.com.
Similar examples can be found here.
Customer wants to be able to log in to their Help Systems Vityl dashboards. This is a private site integrated with AD.
Customer wants to be able to log in to their PRTG IT OPS dashboards. This is a private site integrated with AD.
The idea with this is to showcase how to build an Digital Out of Home (DooH) platform for Screenly. The demo would be a simple Edge App app that randomly picks an image to return from a dataset (included in the Edge App). When the image is served, the app would take noticed of this and generate an event that is sent to Google Analytics.
The user will then be able to track the impressions directly in Google Analytics. We would also enrich this data with all the data available from the Screenly Metadata. That way you can not only see aggregates, but also slice it multiple ways (city etc).
This is probably the most popular cookie consent
Here's an example of where it is live. It would be good to have some more details on this and a JavaScript Injector snippet for it.
A lot of WiFis (and even wired networks) use captive portals. This is normally served from http://captive.apple.com.
When you're logged in, you would normally get this:
$ curl http://captive.apple.com
<HTML><HEAD><TITLE>Success</TITLE></HEAD><BODY>Success</BODY></HTML>
In the first phase, let's use JavaScript to log into a basic page (to be provided).
Customer wants to be able to log in to their Dynatrace dashboards. This is a private site integrated with Okta.
Customer wants to be able to log in to their JAMS dashboards. This is a private site integrated with AD.
We should create a Google Calendar Edge App. It should be fairly straight forward to accomplish based on the quickstart guide.
The goal is to show a weekly/daily calendar in full screen mode.
We would need to define some settings, including:
CLIENT_ID
(setting)API_KEY
(secret)We need to create a sleek countdown timer as an Edge App.
One of the demo assets we use is the Tableau public dashboard. However, when this loads, we get this:
Please create a JS injector script that closes this.
We're experimenting with using Zoom on a Screenly player for screen sharing for a customer. When you follow this URL to join the personal meeting room it will ask you if you want to download Zoom: we want to say no to that. Then we need to click where it says "Join from Your Browser" in order to join the meeting, and after we may need to click the "Join with computer audio" button.
units
(metric
or imperial
) as one of the query parameters.screenly.js
The coordinates are not that precise. They're autogenerated by GitHub Copilot.
const getCoordinates = (area) => {
switch (area) {
case 'San Francisco':
return [
'37.7749',
'-122.4194'
]
case 'Manila':
return [
'14.5995',
'120.9842'
]
case 'Dijon':
return [
'47.3220',
'5.0415'
]
case 'New York':
return [
'40.7128',
'-74.0060'
]
default:
return []
}
}
const screenly = {
metadata: {
coordinates: getCoordinates('New York'),
hardware: 'Screenly Player Max',
hostname: 'srly-abcdefghijklmno',
location: 'San Francisco, USA',
screen_name: 'Edge App Test',
screenly_version: 'v1.0.0',
tags: [
'All Screens'
]
},
settings: {
disable_analytics: false,
ga_api_key: 'mcd0n4ld5',
sentry_id: 'p4nd4expr355',
// Make sure to obfuscate the OpenWeatherMap API key as well.
openweathermap_api_key: '[redacted]',
}
}
gulp
actions, since they are no longer needed and move src
into the root folder.
mock
feature, as this is built into the CLI.We need a way to log in to Tableau dashboards using credentials and not cookies.
Creating an RSS reader in JavaScript is pretty straight forward. I'd love to see an example of how to create an RSS reader for Screenly using this.
Customer wants to be able to log into their Domo dashboard.
I'm using one of the Official Raspberry Pi 7" Touchscreen Display in my test setup.
However, when loading the asset metadata page, it breaks. We should add support for the following resolutions:
Instead of using a primitive sleep()
, it would make more sense to use Heroku Scheduler to drive the app.
Customer wants to be able to log into their Magento dashboard, which is a product of Adobe.
Eric to provide URL and credentials.
gulp
actions, since they are no longer needed, and move src
into the root folder.
mock
feature, as this is built into the CLI.screenly.yml
.The idea behind Screenly Queue is to develop a queue system for retail environments that is open source and cost effective.
tl;dr: The user walks in to the store and gets a number. The teller presses button in the user interface (teller interface) and the number shows up on the screen (dashboard interface).
There are four sides to the app:
The admin interface is simply the Django admin interface. You will be able to do the following:
In the prototype we will only have one queue, but it would be interesting down the road to have different queues.
The teller interface is a Django page that allows you to do the following:
This is the interface that will be shows on a big monitor. It's just an Edge App that pulls from the main server (to ensure rapid updates). It will show "Now serving X at counter Y". When the number is increased, the display will jump forward with very little latency.
This is where the customer gets the number from (if the client isn't using a physical printer). It's simply a page that will give you a session cookie and when you press "Request number" it return a number. This is normally displayed used on a mobile phone.
Customer wants to be able to log in to their Red Gate SQL Monitor dashboards. This is a private site integrated with AD.
With our CLI now ready, I want to update the instructions a bit for the Instagram app
screenly asset add path/to/file.html
The logic for this is very simple.
name
. If this is unset, the default value should be stranger
.If the secret is unset, it should show:
Hi stranger,
I'm $screen_name.
If it is set, it should show:
Hi $name,
I'm $screen_name.
A user wants the ability to log in to their ArcGIS Dashboard.
https://www.esri.com/en-us/arcgis/products/arcgis-online/overview
https://www.esri.com/en-us/home
Example URL: https://gis.[company-name.com]/portal/apps/dashboards/[dashboard-id]
Message me for test URL and login credentials.
An example workflow: https://github.com/Screenly/Playground/actions/runs/7545920425/job/20542576908
The Deploy Edge App step is successful, but the CLI command returned an error: Failed to upload edge app: App id cannot be empty. Provide it either in manifest or with --app-id..
We need to create a sleek looking design for asset-metadata. I'd like to have a nice single screen that includes a map that uses the coordinates.
Acceptance Criteria:
Customer wants to be able to log in to their ServiceNow dashboards. This is a private site integrated with Okta.
We use Google Maps as part of our demo assets. When loading this from EU (at least), it just throws a cookie consent dialogue:
Let's write JS Injector solve this too.
We're currently serving static content using Cloudflare Workers (and KVs). This isn't a very efficient way of doing this. We should migrate this flow to Cloudflare Pages instead.
I quickly looked over how we've implemented Sentry in the Weather edge app here. Comparing this to the Sentry documentation, we seem to be missing a few things.
Implement an earthquake notification system into the existing app. The system should scan for earthquake notifications, extract relevant data (magnitude and coordinates), and update screen content accordingly.
GET /screens/
) to retrieve information about all screens.Please note that this is a draft task description, and additional details may be required for a complete implementation.
Acceptance Criteria:
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.