{"action":"created","issue":{"url":"https://api.github.com/repos/ManageIQ/manageiq/issues/8781","repository_url":"https://api.github.com/repos/ManageIQ/manageiq","labels_url":"https://api.github.com/repos/ManageIQ/manageiq/issues/8781/labels{/name}","comments_url":"https://api.github.com/repos/ManageIQ/manageiq/issues/8781/comments","events_url":"https://api.github.com/repos/ManageIQ/manageiq/issues/8781/events","html_url":"https://github.com/ManageIQ/manageiq/issues/8781","id":155509331,"number":8781,"title":"[WIP] JS style guidelines (draft)","user":{"login":"himdel","id":289743,"avatar_url":"https://avatars.githubusercontent.com/u/289743?v=3","gravatar_id":"","url":"https://api.github.com/users/himdel","html_url":"https://github.com/himdel","followers_url":"https://api.github.com/users/himdel/followers","following_url":"https://api.github.com/users/himdel/following{/other_user}","gists_url":"https://api.github.com/users/himdel/gists{/gist_id}","starred_url":"https://api.github.com/users/himdel/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/himdel/subscriptions","organizations_url":"https://api.github.com/users/himdel/orgs","repos_url":"https://api.github.com/users/himdel/repos","events_url":"https://api.github.com/users/himdel/events{/privacy}","received_events_url":"https://api.github.com/users/himdel/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":{"login":"himdel","id":289743,"avatar_url":"https://avatars.githubusercontent.com/u/289743?v=3","gravatar_id":"","url":"https://api.github.com/users/himdel","html_url":"https://github.com/himdel","followers_url":"https://api.github.com/users/himdel/followers","following_url":"https://api.github.com/users/himdel/following{/other_user}","gists_url":"https://api.github.com/users/himdel/gists{/gist_id}","starred_url":"https://api.github.com/users/himdel/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/himdel/subscriptions","organizations_url":"https://api.github.com/users/himdel/orgs","repos_url":"https://api.github.com/users/himdel/repos","events_url":"https://api.github.com/users/himdel/events{/privacy}","received_events_url":"https://api.github.com/users/himdel/received_events","type":"User","site_admin":false},"milestone":null,"comments":19,"created_at":"2016-05-18T14:02:37Z","updated_at":"2016-05-23T12:57:00Z","closed_at":null,"body":"(This is a draft of a future docs document detailing our Javascript style guidelines for ManageIQ and SSUI.)\r\n\r\n## formatting\r\n### indentation\r\n\r\nUse 2 spaces per indent level, not 4, nor tabs..\r\n\r\n```js\r\n// good\r\nfunction foo() {\r\n  var x;\r\n  if (x === undefined) {\r\n    console.log('Whee!');\r\n  }\r\n}\r\n\r\n// bad\r\nfunction foo() {\r\n    var x;\r\n    if (x === undefined) {\r\n    console.log(\"Unwhee\");\r\n    }\r\n}\r\n```\r\n\r\n### object and array literals\r\n\r\n```js\r\n// good\r\n{\r\n  foo: bar,\r\n  baz: quux,\r\n}\r\n[\r\n  foo,\r\n  bar,\r\n  baz,\r\n]\r\n\r\n// good (for small objects/arrays)\r\n{ foo: bar, baz: quux }\r\n[ 1, 2, 3 ]\r\n\r\n// ok (makes more sense for small values, don't use with anything longer)\r\n[1, 2, 3]\r\n\r\n// discouraged\r\n{foo: bar}\r\n[1,2,3,]\r\n```\r\n\r\n### trailing commas\r\n\r\nPlease prefer trailing commas in multiline object or array literals, they are fully supported now and make nicer diffs..\r\n\r\n```js\r\n//good\r\n[\r\n  1,\r\n  2,\r\n  3,\r\n]\r\n\r\n// discouraged\r\n{\r\n  foo: bar,\r\n  baz: quux\r\n}\r\n\r\n// weird\r\n[ 1, 2, 3, ]\r\n```\r\n\r\n### function calls\r\n\r\nNo spaces surrounding the brackets, split long lines after `{` or `[`.\r\n\r\n```js\r\n// good\r\nfoo(1, 2, 3);\r\nbar(foo, {\r\n  a: b,\r\n  c: d,\r\n});\r\n\r\n// ok for lots of arguments\r\nfoo(\r\n  1,\r\n  2,\r\n  3 # TODO final comma allowed yet?\r\n)\r\n#TODO or go with\r\nfoo(1,\r\n     2,\r\n     3) ?\r\n\r\n// bad\r\nquux( { many: many, keys: and, values: true } );\r\n```\r\n\r\n### chained methods (esp. then/catch/done/success/etc.)\r\n\r\nPlease always split chained method calls into multiple lines, starting continuing lines with the dot.\r\n\r\n```js\r\n// good\r\n$http.get('/foo')\r\n.then(callback)\r\n.catch(errback);\r\n\r\narray\r\n.map(func)\r\n.filter(fn)\r\n.sort();\r\n# TODO figure out the proper indent here\r\n\r\n// discouraged\r\n$http.get('/foo').then(callback).catch(errback);\r\narray.map(func).filter(fn).sort();\r\n```\r\n\r\n### if/while blocks\r\n\r\nPlease use a space before the first parenthesis, use egyptian brackets, and prefer brackets even for single-statement bodies.\r\n\r\n```js\r\n// good\r\nif (expression) {\r\n  body;\r\n} else {\r\n  body;\r\n}\r\n\r\n// discouraged\r\nif(expression)\r\n  bleh();\r\n```\r\n\r\n### expressions\r\n\r\nAlways surround binary operators with spaces.\r\n\r\n\r\n```js\r\n// good\r\n(5 + 4 * (3 + 2)) > 7\r\n\r\n// bad\r\n5+4*3\r\n```\r\n\r\n### switch statements\r\n\r\nUnlike in ruby, indent `case` one indent level more than `switch`. Also, please explicitly mark case-to-case fall-through with `// pass`.\r\n\r\n```js\r\n// good\r\nswitch (x) {\r\n  case 1:\r\n    whatever;\r\n    break;\r\n\r\n  case 2:\r\n  case 3:\r\n    whatever;\r\n    // pass\r\n  case 4:\r\n    whatever;\r\n\r\n  default:\r\n    whatever;\r\n}\r\n\r\n// bad - case indented badly\r\nswitch (x) {\r\ncase 5:\r\n  foo;\r\n}\r\n\r\n// bad - \"hidden\" fall-through\r\nswitch (x) {\r\n  case 1:\r\n    do_something;\r\n  case 2:\r\n    probably_a_bug;\r\n}\r\n```\r\n\r\n## naming\r\n### functions\r\n\r\nUse `camelCase` for function/method names.\r\n\r\n```js\r\n// good\r\nfunction miqOnLoad(foo) {...}\r\n\r\n// bad\r\nfunction add_flash(msg) {...}\r\n```\r\n\r\n### angular\r\n\r\nPrefer full `FooController` for controllers, `FooService` for services, `FooFactory` for factories, `foo` for directives and `foo` or `foo.bar` for modules.\r\n\r\n## globals\r\n### don't\r\n\r\nDon't use global global variables, ever.\r\n\r\nAlso, please try not to create them accidentally by omitting `var`.\r\n\r\n```js\r\n// good\r\nfunction foo() {\r\n  var bar = 5;\r\n}\r\n\r\n// good if you really need a static variable (and don't access it from elsewhere)\r\nfunction bar() {\r\n  bar.baz = bar.baz || 0;\r\n  bar.baz++;\r\n}\r\n\r\n// bad\r\nfunction foo() {\r\n  bar = 5;\r\n}\r\n\r\n// still bad\r\nvar whatever = false;\r\nfunction bar() {\r\n  whatever = true;\r\n}\r\n```\r\n\r\n### `ManageIQ` global object\r\n\r\nIf you really have to keep global state, add it to the `ManageIQ` global object, defined in `miq_global.js`, and add a comment with a purpose.\r\n\r\nBut please think twice before introducing a new one.\r\n\r\n## general\r\n### comparison operators\r\n\r\nPlease prefer `===` and `!==` to `==` and `!=`, but only when it makes sense.\r\n\r\n```js\r\n// good\r\nif (x === \"5\") {...}\r\n\r\n// ok, if really checking for undefined or null\r\nif (null_or_undefined == null) { ... }\r\n\r\n// usually good enough\r\nif (truthy) { ... }\r\n\r\n// discouraged (array.length by itself is perfectly fine there)\r\nif (array.length === 0) { ... }\r\n```\r\n\r\n## es6\r\n\r\nWe do support ES6 now (or a subset thereof - via babel 5) provided the file has an `.es6` extension. Please use your judgement and consult `config/initializers/sprockets-es6.rb`. Also, we support all ES6 library methods (including `Promise`) in `.js` files via `es6-shim`.\r\n\r\n```js\r\n/// in .js files..\r\n// bad\r\nconst foo = 5;\r\n\r\n// ok\r\nvar foo = Promise.all([\r\n  $http.get(...),\r\n  $http.get(...),\r\n]);\r\n\r\n/// in .es6 files\r\n// ok\r\nconst { foo, bar } = { foo: 5, bar: 6, quux: 7 };\r\n\r\n// bad\r\nimport { foo } from \"baar.js\";\r\n```\r\n\r\n## linting\r\n\r\nIn manageiq-ui-self_service, you can run `gulp vet`, which runs `jshint` and `jscs` - but the configuration is currently *too* opinionated. (TODO)\r\n\r\nIn manageiq, you can run linters manually, as soon as we add their config files.. (TODO)\r\n\r\n\r\nFor anything not specified here, please consult https://github.com/airbnb/javascript ."},"comment":{"url":"https://api.github.com/repos/ManageIQ/manageiq/issues/comments/220972524","html_url":"https://github.com/ManageIQ/manageiq/issues/8781#issuecomment-220972524","issue_url":"https://api.github.com/repos/ManageIQ/manageiq/issues/8781","id":220972524,"user":{"login":"zeari","id":11256940,"avatar_url":"https://avatars.githubusercontent.com/u/11256940?v=3","gravatar_id":"","url":"https://api.github.com/users/zeari","html_url":"https://github.com/zeari","followers_url":"https://api.github.com/users/zeari/followers","following_url":"https://api.github.com/users/zeari/following{/other_user}","gists_url":"https://api.github.com/users/zeari/gists{/gist_id}","starred_url":"https://api.github.com/users/zeari/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zeari/subscriptions","organizations_url":"https://api.github.com/users/zeari/orgs","repos_url":"https://api.github.com/users/zeari/repos","events_url":"https://api.github.com/users/zeari/events{/privacy}","received_events_url":"https://api.github.com/users/zeari/received_events","type":"User","site_admin":false},"created_at":"2016-05-23T12:57:00Z","updated_at":"2016-05-23T12:57:00Z","body":"> @zeari What's murphy.sh?\r\n\r\nIts does a rubocop check but just on files added on the last commit. Same as miq-bot but locally on your own machine. \r\nhttps://github.com/zeari/miq-helpers/blob/master/murphy.sh\r\n\r\n"}}
{"actor":{"display_login":"zeari"}}