{"action":"created","issue":{"url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/10","repository_url":"https://api.github.com/repos/CodeCorico/ractive-require","labels_url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/10/labels{/name}","comments_url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/10/comments","events_url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/10/events","html_url":"https://github.com/CodeCorico/ractive-require/pull/10","id":159133063,"number":10,"title":"feat(require):add event listening","user":{"login":"frostbane","id":12523422,"avatar_url":"https://avatars.githubusercontent.com/u/12523422?v=3","gravatar_id":"","url":"https://api.github.com/users/frostbane","html_url":"https://github.com/frostbane","followers_url":"https://api.github.com/users/frostbane/followers","following_url":"https://api.github.com/users/frostbane/following{/other_user}","gists_url":"https://api.github.com/users/frostbane/gists{/gist_id}","starred_url":"https://api.github.com/users/frostbane/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/frostbane/subscriptions","organizations_url":"https://api.github.com/users/frostbane/orgs","repos_url":"https://api.github.com/users/frostbane/repos","events_url":"https://api.github.com/users/frostbane/events{/privacy}","received_events_url":"https://api.github.com/users/frostbane/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2016-06-08T10:42:04Z","updated_at":"2016-06-13T12:26:26Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/CodeCorico/ractive-require/pulls/10","html_url":"https://github.com/CodeCorico/ractive-require/pull/10","diff_url":"https://github.com/CodeCorico/ractive-require/pull/10.diff","patch_url":"https://github.com/CodeCorico/ractive-require/pull/10.patch"},"body":"This patch lets the required child listen to an event fired by the parent.\r\n\r\nThis is quite long and I am writing this while on my job (secretly) so my words could be jumbled. ``child``, ``widget``, ``feature``, ``template`` all mean the same thing.\r\n\r\n#### Syntax\r\n\r\nThe syntax is quite confusing until you get used to it\r\n\r\n```html\r\n<!-- parent.html -->\r\n<rv-require name=\"widget\"\r\n            data-listen-☆☆=\"△△\"></rv-require>\r\n```\r\n\r\n☆ is the event fired inside the widget\r\n\r\n△ is the event fired by the parent\r\n\r\n##### One example is:\r\n\r\nI have a html form \r\n\r\n```html\r\n<!-- parent.html -->\r\n<rv-require name=\"advancedWidget\"\r\n            data-title=\"show advanced settings..\"\r\n            data-listen-cleanupadvanced=\"reset-form\"></rv-require>\r\n<rv-require name=\"superAdvancedWidget\"\r\n            data-title=\"show super advanced settings..\"\r\n            data-listen-cleanupsuperadvanced=\"reset-form\"></rv-require>\r\n<input type=\"reset\"\r\n       value=\"reset everything\"\r\n       on-click=\"reset-button\" />\r\n```\r\n\r\nNow when I hit the reset button I would do some clean up and and also need to tell all the required widgets to do their own clean up.\r\n\r\n```javascript\r\n//parent.js\r\n\r\n//fired when the reset button is clicked\r\nparentRactive.on(\"reset-button\", function(e){\r\n    //clean up the form\r\n    \r\n    var args = { /*some argument */ };\r\n    \r\n    //broadcast it to all the required children\r\n    parentRactive.fire(\"reset-form\", args);\r\n});\r\n\r\n```\r\n\r\nAnd then all the listening children could respond to it accordingly.\r\n\r\n```javascript\r\n//advancedWidget.js\r\n\r\nadvancedWidgetRactive.on(\"cleanupadvanced\", \r\n    function(parentEventName, eventArgs){\r\n        //in this example the handler arguments would be\r\n        //parenEventName = \"reset-form\"\r\n        //eventArgs      = { /*some argument */}\r\n\r\n        //do some cleaning inside the widget\r\n    });\r\n\r\n```\r\n\r\n```javascript\r\n//superAdvancedWidget.js\r\n\r\nsuperAdvancedWidgetRactive.on(\"cleanupsuperadvanced\", \r\n    function(parentEventName, eventArgs){\r\n        //in this example the handler arguments would be\r\n        //parenEventName = \"reset-form\"\r\n        //eventArgs      = { /*some argument */}\r\n\r\n        //do some cleaning inside the widget\r\n    });\r\n\r\n```\r\n\r\nThe main point is I could fire a single ``\"reset-form\"`` event inside the parent and all the required children would just listen to it, and respectively do their own clean up.\r\n\r\nAnother way to call it is **broadcast** or **propagate** an event to all children.\r\n"},"comment":{"url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/comments/225566526","html_url":"https://github.com/CodeCorico/ractive-require/pull/10#issuecomment-225566526","issue_url":"https://api.github.com/repos/CodeCorico/ractive-require/issues/10","id":225566526,"user":{"login":"XavierBoubert","id":482251,"avatar_url":"https://avatars.githubusercontent.com/u/482251?v=3","gravatar_id":"","url":"https://api.github.com/users/XavierBoubert","html_url":"https://github.com/XavierBoubert","followers_url":"https://api.github.com/users/XavierBoubert/followers","following_url":"https://api.github.com/users/XavierBoubert/following{/other_user}","gists_url":"https://api.github.com/users/XavierBoubert/gists{/gist_id}","starred_url":"https://api.github.com/users/XavierBoubert/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/XavierBoubert/subscriptions","organizations_url":"https://api.github.com/users/XavierBoubert/orgs","repos_url":"https://api.github.com/users/XavierBoubert/repos","events_url":"https://api.github.com/users/XavierBoubert/events{/privacy}","received_events_url":"https://api.github.com/users/XavierBoubert/received_events","type":"User","site_admin":false},"created_at":"2016-06-13T12:26:26Z","updated_at":"2016-06-13T12:26:26Z","body":"> The syntax is quite confusing until you get used to it\r\n\r\nExactly lol."}}
{"actor":{"display_login":"XavierBoubert"}}