{"action":"created","issue":{"url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/4","labels_url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/4/labels{/name}","comments_url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/4/comments","events_url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/4/events","html_url":"https://github.com/inf3rno/circuit-training-timer/issues/4","id":41387991,"number":4,"title":"Make the code of the view part cleaner","user":{"login":"inf3rno","id":408911,"avatar_url":"https://avatars.githubusercontent.com/u/408911?v=3","gravatar_id":"","url":"https://api.github.com/users/inf3rno","html_url":"https://github.com/inf3rno","followers_url":"https://api.github.com/users/inf3rno/followers","following_url":"https://api.github.com/users/inf3rno/following{/other_user}","gists_url":"https://api.github.com/users/inf3rno/gists{/gist_id}","starred_url":"https://api.github.com/users/inf3rno/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/inf3rno/subscriptions","organizations_url":"https://api.github.com/users/inf3rno/orgs","repos_url":"https://api.github.com/users/inf3rno/repos","events_url":"https://api.github.com/users/inf3rno/events{/privacy}","received_events_url":"https://api.github.com/users/inf3rno/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/inf3rno/circuit-training-timer/labels/enhancement","name":"enhancement","color":"84b6eb"}],"state":"open","locked":false,"assignee":{"login":"inf3rno","id":408911,"avatar_url":"https://avatars.githubusercontent.com/u/408911?v=3","gravatar_id":"","url":"https://api.github.com/users/inf3rno","html_url":"https://github.com/inf3rno","followers_url":"https://api.github.com/users/inf3rno/followers","following_url":"https://api.github.com/users/inf3rno/following{/other_user}","gists_url":"https://api.github.com/users/inf3rno/gists{/gist_id}","starred_url":"https://api.github.com/users/inf3rno/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/inf3rno/subscriptions","organizations_url":"https://api.github.com/users/inf3rno/orgs","repos_url":"https://api.github.com/users/inf3rno/repos","events_url":"https://api.github.com/users/inf3rno/events{/privacy}","received_events_url":"https://api.github.com/users/inf3rno/received_events","type":"User","site_admin":false},"milestone":null,"comments":10,"created_at":"2014-08-28T13:08:42Z","updated_at":"2015-01-07T00:03:58Z","closed_at":null,"body":"Currently it is about 200 lines and the gui is about 150 lines.\r\n\r\nI think I won't need both of them. The gui classes should not contain Publishers and Subscribers because I cannot add a Publisher and a Subscriber to every event of each general view component... I have to add Publisher and Subscriber only to specific classes, like the TimerView...\r\n\r\nI could use a mediator between the view and the timer, but it would make the html file messy. I think I should first clean the gui from the dflo components and maybe merge it with the TimerView somehow."},"comment":{"url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/comments/68957618","html_url":"https://github.com/inf3rno/circuit-training-timer/issues/4#issuecomment-68957618","issue_url":"https://api.github.com/repos/inf3rno/circuit-training-timer/issues/4","id":68957618,"user":{"login":"inf3rno","id":408911,"avatar_url":"https://avatars.githubusercontent.com/u/408911?v=3","gravatar_id":"","url":"https://api.github.com/users/inf3rno","html_url":"https://github.com/inf3rno","followers_url":"https://api.github.com/users/inf3rno/followers","following_url":"https://api.github.com/users/inf3rno/following{/other_user}","gists_url":"https://api.github.com/users/inf3rno/gists{/gist_id}","starred_url":"https://api.github.com/users/inf3rno/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/inf3rno/subscriptions","organizations_url":"https://api.github.com/users/inf3rno/orgs","repos_url":"https://api.github.com/users/inf3rno/repos","events_url":"https://api.github.com/users/inf3rno/events{/privacy}","received_events_url":"https://api.github.com/users/inf3rno/received_events","type":"User","site_admin":false},"created_at":"2015-01-07T00:03:58Z","updated_at":"2015-01-07T00:03:58Z","body":"szimpla async-es példa:\r\n```js\r\nvar mongo;\r\nvar httpserv;\r\n\r\nasync.parallel([\r\n    function (callback) {\r\n        var mongodb = require('mongodb');\r\n        mongo = new mongodb.Db('project', new mongodb.Server(\"127.0.0.1\", 27017, {auto_reconnect: true}));\r\n        mongo.open(callback);\r\n    },\r\n\r\n    function (callback) {\r\n        httpserv = require('http').createServer(function (request, response) {\r\n            process_request(request, response);\r\n        });\r\n        httpserv.listen(1337, callback);\r\n    },\r\n], function () {\r\n    Application.init(mongo, httpserv);\r\n});\r\n```\r\n\r\nnálam ez sokkal bonyolultabb lenne, viszont cserébe sokkal átláthatóbb:\r\n\r\n```js\r\nvar MongoConnector = df.Object.extend({\r\n    connect: function () {\r\n        var mongodb = require('mongodb');\r\n        var mongo = new mongodb.Db('project', new mongodb.Server(\"127.0.0.1\", 27017, {auto_reconnect: true}));\r\n        mongo.open(function (error, connection) {\r\n            if (error)\r\n                this.error(error);\r\n            else\r\n                this.connected(connection);\r\n        }.bind(this));\r\n    },\r\n    connected: function (connection) {\r\n    },\r\n    error: function (message) {\r\n    }\r\n});\r\n\r\nvar HttpServerConnector = df.Object.extend({\r\n    connect: function () {\r\n        var httpserv = require('http').createServer(this.requested.bind(this));\r\n        httpserv.listen(1337, function (error, connection) {\r\n            if (error)\r\n                this.error(error);\r\n            else\r\n                this.connected(connection);\r\n        });\r\n    },\r\n    connected: function (connection) {\r\n    },\r\n    error: function (message) {\r\n    },\r\n    requested: function (request, response) {\r\n    }\r\n});\r\n\r\nvar Application = Object.extend({\r\n    connected: function (mongo, httpserv) {\r\n        //...\r\n    },\r\n    error: function (mongoMessage, httpServMessage){\r\n        //...\r\n    },\r\n    requested: function (request, response){\r\n        //...\r\n    }\r\n});\r\n\r\nvar network = new df.Network({\r\n    init: function () {\r\n        this.mongoComponent = new df.Component({\r\n            template: new MongoConnector()\r\n        });\r\n        this.httpServComponent = new df.Component({\r\n            template: new HttpServerConnector()\r\n        });\r\n        this.applicationComponent = new Application({\r\n            template: new Application()\r\n        });\r\n        this.flows = [\r\n            new df.Flow({\r\n                init: function (){\r\n                    this.buffer = new ErrorBuffer({\r\n                        ports: [\r\n                            this.mongoComponent.error,\r\n                            this.httpServComponent.error\r\n                        ],\r\n                        size: 2\r\n                    });\r\n                    //nyilván azért ennél bonyolultabb bekonfigolni a buffert, de azzal most nem foglalkozom\r\n                    this.adapter = this.buffer.receive;\r\n                },\r\n                source: [\r\n                    this.mongoComponent.connected,\r\n                    this.mongoComponent.error,\r\n                    this.httpServComponent.connected,\r\n                    this.httpServComponent.error\r\n                ],\r\n                sink: {\r\n                    error: this.applicationComponent.error,\r\n                    connected: this.applicationComponent.connected\r\n                }\r\n            }),\r\n            new df.Flow({\r\n                source: this.httpServComponent.requested,\r\n                sink: this.applicationComponent.requested\r\n            })\r\n        ];\r\n\r\n        this.mongoComponent.connect();\r\n        this.httpServComponent.connect();\r\n\r\n        //érdemes betenni még egy buffer-t, ami a connected-et és a requested-et kapcsolja össze\r\n        //így ha az adatbázis kapcsolat nincs meg, akkor buffereli a kéréseket, amíg megjön\r\n        //az async-es kód ilyesmivel nem rendelkezett, azért nem csináltam meg\r\n    }\r\n});\r\n```\r\n\r\nAz a különbség, hogy én nem teszem ki global namespace-be a dolgokat, hanem midegyiket úgy, ahogy van továbbadom. Az eredeti kódban külön kezelni kell, ha olyan eset lép fel, hogy nincs adatbázis kapcsolat, de már érkeznek a kérések a szerverhez. Ez elég error prone, ha nem figyel az ember. Nálam ez is megoldható plusz egy bufferrel, ami az `Application.connected` és az `Application.requested` -et kapcsolja össze egyetlen szállá. Ez így tetszik, jól követhető, hogy mi hol van, valószínűleg szépen tesztelhető is, viszont nem kompatibilis a jelenlegi eszközökkel, szóval pl az error message-es callback-el. Próbáljuk meg átalakítani úgy, hogy beteszek egy plugin-t, ami direkt callback-es nodejs-hez van."}}