diff --git a/app/assets/javascripts/editor/editor.js.erb b/app/assets/javascripts/editor/editor.js.erb index c72d2fac..59c8cf51 100644 --- a/app/assets/javascripts/editor/editor.js.erb +++ b/app/assets/javascripts/editor/editor.js.erb @@ -346,12 +346,20 @@ var CodeOceanEditor = { initializeSideBarCollapse: function () { $('#sidebar-collapse-collapsed').on('click', this.handleSideBarToggle.bind(this)); - $('#sidebar-collapse').on('click', this.handleSideBarToggle.bind(this)) + $('#sidebar-collapse').on('click', this.handleSideBarToggle.bind(this)); + const tipButton = $('#tips-collapsed'); + if (tipButton) { + tipButton.on('click', this.handleSideBarToggle.bind(this)); + } $('#sidebar').on('transitionend', this.resizeAceEditors.bind(this)); }, handleSideBarToggle: function () { - $('#sidebar').toggleClass('sidebar-col').toggleClass('sidebar-col-collapsed'); + const sidebar = $('#sidebar'); + sidebar.toggleClass('sidebar-col').toggleClass('sidebar-col-collapsed'); + if (sidebar.hasClass('w-25') || sidebar.hasClass('restore-to-w-25')) { + sidebar.toggleClass('w-25').toggleClass('restore-to-w-25'); + } $('#sidebar-collapsed').toggleClass('d-none'); $('#sidebar-uncollapsed').toggleClass('d-none'); }, diff --git a/app/views/exercises/_editor.html.slim b/app/views/exercises/_editor.html.slim index 48c8fc69..a17a91ac 100644 --- a/app/views/exercises/_editor.html.slim +++ b/app/views/exercises/_editor.html.slim @@ -6,7 +6,14 @@ - hide_rfc_button = @hide_rfc_button || false #editor.row data-exercise-id=@exercise.id data-message-depleted=t('exercises.editor.depleted') data-message-timeout=t('exercises.editor.timeout', permitted_execution_time: @exercise.execution_environment.permitted_execution_time) data-submissions-url=submissions_path data-user-id=@current_user.id data-user-external-id=external_user_external_id data-working-times-url=working_times_exercise_path(@exercise) data-intervention-save-url=intervention_exercise_path(@exercise) data-rfc-interventions=show_rfc_interventions data-break-interventions=show_break_interventions data-course_token=@course_token data-search-save-url=search_exercise_path(@exercise) - unless @embed_options[:hide_sidebar] - div id="sidebar" class=(@exercise.hide_file_tree ? 'sidebar-col-collapsed' : 'sidebar-col') = render('editor_file_tree', exercise: @exercise, files: @files) + + - additional_classes = 'sidebar-col' + - if @tips.blank? + - if @exercise.hide_file_tree + - additional_classes = 'sidebar-col-collapsed' + - else + - additional_classes = 'sidebar-col w-25' + div id="sidebar" class=additional_classes = render('editor_file_tree', exercise: @exercise, files: @files) div.editor-col.col.p-0 id='frames' #editor-buttons.btn-group.enforce-bottom-margin = render('editor_button', disabled: true, icon: 'fa fa-ban', id: 'dummy', label: t('exercises.editor.dummy')) diff --git a/app/views/exercises/_editor_file_tree.html.slim b/app/views/exercises/_editor_file_tree.html.slim index cb293d77..8662ddf9 100644 --- a/app/views/exercises/_editor_file_tree.html.slim +++ b/app/views/exercises/_editor_file_tree.html.slim @@ -1,9 +1,12 @@ -div id='sidebar-collapsed' class=(@exercise.hide_file_tree ? '' : 'd-none') +div id='sidebar-collapsed' class=(@exercise.hide_file_tree && @tips.blank? ? '' : 'd-none') = render('editor_button', classes: 'btn-block btn-primary btn', data: {:'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-plus-square', id: 'sidebar-collapse-collapsed', label:'', title:t('exercises.editor.expand_action_sidebar')) - if @exercise.allow_file_creation and not @exercise.hide_file_tree? = render('editor_button', classes: 'btn-block btn-primary btn enforce-top-margin', data: {:'data-cause' => 'file', :'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-plus', id: 'create-file-collapsed', label:'', title: t('exercises.editor.create_file')) + - unless @embed_options[:disable_hints] or @tips.blank? + = render('editor_button', classes: 'btn-block btn-success btn mb-4', data: {:'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-lightbulb', id: 'tips-collapsed', label:'', title: t('exercises.form.tips')) + - unless @embed_options[:disable_download] = render('editor_button', classes: 'btn-block btn-primary btn enforce-top-margin', data: {:'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-download', id: 'download-collapsed', label:'', title: t('exercises.editor.download')) = render('editor_button', classes: "btn-block btn-outline-warning btn enforce-top-margin #{@exercise.hide_file_tree || files.count < 2 && !@exercise.allow_file_creation ? 'd-none' : ''}", data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over_active_file'), :'data-url' => reload_exercise_path(@exercise), :'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-history', id: 'start-over-active-file-collapsed', label: '', title: t('exercises.editor.start_over_active_file')) @@ -11,32 +14,38 @@ div id='sidebar-collapsed' class=(@exercise.hide_file_tree ? '' : 'd-none') = render('editor_button', classes: 'btn-block btn-primary btn enforce-top-margin', data: {:'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-search', id: 'sidebar-search-collapsed', label: '', title: t('search.search_in_forum')) = render('editor_button', classes: 'btn-block btn-outline-danger btn enforce-top-margin', data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over'), :'data-url' => reload_exercise_path(@exercise), :'data-toggle' => 'tooltip', :'data-placement' => 'right'}, icon: 'fa fa-history', id: 'start-over-collapsed', label:'', title: t('exercises.editor.start_over')) -div id='sidebar-uncollapsed' class=(@exercise.hide_file_tree ? 'd-none' : '') - = render('editor_button', classes: 'btn-block btn-primary btn', icon: 'fa fa-minus-square', id: 'sidebar-collapse', label: t('exercises.editor.collapse_action_sidebar')) +div.h-100.col-sm-12.enforce-bottom-margin id='sidebar-uncollapsed' class=(@exercise.hide_file_tree && @tips.blank? ? 'd-none' : '') + .position-absolute.d-flex.mb-1.w-100 style="overflow: auto; left: 0; top: 0; height: 100%;" + .w-100 + = render('editor_button', classes: 'btn-block btn-primary btn', icon: 'fa fa-minus-square', id: 'sidebar-collapse', label: t('exercises.editor.collapse_action_sidebar')) - div class=(@exercise.hide_file_tree ? 'd-none' : '') - hr + div class=(@exercise.hide_file_tree ? 'd-none' : '') + hr - #files data-entries=FileTree.new(files).to_js_tree + #files data-entries=FileTree.new(files).to_js_tree - hr + hr - - if @exercise.allow_file_creation and not @exercise.hide_file_tree? - = render('editor_button', classes: 'btn-block btn-primary btn', data: {:'data-cause' => 'file'}, icon: 'fa fa-plus', id: 'create-file', label: t('exercises.editor.create_file')) - = render('editor_button', classes: 'btn-block btn-warning btn', data: {:'data-cause' => 'file', :'data-message-confirm' => t('shared.confirm_destroy')}, icon: 'fa fa-times', id: 'destroy-file', label: t('exercises.editor.destroy_file')) + - if @exercise.allow_file_creation and not @exercise.hide_file_tree? + = render('editor_button', classes: 'btn-block btn-primary btn', data: {:'data-cause' => 'file'}, icon: 'fa fa-plus', id: 'create-file', label: t('exercises.editor.create_file')) + = render('editor_button', classes: 'btn-block btn-warning btn', data: {:'data-cause' => 'file', :'data-message-confirm' => t('shared.confirm_destroy')}, icon: 'fa fa-times', id: 'destroy-file', label: t('exercises.editor.destroy_file')) - - unless @embed_options[:disable_download] - = render('editor_button', classes: 'btn-block btn-primary btn enforce-top-margin', icon: 'fa fa-download', id: 'download', label: t('exercises.editor.download')) - = render('editor_button', classes: "btn-block btn-outline-warning btn #{@exercise.hide_file_tree || files.count < 2 && !@exercise.allow_file_creation ? 'd-none' : ''}", data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over_active_file'), :'data-url' => reload_exercise_path(@exercise)}, icon: 'fa fa-history', id: 'start-over-active-file', label: t('exercises.editor.start_over_active_file')) - = render('editor_button', classes: 'btn-block btn-outline-danger btn', data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over'), :'data-url' => reload_exercise_path(@exercise)}, icon: 'fa fa-history', id: 'start-over', label: t('exercises.editor.start_over')) + - unless @embed_options[:disable_hints] or @tips.blank? + = render(partial: 'tips_content') + .mb-4 - //- if !@course_token.blank? - .input-group.enforce-top-margin - .enforce-right-margin - = text_field_tag 'search-input-text', nil, placeholder: t('search.search_in_forum'), class: 'form-control' - .input-group-btn - = button_tag(class: 'btn btn-primary', id: 'btn-search-col') do - i.fa.fa-search + - unless @embed_options[:disable_download] + = render('editor_button', classes: 'btn-block btn-primary btn enforce-top-margin', icon: 'fa fa-download', id: 'download', label: t('exercises.editor.download')) + = render('editor_button', classes: "btn-block btn-outline-warning btn #{@exercise.hide_file_tree || files.count < 2 && !@exercise.allow_file_creation ? 'd-none' : ''}", data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over_active_file'), :'data-url' => reload_exercise_path(@exercise)}, icon: 'fa fa-history', id: 'start-over-active-file', label: t('exercises.editor.start_over_active_file')) + = render('editor_button', classes: 'btn-block btn-outline-danger btn', data: {:'data-message-confirm' => t('exercises.editor.confirm_start_over'), :'data-url' => reload_exercise_path(@exercise)}, icon: 'fa fa-history', id: 'start-over', label: t('exercises.editor.start_over')) + + //- if !@course_token.blank? + .input-group.enforce-top-margin + .enforce-right-margin + = text_field_tag 'search-input-text', nil, placeholder: t('search.search_in_forum'), class: 'form-control' + .input-group-btn + = button_tag(class: 'btn btn-primary', id: 'btn-search-col') do + i.fa.fa-search - if @exercise.allow_file_creation? = render('shared/modal', id: 'modal-file', template: 'code_ocean/files/_form', title: t('exercises.editor.create_file')) \ No newline at end of file diff --git a/app/views/exercises/_editor_output.html.slim b/app/views/exercises/_editor_output.html.slim index 353e288f..75855cb2 100644 --- a/app/views/exercises/_editor_output.html.slim +++ b/app/views/exercises/_editor_output.html.slim @@ -55,8 +55,6 @@ div.h-100 id='output_sidebar_uncollapsed' class='d-none col-sm-12 enforce-bottom ul.body #output.mt-2 pre = t('exercises.implement.no_output_yet') - - unless @embed_options[:disable_hints] or @tips.blank? - = render(partial: 'tips_content') - if CodeOcean::Config.new(:code_ocean).read[:flowr][:enabled] && !@embed_options[:disable_hints] && !@embed_options[:hide_test_results] #flowrHint.card.text-white.bg-info data-url=CodeOcean::Config.new(:code_ocean).read[:flowr][:url] role='tab' .card-header = t('exercises.implement.flowr.heading') diff --git a/app/views/exercises/_tips_content.html.slim b/app/views/exercises/_tips_content.html.slim index 7abcc628..bdf58895 100644 --- a/app/views/exercises/_tips_content.html.slim +++ b/app/views/exercises/_tips_content.html.slim @@ -5,7 +5,7 @@ = javascript_pack_tag('highlight', 'data-turbolinks-track': true) = stylesheet_pack_tag('highlight', media: 'all', 'data-turbolinks-track': true) -#tips.card.text-white.bg-info.mt-2 role="tab" style="display: block;" +#tips.card.text-white.bg-success.mt-2 role="tab" style="display: block;" .card-header.py-2 i.fa.fa-lightbulb = t('exercises.implement.tips.heading')