PageRenderTime 48ms CodeModel.GetById 17ms RepoModel.GetById 0ms app.codeStats 0ms

/resources/sap/ui/commons/DatePickerRenderer-dbg.js

https://gitlab.com/unmeshM/trippinrw-openui
JavaScript | 146 lines | 57 code | 25 blank | 64 comment | 8 complexity | 814c6db73873bbacedb0c7c0edcf9b2d MD5 | raw file
  1. /*!
  2. * SAP UI development toolkit for HTML5 (SAPUI5/OpenUI5)
  3. * (c) Copyright 2009-2014 SAP SE or an SAP affiliate company.
  4. * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.
  5. */
  6. // Provides default renderer for control sap.ui.commons.DatePicker
  7. jQuery.sap.declare("sap.ui.commons.DatePickerRenderer");
  8. jQuery.sap.require("sap.ui.commons.TextFieldRenderer");
  9. jQuery.sap.require("sap.ui.commons.DatePicker");
  10. /**
  11. * @class DatePicker renderer.
  12. * @static
  13. * For a common look&feel, the DatePicker extends the TextField control,
  14. * just like the ComboBox does.
  15. */
  16. sap.ui.commons.DatePickerRenderer = sap.ui.core.Renderer.extend(sap.ui.commons.TextFieldRenderer);
  17. /**
  18. * Hint: "renderOuterAttributes" is a reserved/hard-coded TextField extending function!
  19. * It is used to allow extensions to display help icons.
  20. *
  21. * @param {sap.ui.core.RenderManager}
  22. * rm the RenderManager currently rendering this control
  23. * @param {sap.ui.commons.DatePicker}
  24. * oControl the DatePicker whose "value help" should be rendered
  25. * @private
  26. */
  27. sap.ui.commons.DatePickerRenderer.renderOuterAttributes = function(rm, oControl) {
  28. // To share the overall ComboBox styling:
  29. // Note: Would be best if a more generic className had been used for this, like
  30. // "sapUiTfIconContainer", as ComboBox and DatePicker and F4Help are likely
  31. // to always share a common container look. (Only icon should differ.)
  32. // Then, in the unlikely case where one of them would want to differ from the
  33. // others, then this one would only need to add its own className on top of
  34. // the generic one, e.g. "sapUiTfDateContainer" for the DatePicker.
  35. // Referencing "sapUiTfCombo" for now.
  36. rm.addClass("sapUiTfCombo");
  37. this.renderDatePickerARIAInfo(rm, oControl);
  38. };
  39. /**
  40. * Renders additional HTML for the DatePicker to the TextField (sets the icon)
  41. *
  42. * @param {sap.ui.fw.RenderManager} rm The RenderManager that can be used for
  43. * writing to the Render-Output-Buffer.
  44. * @param {sap.ui.fw.Control} oControl An object representation of the control that should
  45. * be rendered.
  46. */
  47. sap.ui.commons.DatePickerRenderer.renderOuterContentBefore = function(rm, oControl){
  48. rm.write("<div");
  49. rm.writeAttribute('id', oControl.getId() + '-icon');
  50. rm.writeAttribute('tabindex', '-1'); // to do not close popup by click on it
  51. // As mentioned above, a more generic "sapUiTfIcon" className could have been used...
  52. // One would just have had to add its own icon className!
  53. // Using "sapUiTfDateIcon" for now, as it proved easier to define instead of overwriting
  54. // the ComboBox image sources and backgrounds.
  55. rm.addClass("sapUiTfDateIcon");
  56. rm.writeClasses();
  57. rm.write("></div>"); //No Symbol for HCB Theme, as done by ComboBox.
  58. // invisible span with description for keyboard navigation
  59. var rb = sap.ui.getCore().getLibraryResourceBundle("sap.ui.commons");
  60. // ResourceBundle always returns the key if the text is not found
  61. var sText = rb.getText("DATEPICKER_KEYBOARD");
  62. var sDateType = rb.getText("DATEPICKER_DATE_TYPE");
  63. var sTooltip = sap.ui.core.ValueStateSupport.enrichTooltip(oControl, oControl.getTooltip_AsString());
  64. if (sTooltip) {
  65. // add tooltip to description because it is not read by JAWS from title-attribute if a label is assigned
  66. sText = sTooltip + ". " + sText;
  67. }
  68. sText = sDateType + ". " + sText;
  69. rm.write('<SPAN id="' + oControl.getId() + '-Descr" style="visibility: hidden; display: none;">');
  70. rm.writeEscaped(sText);
  71. rm.write('</SPAN>');
  72. };
  73. /*
  74. * Renders the inner attributes for the input element of the DatePicker
  75. *
  76. * @param {sap.ui.fw.RenderManager} oRenderManager the RenderManager that can be used for writing to the Render-Output-Buffer
  77. * @param {sap.ui.fw.Control} oDatePicker an object representation of the control that should be rendered
  78. */
  79. sap.ui.commons.DatePickerRenderer.renderInnerAttributes = function(rm, oDatePicker) {
  80. if (oDatePicker._bMobile) {
  81. rm.writeAttribute('type', 'date');
  82. rm.addStyle('position', 'absolute'); // to lay input field over expander icon
  83. }
  84. };
  85. /*
  86. * Renders ARIA information for the outer DIV
  87. *
  88. * @param {sap.ui.fw.RenderManager} oRenderManager the RenderManager that can be used for
  89. * writing to the Render-Output-Buffer
  90. * @param {sap.ui.fw.Control} oControl an object representation of the control that should
  91. * be rendered
  92. */
  93. sap.ui.commons.DatePickerRenderer.renderDatePickerARIAInfo = function(rm, oControl) {
  94. // no ARIA on outer DIV because focus is only on the input field
  95. // so no ARIA necessary here -> if there it brings some conufing reading by JAWS
  96. // IMPORTANT: According to jQuery forums, DatePicker Accessibility is to be delivered in a
  97. // future release. No release mentionned.
  98. // So there is not much point about doing more about this at the moment.
  99. };
  100. sap.ui.commons.DatePickerRenderer.renderARIAInfo = function(rm, oDatePicker) {
  101. var mProps= {
  102. role: oDatePicker.getAccessibleRole().toLowerCase(),
  103. multiline: false,
  104. autocomplete: "none",
  105. haspopup: true,
  106. describedby: {value: oDatePicker.getId() + "-Descr", append: true}};
  107. if (oDatePicker.getValueState() == sap.ui.core.ValueState.Error) {
  108. mProps["invalid"] = true;
  109. }
  110. rm.writeAccessibilityState(oDatePicker, mProps);
  111. };
  112. sap.ui.commons.DatePickerRenderer.convertPlaceholder = function(oDatePicker) {
  113. var sPlaceholder = oDatePicker.getPlaceholder();
  114. if (sPlaceholder.length == 8 && !isNaN(sPlaceholder)) {
  115. var oDate = oDatePicker._oFormatYyyymmdd.parse(sPlaceholder);
  116. if (oDate) {
  117. sPlaceholder = oDatePicker._formatValue(oDate);
  118. }
  119. }
  120. return sPlaceholder;
  121. };