diff --git a/lib/zin/wg/tree/v1.php b/lib/zin/wg/tree/v1.php index c6388af1fa..695b4284cd 100644 --- a/lib/zin/wg/tree/v1.php +++ b/lib/zin/wg/tree/v1.php @@ -12,7 +12,7 @@ class tree extends wg protected function build() { $this->setProp('items', $this->buildTree($this->prop('items'))); - return zui::tree(set($this->props->pick(array('items', 'activeClass', 'activeIcon', 'activeKey', 'onClickItem', 'defaultNestedShow', 'changeActiveKey', 'isDropdownMenu')))); + return zui::tree(set($this->props->pick(array('items', 'activeClass', 'activeIcon', 'activeKey', 'onClickItem', 'defaultNestedShow', 'changeActiveKey', 'isDropdownMenu', 'collapsedIcon', 'expandedIcon', 'normalIcon', 'id')))); } private function buildTree(array $items): array @@ -20,7 +20,7 @@ class tree extends wg foreach($items as $key => $item) { $item = (array)$item; - $treeItem = array('text' => $item['name'], 'url' => $item['url']); + $treeItem = array('text' => $item['name'], 'url' => $item['url'], 'id' => $item['id'], 'key' => $item['key']); if(isset($item['items'])) $treeItem['items'] = $this->buildTree($item['items']); $items[$key] = $treeItem; diff --git a/module/repo/control.php b/module/repo/control.php index ed06ff7edd..2d20538a8d 100644 --- a/module/repo/control.php +++ b/module/repo/control.php @@ -393,6 +393,7 @@ class repo extends control $this->view->file = $file; $this->view->entry = $entry; $this->view->pathInfo = $pathInfo; + $this->display(); } @@ -423,7 +424,7 @@ class repo extends control $this->commonAction($repoID, $objectID); $repo = $this->repo->getRepoByID($repoID); - if($browser['name'] != 'ie' and $repo->SCM == 'Gitlab') return print($this->fetch('repo', 'monaco', "repoID=$repoID&objectID=$objectID&entry=$entry&revision=$revision&showBug=$showBug&encoding=$encoding")); + if($browser['name'] != 'ie') return print($this->fetch('repo', 'monaco', "repoID=$repoID&objectID=$objectID&entry=$entry&revision=$revision&showBug=$showBug&encoding=$encoding")); if($_POST) { @@ -612,7 +613,6 @@ class repo extends control foreach($infos as $info) { $infoPath = trim(urldecode($path) . '/' . $info->name, '/'); - $info->comment = htmlSpecialString($info->comment, ENT_QUOTES); $info->revision = $repo->SCM == 'Subversion' ? $info->revision : substr($info->revision, 0, 10); if($info->kind == 'dir') { diff --git a/module/repo/css/browse.ui.css b/module/repo/css/browse.ui.css index 667bcb60d9..babb73449a 100644 --- a/module/repo/css/browse.ui.css +++ b/module/repo/css/browse.ui.css @@ -2,4 +2,4 @@ .repo-select{margin-left: 1rem; margin-right: 10px;} .repo-comment{width: 100%; display: block; word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .dtable-cell-html{width: 100%;} -.sidebar{width: 550px!important;} \ No newline at end of file +.container .sidebar{width: 550px;} \ No newline at end of file diff --git a/module/repo/js/common.ui.js b/module/repo/js/common.ui.js new file mode 100644 index 0000000000..95bb17f88c --- /dev/null +++ b/module/repo/js/common.ui.js @@ -0,0 +1,4 @@ +window.onMouseDown = function(e) +{ + console.log(12321312,e); +} diff --git a/module/repo/js/monaco.ui.js b/module/repo/js/monaco.ui.js new file mode 100644 index 0000000000..2054b207c2 --- /dev/null +++ b/module/repo/js/monaco.ui.js @@ -0,0 +1,171 @@ +var iframeHeight = 0; +var sidebarHeight = 0; +var tabTemp; +var parentTree = []; + +/* Close tab. */ +$('#monacoTabs').on('click', '.monaco-close', function() +{ + var eleId = $(this).parent().attr('href'); + if($(this).parent().hasClass('active')) $(this).parent().parent().parent().children().first().find('a').trigger('click'); + $(this).parent().parent().remove(); + $(eleId).remove(); + $('#' + eleId.substring(5)).parent().removeClass('selected'); +}); + +window.afterPageUpdate = function() +{ + setTimeout(function() + { + /* Resize moaco height. */ + $('#monacoTree').css('height', getSidebarHeight() - 8 + 'px'); + /* Init tab template. */ + if(!tabTemp) tabTemp = $('#monacoTabs ul li').first().clone(); + + /* Load default tab content. */ + var height = getIframeHeight(); + $('#tab-' + file).html("") + + /* Select default tree item. */ + const currentElement = findItemInTreeItems(tree, file, 0); + $('#' + currentElement.id).parent().addClass('selected'); + expandTree(); + }, 100); +}; + + +/** + * Open new tab when click tree item. + * + * @access public + * @return void + */ +window.treeClick = function(info) +{ + if (info.item.items && info.item.items.length > 0) return; + $('#' + info.item.id).parent().addClass('selected'); + openTab(info.item.key, info.item.text); +} + +/** + * Open new tab. + * + * @access public + * @return void + */ +function openTab(entry, name) +{ + var eleId = 'tab-' + entry.replace(/=/g, '-'); + var element = document.getElementById(eleId); + if (element) + { + $("a[href='" + '#' + eleId + "']").trigger('click'); + return; + } + + var newTab = tabTemp.clone(); + newTab.find('a').attr('href', '#' + eleId); + newTab.find('span').text(name); + $('#monacoTabs .nav-tabs').append(newTab); + + var height = getIframeHeight(); + $('#monacoTabs .tab-content').append("
") + + setTimeout(() => { + $("a[href='" + '#' + eleId + "']").trigger('click'); + }, 100); +} + +/** + * Find parent nodes and item id of selected tree item. + * + * @access public + * @return string + */ +function findItemInTreeItems(list, key, level) { + for (const item of list) { + if(level === 0) + { + parentTree = [item.key]; + } + else + { + parentTree.push(item.key); + } + + if (item.key === key) return item; + + if (item.items && item.items.length > 0) + { + const findedItem = findItemInTreeItems(item.items, key); + if (findedItem) return findedItem; + } + } +} + +/** + * Expand tree node. + * + * @access public + * @return void + */ +function expandTree() +{ + const treeObj = $('#monacoTree').parent().data('zui.Tree'); + + for (const key of parentTree) + { + treeObj.$.expand(key); + } +} + +/** + * Get tab-content height. + * + * @access public + * @return void + */ +function getIframeHeight() +{ + if(iframeHeight) return iframeHeight; + + var windowHeight = $(window).height(); + var headerHeight = parseInt($('#header').height()); + var mainNavbar = parseInt($('#mainNavbar').height()); + var tabsbar = parseInt($('.nav-tabs').height()); + var mainMenuHeight = parseInt($('#mainMenu').css('padding-top')) + parseInt($('#mainMenu').css('padding-bottom')); + var appTabsHeight = parseInt($('#appTabs').height()); + var appsBarHeight = parseInt($('#appsBar').height()); + appsBarHeight = appsBarHeight ? appsBarHeight : 0; + appTabsHeight = appTabsHeight ? appTabsHeight : 0; + mainMenuHeight = mainMenuHeight ? mainMenuHeight : 0; + mainNavbar = mainNavbar ? mainNavbar : 0; + iframeHeight = windowHeight - headerHeight - appsBarHeight - appTabsHeight - mainMenuHeight - mainNavbar - tabsbar; + + return iframeHeight; +} + +/** + * Get sidebar height. + * + * @access public + * @return void + */ +function getSidebarHeight() +{ + if(sidebarHeight) return sidebarHeight; + + var windowHeight = $(window).height(); + var headerHeight = parseInt($('#header').height()); + var mainNavbar = parseInt($('#mainNavbar').height()); + var mainMenuHeight = parseInt($('#mainMenu').css('padding-top')) + parseInt($('#mainMenu').css('padding-bottom')); + var appTabsHeight = parseInt($('#appTabs').height()); + var appsBarHeight = parseInt($('#appsBar').height()); + appsBarHeight = appsBarHeight ? appsBarHeight : 0; + appTabsHeight = appTabsHeight ? appTabsHeight : 0; + mainMenuHeight = mainMenuHeight ? mainMenuHeight : 0; + mainNavbar = mainNavbar ? mainNavbar : 0; + sidebarHeight = windowHeight - headerHeight - appsBarHeight - appTabsHeight - mainMenuHeight - mainNavbar; + + return sidebarHeight; +} diff --git a/module/repo/model.php b/module/repo/model.php index 926ddfa046..140766d5c1 100644 --- a/module/repo/model.php +++ b/module/repo/model.php @@ -2552,7 +2552,7 @@ class repoModel extends model { $files = array(); $id = 0; - foreach($allFiles as $key => $file) + foreach($allFiles as $file) { $fileName = explode('/', $file); $parent = ''; @@ -2567,36 +2567,18 @@ class repoModel extends model $id++; $files[$parent] = array( - 'id' => $id, + 'id' => str_replace('=', '-', base64_encode(urlencode($parent))), 'parent' => $parentID, 'name' => $path, 'path' => $parent, - 'key' => $key, + 'key' => base64_encode(urlencode($parent)), ); } } } sort($files); - $fileTree = $this->buildTree($files); - $html = ''; - - return $html; + return $this->buildTree($files); } /** @@ -2627,7 +2609,7 @@ class repoModel extends model if($children) { - $treeList[$key]['children'] = $children; + $treeList[$key]['items'] = $children; $fileName[$key] = ''; $pathName[$key] = $file['path']; } diff --git a/module/repo/ui/monaco.html.php b/module/repo/ui/monaco.html.php new file mode 100644 index 0000000000..21884fab35 --- /dev/null +++ b/module/repo/ui/monaco.html.php @@ -0,0 +1,69 @@ + + * @package repo + * @link http://www.zentao.net + */ + +namespace zin; + +$tree = $this->repo->getFileTree($repo); + +jsVar('isonlybody', isonlybody()); +jsVar('entry', $entry); +jsVar('repoID', $repoID); +jsVar('repo', $repo); +jsVar('revision', $revision); +jsVar('branchID', $branchID); +jsVar('file', $file); +jsVar('tree', $tree); +jsVar('openedFiles', array($entry)); +jsVar('urlParams', "repoID=$repoID&objectID=$objectID&entry=%s&revision=$revision&showBug=$showBug&encoding=$encoding"); + +featureBar(); +div( + set::id('fileTabs'), + tabs + ( + set::id('monacoTabs'), + tabPane + ( + set::title($pathInfo['basename']), + set::active(true), + set::key('tab-' . str_replace('=', '-', $file)), + set('data-prevent', false), + to::suffix + ( + icon + ( + 'close', + set::class('monaco-close'), + ) + ), + tableData + ( + div(set::id('tab-' . $file)) + ) + ), + ) +); + +sidebar +( + set::side('left'), + tree + ( + set::id('monacoTree'), + set::items($tree), + set::collapsedIcon('folder'), + set::expandedIcon('folder-open'), + set::normalIcon('file-text-alt'), + set::activeKey($entry), + set::onClickItem(jsRaw('window.treeClick')), + ) +);