{"id":33169560,"url":"https://github.com/netgfx/Phasetips","last_synced_at":"2025-11-20T19:01:00.907Z","repository":{"id":153618938,"uuid":"44006141","full_name":"netgfx/Phasetips","owner":"netgfx","description":"A tooltips plugin for Phaser.io game framework","archived":false,"fork":false,"pushed_at":"2021-08-29T17:48:44.000Z","size":2436,"stargazers_count":43,"open_issues_count":0,"forks_count":10,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-08-17T04:33:36.965Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/netgfx.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,"governance":null,"roadmap":null,"authors":null}},"created_at":"2015-10-10T10:25:32.000Z","updated_at":"2024-12-01T01:40:27.000Z","dependencies_parsed_at":"2023-05-20T11:31:01.383Z","dependency_job_id":null,"html_url":"https://github.com/netgfx/Phasetips","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/netgfx/Phasetips","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/netgfx%2FPhasetips","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/netgfx%2FPhasetips/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/netgfx%2FPhasetips/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/netgfx%2FPhasetips/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/netgfx","download_url":"https://codeload.github.com/netgfx/Phasetips/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/netgfx%2FPhasetips/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":285494607,"owners_count":27181443,"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-11-20T02:00:05.334Z","response_time":54,"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":[],"created_at":"2025-11-16T01:00:33.531Z","updated_at":"2025-11-20T19:01:00.899Z","avatar_url":"https://github.com/netgfx.png","language":"JavaScript","funding_links":["https://www.paypal.com/cgi-bin/webscr?cmd=_donations\u0026business=JCFPKZJ7Y23JJ\u0026lc=GR\u0026item_name=NetGfx%2ecom\u0026currency_code=EUR\u0026bn=PP%2dDonationsBF%3abtn_donate_SM%2egif%3aNonHosted"],"categories":["Uncategorized"],"sub_categories":["Uncategorized"],"readme":"# PhaseTips\nA tooltips UI component for Phaser.io Javascript library\n\n### A new V3 Version is here: https://github.com/netgfx/Phaser-tooltip\n\n---\n\u003cbr\u003e\n\n\u003ch3\u003eInitialize the tooltip anywhere in your game\u003c/h3\u003e\n\n```\nvar myTooltip = new Phasetips(gameInstance, options);\n```\n\npass necesery options like: `context` (the object that launches the tooltip)\n\n```\nnew Phasetips(gameInstance, {\n    targetObject: myObj,\n    context: \"Hello tooltip\",\n    strokeColor: 0xff0000\n  });\n```\n\n\u003chr\u003e\n\n\u003cimg src=\"https://netgfx.com/trunk/randomPICS/phasetips_zpsjtzerwxx.gif\"/\u003e\n\n\u003cstrong\u003eView example: \u003ca href=\"http://www.netgfx.com/trunk/games/tools/phasetips\"\u003eComplete example\u003c/a\u003e\u003c/strong\u003e\n\n  \u003chr\u003e\n\n\u003cstrong\u003eGame Instance\u003c/strong\u003e\nThe game instance that we want the tooltips to appear to, such as \"game\"\n\n\u003cstrong\u003eGeneral Options:\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003econtext:\u003c/strong\u003e The information inside the tooltip, can be String, Number, Sprite, Phaser.Text, Phaser.BitmapText, Phaser.Group, Phaser.Image\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003ewidth:\u003c/strong\u003e The width of the tooltip (default: auto)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eheight:\u003c/strong\u003e The height of the tooltip (default: auto)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003ex:\u003c/strong\u003e The x position of the tooltip (default: auto based on position)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003ey:\u003c/strong\u003e The y position of the tooltip (default: auto based on position)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eposition: \u003c/strong\u003e The position of the tooltip based on the targetObject (default: top, options: top, bottom, left, right)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003etargetObject:\u003c/strong\u003e The actual object in which the tooltip will appear on hover (default: Game)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eenableCursor: \u003c/strong\u003e Enables the hand-cursor over the target object when hovered (default: false)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003edisableInputEvents:\u003c/strong\u003e If disableInputEvents option is set to true, the tooltip will not add will not add input events. Use simulateOnHoverOver, simulateOnHoverOut, hideTooltip or showTooltip API functions to manually control the visibility. (Default: false)\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eAnimation Options:\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003eanimation: \u003c/strong\u003e The animation effect (default: fade, options:fade, grow, none)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eanimationSpeedShow: \u003c/strong\u003e The duration of the animation effect showing the tooltip (default: 300)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eanimationSpeedHide: \u003c/strong\u003e The duration of the animation effect hiding the tooltip (default: 200)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eanimationDelay: \u003c/strong\u003e The animation delay before showing the tooltip (default: 0)\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eAlignment Options:\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003epadding: \u003c/strong\u003e The padding that the context keeps from the tooltip bounds (default: 20)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003epositionOffset: \u003c/strong\u003e The position offset that the tooltip keeps from the targetObject (default: 20)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efixedToCamera: \u003c/strong\u003e Pins the tooltip on the camera and moves with it (x,y are now camera offset) (default: false)\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eAppearance Options:\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003ebackgroundColor: \u003c/strong\u003e The color of the background (default: 0x000000)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eroundedCornersRadius: \u003c/strong\u003e Radius of the rectangle corners. Set to 1 to use a regular rectangle. (default: 1)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003estrokeColor: \u003c/strong\u003e The color of tooltip stroke (default: 0xffffff)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003estrokeWeight: \u003c/strong\u003e The line weight of the tooltip stroke (default: 2)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003ecustomBackground: \u003c/strong\u003e If the tooltip will use a custom background (default: false)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003einitialOn: \u003c/strong\u003e If the tooltip will visible when it first appears\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eFont Options:\u003c/strong\u003e\n\nIt is also possible to define individual text style options.\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003efont: \u003c/strong\u003e The style and size of the font. This is overridden if you set any of the following font options. (default: '')\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontSize: \u003c/strong\u003e The size of the font. Accepts either string or number. eg. 12 or '12px' (default: 12)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontFill: \u003c/strong\u003e A canvas fillstyle that will be used on the text eg 'red', '#00FF00'. (default: '#FFFFFF')\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontStroke: \u003c/strong\u003e A canvas stroke style that will be used on the text stroke eg 'blue', '#FCFF00'. (default: '#232323')\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontStrokeThickness: \u003c/strong\u003e A number that represents the thickness of the stroke. Set 0 for no stroke. (default: 1)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontWordWrap: \u003c/strong\u003e Indicates if word wrap should be used. (default: true)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003efontWordWrapWidth: \u003c/strong\u003e The width in pixels at which text will wrap. (default: 200)\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eText Style Options:\u003c/strong\u003e\n\nSet an object with respective properties to define all at once.\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003etextStyle: \u003c/strong\u003e Declares styles for the simple text element. Individual font options above are overridden if the textStyle option is set. Default:\u003c/li\u003e\n\u003c/ul\u003e\n\n```\n{\n    font: '',\n    fontSize: 12,\n    fill: \"#ffffff\",\n    stroke: \"#1e1e1e\",\n    strokeThickness: 1,\n    wordWrap: true,\n    wordWrapWidth: 200,\n    lineSpacing: -2\n}\n```\n\n\u003cstrong\u003eCallback Options:\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003eonHoverCallback: \u003c/strong\u003e Calls a function when hover occurs (default: fn)\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eonOutCallback: \u003c/strong\u003e Calls a function when hover ends (default: fn)\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cstrong\u003eAPI Functions\u003c/strong\u003e\n\n\u003cul\u003e\n    \u003cli\u003e\u003cstrong\u003eprintOptions: \u003c/strong\u003e Prints the options specified in the constructor on the console\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eupdatePosition: \u003c/strong\u003e Change the x, y of the tooltip\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003edestroy: \u003c/strong\u003e Destroys the tooltip and all its children\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003ehideTooltip: \u003c/strong\u003e Hide the tooltip\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003eshowTooltip: \u003c/strong\u003e Show the tooltip\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003esimulateOnHoverOver: \u003c/strong\u003e Simulates onHoverOver\u003c/li\u003e\n    \u003cli\u003e\u003cstrong\u003esimulateOnHoverOut: \u003c/strong\u003e Simulates onHoverOut\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003ci\u003e\n\u003c/i\u003e\n\n\u003chr\u003e\n\n\u003cstrong\u003eBuy me a coffee or tea!\u003c/strong\u003e \u003cbr\u003e\n\u003ca href=\"https://www.paypal.com/cgi-bin/webscr?cmd=_donations\u0026business=JCFPKZJ7Y23JJ\u0026lc=GR\u0026item_name=NetGfx%2ecom\u0026currency_code=EUR\u0026bn=PP%2dDonationsBF%3abtn_donate_SM%2egif%3aNonHosted\"\u003e\u003cimg src=\"https://www.paypalobjects.com/webstatic/en_US/btn/btn_donate_92x26.png\"/\u003e\u003c/a\u003e\n\n\n\u003chr\u003e\n\n\u003eThe TODO list is diminising!\n\n\u003ePlease let me know if you come across some bug or have something to contribute\n\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnetgfx%2FPhasetips","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnetgfx%2FPhasetips","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnetgfx%2FPhasetips/lists"}