Commit f64a7c47 authored by Luke "Jared" Bennett's avatar Luke "Jared" Bennett

Remove repo_binary_viewer as it is no longer needed

parent ec93e17a
...@@ -3,7 +3,6 @@ import RepoSidebar from './repo_sidebar.vue'; ...@@ -3,7 +3,6 @@ import RepoSidebar from './repo_sidebar.vue';
import RepoCommitSection from './repo_commit_section.vue'; import RepoCommitSection from './repo_commit_section.vue';
import RepoTabs from './repo_tabs.vue'; import RepoTabs from './repo_tabs.vue';
import RepoFileButtons from './repo_file_buttons.vue'; import RepoFileButtons from './repo_file_buttons.vue';
import RepoBinaryViewer from './repo_binary_viewer.vue';
import RepoPreview from './repo_preview.vue'; import RepoPreview from './repo_preview.vue';
import RepoMixin from '../mixins/repo_mixin'; import RepoMixin from '../mixins/repo_mixin';
import PopupDialog from '../../vue_shared/components/popup_dialog.vue'; import PopupDialog from '../../vue_shared/components/popup_dialog.vue';
...@@ -18,7 +17,6 @@ export default { ...@@ -18,7 +17,6 @@ export default {
'repo-sidebar': RepoSidebar, 'repo-sidebar': RepoSidebar,
'repo-tabs': RepoTabs, 'repo-tabs': RepoTabs,
'repo-file-buttons': RepoFileButtons, 'repo-file-buttons': RepoFileButtons,
'repo-binary-viewer': RepoBinaryViewer,
'repo-editor': MonacoLoaderHelper.repoEditorLoader, 'repo-editor': MonacoLoaderHelper.repoEditorLoader,
'repo-commit-section': RepoCommitSection, 'repo-commit-section': RepoCommitSection,
'popup-dialog': PopupDialog, 'popup-dialog': PopupDialog,
...@@ -50,7 +48,6 @@ export default { ...@@ -50,7 +48,6 @@ export default {
<repo-tabs/> <repo-tabs/>
<component :is="currentBlobView" class="blob-viewer-container"></component> <component :is="currentBlobView" class="blob-viewer-container"></component>
<repo-file-buttons/> <repo-file-buttons/>
<!-- <repo-binary-viewer/> soon™ -->
</div> </div>
<repo-commit-section/> <repo-commit-section/>
<popup-dialog <popup-dialog
......
<script>
import Store from '../stores/repo_store';
import Helper from '../helpers/repo_helper';
const RepoBinaryViewer = {
data: () => Store,
computed: {
pngBlobWithDataURI() {
if (this.binaryTypes.png) {
return `data:image/png;base64,${this.blobRaw}`;
}
return '';
},
svgBlobWithDataURI() {
if (this.binaryTypes.svg) {
return `data:image/svg+xml;utf8,${this.blobRaw}`;
}
return '';
},
},
methods: {
errored() {
Store.binaryLoaded = false;
},
loaded() {
Store.binaryLoaded = true;
},
getBinaryType() {
if (Object.hasOwnProperty.call(this.binaryTypes, this.activeFile.extension)) {
return this.activeFile.extension;
}
return 'unknown';
},
},
watch: {
blobRaw() {
Store.resetBinaryTypes();
if (Helper.isKindaBinary()) {
this.activeFile.raw = false;
// counts as binaryish so we use the binary viewer in this case.
this.binary = true;
}
if (!this.binary) return;
this.binaryTypes[this.getBinaryType()] = true;
},
},
};
export default RepoBinaryViewer;
</script>
<template>
<div id="binary-viewer" v-if="binary && !activeFile.raw">
<img v-show="binaryTypes.png && binaryLoaded" @error="errored" @load="loaded" :src="pngBlobWithDataURI" :alt="activeFile.name"/>
<img v-show="binaryTypes.svg" @error="errored" @load="loaded" :src="svgBlobWithDataURI" :alt="activeFile.name"/>
<div v-if="binaryTypes.md" v-html="activeFile.html"></div>
<div class="binary-unknown" v-if="binaryTypes.unknown">
<span>Binary file. No preview available.</span>
</div>
</div>
</template>
import Vue from 'vue';
import Store from '~/repo/stores/repo_store';
import repoBinaryViewer from '~/repo/components/repo_binary_viewer.vue';
describe('RepoBinaryViewer', () => {
function createComponent() {
const RepoBinaryViewer = Vue.extend(repoBinaryViewer);
return new RepoBinaryViewer().$mount();
}
function createActiveFile(type, activeFile = {}) {
const file = activeFile;
switch (type) {
case 'svg':
case 'png':
file.name = 'name';
break;
case 'md':
file.html = 'html';
break;
default:
break;
}
return file;
}
function setActiveBinary(type) {
const binaryTypes = {};
binaryTypes[type] = true;
const activeFile = createActiveFile(type);
const uri = 'uri';
Store.binary = true;
Store.binaryTypes = binaryTypes;
Store.activeFile = activeFile;
Store.pngBlobWithDataURI = uri;
return {
activeFile,
uri,
};
}
function assertBinaryImg(img, activeFile, uri) {
expect(img.src).toMatch(`/${uri}`);
expect(img.alt).toEqual(activeFile.name);
}
it('renders an img if its png', () => {
const { activeFile, uri } = setActiveBinary('png');
const vm = createComponent();
const img = vm.$el.querySelector(':scope > img');
assertBinaryImg(img, activeFile, uri);
});
it('renders an img if its svg', () => {
const { activeFile, uri } = setActiveBinary('svg');
const vm = createComponent();
const img = vm.$el.querySelector(':scope > img');
assertBinaryImg(img, activeFile, uri);
});
it('renders an div with content if its markdown', () => {
const { activeFile } = setActiveBinary('md');
const vm = createComponent();
expect(vm.$el.querySelector(':scope > div').innerHTML).toEqual(activeFile.html);
});
it('renders no preview message if its unknown', () => {
setActiveBinary('unknown');
const vm = createComponent();
expect(vm.$el.querySelector('.binary-unknown').textContent).toMatch('Binary file. No preview available.');
});
it('does not render if no binary', () => {
Store.binary = false;
const vm = createComponent();
expect(vm.$el.innerHTML).toBeFalsy();
});
});
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