{
"id": "153468",
"key": "ALOY-1335",
"fields": {
"issuetype": {
"id": "1",
"description": "A problem which impairs or prevents the functions of the product.",
"name": "Bug",
"subtask": false
},
"project": {
"id": "11113",
"key": "ALOY",
"name": "Alloy",
"projectCategory": {
"id": "10400",
"description": "Tools for developing applications",
"name": "Tooling"
}
},
"fixVersions": [
{
"id": "17081",
"name": "Release 5.2.0",
"archived": false,
"released": true,
"releaseDate": "2016-02-23"
},
{
"id": "17537",
"name": "alloy 1.7.29",
"archived": false,
"released": true,
"releaseDate": "2015-11-30"
}
],
"resolution": {
"id": "1",
"description": "A fix for this issue is checked into the tree and tested.",
"name": "Fixed"
},
"resolutiondate": "2015-11-30T20:50:07.000+0000",
"created": "2015-11-27T10:41:20.000+0000",
"priority": {
"name": "Critical",
"id": "1"
},
"labels": [
"Alloy",
"inheritance",
"styles"
],
"versions": [
{
"id": "17533",
"name": "alloy 1.7.28",
"archived": false,
"released": true,
"releaseDate": "2015-11-25"
}
],
"issuelinks": [],
"assignee": {
"name": "fmiao",
"key": "fmiao",
"displayName": "Feon Sua Xin Miao",
"active": true,
"timeZone": "America/Vancouver"
},
"updated": "2016-01-20T23:18:33.000+0000",
"status": {
"description": "The issue is considered finished, the resolution is correct. Issues which are closed can be reopened.",
"name": "Closed",
"id": "6",
"statusCategory": {
"id": 3,
"key": "done",
"colorName": "green",
"name": "Done"
}
},
"components": [
{
"id": "13603",
"name": "Styling",
"description": "TSS, dynamic styling, styling API"
}
],
"description": "Alloy selectors provide ways to overload style rules based on switches (formFactor, OS, conditional rules, etc.). Say the TSS is somehow:\r\n\r\n{code}\r\n...\r\n\".title-home\": {\r\n\tbottom: 4,\r\n},\r\n\".title-home[formFactor=tablet]\": {\r\n\tbottom: 8\r\n},\r\n...\r\n{code}\r\n\r\nThe generated code will look like:\r\n\r\n{code}\r\nAlloy.deepExtend(true, o, {\r\n bottom: 4\r\n});\r\nAlloy.isTablet && _.extend(o, {\r\n bottom: 8\r\n});\r\n{code}\r\n\r\nIf this works fine with most of the properties, this is particularly annoying with font or nested properties. For instance, \r\n\r\n{code}\r\n\".title-home\": {\r\n\tfont: {\r\n\t\tfontFamily: \"Delius-Regular\",\r\n\t\tfontSize: 11\r\n\t}\r\n},\r\n\".title-home[formFactor=tablet]\": {\r\n\tfont: {\r\n\t\tfontSize: 22\r\n\t}\r\n},\r\n{code}\r\n\r\nwill result in the font name being simply ignored on tablets, as {{_.extend()}} is not a deepExtend method. We're lucky, Alloy provides a {{deepExtend()}} implementation which we may want to use. I therefore propose to switch from {{_.extend()}} to Alloy's {{deepExtend}} implementation. This will allow much more efficient ways of integrating complex graphical interfaces, with style inheritances all across the app:\r\n\r\n{code:xml}\r\n\r\n{code}\r\n\r\nAll styles are merged deeply, and it becomes unnecessary to repeat over and over the font name.\r\n\r\nI _know_ that this change may break many tests, but I strongly believe that this behavior is the right way styles _should_ work, in the sake for development efficiency.",
"attachment": [],
"flagged": false,
"summary": "Use Alloy's deepExtend to handle conditional on-device style inheritance",
"creator": {
"name": "xavier",
"key": "xavier",
"displayName": "Xavier Lacot",
"active": true,
"timeZone": "Europe/Paris"
},
"subtasks": [],
"reporter": {
"name": "xavier",
"key": "xavier",
"displayName": "Xavier Lacot",
"active": true,
"timeZone": "Europe/Paris"
},
"environment": null,
"closedSprints": [
{
"id": 534,
"state": "closed",
"name": "2015 Sprint 24 Tooling",
"startDate": "2015-11-23T20:23:31.316Z",
"endDate": "2015-12-05T02:23:00.000Z",
"completeDate": "2015-12-07T18:44:25.555Z",
"originBoardId": 121
}
],
"comment": {
"comments": [
{
"id": "371593",
"author": {
"name": "xavier",
"key": "xavier",
"displayName": "Xavier Lacot",
"active": true,
"timeZone": "Europe/Paris"
},
"body": "A pull request has been proposed in https://github.com/appcelerator/alloy/pull/744",
"updateAuthor": {
"name": "xavier",
"key": "xavier",
"displayName": "Xavier Lacot",
"active": true,
"timeZone": "Europe/Paris"
},
"created": "2015-11-27T10:44:38.000+0000",
"updated": "2015-11-27T10:44:38.000+0000"
},
{
"id": "371599",
"author": {
"name": "fokkezb",
"key": "fokke",
"displayName": "Fokke Zandbergen",
"active": true,
"timeZone": "Europe/Amsterdam"
},
"body": "Thank you [~xavier]! Didn't even know we were not deep merging this as do deep merge normal classes? Wonderful!",
"updateAuthor": {
"name": "fokkezb",
"key": "fokke",
"displayName": "Fokke Zandbergen",
"active": true,
"timeZone": "Europe/Amsterdam"
},
"created": "2015-11-28T06:13:49.000+0000",
"updated": "2015-11-28T06:13:49.000+0000"
},
{
"id": "371678",
"author": {
"name": "fmiao",
"key": "fmiao",
"displayName": "Feon Sua Xin Miao",
"active": true,
"timeZone": "America/Vancouver"
},
"body": "PR merged.\r\n\r\nTo test:\r\n1. Create an project\r\n2. Add a label in index.xml, i.e {{}}\r\n3. Add the following style to index.tss\r\n{code}\r\n\".title-home\": {\r\n\tfont: {\r\n\t\tfontFamily: \"Delius-Regular\",\r\n\t\tfontSize: 11\r\n\t}\r\n}\r\n\r\n\".title-home[formFactor=handheld]\": {\r\n\tfont: {\r\n\t\tfontSize: 22,\r\n\t\tfontWeight: 'bold'\r\n\t}\r\n}\r\n{code}\r\n4. Build the project for handheld devices, the label text should be in bold.",
"updateAuthor": {
"name": "fmiao",
"key": "fmiao",
"displayName": "Feon Sua Xin Miao",
"active": true,
"timeZone": "America/Vancouver"
},
"created": "2015-11-30T20:50:07.000+0000",
"updated": "2015-11-30T20:50:07.000+0000"
},
{
"id": "375011",
"author": {
"name": "ewieber",
"key": "ewieber",
"displayName": "Eric Wieber",
"active": false,
"timeZone": "America/Los_Angeles"
},
"body": "Verified fixed, using:\r\n\r\nMacOS 10.11.3 (15D21)\r\nStudio 4.4.0.201511241829\r\nTi SDK 5.2.0.v20160114021251\r\nAppc NPM 4.2.3-1\r\nAppc CLI 5.2.0-232\r\nAlloy 1.7.33 \r\nXcode 7.2 (7C68)\r\nNode v0.12.7\r\nJava 1.7.0_80\r\n\r\nNow using Alloy's deepExtend() over .extend() and can now see the generated code is conditioned properly. Used the provided steps and code to verify that the fonts are being bolded.",
"updateAuthor": {
"name": "ewieber",
"key": "ewieber",
"displayName": "Eric Wieber",
"active": false,
"timeZone": "America/Los_Angeles"
},
"created": "2016-01-20T23:18:33.000+0000",
"updated": "2016-01-20T23:18:33.000+0000"
}
],
"maxResults": 4,
"total": 4,
"startAt": 0
}
}
}