templates/components/parts/modals.html.twig line 1

Open in your IDE?
  1. <!-- Modal -->
  2. {% if updateClientForm is defined %}
  3. <div id="edit-client-profile" class="modal fade" role="dialog">
  4.     <div class="modal-dialog modal-lg">
  5.         <!-- Modal content-->
  6.         <div class="modal-content">
  7.             <div class="modal-header">
  8.                 <h4 class="modal-title">Editing profile</h4>
  9.                 <button type="button" class="js-close-message btn btn-outline" data-target="#edit-client-profile" data-dismiss="modal">&times;</button>
  10.             </div>
  11.             <div class="modal-body">
  12.                 {{ form_start(updateClientForm, {'action': path('edit_client_info'),'method':"POST"} ) }}
  14.                 <div class="form-group">
  15.                     {{ form_label(updateClientForm.imageFile,'Image') }}
  16.                     {{ form_widget(updateClientForm.imageFile, {'attr': {'class': 'client-crop-avatar form-control'}}) }}
  17.                     <img id="client_vichUploaderCropImagePreview" src="" style="max-width: 100%;" alt="preview" />
  18.                     <button id="clientCropButton">Crop & Upload</button>
  19.                 </div>
  20.                 <div class="form-group">
  21.                     {{ form_label(updateClientForm.username,'Username') }}
  22.                     {{ form_widget(updateClientForm.username, {'attr': {'class': 'form-control'}}) }}
  23.                     </div>
  24.                 <div class="form-group">
  25.                     {{ form_label(updateClientForm.name,'First name') }}
  26.                     {{ form_widget(updateClientForm.name, {'attr': {'class': 'form-control'}}) }}
  27.                 </div>
  28.                 <div class="form-group">
  29.                     {{ form_label(updateClientForm.surname,'Last name') }}
  30.                     {{ form_widget(updateClientForm.surname, {'attr': {'class': 'form-control'}}) }}
  31.                 </div>
  32.                 <div class="form-group">
  33.                     {{ form_label(updateClientForm.city,'City') }}
  34.                     {{ form_widget(updateClientForm.city, {'attr': {'class': 'form-control'}}) }}
  35.                 </div>
  36.                 <div class="form-group">
  37.                     {{ form_label(updateClientForm.country,'Country') }}
  38.                     {{ form_widget(updateClientForm.country, {'attr': {'class': 'form-control'}}) }}
  39.                 </div>
  40.             </div>
  41.             <div class="modal-footer">
  42.                 <input type="hidden" name="client_id" id="client_id" value="{% if client !=null %}{{ client.id }}{% endif %}"/>
  43.                 {{ form_widget(updateClientForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  44.                 <button type="button" class="js-close-message btn btn-default" data-target="#edit-client-profile" data-dismiss="modal">Close</button>
  45.                 {{ form_end(updateClientForm) }}
  46.             </div>
  48.         </div>
  49.     </div>
  50. </div>
  51. {% endif %}
  53. {% if updateRapperForm is defined %}
  54. <div id="create-edit-raper-profile" class="modal fade" role="dialog">
  55.     <div class="modal-dialog modal-lg">
  56.         <!-- Modal content-->
  57.         <div class="modal-content">
  58.             {% if client.rapper != null %}
  59.                 {{ form_start(updateRapperForm, {'action': path('rapperEdit')} ) }}
  60.                 <div class="modal-header">
  61.                     <h4 class="modal-title">Editing rapper profile</h4>
  62.                     <button type="button" class="js-close-message btn btn-outline" data-target="#create-edit-raper-profile" data-dismiss="modal">&times;</button>
  63.                 </div>
  64.                 <div class="modal-body">
  65.                     <div class="form-group">
  66.                         {{ form_label(updateRapperForm.avatarFile,'Avatar') }}
  67.                         {{ form_widget(updateRapperForm.avatarFile, {'attr': {'class': 'rapper-crop-avatar form-control'}}) }}
  68.                         <img id="rapper_vichUploaderCropImagePreview" src="" style="max-width: 100%;" alt="preview" />
  69.                         <button id="rapperCropButton">Crop & Upload</button>
  70.                     </div>
  71.                     <div class="form-group">
  72.                         {{ form_label(updateRapperForm.pseudoname,'Art name') }}
  73.                         {{ form_widget(updateRapperForm.pseudoname, {'attr': {'class': 'form-control'}}) }}
  74.                     </div>
  75.                     <div class="form-group">
  76.                         <label for="crew">Crew</label>
  77.                         <select class="form-control" id="crew" name="crew" aria-describedby="crewHelp" >
  78.                             {% if crews|length > 0 %}
  79.                                 <option value {% if rapper.crew == null %}selected{% endif %}>Not selected</option>
  80.                                 {% for crew in crews %}
  81.                                     <option value="{{ crew.id }}" {% if rapper.crew != null and rapper.crew.id == crew.id %}selected{% endif %}>{{ crew.name }}</option>
  82.                                 {% endfor %}
  83.                             {% else %}
  84.                                 <option value="0" selected>No crews yet</option>
  85.                             {% endif %}
  86.                         </select>
  87.                         <div class="py-3 d-flex align-items-center justify-content-between no-crew-profile">
  88.                             <div class="col-lg-9">
  89.                                 <p class="m-0">Can't find your crew? Maybe is not created yet, you can create one with this button. </p>
  90.                             </div>
  91.                             <button type="button" class="js-create-new-crew col-lg-2 btn btn-primary">Create crew</button>
  92.                         </div>
  93.                     </div>
  94.                     <div class="crew-panel hide">
  95.                         <label for="crew-name">Crew name</label>
  96.                         <div class="input-group mb-3">
  97.                             <input type="text" class="form-control" id="crew-name" name="crew-name" aria-describedby="crewNameHelp" placeholder="Enter crew name">
  98.                             <button type="button" class="js-create-crew-submit btn btn-success">Create new crew</button>
  99.                         </div>
  100.                     </div>
  101.                     <div class="form-group">
  102.                         {{ form_label(updateRapperForm.rapperStyle,'Rap style') }}
  103.                         {{ form_widget(updateRapperForm.rapperStyle, {'attr': {'class': 'form-control'}}) }}
  104.                     </div>
  105.                     <div class="form-group">
  106.                         {{ form_label(updateRapperForm.bio,'Bio') }}
  107.                         {{ form_widget(updateRapperForm.bio, {'attr': {'class': 'form-control'}}) }}
  108.                     </div>
  110.                 </div>
  111.                 <div class="modal-footer">
  112.                     {{ form_widget(updateRapperForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  113.                     <button type="button" class="js-close-message btn btn-default" data-target="#create-edit-raper-profile" data-dismiss="modal">Close</button>
  114.                 </div>
  115.                 {{ form_end(updateRapperForm) }}
  119.             {% else %}
  120.                 {{ form_start(createRapperForm, {'action': path('rapperCreate'),'method':"POST"}) }}
  121.                 <div class="modal-header">
  122.                     <h4 class="modal-title">Creating rapper profile</h4>
  123.                     <button type="button" class="js-close-message btn btn-outline" data-target="#create-edit-raper-profile" data-dismiss="modal">&times;</button>
  124.                 </div>
  125.                 <div class="modal-body">
  126.                     <div class="form-group">
  127.                         {{ form_label(createRapperForm.avatarFile,'Avatar') }}
  128.                         {{ form_widget(createRapperForm.avatarFile, {'attr': {'class': 'form-control'}}) }}
  129.                         <img class="rapper_vichUploaderCropImagePreview" src="" style="max-width: 100%;" alt="preview" />
  130.                         <button id="rapperCropButton">Crop & Upload</button>
  131.                     </div>
  132.                     <div class="form-group">
  133.                         {{ form_label(createRapperForm.pseudoname,'Art name') }}
  134.                         {{ form_widget(createRapperForm.pseudoname, {'attr': {'class': 'form-control'}}) }}
  135.                     </div>
  136.                     <div class="form-group">
  137.                         <label for="crew">Crew</label>
  138.                         <select class="form-control" id="crew" name="crew" aria-describedby="crewHelp" >
  139.                             {% if crews|length > 0 %}
  140.                                 <option value>Pick one...</option>
  141.                                 {% for crew in crews %}
  142.                                     <option value="{{ crew.id }}">{{ crew.name }}</option>
  143.                                 {% endfor %}
  144.                             {% else %}
  145.                                 <option value="0" selected>No crews yet</option>
  146.                             {% endif %}
  147.                         </select>
  148.                     </div>
  149.                     <div class="form-group">
  150.                         {{ form_label(createRapperForm.rapperStyle,'Rap style') }}
  151.                         {{ form_widget(createRapperForm.rapperStyle, {'attr': {'class': 'form-control'}}) }}
  152.                     </div>
  153.                     <div class="form-group">
  154.                         {{ form_label(createRapperForm.bio,'Bio') }}
  155.                         {{ form_widget(createRapperForm.bio, {'attr': {'class': 'form-control'}}) }}
  156.                     </div>
  157.                 </div>
  158.                 <div class="modal-footer">
  159.                     {{ form_widget(createRapperForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  160.                     <button type="button" class="js-close-message btn btn-default" data-target="#create-edit-raper-profile" data-dismiss="modal">Close</button>
  161.                 </div>
  162.                 {{ form_end(createRapperForm) }}
  163.             {% endif %}
  164.         </div>
  165.     </div>
  166. </div>
  167. {% endif %}
  169. {% if updateAuthorForm is defined%}
  170. <div id="create-edit-author-profile" class="modal fade" role="dialog">
  171.     <div class="modal-dialog modal-lg">
  172.         <!-- Modal content-->
  173.         <div class="modal-content">
  174.             {% if client.author != null %}
  175.                 {{ form_start(updateAuthorForm, {'action': path('authorEdit'),'method':"POST"}) }}
  176.                 <div class="modal-header">
  177.                     <h4 class="modal-title">Editing author profile</h4>
  178.                     <button type="button" class="js-close-message btn btn-outline" data-target="#create-edit-author-profile" data-dismiss="modal">&times;</button>
  179.                 </div>
  180.                 <div class="modal-body">
  181.                     <div class="form-group">
  182.                         {{ form_label(updateAuthorForm.imageFile,'Avatar') }}
  183.                         {{ form_widget(updateAuthorForm.imageFile, {'attr': {'class': 'author-crop-avatar form-control'}}) }}
  184.                         <img id="author_vichUploaderCropImagePreview" src="" style="max-width: 100%;" alt="preview" />
  185.                         <button id="authorCropButton">Crop & Upload</button>
  186.                     </div>
  187.                     <div class="form-group">
  188.                         {{ form_label(updateAuthorForm.pseudoname,'Art name') }}
  189.                         {{ form_widget(updateAuthorForm.pseudoname, {'attr': {'class': 'form-control'}}) }}
  190.                     </div>
  191.                 </div>
  192.                 <div class="modal-footer">
  193.                     {{ form_widget(updateAuthorForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  194.                     {#                            <button type="button" class="js-edit-author-submit btn btn-success" data-target="#edit-author-form" data-dismiss="modal">Save</button>#}
  195.                     <button type="button" class="js-close-message btn btn-default" data-target="#create-edit-author-profile" data-dismiss="modal">Close</button>
  196.                 </div>
  197.                 {{ form_end(updateAuthorForm) }}
  198.             {% else %}
  199.                 {{ form_start(createAuthorForm, {'action': path('authorCreate'),'method':"POST"}) }}
  200.                 <div class="modal-header">
  201.                     <h4 class="modal-title">Creating author profile</h4>
  202.                     <button type="button" class="js-close-message btn btn-outline" data-target="#create-edit-author-profile" data-dismiss="modal">&times;</button>
  203.                 </div>
  204.                 <div class="modal-body">
  205.                     <div class="form-group">
  206.                         {{ form_label(createAuthorForm.imageFile,'Avatar') }}
  207.                         {{ form_widget(createAuthorForm.imageFile, {'attr': {'class': 'form-control'}}) }}
  208.                     </div>
  209.                     <div class="form-group">
  210.                         <label for="author_fullname">Full name</label>
  211.                         <input type="text" class="form-control" id="author_fullname" name="author_fullname" aria-describedby="artnameHelp" value="{{ client.name }} {{ client.surname }}" disabled/>
  212.                     </div>
  213.                     <div class="form-group">
  214.                         {{ form_label(createAuthorForm.pseudoname,'Art name') }}
  215.                         {{ form_widget(createAuthorForm.pseudoname, {'attr': {'class': 'form-control'}}) }}
  216.                     </div>
  217.                 </div>
  218.                 <div class="modal-footer">
  219.                     {{ form_widget(createAuthorForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  220.                     <button type="button" class="js-close-message btn btn-default" data-target="#create-edit-author-profile" data-dismiss="modal">Close</button>
  221.                 </div>
  222.                 {{ form_end(createAuthorForm) }}
  223.             {% endif %}
  224.         </div>
  225.     </div>
  226. </div>
  227. {% endif %}
  229. {% if createBeatForm is defined%}
  230. <div id="add-beat-modal" class="modal fade" role="dialog">
  231.     <div class="modal-dialog modal-lg">
  232.         <!-- Modal content-->
  233.         <div class="modal-content">
  234.             {{ form_start(createBeatForm, {'action': path('create_beat'),'method':"POST"}) }}
  235.             <div class="modal-header">
  236.                 <h4 class="modal-title">Upload new beat</h4>
  237.                 <button type="button" class="js-close-message btn btn-outline" data-target="#add-beat-modal" data-dismiss="modal">&times;</button>
  238.             </div>
  239.             <div class="modal-body">
  240.                 <div class="form-group">
  241.                     {{ form_label(createBeatForm.imageFile,'Beat cover image') }}
  242.                     {{ form_widget(createBeatForm.imageFile, {'attr': {'class': 'form-control'}}) }}
  243.                 </div>
  244.                 <div class="form-group">
  245.                     {{ form_label(createBeatForm.instrumentalFile,'Beat audio file') }}
  246.                     {{ form_widget(createBeatForm.instrumentalFile, {'attr': {'class': 'form-control'}}) }}
  247.                     <small>Audio file should be maximum 1 min of length</small><br>
  248.                     <small>By uploading, you agree, that uploading beat, is your own or you have proper licence to edit, share etc..</small>
  249.                 </div>
  250.                 <div class="form-group">
  251.                     {{ form_label(createBeatForm.name,'Beat name') }}
  252.                     {{ form_widget(createBeatForm.name, {'attr': {'class': 'form-control'}}) }}
  253.                 </div>
  254.             </div>
  255.             <div class="modal-footer">
  256.                 {{ form_widget(createBeatForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  257.                 {#                        <button type="button" class="js-add-beat-submit btn btn-success" data-target="#add-beat-form" data-dismiss="modal">Save</button>#}
  258.                 <button type="button" class="js-close-message btn btn-default" data-target="#add-beat-modal" data-dismiss="modal">Close</button>
  259.             </div>
  260.             {{ form_end(createBeatForm) }}
  261.         </div>
  262.     </div>
  263. </div>
  264. {% endif %}
  266. {% if client is defined%}
  267. {% if client.rapper and client.rapper.crew and client.rapper.crew.createdBy == client %}
  268.     <div id="edit-crew-modal" class="modal fade" role="dialog">
  269.         <div class="modal-dialog modal-lg">
  270.             <!-- Modal content-->
  271.             <div class="modal-content">
  272.                 {{ form_start(updateCrewForm, {'action': path('crewEdit'),'attr': {'id': 'crew-edit-form'} } ) }}
  273.                 <div class="modal-header">
  274.                     <h4 class="modal-title">Edit crew information</h4>
  275.                     <button type="button" class="js-close-message btn btn-outline" data-target="#edit-crew-modal" data-dismiss="modal">&times;</button>
  276.                 </div>
  277.                 <div class="modal-body">
  278.                     <input type="hidden" name="id" id="id" value="{{ client.crew.id }}"/>
  279.                     <div class="form-group">
  280.                         {{ form_label(updateCrewForm.imageFile,'Crew Logo') }}
  281.                         {{ form_widget(updateCrewForm.imageFile, {'attr': {'class': 'form-control'}}) }}
  282.                     </div>
  283.                     <div class="form-group">
  284.                         {{ form_label(updateCrewForm.backgroundFile,'Crew Background') }}
  285.                         {{ form_widget(updateCrewForm.backgroundFile, {'attr': {'class': 'form-control'}}) }}
  286.                     </div>
  287.                     <div class="form-group">
  288.                         {{ form_label(updateCrewForm.name,'Crew name') }}
  289.                         {{ form_widget(updateCrewForm.name, {'attr': {'class': 'form-control'}}) }}
  290.                     </div>
  291.                     <div class="form-group">
  292.                         {{ form_label(updateCrewForm.city,'Crew origin - city') }}
  293.                         {{ form_widget(updateCrewForm.city, {'attr': {'class': 'form-control'}}) }}
  294.                     </div>
  295.                     <div class="form-group">
  296.                         {{ form_label(updateCrewForm.country,'Crew origin - country') }}
  297.                         {{ form_widget(updateCrewForm.country, {'attr': {'class': 'form-control'}}) }}
  298.                     </div>
  299.                     <div class="form-group">
  300.                         {{ form_label(updateCrewForm.description,'Crew description') }}
  301.                         {{ form_widget(updateCrewForm.description, {'attr': {'class': 'form-control'}}) }}
  302.                     </div>
  303.                 </div>
  304.                 <div class="modal-footer">
  305.                     {{ form_widget(updateCrewForm.submit, {'attr': {'class': 'btn btn-success'}}) }}
  306.                     {#                            <button type="button" class="js-update-crew-submit btn btn-success" data-target="#crew-edit-form" data-dismiss="modal">Save</button>#}
  307.                     <button type="reset" class="js-close-message btn btn-default" data-target="#edit-crew-modal" data-dismiss="modal">Close</button>
  308.                 </div>
  309.                 {{ form_end(updateCrewForm) }}
  310.             </div>
  311.         </div>
  312.     </div>
  313. {% endif %}
  314. {% endif %}
  316. {% if allRappers is defined%}
  317. <div id="invite-member-modal" class="modal fade" role="dialog">
  318.     <div class="modal-dialog modal-lg">
  319.         <!-- Modal content-->
  320.         <div class="modal-content">
  321.             <form id="invite-crew-member-form">
  322.                 <div class="modal-header">
  323.                     <h4 class="modal-title">Invite new member to the crew</h4>
  324.                     <button type="button" class="js-close-message btn btn-outline" data-target="#invite-member-modal" data-dismiss="modal">&times;</button>
  325.                 </div>
  326.                 <div class="modal-body">
  327.                     <div class="form-group">
  328.                         <label for="rapper">Rapper</label>
  329.                         <select name="rapper" class="form-control" id="rapper">
  330.                             <option value data-tokens="">Pick one...</option>
  331.                             {% for rapper in allRappers %}
  332.                                 {% if rapper!=client.rapper %}
  333.                                     <option value="{{ rapper.id }}" data-tokens="{{ rapper.client.name }}">{{ rapper.client.name }} <strong>{{ rapper.pseudoname }}</strong> {{ rapper.client.surname }}</option>
  334.                                 {% endif %}
  335.                             {% endfor %}
  336.                         </select>
  337.                     </div>
  338.                 </div>
  339.                 <div class="modal-footer">
  340.                     <button type="button" class="js-invite-crew-member-submit btn btn-success" data-target="#invite-crew-member-form" data-dismiss="modal">Invite</button>
  341.                     <button type="button" class="js-close-message btn btn-default" data-target="#invite-member-modal" data-dismiss="modal">Close</button>
  342.                 </div>
  343.             </form>
  344.         </div>
  345.     </div>
  346. </div>
  347. {% endif %}