UsageRightsSelectBox.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. /*
  2. * Copyright (C) 2015 - present Instructure, Inc.
  3. *
  4. * This file is part of Canvas.
  5. *
  6. * Canvas is free software: you can redistribute it and/or modify it under
  7. * the terms of the GNU Affero General Public License as published by the Free
  8. * Software Foundation, version 3 of the License.
  9. *
  10. * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
  11. * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
  12. * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
  13. * details.
  14. *
  15. * You should have received a copy of the GNU Affero General Public License along
  16. * with this program. If not, see <http://www.gnu.org/licenses/>.
  17. */
  18. import React from 'react'
  19. import I18n from 'i18n!react_files'
  20. import UsageRightsSelectBox from 'compiled/react_files/components/UsageRightsSelectBox'
  21. var CONTENT_OPTIONS = [{
  22. display: I18n.t('Choose usage rights...'),
  23. value: 'choose'
  24. }, {
  25. display: I18n.t('I hold the copyright'),
  26. value: 'own_copyright'
  27. }, {
  28. display: I18n.t('I have obtained permission to use this file.'),
  29. value: 'used_by_permission'
  30. }, {
  31. display: I18n.t('The material is in the public domain'),
  32. value: 'public_domain'
  33. }, {
  34. display: I18n.t('The material is subject to fair use exception'),
  35. value: 'fair_use'
  36. }, {
  37. display: I18n.t('The material is licensed under Creative Commons'),
  38. value: 'creative_commons'
  39. }
  40. ];
  41. UsageRightsSelectBox.renderContentOptions = function () {
  42. return CONTENT_OPTIONS.map((contentOption) => {
  43. return (<option key={contentOption.value} value={contentOption.value}>{contentOption.display}</option>);
  44. });
  45. };
  46. UsageRightsSelectBox.renderCreativeCommonsOptions = function () {
  47. var onlyCC = this.state.licenseOptions.filter((license) => {
  48. return license.id.indexOf('cc') === 0;
  49. });
  50. return onlyCC.map((license) => {
  51. return (<option key={license.id} value={license.id}>{license.name}</option>);
  52. });
  53. };
  54. UsageRightsSelectBox.renderShowCreativeCommonsOptions = function () {
  55. var renderShowCreativeCommonsOptions = (
  56. <div className='control-group'>
  57. <label
  58. className='control-label'
  59. htmlFor='creativeCommonsSelection'
  60. >
  61. {I18n.t('Creative Commons License:')}
  62. </label>
  63. <div className='control'>
  64. <select
  65. id='creativeCommonsSelection'
  66. className='UsageRightsSelectBox__creativeCommons'
  67. ref='creativeCommons'
  68. defaultValue={this.props.cc_value}
  69. >
  70. {this.renderCreativeCommonsOptions()}
  71. </select>
  72. </div>
  73. </div>
  74. );
  75. return this.state.showCreativeCommonsOptions ? renderShowCreativeCommonsOptions : null;
  76. };
  77. UsageRightsSelectBox.renderShowMessage = function () {
  78. var renderShowMessage = (
  79. <div
  80. ref='showMessageAlert'
  81. className='alert'
  82. >
  83. <span>
  84. <i className='icon-warning' ></i>
  85. <span style={{paddingLeft: '10px'}}>
  86. {I18n.t("If you do not select usage rights now, this file will be unpublished after it's uploaded.")}
  87. </span>
  88. </span>
  89. </div>
  90. );
  91. return this.state.showMessage ? renderShowMessage : null;
  92. };
  93. UsageRightsSelectBox.render = function () {
  94. return (
  95. <div
  96. className='UsageRightsSelectBox__container'
  97. >
  98. <div className='control-group'>
  99. <label
  100. className='control-label'
  101. htmlFor='usageRightSelector'
  102. >
  103. {I18n.t('Usage Right:')}
  104. </label>
  105. <div className='controls'>
  106. <select
  107. id='usageRightSelector'
  108. className='UsageRightsSelectBox__select'
  109. onChange={this.handleChange}
  110. onKeyUp={this.handleChooseKeyPress}
  111. ref='usageRightSelection'
  112. value={this.state.usageRightSelectionValue}
  113. >
  114. {this.renderContentOptions()}
  115. </select>
  116. </div>
  117. </div>
  118. {this.renderShowCreativeCommonsOptions()}
  119. <div className='control-group'>
  120. <label
  121. className='control-label'
  122. htmlFor='copyrightHolder'
  123. >
  124. {I18n.t('Copyright Holder:')}
  125. </label>
  126. <div className='controls'>
  127. <input
  128. id='copyrightHolder'
  129. type='text'
  130. ref='copyright'
  131. defaultValue={this.props.copyright && this.props.copyright}
  132. placeholder={I18n.t('(c) 2001 Acme Inc.')}
  133. >
  134. </input>
  135. </div>
  136. </div>
  137. {this.renderShowMessage()}
  138. </div>
  139. );
  140. };
  141. export default React.createClass(UsageRightsSelectBox)