BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit bfe193d3 by Jacob Schatz
Options

Adds editor buttons

parent 95a850ca
Showing with 109 additions and 78 deletions
app/assets/javascripts/repo/repo_bundle.js
import Tabs from './repo_tabs'
import Sidebar from './repo_sidebar'
import Editor from './repo_editor'
import FileButtons from './repo_file_buttons'
import BinaryViewer from './repo_binary_viewer'
import ViewToggler from './repo_view_toggler'
import Service from './repo_service'
......@@ -15,6 +16,7 @@ export default class RepoBundle {
Store.tabs = new Tabs();
Store.sidebar = new Sidebar(url);
Store.editor = new Editor();
Store.buttons = new FileButtons();
// Store.toggler = new ViewToggler();
Store.binaryViewer = new BinaryViewer();
Helper.getContent();
......
app/assets/javascripts/repo/repo_editor.js
......@@ -16,7 +16,8 @@ export default class RepoEditor {
.create(
document.getElementById('ide'), {
model: null,
readOnly: true
readOnly: true,
contextmenu: false,
}
)
Helper.monacoInstance = monaco;
......
app/assets/javascripts/repo/repo_file_buttons.js 0 → 100644
import Vue from 'vue'
import Store from './repo_store'
import Helper from './repo_helper'
export default class RepoSidebar {
constructor(url) {
this.url = url;
this.initVue();
this.el = document.getElementById('repo-file-buttons');
}
initVue() {
this.vue = new Vue({
el: '#repo-file-buttons',
data: () => Store,
template: `
<div id='repo-file-buttons'>
<a :href='rawFileURL' target='_blank' class='btn btn-default'>Download file</a>
<div class="btn-group" role="group" aria-label="File actions">
<a :href='blameFileUrl' class='btn btn-default'>Blame</a>
<a :href='historyFileUrl' class='btn btn-default'>History</a>
<a href='#' class='btn btn-default'>Permalink</a>
<a href='#' class='btn btn-default'>Lock</a>
</div>
<a href='#' v-if='canPreview' class='btn btn-default'>{{previewLabel}}</a>
<a href='#' class='btn btn-danger'>Delete</a>
</div>
`,
computed: {
previewLabel() {
return this.activeFile.raw ? 'Preview' : 'Raw'
},
canPreview() {
return this.activeFile.extension === 'md';
},
rawFileURL() {
console.log(this.activeFile)
return Helper.getRawURLFromBlobURL(this.activeFile.url);
},
blameFileUrl() {
return Helper.getBlameURLFromBlobURL(this.activeFile.url);
},
historyFileUrl() {
return Helper.getHistoryURLFromBlobURL(this.activeFile.url);
}
},
methods: {
setRawPreviewMode() {
}
}
});
}
}
\ No newline at end of file
app/assets/javascripts/repo/repo_helper.js
......@@ -117,6 +117,14 @@ let RepoHelper = {
return url.replace('blob', 'raw');
},
getBlameURLFromBlobURL(url) {
return url.replace('blob', 'blame');
},
getHistoryURLFromBlobURL(url) {
return url.replace('blob', 'commits');
},
setBinaryDataAsBase64(url, file) {
Service.getBase64Content(url)
.then((response) => {
......@@ -156,6 +164,7 @@ let RepoHelper = {
// may be tree or file.
getContent(file) {
console.log('file')
const loadingData = this.setLoading(true);
Service.getContent()
.then((response) => {
......@@ -176,11 +185,19 @@ let RepoHelper = {
data
);
data.binary = true;
console.log('file1', file)
if(!file.url) {
file.url = location.pathname;
}
data.url = file.url;
this.addToOpenedFiles(data);
this.setActiveFile(data);
} else {
Store.blobRaw = data.plain;
console.log('file2', file)
if(!file.url) {
file.url = location.pathname;
}
data.url = file.url;
data.binary = false;
this.addToOpenedFiles(data);
......
app/assets/javascripts/repo/repo_store.js
......@@ -10,7 +10,17 @@ let RepoStore = {
blobRaw: '',
blobRendered: '',
openedFiles: [],
activeFile: {},
activeFile: {
active: true,
binary: false,
extension: '',
html: '',
mime_type: '',
name: 'loading...',
plain: '',
size: 0,
url: ''
},
files: [],
binary: false,
binaryMimeType: '',
......
app/assets/stylesheets/pages/repo.scss
......@@ -27,12 +27,17 @@ header {
.panel-right{
display: inline-block;
width: 85%;
.monaco-editor.vs .cursor {
background: rgba(255,255,255,0);
border-color: rgba(255,255,255,0);
}
#tabs {
height: 41px;
border-bottom: 1px solid #f0f0f0;
border-bottom: 1px solid $white-normal;
padding-left: 0;
margin-bottom: 0;
background: $gray-light;
display: inline-block;
white-space: nowrap;
width: 100%;
......@@ -65,13 +70,19 @@ header {
}
#ide {
height: 70vh;
}
#repo-file-buttons {
background: $gray-light;
padding: 5px;
margin-top: -5px;
border-bottom: 1px solid $white-normal;
}
#binary-viewer {
height: 70vh;
overflow: auto;
margin-top: -5px;
margin-top: 5px;
margin-left: 10px;
.blob-viewer {
......
app/assets/stylesheets/pages/tree.scss
......@@ -132,7 +132,6 @@
}
.tree-ref-holder {
float: left;
margin-right: 15px;
}
......
app/views/projects/tree/_tree_content.html.haml
......@@ -18,6 +18,7 @@
.panel-right>
%ul#tabs{"v-if" => "isMini", ":style" => "{height: 41 + scrollWidth + 'px'}", "v-cloak" => "1"}
%li{ is: "repo-tab", "v-for" => "tab in openedFiles", ":key" => "tab.id", ":tab" => "tab", ":class" => "{'active' : tab.active}" }
#repo-file-buttons
#ide{ data: { url: repo_url } }
#binary-viewer{ "v-if" => "binary" }
%img{"v-if" => "binaryTypes.png", ":src" => "pngBlobWithDataURI"}
......
app/views/projects/tree/_tree_header.html.haml
.tree-controls
%a.btn.btn-default.editable-mode{href='#'}
Edit mode
= render 'projects/find_file_link'
= link_to s_('Commits|History'), namespace_project_commits_path(@project.namespace, @project, @id), class: 'btn btn-grouped'
= render 'projects/buttons/download', project: @project, ref: @ref
.tree-ref-holder
= render 'shared/ref_switcher', destination: 'tree', path: @path
%ul.breadcrumb.repo-breadcrumb
%li
= link_to namespace_project_tree_path(@project.namespace, @project, @ref) do
= @project.path
- path_breadcrumbs do |title, path|
%li
= link_to truncate(title, length: 40), namespace_project_tree_path(@project.namespace, @project, tree_join(@ref, path))
- if current_user
%li
- if !on_top_of_branch?
%span.btn.add-to-tree.disabled.has-tooltip{ title: _("You can only add files when you are on a branch"), data: { container: 'body' } }
= icon('plus')
- else
%span.dropdown
%a.dropdown-toggle.btn.add-to-tree{ href: '#', "data-toggle" => "dropdown" }
= icon('plus')
%ul.dropdown-menu
- if can_edit_tree?
%li
= link_to namespace_project_new_blob_path(@project.namespace, @project, @id) do
= icon('pencil fw')
#{ _('New file') }
%li
= link_to '#modal-upload-blob', { 'data-target' => '#modal-upload-blob', 'data-toggle' => 'modal' } do
= icon('file fw')
#{ _('Upload file') }
%li
= link_to '#modal-create-new-dir', { 'data-target' => '#modal-create-new-dir', 'data-toggle' => 'modal' } do
= icon('folder fw')
#{ _('New directory') }
- elsif can?(current_user, :fork_project, @project)
%li
- continue_params = { to: namespace_project_new_blob_path(@project.namespace, @project, @id),
notice: edit_in_new_fork_notice,
notice_now: edit_in_new_fork_notice_now }
- fork_path = namespace_project_forks_path(@project.namespace, @project, namespace_key: current_user.namespace.id,
continue: continue_params)
= link_to fork_path, method: :post do
= icon('pencil fw')
#{ _('New file') }
%li
- continue_params = { to: request.fullpath,
notice: edit_in_new_fork_notice + " Try to upload a file again.",
notice_now: edit_in_new_fork_notice_now }
- fork_path = namespace_project_forks_path(@project.namespace, @project, namespace_key: current_user.namespace.id,
continue: continue_params)
= link_to fork_path, method: :post do
= icon('file fw')
#{ _('Upload file') }
%li
- continue_params = { to: request.fullpath,
notice: edit_in_new_fork_notice + " Try to create a new directory again.",
notice_now: edit_in_new_fork_notice_now }
- fork_path = namespace_project_forks_path(@project.namespace, @project, namespace_key: current_user.namespace.id,
continue: continue_params)
= link_to fork_path, method: :post do
= icon('folder fw')
#{ _('New directory') }
%li.divider
%li
= link_to new_namespace_project_branch_path(@project.namespace, @project) do
= icon('code-fork fw')
#{ _('New branch') }
%li
= link_to new_namespace_project_tag_path(@project.namespace, @project) do
= icon('tags fw')
#{ _('New tag') }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment