{"id":13626417,"url":"https://github.com/dddddddddzzzz/OpenStories","last_synced_at":"2025-04-16T14:33:36.777Z","repository":{"id":56776525,"uuid":"522239116","full_name":"dddddddddzzzz/OpenStories","owner":"dddddddddzzzz","description":"The Open Stories format.","archived":false,"fork":false,"pushed_at":"2024-10-29T04:06:44.000Z","size":10719,"stargazers_count":223,"open_issues_count":1,"forks_count":6,"subscribers_count":8,"default_branch":"main","last_synced_at":"2024-10-29T04:10:27.209Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://openstories.fyi","language":"TypeScript","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/dddddddddzzzz.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"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}},"created_at":"2022-08-07T14:43:08.000Z","updated_at":"2024-10-29T04:06:47.000Z","dependencies_parsed_at":"2024-01-14T07:17:10.460Z","dependency_job_id":"d3a44c75-ec71-4744-bb6a-8ad1e9841370","html_url":"https://github.com/dddddddddzzzz/OpenStories","commit_stats":null,"previous_names":["mochokidae/webstories-ts-types","mochokidae/openstories"],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dddddddddzzzz%2FOpenStories","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dddddddddzzzz%2FOpenStories/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dddddddddzzzz%2FOpenStories/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dddddddddzzzz%2FOpenStories/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dddddddddzzzz","download_url":"https://codeload.github.com/dddddddddzzzz/OpenStories/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223716513,"owners_count":17191057,"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":[],"created_at":"2024-08-01T21:02:17.799Z","updated_at":"2024-11-08T16:30:40.376Z","avatar_url":"https://github.com/dddddddddzzzz.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"# Open Stories\n\nOpen Stories is a syndication format for distributing stories to friends and families.\n\nStories are small pieces of media – such as images and video clips – with a 9:16 aspect ratio.\n\nAn OpenStories feed is essentially a [JSON Feed Version 1.1](https://www.jsonfeed.org/version/1.1/) with [extensions](https://www.jsonfeed.org/version/1.1/#extensions-a-name-extensions-a).\n\nYou can validate a `OpenStoriesFeed` with its TypeScript definitions in [`openstories-types`](https://npmjs.com/package/openstories-types).\n\n## Clients\n\n- [`\u003copen-stories\u003e`](https://github.com/dddddddddzzzz/open-stories-element): A custom element that will display a single `OpenStoriesFeed`'s content.\n\n## Example\n\nA minimal `OpenStoriesFeed` may look like the following; note, specifically the required `_open_stories` object for each `item`.\n\n```json\n{\n  \"version\": \"https://jsonfeed.org/version/1.1\",\n  \"title\": \"Valid feed\",\n  \"_open_stories\": {\n    \"version\": \"0.0.9\"\n  },\n  \"items\": [\n    {\n      \"id\": \"a1\",\n      \"content_text\": \"Text\",\n      \"authors\": [{\"name\": \"muan\", \"url\": \"https://muan.co\"}],\n      \"_open_stories\": {\n        \"mime_type\": \"image/jpg\",\n        \"url\": \"https://example.com/a1.jpg\",\n        \"alt\": \"Sky\"\n      }\n    },\n    {\n      \"id\": \"a2\",\n      \"content_text\": \"Text 2\",\n      \"authors\": [{\"name\": \"muan\", \"url\": \"https://muan.co\"}],\n      \"_open_stories\": {\n        \"mime_type\": \"image/jpg\",\n        \"url\": \"https://example.com/a2.jpg\",\n        \"alt\": \"Sky\"\n      }\n    }\n  ]\n}\n```\n\n## An Open Stories feed\n\n### Top-level\n\nThe top level object of the feed matches that of a JSON Feed with the following additions:\n\n- `_open_stories` (required, _Open Stories Metadata_): The _Open Stories Metadata_ of this feed.\n- `items`: (required, an array of _Open Stories Items_): The items of the feed.\n- `feed_url`: (required, string): Unlike in JSON Feed, `feed_url` is a required field in Open Stories feeds.\n\n### Open Stories Metadata\n\nMetadata that identifies an Open Stories feed\n\n- `preview` (optional, _Preview_): Data that helps clients display a preview of the feed while loading its items.\n- `version`: (required, _String_): The version of the Open Stories used for this feed. Currently, only `0.0.9` is supported.\n\n### Items\n\nItems represent stories in the feed. Items in an Open Stories feed match Items of a JSON Feed with the following additions:\n\n- `_open_stories` (required, either [_Image Story_](#image-story) or [_Video Story_](#video-story)): The story this item represents.\n- `authors`: (optional, an array of [_Open Stories Authors_](#authors)): The authors that created this item.\n\nAddtionally, authoring software of Open Stories is encouraged to populate the `content_html` field of the Item with an approximation of the stories contents, e.g. an `\u003cimg\u003e` point at the same `url` as the Item's `_open_stories.url`, with an `alt` attribute matching `_open_stories.alt`.\n\n```html\n\u003cimg src='{{ item._open_stories.url }}' alt='{{ item._open_stories.alt }}'\u003e\n{{ item._open_stories.caption }}\n```\n\nor\n\n```html\n\u003cvideo src='{{ item._open_stories.url }}' aria-describedby='description'\u003e\n  \u003ctrack src='{{ item._open_stories.tracks[0].url }}' kind='{{ item._open_stories.tracks[0].kind }}'\u003e\u003c/track\u003e\n\u003c/video\u003e\n\u003cdiv id='description'\u003e{{ item._open_stories.title }}\u003c/div\u003e\n```\n\n### Image Story\n\nCommon fields between Image Stories and Video Stories:\n\n- `url`: (required, _String_): The URL of the image. Expected to be in a 9:16 aspect ratio.\n- `date_expired` (optional, _String_): The date at which the story did or will expire. Clients are encouraged not to display stories after this date.\n- `preview` (optional, [_Preview_](#preview)): Data that helps the client display a preview while this image is loading.\n- `reactions` (optional, [_Reactions_](#reactions)): Data that describes how clients can react to this image.\n- `content_warning` (optional, _String_): If present, clients should display this warning before showing the story to the user.\n- `duration_in_seconds` (optional, _Number_): How long the story should be displayed for. Clients are free to adjust this number.\n- `alt` (required, _String_): The alt text of the image.\n- `caption` (optional, _String_): The caption of the image.\n\nFields unique to Image Story:\n\n- `mime_type` (required, _String_ beginning with `image/${string}`): the MIME type of the image.\n\n### Video Story\n\nCommon fields between Image Stories and Video Stories:\n\n- `url`: (required, _String_): The URL of the video. Expected to be in a 9:16 aspect ratio.\n- `date_expired` (optional, _String_): The date at which the story did or will expire. Clients are encouraged not to display stories after this date.\n- `preview` (optional, _Preview_): Data that helps the client display a preview while this video is loading.\n- `reactions` (optional, _Reactions_): Data that describes how clients can react to this video.\n- `content_warning` (optional, _String_): If present, clients should display this warning before showing the story to the user.\n- `duration_in_seconds` (optional, _Number_): How long the story should be displayed for. Clients are free to adjust this number.\n- `title` (required, _String_): A description of the video.\n\nFields unique to Video Story:\n\n- `mime_type` (required, _String_ beginning with `video/`): the MIME type of the video.\n- `tracks` (optional, an array of [_Tracks_](#tracks)): The subtitle, caption, or chapters track of a video. Modeled after the [`HTMLTrackElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTrackElement).\n\n#### Tracks\n\n- `url` (required, _String_): The URL of a WEBVTT file.\n- `lang` (optional, _String_): A [BCP47 language subtag](https://en.wikipedia.org/wiki/IETF_language_tag#List_of_common_primary_language_subtags) for the track.\n- `kind` (optional, _String_): 'captions' (default), 'subtitles', 'chapters'.\n- `label` (optional, _String_): A user readable label for the track.\n\n### Authors\n\nAuthors represent people that created the stories in the feed. Authors in an Open Stories feed match Authors of a JSON Feed with the following additions:\n\n- `name` (required, _String_): Unlike in JSON Feed, `name` is a required field in Open Stories feeds.\n- `url` (required, _String_): Unlike in JSON Feed, `url` is a required field in Open Stories. `url` is expected to uniquely identify the author across feeds and items.\n\n### Preview\n\nA _Preview_ is a light-weight representation that allows clients to construct a more pleasant preview image while the actual story is loading.\n\n- `blurhash` (optional, _String_): A [blurhash representation](https://blurha.sh/) of this item, at a 9:16 aspect ratio.\n- `color` (optional, _String_): A solid color that can be used as a placeholder to this story.\n\n### Reactions\n\n_Reactions_ allow a client to communicate back to the authors of a story.\n\n- `open_heart_urls` (optional, _String_): A [Open Heart](https://github.com/dddddddddzzzz/OpenHeart) URL.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdddddddddzzzz%2FOpenStories","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdddddddddzzzz%2FOpenStories","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdddddddddzzzz%2FOpenStories/lists"}