{"id":19146774,"url":"https://github.com/lcluber/orbis.js","last_synced_at":"2026-06-11T21:35:27.835Z","repository":{"id":13158368,"uuid":"31953243","full_name":"LCluber/Orbis.js","owner":"LCluber","description":"Lazy loader","archived":false,"fork":false,"pushed_at":"2022-12-08T03:51:14.000Z","size":6945,"stargazers_count":1,"open_issues_count":16,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-04-14T12:27:00.801Z","etag":null,"topics":["lazy-loading"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/LCluber.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2015-03-10T11:15:32.000Z","updated_at":"2022-04-17T14:17:02.000Z","dependencies_parsed_at":"2023-01-13T17:20:05.524Z","dependency_job_id":null,"html_url":"https://github.com/LCluber/Orbis.js","commit_stats":null,"previous_names":[],"tags_count":27,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LCluber%2FOrbis.js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LCluber%2FOrbis.js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LCluber%2FOrbis.js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LCluber%2FOrbis.js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LCluber","download_url":"https://codeload.github.com/LCluber/Orbis.js/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240229976,"owners_count":19768597,"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":["lazy-loading"],"created_at":"2024-11-09T07:47:59.700Z","updated_at":"2026-06-11T21:35:27.803Z","avatar_url":"https://github.com/LCluber.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Synopsis\n\n[Orbis.js](http://orbisjs.lcluber.com) is a lazy loader written in TypeScript.\n\n## Motivation\n\nThe main purpose of this library is to provide a simple way to load assets only when needed instead of loading everything when the main page loads.\n\n## Installation\n\n### npm\n\n```bash\n$ npm i @lcluber/orbisjs\n```\n\n### Yarn\n\n```bash\n$ yarn add @lcluber/orbisjs\n```\n\n## Usage\n\n### html\n\n```html\n\u003cdiv id=\"progressPanel\"\u003e\n  \u003cbutton\n    id=\"launcher\"\n    type=\"button\"\n    class=\"btn btn-default\"\n    onclick=\"loadAssets()\"\n  \u003e\n    LOAD ASSETS\n  \u003c/button\u003e\n  \u003cdiv id=\"progressText\"\u003eLoading\u003c/div\u003e\n  \u003cdiv id=\"progressBar\"\u003e\n    \u003cdiv id=\"progressBarNumber\"\u003e0\u003c/div\u003e\n    \u003cdiv id=\"progressBarPercentage\"\u003e\u003c/div\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n```\n\n### assets object\n\n```javascript\n//example of assets to load :\nvar list = {\n  shaders: {\n    folder: \"shaders\",\n    files: [\n      { name: \"shader1.txt\" },\n      { name: \"shader2.txt\" },\n      { name: \"shader3.txt\" }\n    ]\n  },\n  materials: {\n    folder: \"materials\",\n    files: [\n      { name: \"material1.txt\" },\n      { name: \"material2.txt\" },\n      { name: \"material3.doc\" }\n    ]\n  },\n  textures: {\n    folder: \"textures\",\n    files: [\n      { name: \"texture1.png\" },\n      { name: \"texture2.png\" },\n      { name: \"texture3.png\" }\n    ]\n  },\n  meshes: {\n    folder: \"meshes\",\n    files: [{ name: \"mesh1.json\" }, { name: \"mesh2.json\" }]\n  },\n  sprites: {\n    folder: \"sprites\",\n    files: [\n      {\n        name: \"sprite1.png\",\n        params: {\n          texSize: [124, 70],\n          frameSize: [62, 70]\n        }\n      },\n      {\n        name: \"sprite2.png\",\n        params: {\n          texSize: [540, 30],\n          frameSize: [30, 30]\n        }\n      },\n      {\n        name: \"sprite3.png\",\n        params: {\n          texSize: [540, 30],\n          frameSize: [30, 30]\n        }\n      }\n    ]\n  },\n  sounds: {\n    folder: \"sounds\",\n    files: [\n      {\n        name: \"sound1.mp3\",\n        params: {\n          volume: 0.2,\n          loop: 0,\n          type: 0\n        }\n      },\n      {\n        name: \"sound2.mp3\",\n        params: {\n          volume: 0.3,\n          loop: 0,\n          type: 0\n        }\n      },\n      {\n        name: \"sound3.mp3\",\n        params: {\n          volume: 0.7,\n          loop: 0,\n          type: 0\n        }\n      }\n    ]\n  }\n};\n```\n\n### ES6\n\n```javascript\nimport { Loader, IResponse } from \"@lcluber/orbisjs\";\n\nlet loader = new Loader(\n  list,\n  \"../public/assets/\",\n  \"progressBar\",\n  \"progressText\"\n);\n\nfunction loadAssets() {\n  loader.start().then((response: IResponse) =\u003e {\n    console.log(response.message);\n    if (response.success) {\n      console.log(loader.getList(\"sounds\"));\n      console.log(loader.getAsset(\"sound3.mp3\"));\n      console.log(loader.getContent(\"sound3.mp3\"));\n    }\n  });\n}\n```\n\n### IIFE\n\n```html\n\u003cscript src=\"node-modules/@lcluber/orbisjs/dist/orbis.iife.min.js\"\u003e\u003c/script\u003e\n```\n\n```javascript\nvar loader = new Orbis.Loader(\n  list,\n  \"../public/assets/\",\n  \"progressBar\",\n  \"progressText\"\n);\n\nfunction loadAssets() {\n  loader.start().then(function(response) {\n    console.log(response.message);\n    if (response.success) {\n      console.log(loader.getList(\"sounds\"));\n      console.log(loader.getAsset(\"sound3.mp3\"));\n      console.log(loader.getContent(\"sound3.mp3\"));\n    }\n  });\n}\n```\n\n### ANGULAR\n\nExample of a service to load several assets when needed.\n\n```javascript\nimport { Injectable } from '@angular/core';\nimport { Loader, IAssets, IResponse } from \"@lcluber/orbisjs\";\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class AssetsLoaderService {\n\n  list: IAssets = {\n    shaders: {\n      folder: \"shader\",\n      files: [\n        { name: \"vertex.glsl\" },\n        { name: \"fragment.glsl\" }\n      ]\n    }\n  };\n\n  loader: Loader = new Loader(\n    this.list,\n    '../assets/',\n    null,\n    null\n  );\n\n  constructor() { }\n\n  public load(): Promise\u003cboolean\u003e {\n    return this.loader.start().then((response: IResponse) =\u003e {\n      console.log(\"complete\");\n      return response.success;\n    });\n  }\n\n  public get vertexShader(): Object | HTMLImageElement | AudioBuffer | string | null | false {\n    return this.loader.getContent(\"vertex.glsl\");\n  }\n\n  public get fragmentShader(): Object | HTMLImageElement | AudioBuffer | string | null | false {\n    return this.loader.getContent(\"fragment.glsl\");\n  }\n}\n\n```\n\n## API Reference\n\n```javascript\n\n// the structure of loader.start() promise response.\ninterface IResponse {\n  success: boolean,\n  message: string\n};\n\ninterface IAssets {\n  [key: string]: { // type\n    folder: string;\n    files: IAsset[];\n  };\n}\n\ninterface IAsset {\n  name: string;\n  params?: IParams | null;\n}\n\ninterface IParams {\n  [key: string]: string | number | boolean | Array\u003cstring | number | boolean\u003e;\n}\n\nclass Asset implements IAsset {\n    name: string;\n    params: IParams | null;\n    xhr: XHR | null;\n    isValid: boolean;\n}\n\nclass XHR {\n    path: string;\n    extension: string;\n    type: string;\n    response: Object | HTMLImageElement | AudioBuffer | string | null;\n    request: Request;\n\nclass Loader(\n  assets: IAssets,\n  assetsPath: string,\n  progressBarId?: string,\n  progressTextId?: string\n);\n\n// Starts loading the assets\nloader.start(): Promise\u003cIResponse\u003e {}\n// Returns the asset object\nloader.getAsset(name: string): Asset | false {}\n// Returns only the response of the xhr request.\nloader.getContent(name: string): Object | HTMLImageElement | AudioBuffer | string | null | false {}\n// Returns a list of assets by type\nloader.getList(type: string): Asset[] | false {}\n\n// Reset the progress bar before starting a new loading process\nloader.resetProgress(): void;\n\n// Log levels from @lcluber Mouette.js logger library\ntype LevelName = \"info\" | \"trace\" | \"warn\" | \"error\" | \"off\";\nloader.setLogLevel(name: LevelName): LevelName {}\nloader.getLogLevel(): LevelName {}\n\n```\n\n## Contributors\n\nThere is still a lot of work to do on this project and I would be glad to get all the help you can provide.\nTo contribute you can clone the project on **[GitHub](https://github.com/LCluber/Orbis.js)** and see **NOTICE.md** for detailed installation walkthrough of the project.\n\n## License\n\nMIT License\n\nCopyright (c) 2011 Ludovic CLUBER\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcluber%2Forbis.js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flcluber%2Forbis.js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcluber%2Forbis.js/lists"}