From b2f62e91d5271dba698ed7ea668cddc37e5369ca Mon Sep 17 00:00:00 2001 From: Marc Bernard <59966492+mbtools@users.noreply.github.com> Date: Wed, 22 Dec 2021 10:31:44 -0500 Subject: [PATCH] Repo View: Improve view with folders (#5215) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Repo View: Improve view with folders I made some improvements to the folder view: - Boxed display of path - Separate links for folders within path - Remove leading/trailing `/` in folder display - Better alignment of `..` parent folder - Fix incorrect HTML since `%26lt;tr%26gt;` was before `%26lt;thead%26gt;` Ref https://github.com/abapGit/abapGit/pull/5159#issuecomment-976124592 * Update CSS Co-authored-by: Lars Hvam Co-authored-by: Christian Günter --- src/ui/zabapgit_css_common.w3mi.data.css | 1 + src/ui/zabapgit_css_theme_dark.w3mi.data.css | 27 +++++----- .../zabapgit_css_theme_default.w3mi.data.css | 3 +- src/ui/zcl_abapgit_gui_chunk_lib.clas.abap | 52 +++++++++++++++++++ .../zcl_abapgit_gui_page_repo_view.clas.abap | 22 ++++++-- 5 files changed, 87 insertions(+), 18 deletions(-) diff --git a/src/ui/zabapgit_css_common.w3mi.data.css b/src/ui/zabapgit_css_common.w3mi.data.css index 43e67fa2b..7f3e113a5 100644 --- a/src/ui/zabapgit_css_common.w3mi.data.css +++ b/src/ui/zabapgit_css_common.w3mi.data.css @@ -225,6 +225,7 @@ div.repo { span.branch, span.user-box, span.package-box, +span.path-box, span.transport-box { padding: 2px 4px; border: 1px solid; diff --git a/src/ui/zabapgit_css_theme_dark.w3mi.data.css b/src/ui/zabapgit_css_theme_dark.w3mi.data.css index 8308b2998..49dd34b71 100644 --- a/src/ui/zabapgit_css_theme_dark.w3mi.data.css +++ b/src/ui/zabapgit_css_theme_dark.w3mi.data.css @@ -27,7 +27,7 @@ body { background-color: var(--theme-background-color); color: var(--theme-primary-font-color); } -select, input, textarea { +select, input, textarea { color: var(--theme-primary-font-color); border-color: #ffffff; background-color: var(--theme-background-color); @@ -57,6 +57,7 @@ span.package-box { background-color: #705a6d; border-color: #987095; } +span.path-box, span.transport-box { background-color: #456d5d; border-color: #60a087; @@ -66,8 +67,8 @@ span.transport-box { #debug-output { color: var(--theme-greyscale-dark); } /* abapGit logo in header and footer */ -.logo .icon.icon-abapgit { - color: var(--theme-primary-font-color); +.logo .icon.icon-abapgit { + color: var(--theme-primary-font-color); } /* TUTORIAL */ @@ -93,32 +94,32 @@ span.branch_branch { .repo_tab th { border-top-color: var(--theme-greyscale-dark); - background-color: black; + background-color: black; } .repo_tab td { border-top-color: var(--theme-greyscale-dark); } /* STAGE */ -.stage_tab { +.stage_tab { border-color: var(--theme-greyscale-dark); - background-color: var(--theme-background-color); + background-color: var(--theme-background-color); } .stage_tab th { border-top-color: var(--theme-greyscale-dark); - background-color: black; + background-color: black; } -.stage_tab td { - color: var(--theme-primary-font-color); +.stage_tab td { + color: var(--theme-primary-font-color); border-top-color: var(--theme-greyscale-dark); } -.stage_tab td.status.highlight { +.stage_tab td.status.highlight { color: var(--theme-primary-font-color) !important; background-color: var(--theme-background-color); } -.stage_tab td.status { +.stage_tab td.status { color: #777; - background-color: var(--theme-background-color); + background-color: var(--theme-background-color); } .stage_tab th { background-color: var(--theme-container-background-color); } .stage_tab tr:hover {background-color: var(--theme-list-hover-background-color) !important;} @@ -186,7 +187,7 @@ div.log { color: var(--theme-greyscale-dark); } /* DIALOGS */ .dialog { color: var(--theme-primary-font-color-reduced); - background-color: var(--theme-container-background-color); + background-color: var(--theme-container-background-color); } .dialog li.dialog-commands a { border-color: #ccc; diff --git a/src/ui/zabapgit_css_theme_default.w3mi.data.css b/src/ui/zabapgit_css_theme_default.w3mi.data.css index 60fef5a9f..25cb47fee 100644 --- a/src/ui/zabapgit_css_theme_default.w3mi.data.css +++ b/src/ui/zabapgit_css_theme_default.w3mi.data.css @@ -71,6 +71,7 @@ span.package-box { border-color: #d3ccd2; background-color: #ebe3ea; } +span.path-box, span.transport-box { border-color: #a7e3cf; background-color: #dbf3eb; @@ -557,4 +558,4 @@ table.settings_tab input:focus { .dialog input[readonly] { background-color: #f4f4f4; color: var(--theme-greyscale-dark); -} \ No newline at end of file +} diff --git a/src/ui/zcl_abapgit_gui_chunk_lib.clas.abap b/src/ui/zcl_abapgit_gui_chunk_lib.clas.abap index ec9678dfe..585c2b3a6 100644 --- a/src/ui/zcl_abapgit_gui_chunk_lib.clas.abap +++ b/src/ui/zcl_abapgit_gui_chunk_lib.clas.abap @@ -164,6 +164,14 @@ CLASS zcl_abapgit_gui_chunk_lib DEFINITION iv_sci_result TYPE zif_abapgit_definitions=>ty_sci_result. + CLASS-METHODS render_path + IMPORTING + !iv_path TYPE string + !iv_interactive TYPE abap_bool DEFAULT abap_true + RETURNING + VALUE(ri_html) TYPE REF TO zif_abapgit_html + RAISING + zcx_abapgit_exception . PROTECTED SECTION. CLASS-METHODS render_repo_top_commit_hash @@ -739,6 +747,50 @@ CLASS zcl_abapgit_gui_chunk_lib IMPLEMENTATION. ENDMETHOD. + METHOD render_path. + + DATA: + lv_path TYPE string, + lv_jump TYPE string, + lv_folder TYPE string, + lt_folders TYPE STANDARD TABLE OF string WITH DEFAULT KEY. + + CREATE OBJECT ri_html TYPE zcl_abapgit_html. + + IF iv_path IS INITIAL. + RETURN. + ENDIF. + + lv_jump = |{ zcl_abapgit_gui_page_repo_view=>c_actions-change_dir }?PATH=|. + + ri_html->add( || ). + + IF iv_interactive = abap_true. + SPLIT iv_path AT '/' INTO TABLE lt_folders. + + LOOP AT lt_folders INTO lv_folder. + IF lv_folder IS INITIAL. + " root + lv_path = '/'. + ELSEIF sy-tabix < lines( lt_folders ). + lv_path = lv_path && lv_folder && '/'. + ri_html->add_a( iv_act = lv_jump && lv_path + iv_txt = lv_folder ). + ELSE. + " no link for current folder + ri_html->add( | { lv_folder } | ). + ENDIF. + ri_html->add( '/' ). + ENDLOOP. + ELSE. + ri_html->add( iv_path ). + ENDIF. + + ri_html->add( '' ). + + ENDMETHOD. + + METHOD render_repo_palette. DATA lt_repo_obj_list TYPE zif_abapgit_repo_srv=>ty_repo_list. diff --git a/src/ui/zcl_abapgit_gui_page_repo_view.clas.abap b/src/ui/zcl_abapgit_gui_page_repo_view.clas.abap index 10a5a65e7..76ed2e210 100644 --- a/src/ui/zcl_abapgit_gui_page_repo_view.clas.abap +++ b/src/ui/zcl_abapgit_gui_page_repo_view.clas.abap @@ -350,6 +350,18 @@ CLASS zcl_abapgit_gui_page_repo_view IMPLEMENTATION. REPLACE FIRST OCCURRENCE OF mv_cur_dir IN lv_path WITH ''. lv_encode = zcl_abapgit_html_action_utils=>dir_encode( lv_path ). + " remove leading and trailing / for display + IF lv_path <> '/'. + IF lv_path(1) = '/'. + lv_path = lv_path+1. + ENDIF. + IF substring( val = reverse( lv_path ) + len = 1 ) = '/'. + lv_path = substring( val = lv_path + len = strlen( lv_path ) - 1 ). + ENDIF. + ENDIF. + rv_html = li_html->a( iv_txt = lv_path iv_act = |{ c_actions-change_dir }?{ lv_encode }| ). @@ -812,12 +824,12 @@ CLASS zcl_abapgit_gui_page_repo_view IMPLEMENTATION. " Repo content table ri_html->add( '' ). + ri_html->add( render_order_by( ) ). + IF zcl_abapgit_path=>is_root( mv_cur_dir ) = abap_false. ri_html->add( render_parent_dir( ) ). ENDIF. - ri_html->add( render_order_by( ) ). - LOOP AT lt_repo_items ASSIGNING . IF mv_max_lines > 0 AND sy-tabix > mv_max_lines. lv_max = abap_true. @@ -891,7 +903,9 @@ CLASS zcl_abapgit_gui_page_repo_view IMPLEMENTATION. ri_html->add( '
' ). IF mv_show_folders = abap_true. - ri_html->add( || ). + ri_html->add( '' ). ENDIF. ri_html->add( '' ). ri_html->add( || ). - ri_html->add( || ). + ri_html->add( || ). IF mo_repo->has_remote_source( ) = abap_true. ri_html->add( || ). " Dummy for online ENDIF.
{ mv_cur_dir }' ). + ri_html->add( zcl_abapgit_gui_chunk_lib=>render_path( mv_cur_dir ) ). + ri_html->add( '' ). @@ -1147,7 +1161,7 @@ CLASS zcl_abapgit_gui_page_repo_view IMPLEMENTATION. ri_html->add( '
{ ri_html->icon( 'folder' ) }{ build_dir_jump_link( '..' ) }{ build_dir_jump_link( '..' ) }