deadcxap/liberama
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Поправки для планшета

Browse Source
This commit is contained in:
Book Pauk
2019-01-18 00:16:51 +07:00
parent 7d5af52d53
commit bea5e9cf37
1 changed files with 24 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
client/components/Reader/TextPage/TextPage.vue
View File

@@ -36,7 +36,7 @@ class TextPage extends Vue {
this.debouncedEmitPosChange = _.debounce((newValue) => { this.debouncedEmitPosChange = _.debounce((newValue) => {
this.$emit('book-pos-changed', {bookPos: newValue}); this.$emit('book-pos-changed', {bookPos: newValue});
}, 100); }, 1000);
this.$root.$on('resize', () => {this.$nextTick(this.onResize)}); this.$root.$on('resize', () => {this.$nextTick(this.onResize)});
} }
@@ -47,12 +47,24 @@ class TextPage extends Vue {
} }
async calcDrawProps() { async calcDrawProps() {
this.canvas.width = this.$refs.main.clientWidth; this.realWidth = this.$refs.main.clientWidth;
this.canvas.height = this.$refs.main.clientHeight; this.realHeight = this.$refs.main.clientHeight;
if (window.devicePixelRatio) {
this.canvas.width = this.realWidth*window.devicePixelRatio;
this.canvas.height = this.realHeight*window.devicePixelRatio;
this.canvas.style.width = this.$refs.main.clientWidth + 'px';
this.canvas.style.height = this.$refs.main.clientHeight + 'px';
this.context.scale(window.devicePixelRatio, window.devicePixelRatio);
} else {
this.canvas.width = this.realWidth;
this.canvas.height = this.realHeight;
}
this.lineHeight = this.fontSize + this.lineInterval; this.lineHeight = this.fontSize + this.lineInterval;
this.pageLineCount = Math.floor(this.canvas.height/this.lineHeight); this.pageLineCount = Math.floor(this.canvas.height/this.lineHeight);
this.w = this.canvas.width - 2*this.indent; this.w = this.realWidth - 2*this.indent;
this.h = this.canvas.height; this.h = this.realHeight;
this.context.textAlign = 'left'; this.context.textAlign = 'left';
this.context.textBaseline = 'bottom'; this.context.textBaseline = 'bottom';
@@ -98,12 +110,12 @@ class TextPage extends Vue {
this.textColor = 'black'; this.textColor = 'black';
this.backgroundColor = '#478355'; this.backgroundColor = '#478355';
this.fontStyle = '';// 'bold','italic' this.fontStyle = '';// 'bold','italic'
this.fontSize = 40;// px this.fontSize = 33;// px
this.fontName = 'Arial'; this.fontName = 'Arial';
this.lineInterval = 15;// px, межстрочный интервал this.lineInterval = 10;// px, межстрочный интервал
this.textAlignJustify = true;// выравнивание по ширине this.textAlignJustify = true;// выравнивание по ширине
this.p = 60;// px, отступ параграфа this.p = 50;// px, отступ параграфа
this.indent = 20;// px, отступ всего текста слева и справа this.indent = 10;// px, отступ всего текста слева и справа
this.wordWrap = true; this.wordWrap = true;
this.calcDrawProps(); this.calcDrawProps();
@@ -327,8 +339,8 @@ class TextPage extends Vue {
100: {30: 'PgUp', 100: 'PgDown'} 100: {30: 'PgUp', 100: 'PgDown'}
}; };
const w = event.clientX/this.canvas.width*100; const w = event.clientX/this.realWidth*100;
const h = event.clientY/this.canvas.height*100; const h = event.clientY/this.realHeight*100;
let action = ''; let action = '';
loops: { loops: {