{"id":18597468,"url":"https://github.com/convoo/file-fire","last_synced_at":"2025-07-06T14:34:22.010Z","repository":{"id":58240468,"uuid":"64053025","full_name":"convoo/file-fire","owner":"convoo","description":"Simple way to upload and download files from Firebase Storage.","archived":false,"fork":false,"pushed_at":"2017-05-12T14:17:28.000Z","size":69,"stargazers_count":13,"open_issues_count":8,"forks_count":5,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-10-10T08:14:00.895Z","etag":null,"topics":["firebase","polymer","webcomponents"],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/convoo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-24T07:00:15.000Z","updated_at":"2021-10-16T09:44:50.000Z","dependencies_parsed_at":"2022-08-31T09:40:24.307Z","dependency_job_id":null,"html_url":"https://github.com/convoo/file-fire","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/convoo%2Ffile-fire","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/convoo%2Ffile-fire/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/convoo%2Ffile-fire/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/convoo%2Ffile-fire/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/convoo","download_url":"https://codeload.github.com/convoo/file-fire/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223442151,"owners_count":17145715,"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":["firebase","polymer","webcomponents"],"created_at":"2024-11-07T01:28:16.317Z","updated_at":"2024-11-07T01:28:16.861Z","avatar_url":"https://github.com/convoo.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# file-fire\n\n\u003cp align=\"center\"\u003e\n  \u003cimg alt=\"file-fire\" src=\"File-Fire.png\" width=\"200\"\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\nSimple way to upload and download files from Firebase Storage.\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://webcomponents.org/element/convoo/file-fire\"\u003e\u003cimg src=\"https://img.shields.io/badge/webcomponents.org-published-blue.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://gitter.im/convoo/general\"\u003e\u003cimg src=\"https://img.shields.io/badge/gitter-join%20chat-brightgreen.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"http://waffle.io/convoo/roadmap\"\u003e\u003cimg src=\"https://badge.waffle.io/convoo/file-fire.svg?label=In%20Progress\u0026title=In%20Progress\"\u003e\u003c/a\u003e\n\n\u003c/p\u003e\n\n---\n\n## Install\n\n```\nbower install file-fire --save\n```\n\n# \\\u003cfile-fire\\\u003e\n\nAn element that uploads files and provides download url from Firebase Storage. For images, it can resize and provide a placeholder as well.\n\nAfter resizing, it can also generate 2x 3x image sizes. This is determined by the `max-scale` and `scale-step` properties. Some examples:\n\n1. `max-scale` of 3 and `scale-step` of 1 will generate 1x, 2x and 3x images.\n1. `max-scale` of 2 and `scale-step` of 0.5 will generate 1x, 1.5x and 2x images.\n\nIt can also fetch images from elsewhere (such as a twitter profile image) and upload that to your Firebase Storage.\n\n\u003c!--\n```\n\u003ccustom-element-demo\u003e\n  \u003ctemplate\u003e\n    \u003clink rel=\"import\" href=\"file-fire.html\"\u003e\n    \u003clink rel=\"import\" href=\"../polymerfire/firebase-app.html\"\u003e\n    \u003cnext-code-block\u003e\u003c/next-code-block\u003e\n  \u003c/template\u003e\n\u003c/custom-element-demo\u003e\n```\n--\u003e\n```html\n\u003cfirebase-app\n  name=\"demo\"\n  api-key=\"AIzaSyACU-9dEBSmlEq8iwfuDCPCWU81UNDytuQ\"\n  auth-domain=\"convoofire.firebaseapp.com\"\n  database-url=\"https://convoofire.firebaseio.com\"\n  storage-bucket=\"convoofire.appspot.com\"\n  \u003e\n\u003c/firebase-app\u003e\n\u003cfile-fire\n  app-name=\"demo\"\n  path=\"/remote/file\"\n  src-url=\"https://pbs.twimg.com/profile_images/741290730170122240/abfazODg_400x400.jpg\"\n  progress=\"{{remoteProgress}}\"\n  download-url=\"{{downloadRemoteUrl}}\"\n  max-scale=\"3\"\n  resize-height=\"50\"\n  resize-width=\"50\"\n  placeholder=\"{{remotePlaceholder}}\"\n\u003e\u003c/file-fire\u003e\n```\n\n\n# \\\u003cfile-fire-drop\\\u003e\n\nAn enhanced version of \\\u003cfile-fire\\\u003e that allows dragging and dropping a file. This element can have contents that are displayed unless a file is dragged over it.\n\u003c!--\n```\n\u003ccustom-element-demo\u003e\n  \u003ctemplate\u003e\n    \u003clink rel=\"import\" href=\"file-fire-drop.html\"\u003e\n    \u003clink rel=\"import\" href=\"../polymerfire/firebase-app.html\"\u003e\n    \u003cnext-code-block\u003e\u003c/next-code-block\u003e\n  \u003c/template\u003e\n\u003c/custom-element-demo\u003e\n```\n--\u003e\n```html\n\u003cfile-fire-drop\n  app-name=\"demo\"\n  path=\"/u/test.png\"\n  over-write\n  progress=\"{{progress}}\"\n  placeholder=\"{{base64}}\"\n  files=\"{{images}}\"\n\u003e\nThis text will be visible unless you hover over it while dragging a file\u003c/br\u003e\nThis text will be visible unless you hover over it while dragging a file\u003c/br\u003e\nThis text will be visible unless you hover over it while dragging a file\u003c/br\u003e\n\u003c/file-fire-drop\u003e\n```\n\n# \\\u003cfile-fire-fetch\\\u003e\n\nAn element that retrieves the download url from the file storage path in Firebase Storage.\n\u003c!--\n```\n\u003ccustom-element-demo\u003e\n  \u003ctemplate\u003e\n    \u003clink rel=\"import\" href=\"file-fire-fetch.html\"\u003e\n    \u003clink rel=\"import\" href=\"../polymerfire/firebase-app.html\"\u003e\n    \u003cnext-code-block\u003e\u003c/next-code-block\u003e\n  \u003c/template\u003e\n\u003c/custom-element-demo\u003e\n```\n--\u003e\n```html\n\u003cfirebase-app\n  name=\"demo\"\n  api-key=\"AIzaSyACU-9dEBSmlEq8iwfuDCPCWU81UNDytuQ\"\n  auth-domain=\"convoofire.firebaseapp.com\"\n  database-url=\"https://convoofire.firebaseio.com\"\n  storage-bucket=\"convoofire.appspot.com\"\n  \u003e\n\u003c/firebase-app\u003e\n\u003cfile-fire-fetch\n  app-name=\"demo\"\n  path=\"/my/path/to/file.jpg\"\n  file=\"{{myFile}}\"\n  file-url=\"{{myFileURL}}\"\n\u003e\u003c/file-fire-fetch\u003e\n```\n\n## Dependencies\n\nElement dependencies are managed via [Bower](http://bower.io/). You can\ninstall that via:\n\n    npm install -g bower\n\nThen, go ahead and download the element's dependencies:\n\n    bower install\n\n\n## Playing With Your Element\n\nIf you wish to work on your element in isolation, we recommend that you use\n[Polyserve](https://github.com/PolymerLabs/polyserve) to keep your element's\nbower dependencies in line. You can install it via:\n\n    npm install -g polyserve\n\nAnd you can run it via:\n\n    polyserve\n\nOnce running, you can preview your element at\n`http://localhost:8080/components/image-fire/`, where `image-fire` is the name of the directory containing it.\n\n\n## Testing Your Element\n\nSimply navigate to the `/test` directory of your element to run its tests. If\nyou are using Polyserve: `http://localhost:8080/components/image-fire/test/`\n\n### web-component-tester\n\nThe tests are compatible with [web-component-tester](https://github.com/Polymer/web-component-tester).\nInstall it via:\n\n    npm install -g web-component-tester\n\nThen, you can run your tests on _all_ of your local browsers via:\n\n    wct\n\n#### WCT Tips\n\n`wct -l chrome` will only run tests in chrome.\n\n`wct -p` will keep the browsers alive after test runs (refresh to re-run).\n\n`wct test/some-file.html` will test only the files you specify.\n\n\n## Yeoman support\n\nIf you'd like to use Yeoman to scaffold your element that's possible. The official [`generator-polymer`](https://github.com/yeoman/generator-polymer) generator has a [`seed`](https://github.com/yeoman/generator-polymer#seed) subgenerator.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconvoo%2Ffile-fire","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fconvoo%2Ffile-fire","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconvoo%2Ffile-fire/lists"}