{"id":22237482,"url":"https://github.com/brosenberger/jquery-dashboard","last_synced_at":"2025-07-27T22:33:06.073Z","repository":{"id":57282051,"uuid":"88039674","full_name":"brosenberger/jquery-dashboard","owner":"brosenberger","description":"This repository contains a easy to use and extendable dashboard framework written in javascript to be embedded within existing web applications","archived":false,"fork":false,"pushed_at":"2017-04-27T06:45:14.000Z","size":1950,"stargazers_count":12,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-04T09:22:38.416Z","etag":null,"topics":["dashboard-widget","dashboards","javascript","javascript-library","jquery","jquery-ui","widgets"],"latest_commit_sha":null,"homepage":"https://brosenberger.github.io/jquery-dashboard/docs/index.html","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/brosenberger.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-12T10:28:00.000Z","updated_at":"2024-05-04T05:25:45.000Z","dependencies_parsed_at":"2022-09-13T09:23:38.970Z","dependency_job_id":null,"html_url":"https://github.com/brosenberger/jquery-dashboard","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/brosenberger/jquery-dashboard","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brosenberger%2Fjquery-dashboard","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brosenberger%2Fjquery-dashboard/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brosenberger%2Fjquery-dashboard/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brosenberger%2Fjquery-dashboard/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brosenberger","download_url":"https://codeload.github.com/brosenberger/jquery-dashboard/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brosenberger%2Fjquery-dashboard/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267436567,"owners_count":24086898,"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","status":"online","status_checked_at":"2025-07-27T02:00:11.917Z","response_time":82,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["dashboard-widget","dashboards","javascript","javascript-library","jquery","jquery-ui","widgets"],"created_at":"2024-12-03T03:10:05.990Z","updated_at":"2025-07-27T22:33:05.680Z","avatar_url":"https://github.com/brosenberger.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# jquery-dashboard\n\nDemo: see https://brosenberger.github.io/jquery-dashboard/docs/index.html\n\nThis library provides a framework for showing a Jira-Like Dashboard and easy creating Widgets.\n\n**Usage**\n\nInstall via npm:\n```js\nnpm install jquery-dashboard --save\n```\n\nAs library embedd dependencies (e.g. with cdn links):\n\n```html\n\u003cscript src=\"https://code.jquery.com/jquery-2.2.4.min.js\" integrity=\"sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://code.jquery.com/ui/1.12.0/jquery-ui.min.js\" integrity=\"sha256-eGE6blurk5sHj+rmkfsGYeKyZx3M4bG+ZlFyA7Kns7E=\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n\u003clink href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\" integrity=\"sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u\" crossorigin=\"anonymous\"\u003e\n\u003cscript src=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js\" integrity=\"sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa\" crossorigin=\"anonymous\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js\"\u003e\u003c/script\u003e\n\u003clink href=\"https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css\" rel=\"stylesheet\" integrity=\"sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN\" crossorigin=\"anonymous\"\u003e\n```\n\nand dashboard components (styles not yet included, see docs/index.html for inline styling):\n\n```html\n\u003cscript src=\"../dist/jquery.dashboard.core.js\" charset=\"utf-8\"\u003e\u003c/script\u003e\n\u003cscript src=\"../dist/jquery.dashboard.templates.js\" charset=\"utf-8\"\u003e\u003c/script\u003e\n\u003cscript src=\"../dist/jquery.dashboard.jqueryui.js\" charset=\"utf-8\"\u003e\u003c/script\u003e\n\u003cscript src=\"../dist/jquery.dashboard.samples.js\" charset=\"utf-8\"\u003e\u003c/script\u003e\n```\n\ninitialize components:\n\n```js\n$(document).ready(function () {\n    // initialize dashboard services\n    var service = Dashboard.core.default();\n    // register sample widgets\n    Dashboard.samples.default(service);\n\n    // create dashboard view and refresh list\n    var dashboard = $('.dashboard-sortable').dashboard({\n        dashboardService: service\n    }).dashboard(\"refresh\");\n    // initialize widget add dialog\n    $('h1 .fa.fa-plus-square').dashboardWidgetDialog({\n        dashboardService: service,\n        addCallback: function(widgetData) {\n            dashboard.dashboard(\"addWidget\", widgetData);\n        }\n    });\n\n});\n```\n\n**Creating your own Widgets**\n\nThis is possible with standard require/extension mechanism like within the sample, but also without all js environment.\n\ne.g. a Welcome Widget, just showing some welcome message:\n\n```js\nvar WelcomeWidget = function () {\n    this.type = WelcomeWidget.type;\n    this.widgetTemplate=  Dashboard.widgetWelcome;\n    this.sizeConfiguration= 'col-xs-12 col-md-6';\n};\nWelcomeWidget.type = 'welcomeWidget';\nWelcomeWidget.prototype = $.extend(Dashboard.core.Widget.prototype, {\n    description: {\n        title: 'Welcome Widget',\n        description: 'Gives you a warm welcome'\n    },\n    initialize: function (widgetElement) {\n        console.log('welcome widget initialized');\n    }\n});\n```\n\nHandlebarlayouts have to initialized when embedding as library:\n```js\nhandlebarsLayouts.register(Handlebars);\nHandlebars.registerPartial('widget-layout', Dashboard.templates.layout);\nHandlebars.registerPartial('widget-configuration-layout', Dashboard.templates.configurationLayout);\n```\n\nRegister the widget within the service: \n```js\ndashboardService.registerWidget(new WelcomeWidget());\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrosenberger%2Fjquery-dashboard","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrosenberger%2Fjquery-dashboard","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrosenberger%2Fjquery-dashboard/lists"}