Diff
Modified: trunk/Source/WebCore/ChangeLog (120244 => 120245)
--- trunk/Source/WebCore/ChangeLog 2012-06-13 20:53:52 UTC (rev 120244)
+++ trunk/Source/WebCore/ChangeLog 2012-06-13 20:56:42 UTC (rev 120245)
@@ -1,3 +1,35 @@
+2012-06-13 Christopher Hutten-Czapski <[email protected]>
+
+ 2012-06-13 Christopher Hutten-Czapski <[email protected]>
+
+ [BlackBerry] Update Select Popup's styling
+ https://bugs.webkit.org/show_bug.cgi?id=89005
+
+ Reviewed by Rob Buis.
+
+ Add in some nicely-styled CSS and JS for the BlackBerry port's <select>
+
+ * Resources/blackberry/popupControlBlackBerry.css:
+ (body):
+ (.popup-area):
+ (.popup-area>:first-child):
+ (.popup-buttons):
+ (.popup-button-divider):
+ (.popup-button):
+ (.popup-button:active):
+ (.popup-button:first-child:active):
+ (.popup-button:last-child:active):
+ (.popup-button:only-child:active):
+ * Resources/blackberry/selectControlBlackBerry.css: Added.
+ (.select-area):
+ (.select-area:last-child):
+ (.option):
+ (.optgroup:last-child):
+ (.selected):
+ (.optgroup):
+ (.optgroup .option):
+ * Resources/blackberry/selectControlBlackBerry.js: Added.
+
2012-06-13 Alec Flett <[email protected]>
[V8] IndexedDB: Cursor value modifications should be preserved until cursor iterates
Modified: trunk/Source/WebCore/Resources/blackberry/popupControlBlackBerry.css (120244 => 120245)
--- trunk/Source/WebCore/Resources/blackberry/popupControlBlackBerry.css 2012-06-13 20:53:52 UTC (rev 120244)
+++ trunk/Source/WebCore/Resources/blackberry/popupControlBlackBerry.css 2012-06-13 20:56:42 UTC (rev 120245)
@@ -1,9 +1,8 @@
+/*
+ * Copyright (C) Research In Motion Limited, 2012. All rights reserved.
+ */
+
html {
- position: fixed;
- left: 0;
- top: 0;
- bottom: 0;
- right: 0;
overflow: hidden;
}
@@ -11,56 +10,103 @@
padding: 0;
margin: 0;
font-family: "Myriad Pro", "Arial", "Helvetica", sans-serif;
-}
+ font-size: 40px;
-.bottombuttonOK {
- font-family: Arial, Helvetica, sans-serif;
- font-size: 14px;
- font-style: oblique;
- color: rgba(16, 16, 16, 0.6);
- background-color: rgba(6, 6, 6, 0.6);
- text-align: center;
- vertical-align: middle;
- display: block;
- height: 30px;
- width: 70px;
- border: 1px solid #000;
- position: fixed;
- bottom: auto;
-}
+ -webkit-user-select: none;
+ user-select: none;
-.bottombuttonCancel {
- font-family: Arial, Helvetica, sans-serif;
- font-size: 14px;
- font-style: oblique;
- color: rgba(16, 16, 16, 0.6);
- background-color: rgba(6, 6, 6, 0.6);
- text-align: center;
- vertical-align: middle;
- display: block;
- height: 30px;
- width: 70px;
- border: 1px solid #000;
- position: fixed;
- bottom: auto;
- left: 80px;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-box-align: center;
+ -webkit-box-pack: center;
+
+ display: box;
+ box-orient: vertical;
+ box-align: center;
+ box-pack: center;
}
-.tablebutton {
- font-family: Arial, Helvetica, sans-serif;
- font-size: 16px;
- font-weight: bold;
- background-color: #E2E4E3;
+.popup-area {
+ width: 100%;
height: 100%;
- width: 100%;
- border-top-style: none;
- border-right-style: none;
- border-left-style: none;
- border-bottom-style: none;
- margin: 0 auto;
- position:relative;
- top:0%;
- left:0%;
- bottom:0%;
- right:0%;
+
+ display: -webkit-box;
+ display: box;
+ -webkit-box-orient: vertical;
+ box-orient: vertical;
}
+
+ .popup-area>:first-child {
+ -webkit-box-flex: 1;
+ box-flex: 1;
+ }
+
+ .popup-buttons {
+ display: -webkit-box;
+ -webkit-box-orient: horizontal;
+ -webkit-box-pack: center;
+ -webkit-box-align: stretch;
+
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAB6CAMAAABwSXjiAAAAvVBMVEXc3Nzd3d3e3t7d3d3c3Nzd3d3f39/e3t7e3t7c3Nzc3Nzd3d3c3Nzc3Nzc3Nze3t7d3d3e3t7e3t7d3d3c3Nzd3d3c3Nzc3Nzd3d3c3Nzd3d3c3Nzd3d3c3Nzd3d3e3t7c3Nzf39/e3t7d3d3l5eXg4ODq6urj4+Pn5+fp6enk5OTm5ubo6Oji4uLh4eH09PT29vb6+vrx8fHw8PDv7+/u7u7t7e3r6+v19fX5+fn4+Pjz8/Py8vL39/fs7OxBzuRYAAAAIHRSTlMAAOqH6qj5xksJP1HJzIcG5JYDEuF+VFd4cud1CeSEk7PB98YAAADeSURBVHhezMlHEYBAAARBHF1OJP+ycDCfra2jv30kZv/Ffv8n2/4P2/6R2X8y+wdm/4vJfzP7ZyZ/YfavTP7G5O9M/pfJP5j6X3fzkYNAEANR1O7JkZxzztz/eDQaIRhB18byhr99KhXtcep+won9ihP7ESf2C07sW5y6n3FiP+DU/YYT+x33977DqfsKp+4h5JDMGmUogh7RAnqLYugxtQ26bxD3Nu6GTNwZO7k5tc6Z0zN+Os8d7HHlHPzkgF/OnmNtvarfXdabDahWMvI/1J8k9FVa5oW1Ii/TNzwAJkil621gpK4AAAAASUVORK5CYII=");
+ border-image-slice: 14 14 14 14 fill;
+ border-width: 14px;
+
+ text-align: center;
+ }
+
+ .popup-button-divider {
+ width: 2px;
+ background-color: rgba(0, 0, 0, 0.2);
+ border-width: 14px 0;
+ /* border image takes an image, so use a solid-colour gradient */
+ border-image-source: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 0%);
+ border-image-slice: 1 0 1 0;
+ border-image-outset: 1 0 1 0;
+ }
+
+ .popup-button {
+ color: inherit;
+ font: inherit;
+ text-shadow: rgba(255, 255, 255, 0.5) 0 -2px;
+ padding: 0;
+ margin: 0;
+ background: none;
+ line-height: 200%;
+ display: block;
+
+ width: 0;
+ -webkit-box-flex: 1;
+
+ border: 14px solid transparent;
+ }
+
+ .popup-button:active { /* all current popups have at most two buttons, so this is unused atm */
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAB4AQMAAAAJ9grDAAAAA1BMVEUAAACnej3aAAAAAXRSTlMz/za5cAAAABVJREFUeF7lwIEAAAAAgKD9qQepMAMA8AABd9vWlQAAAABJRU5ErkJggg==");
+ border-image-slice: 1 0 1 0 fill;
+ padding: 14px;
+ margin: -14px;
+ }
+
+ .popup-button:first-child:active { /* TODO: RTL */
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAB4CAMAAADMioJkAAAAPFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADQLyYwAAAAFHRSTlMzAC8BGygeDzIuEBoiGBEtAhcNKSH3iKYAAABFSURBVHhe7cy5AYAwEMTA27PN/9N/r0QQqAVW4QSKX+Wcc84NhCQ0QkfoCYUTrYQyAjQRNBO0EFQJ2naAjjNf+LpquyMeT+sA9bsu6t8AAAAASUVORK5CYII=");
+ border-image-slice: 14 0 14 14 fill;
+ border-image-width: 1 0 1 1;
+ padding: 14px;
+ margin: -14px;
+ }
+
+ .popup-button:last-child:active { /* TODO: RTL */
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAB3CAMAAAA93DCxAAAAM1BMVEUAAAAAAAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACin91XAAAAEXRSTlMzAAAvLhsCKBgyARAeDyIRFxtQtTsAAAA/SURBVHhe7ci3AYAAEAJA8YM57D+thY2wglx5w5+ZmZktGqExaewah0SsEvPIkS2xgaPAcYKjQJEXvhF3440HSAQAwP9T2mwAAAAASUVORK5CYII=");
+ border-image-slice: 14 14 14 0 fill;
+ border-image-width: 1 1 1 0;
+ padding: 14px;
+ margin: -14px;
+ }
+
+ .popup-button:only-child:active {
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAB4CAMAAACkeQBcAAAAPFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADQLyYwAAAAFHRSTlMzAC8bKAEuAjIeDxAXGCIRDSktGtImyaoAAABzSURBVHhe7c5LDsIwEATR6rGdkH+A+9+VRUQUCWx2rPptp0Zq/szMzMzMzMxuv85BU5Bpygw0DYw0jZSgIQpaaFiESkdV1wtpomqSkPSkIukItPLVqnegVPk/A22Pj32broH6ObiIudcBnfaU7wD3nHadXi1ZAc/vLQEmAAAAAElFTkSuQmCC");
+ border-image-slice: 14 14 14 14 fill;
+ border-image-width: 1 1 1 1;
+ padding: 14px;
+ margin: -14px;
+ }
Added: trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.css (0 => 120245)
--- trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.css (rev 0)
+++ trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.css 2012-06-13 20:56:42 UTC (rev 120245)
@@ -0,0 +1,63 @@
+/*
+ * Copyright (C) Research In Motion Limited 2012. All rights reserved.
+ */
+
+.select-area {
+ overflow-x: hidden;
+ overflow-y: auto;
+ white-space: nowrap;
+
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAtUAAAANCAYAAABmQZIAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowODgwMTE3NDA3MjA2ODExOERCQkU3QjZERTFCNzVGNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxQzIwQ0ZFQTM0ODYxMUUxQkI0RkE0ODBENzFGMEVDRSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxQzIwQ0ZFOTM0ODYxMUUxQkI0RkE0ODBENzFGMEVDRSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA4ODAxMTc0MDcyMDY4MTE4REJCRTdCNkRFMUI3NUY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjA4ODAxMTc0MDcyMDY4MTE4REJCRTdCNkRFMUI3NUY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YZtOWQAAA25JREFUeNrsnetuwyAMhYPH3v+FUzNV2qSpSsAXTCA550eltingC/BBaZpKKRsEQRAEQRAEQXbl90NKCZ6AtCK4AIIgCLqxGC6ApHpvUueJweyOybwaiGJAQV5AEITxGlp3zOYH+H0aGzOSFkC0aH5ggIYgCAJUw9f++QW5Mxk00UWJACCCbfAzBEEQBD13MUOBZQ+Daqo854PXSGgECZ3EHSClhxMJUDQNGEpjwQ/xBxYHEDR4UoWtqnGAJ/I7B9m4Sj5wcB708C93iG0LzF1+yA4ja89J6CRyJGsO7OhXl7tih50FqiW/uo2+5U0yTCx3AOo7QzW+Hr33wml/WGw4cBzU3PmgLArVd2snT9Zu7Y60Bdg5wo6s6KQaAKZGA+hgImbl4NBjcI88M+xpX+qQTLVvBvJA+1jp9zvvIj+tXsAkFhfQ9b7jG9dHwoUSDbBFstt7BnSa+b0sEqNdMO+zsn0S3uGDa3PD5hZ/iv2VlclKjQT5hHDa6kdBtFBNjo6WOnRW6tTZo8obWdaXsKMnZ/0c4AO6sIxRcLYKBCbjhOG9D2hxtvOpKoN8Zq1n9j9e4MH1WHflWAiDI2y1zgGszIujfH1dHF8O+gx3KLNVhoQRekH11oBq+rfoOdpc3H9fJ2GfYi1UHwExVaA6VyCUGkCejFBLgUCsKSM5wKYHeFvgiTpMftT5urPrI6C6ByDNBtW9y70KIkf9HgLHtuJBjwf5cvRObFkgBjNAdQnwjfWcLg+ISxG0m531eICZHTHjDj7dFfFr1cdKYOcKcH9Ct8vO3BjAqALVR5CdK1CdKu9twvdIcM1XI9k8MGg9ApMcIG2dqNNJh/k878sVX7LCxl5wNgJMrtypThPbZC0vdZxUpf7xTtgR596fANWaRU9xxicK3rz5OvuZ1lmOB8x0TrcYy2RhH2jB2CdUF4e9WrCO2iHWxvdbEZddEJfWcY4z7uKTz1MFumscyTUIriUENwDsDFrZCGzWFdneaONrIOhsFbD1DBTWHe6/WLwOfGKJUTK2IxLwJNdqvtJLg9o9G2Svenwkuu/2gvTZoLpc7NtIQJxlQTIKNCPqLpO0cfSOswSqJWW/OvGNNC4WP0o+w4780NSpOZ++V8p8bed3puPKAuqPlf7vrpMgHzi9/1YRgiAIgiAIgiC7fgQYALk6BVm+VKUFAAAAAElFTkSuQmCC") bottom no-repeat rgba(255, 255, 255, 0.5);
+ background-size: 100% auto;
+ border-top-left-radius: 10px;
+ border-top-right-radius: 10px;
+ border-image-source: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAcCAYAAACdz7SqAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9wGBw8oKjYFm6wAAAMkSURBVEjHxZbBThtXFIa/MzaejAs2aZKqbnHsSunG6kOwiJF4A4RhA1ElVGXLgteIKhQasUoRD5CmEs6CR/Ciu7YuBksjFZTa4Ho8tmdOF7kzOIi2CZjkSEdjX8093/3/e2bmiqoSReOg4QD3gE8YX/wNHBeKBS8akAh6eHB41wCpVqv2k++f3G0cNKZb7dYkIO8B0ensdKdQLLQef/f4pFwu+2b8+H7x/kkMPWoc5YBpgEffPvqsWq0WVDUC6RXUCYCIaLlcbjzbevanGW/lC3lXDhuHGeDLs7MzeVh++MB13dtACPiABwxGwPp/IHOdABzABqxcLvfXq+qr36amphRoWoLcFoTKUuUL13WzBtICXgMdA+6Z9P8jo3s8M++1qTNwXTdbWarkBEGQTy0RSb/46YVdq9U+BwLgGGibBoiyA5y9Q3YuzGsDJ0BQq9VyL39+mRKRtCUibP2wdccAT83NXbPid1V5mVrP1OmYusHTrad3RISkiFCv1zNA39jRM78Ds7fhFRrJMjk089uAXa/XsyLiJkWEbrebMCvtmmvfNE14je6NoGr+9z3Pm4iVDgaDoWmgCBjB9IovhGjBYuoBDHzfT8RQY+XwmpZeBo5UxvXfQC1hBDi8hqX/FsHIdSiWYBmlo3aOE8iFumFsr4joiKXjhkYRAipyrlRvGBjXH20kvUF736o/qvSDxUeEWh8YGj0yqVTq4jdx3GEBTE5OSmxvPp9H35xbrEuaahwpqqrFYvG8kebn5yOFzg0pdQDK5fK50tXVVQBVVQdIjhmYVNU0oMvLy7HSbqlU6q2vr6cMOauqto4nbFXNArqxsWGXSqWeiHTF87yMiHwVhuHMysrK6e7urmf2oWe+r4MrqJsA0sAtQBYWFpzt7e2MZVlNVf1DVBW/5+cSicQDEck8//F5d21t7dTzvOtvpOOwubmZWaospVW1HQTB7/Yt240P277v30skEt+ISLrZbA53dna8vb09f39/f/i+sNnZ2eTc3Jy9uLjozMzMJFW1GwTBL7ZtH791wgfo9/uOZVlfi0h+bC9d1aMwDH9NpVKxdf8AVVvibOaCYy8AAAAASUVORK5CYII=");
+ border-width: 12px 12px 0 12px;
+ border-image-slice: 12 12 12 12 fill;
+}
+
+.select-area:last-child {
+ /* Nothing comes after us? Put the bottom border back and adjust the bottom shadow */
+ border-bottom-width: 12px;
+ background-origin: border-box;
+}
+
+ .option {
+ overflow: hidden;
+ text-overflow: -blackberry-fade;
+ color: #262626;
+ text-shadow: rgba(0, 0, 0, 0.2) 0 -1px;
+
+ box-sizing: border-box;
+ height: 99px;
+
+ border: 2px solid rgba(0, 0, 0, 0.2);
+ border-bottom-width: 0;
+
+ padding-left: 24px;
+ padding-top: 28px;
+ }
+
+ .option:last-child,
+ .optgroup:last-child {
+ border-bottom-width: 2px;
+ }
+
+ .selected {
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAfCAYAAACPvW/2AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowOTgwMTE3NDA3MjA2ODExOERCQkU3QjZERTFCNzVGNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4QjlDOEZERjRFOEUxMUUxQTVCNEE5NzUyM0FFRjA5OSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4QjlDOEZERTRFOEUxMUUxQTVCNEE5NzUyM0FFRjA5OSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkUzQUZFRkQwNDMyMDY4MTE5NDU3RDYyQTNCRTFFRDU2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjA5ODAxMTc0MDcyMDY4MTE4REJCRTdCNkRFMUI3NUY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Ei1rtAAAAxlJREFUeNrEl89rGkEUx1dXTWISPajxRzQhGkECIedCDvbQg9BbaQ6BQK8p9A9IDi2l2D8hJ9Eo/khMcmjVHJJLoYcWofaSXpJDyalJhIIUkYI/+n1DVyLurDHRdeHhzDgz++H73rx5q/H7/cIon/Pz846+ZoRANtgj2G/YF4A1aFDbarWEEdi6RqO5MBgMH/R6/Wf0v0MYBwHpRqDMi/Hx8YjZbBYBxQbq9fpypVKJoPlUR8RqwkxMTDAY6kjvFkVRmJqaCqmtEFPGZDKJciIYjcYaA1JJIaYMD4aelZWVExbUasLwJiwsLJTC4fB7NRTaIDchPsRms8mFiUQiW4D+NmwggolNT09z3UQw0WiUYE4pxocZ1BtjY2M9YWKxWAfMsBRiMEpu8nq9pd3d3S6YYWTqDWRfBsObQ8rE43EGMz8/36WGdhhu4k0gZRKJBBdGzmVLsGVYEfazX5jJyUlFN0kwc3Nz3DiRXEYSp7Ra7Q9IvoffC/Tf9uMmglFyUzKZZDAej6d1+z9ZhQDwCql7HRtL42KtVnsNoxLhZS9lsJarjM/nK6VSKQbjdrt7niAGZLFYnuHG7SBGDhFwG29Wq1WBA7UuwfBOKsGk02kGMzs7e6fjzILaZrPV5f7ECwW4YhPNHRmYBLmJtzHBZDKZvmDaMRQMBj+S5HKGAkrAppuYtyMVVxhLYEzkraGYkWBcLldLKQZlFdre3t4LhUJZ3iKKLYLC1BOCkdwkZ3Sa9vf32zD95g4WQ06n8xeed9Q+Pj5ek5tIUAj+JzqdTlCKmWw2y2Cw572ugHYecjgcZ1dXVwyqUCjIQgFI4J2mxcXFNgz2uvd91JEY7Xb72fX1tSIUD+bg4GALrjzFHg+6HLtuewmK2neBIpjDw8OBwHDLj9tQ+Xx+TS0YxfJjZmbm7ObmhrlPDopgjo6OGAzmDqyGUSzQJCicrHoul3veaDT0NB4IBIooId4MGoZ9Slut1p6TyuXy0uXl5eNisejCca6urq5+xfAnZPjmQwGwd/9A/xfSzWuC/QXIn0Ep0gWk8pdrz+efAAMAmYa9FmAD9lUAAAAASUVORK5CYII="),
+ -webkit-linear-gradient(top, #fafafa 0%, #dddddd 100%);
+ background-position: right 20px, 0% 0%; /* TODO: RTL */
+ /* FIXME: the above should put the checkmark 20px from the right of the box, but webkit isn't supporting that part of CSS3 yet. So fake it */
+ background-position: 97% 50%, 0% 0%;
+ background-repeat: no-repeat;
+ padding-right: 56px; /* this gets the overflow and fade to work. 36px for the image, about 20px for the right padding */
+ }
+
+ .optgroup {
+ /* need to do something with this */
+ padding-left: 22px;
+ }
+
+ .optgroup .option {
+ border-left-width: 0; /* TODO: RTL */
+ }
Added: trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.js (0 => 120245)
--- trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.js (rev 0)
+++ trunk/Source/WebCore/Resources/blackberry/selectControlBlackBerry.js 2012-06-13 20:56:42 UTC (rev 120245)
@@ -0,0 +1,92 @@
+/*
+ * Copyright (C) Research In Motion Limited, 2012. All rights reserved.
+ */
+
+// Upon the user making a selection, I will call window.setValueAndClosePopup with a binary string where
+// the character at index i being '1' means that the option at index i is selected.
+(function (){
+
+ var selectOption = function (event) {
+ for (var option = document.getElementById('select-area').firstChild; option; option = option.nextSibling) {
+ if (option === event.target) {
+ if (option.className.indexOf('selected') === -1) {
+ option.className += ' selected';
+ }
+ } else {
+ option.className = option.className.replace('selected', '');
+ }
+ }
+ done();
+ };
+
+ var toggleOption = function (event) {
+ if (event.target.className.indexOf('selected') === -1) {
+ event.target.className += ' selected';
+ } else {
+ event.target.className = event.target.className.replace('selected', '');
+ }
+ };
+
+ var done = function () {
+ var result = '';
+ for (var option = document.getElementById('select-area').firstChild; option; option = option.nextSibling) {
+ if (option.className.indexOf('selected') === -1) {
+ result += '0';
+ } else {
+ result += '1';
+ }
+ }
+ window.setValueAndClosePopup(result, window.popUp);
+ };
+
+ /* multiple - a boolean
+ * labels - an array of strings
+ * enableds - an array of booleans.
+ * -I will assume that the HTML "disabled optgroups disable all options in the optgroup" hasn't been applied,
+ * so if the index corresponds to an optgroup, I will render all of its options as disabled
+ * itemTypes - an array of integers, 0 === option, 1 === optgroup, 2 === option in optgroup
+ * selecteds - an array of booleans
+ * buttonText - a string to use for the button presented when multiple is true. Like "OK" or "Done" or something.
+ */
+ var show = function (multiple, labels, enableds, itemTypes, selecteds, buttonText) {
+ var i,
+ size = labels.length,
+ popup = document.createElement('div'),
+ select = document.createElement('div');
+
+ popup.className = 'popup-area';
+ select.className = 'select-area';
+ select.id = 'select-area';
+ popup.appendChild(select);
+
+ for (i = 0; i < size; i++) {
+ // TODO: handle itemTypes
+ var option = document.createElement('div');
+ option.className = 'option' + (enableds[i] ? '' : ' disabled') + (selecteds[i] ? ' selected' : '');
+ option.appendChild(document.createTextNode(labels[i]));
+ if (!multiple) {
+ option.addEventListener('click', selectOption);
+ } else if (enableds[i]) {
+ option.addEventListener('click', toggleOption);
+ }
+
+ select.appendChild(option);
+ }
+
+ if (multiple) {
+ var okButton = document.createElement('button'),
+ buttons = document.createElement('div');
+ buttons.className = 'popup-buttons';
+ okButton.className = 'popup-button';
+ okButton.addEventListener('click', done);
+ okButton.appendChild(document.createTextNode(buttonText));
+ buttons.appendChild(okButton);
+ popup.appendChild(buttons);
+ }
+
+ document.body.appendChild(popup);
+ };
+
+ window.select = window.select || {};
+ window.select.show = show;
+}());
