Skip to content
This repository has been archived by the owner on Mar 28, 2024. It is now read-only.

Commit

Permalink
feat(zoom feature beta): zoom in and zoom out sheet
Browse files Browse the repository at this point in the history
  • Loading branch information
DR-Univer committed Aug 16, 2020
1 parent 2b6f8ce commit 249aa02
Show file tree
Hide file tree
Showing 19 changed files with 1,788 additions and 1,551 deletions.
2 changes: 2 additions & 0 deletions src/config.js
Original file line number Diff line number Diff line change
Expand Up @@ -52,4 +52,6 @@ export default {
lang: 'en', //language
plugins: [], //plugins, e.g. ['chart']
forceCalculation:false,//强制刷新公式,公式较多会有性能问题,慎用
rowHeaderWidth: 46,
columeHeaderHeight: 20,
}
9 changes: 5 additions & 4 deletions src/controllers/handler.js
Original file line number Diff line number Diff line change
Expand Up @@ -1293,8 +1293,8 @@ export default function luckysheetHandler() {
top = $("#luckysheet-scrollbar-y").scrollTop();
let x = mouse[0];
let y = mouse[1];
let winH = $("#luckysheet-cell-main").height() - 20,
winW = $("#luckysheet-cell-main").width() - 60;
let winH = $("#luckysheet-cell-main").height() - 20*Store.zoomRatio,
winW = $("#luckysheet-cell-main").width() - 60*Store.zoomRatio;

if (y < 0 || y > winH) {
let stop;
Expand All @@ -1315,6 +1315,7 @@ export default function luckysheetHandler() {
else {
sleft = left + (x - winW) / 2;
}

$("#luckysheet-scrollbar-x").scrollLeft(sleft);
}
}
Expand Down Expand Up @@ -2307,7 +2308,7 @@ export default function luckysheetHandler() {
cfg["rowlen"] = {};
}

cfg["rowlen"][Store.luckysheet_rows_change_size_start[1]] = Math.ceil(size);
cfg["rowlen"][Store.luckysheet_rows_change_size_start[1]] = Math.ceil(size/Store.zoomRatio);

if (Store.clearjfundo) {
Store.jfundo = [];
Expand Down Expand Up @@ -2373,7 +2374,7 @@ export default function luckysheetHandler() {
cfg["columnlen"] = {};
}

cfg["columnlen"][Store.luckysheet_cols_change_size_start[1]] = Math.ceil(size);
cfg["columnlen"][Store.luckysheet_cols_change_size_start[1]] = Math.ceil(size/Store.zoomRatio);

if (Store.clearjfundo) {
Store.jfundo = [];
Expand Down
16 changes: 8 additions & 8 deletions src/controllers/menuButton.js
Original file line number Diff line number Diff line change
Expand Up @@ -3154,19 +3154,20 @@ const menuButton = {
Store.clearjfundo = true;
},
borderfix: function(d, r, c){
return [-1, -1, 2, 2];
// return [-1, -1, 2, 2];

let cell = d[r][c];
let bg = null;

if(cell == null){
return [0, 0, 0, 0];
return [-1, 0, 0, -1];
}
else if(d[r][c].bg == null || d[r][c].bg == ""){
return [0, 0, 0, 0];
return [-1, 0, 0, -1];
}
else {
return [-1, -1, 2, 2];
return [-2, -1, 1, 0];
//return [-2, -2, 1, 0];
}
},
menuButtonFocus: function(d, r, c){
Expand Down Expand Up @@ -3341,16 +3342,15 @@ const menuButton = {
}
else if(a == "bg"){
if(foucsStatus == null){
foucsStatus = "#ffffff";
foucsStatus = null;
}
else{
foucsStatus = foucsStatus[a];

if(foucsStatus == null){
foucsStatus = "#ffffff";
foucsStatus = null;
}

if(foucsStatus.toString().indexOf("rgba") > -1){
else if(foucsStatus.toString().indexOf("rgba") > -1){
foucsStatus = rgbTohex(foucsStatus);
}
}
Expand Down
17 changes: 14 additions & 3 deletions src/controllers/sheetmanage.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import { createFilterOptions, labelFilterOptionState } from './filter';
import { selectHightlightShow, selectionCopyShow } from './select';
import Store from '../store';
import locale from '../locale/locale';
import { renderChartShow } from '../expendPlugins/chart/plugin'
import { renderChartShow } from '../expendPlugins/chart/plugin';

const sheetmanage = {
generateRandomSheetIndex: function(prefix) {
Expand Down Expand Up @@ -600,6 +600,8 @@ const sheetmanage = {
Store.luckysheet_selection_range = file["luckysheet_selection_range"] == null ? [] : file["luckysheet_selection_range"];
Store.config = file["config"] == null ? {} : file["config"];

Store.zoomRatio = file["zoomRatio"] == null ? 1 : file["zoomRatio"];

let r2 = Store.luckysheet_select_save[0].row[1],
c2 = Store.luckysheet_select_save[0].column[1];

Expand Down Expand Up @@ -758,6 +760,8 @@ const sheetmanage = {

file["scrollLeft"] = $("#luckysheet-scrollbar-x").scrollLeft();//列标题
file["scrollTop"] = $("#luckysheet-scrollbar-y").scrollTop();//行标题

file["zoomRatio"] = Store.zoomRatio;
},
setSheetParam: function(isload) {
let index = this.getSheetIndex(Store.currentSheetIndex);
Expand Down Expand Up @@ -785,18 +789,25 @@ const sheetmanage = {
luckysheetFreezen.freezenverticaldata = file["freezen"].vertical == null ? null : file["freezen"].vertical.freezenverticaldata;
}

if(file["zoomRatio"]!=null){
Store.zoomRatio = file["zoomRatio"];
}
else{
Store.zoomRatio = 1;
}

createFilterOptions(file["filter_select"], file["filter"]);

Store.scrollRefreshSwitch = false;
if(file["scrollLeft"]!=null && file["scrollLeft"]>0){
$("#luckysheet-scrollbar-x").scrollLeft(file["scrollLeft"]);
$("#luckysheet-scrollbar-x").scrollLeft(file["scrollLeft"]*Store.zoomRatio);
}
else{
$("#luckysheet-scrollbar-x").scrollLeft(0);
}

if(file["scrollTop"]!=null && file["scrollTop"]>0){
$("#luckysheet-scrollbar-y").scrollTop(file["scrollTop"]);
$("#luckysheet-scrollbar-y").scrollTop(file["scrollTop"]*Store.zoomRatio);
}
else{
$("#luckysheet-scrollbar-y").scrollTop(0);
Expand Down
50 changes: 41 additions & 9 deletions src/controllers/updateCell.js
Original file line number Diff line number Diff line change
Expand Up @@ -34,14 +34,22 @@ export function luckysheetupdateCell(row_index1, col_index1, d, cover, isnotfocu
}

let input_postition = {
"min-width": col - col_pre + 1 - 8,
"min-height": row - row_pre + 1 - 4,
"max-width": winW + scrollLeft - col_pre - 20 - Store.rowHeaderWidth,
"min-width": col - col_pre+ 1- 8,
"min-height": row - row_pre + 1- 4,

"max-width":winW + scrollLeft - col_pre - 20 - Store.rowHeaderWidth,
"max-height": winH + scrollTop - row_pre - 20 - 15 - Store.toolbarHeight - Store.infobarHeight - Store.calculatebarHeight - Store.sheetBarHeight - Store.statisticBarHeight,
"left": col_pre + container_offset.left + Store.rowHeaderWidth - scrollLeft - 2,
"top": row_pre + container_offset.top + Store.infobarHeight + Store.toolbarHeight + Store.calculatebarHeight + Store.columeHeaderHeight - scrollTop - 2,
}

let inputContentScale = {
"transform":"scale("+ Store.zoomRatio +")",
"transform-origin":"left top",
"width":(100 / Store.zoomRatio) + "%",
"height":(100 / Store.zoomRatio) + "%",
}

Store.luckysheetCellUpdate = [row_index, col_index];
if (!isnotfocus) {
$("#luckysheet-rich-text-editor").focus().select();
Expand Down Expand Up @@ -69,28 +77,51 @@ export function luckysheetupdateCell(row_index1, col_index1, d, cover, isnotfocu
if (d[row_index] != null && d[row_index][col_index] != null) {
let cell = d[row_index][col_index];
let htValue = cell["ht"];
let leftOrigin = "left", topOrigin = "top";
if(htValue == "0"){//0 center, 1 left, 2 right
input_postition = {
"min-width": col - col_pre + 1 - 8,
"min-height": row - row_pre + 1 - 4,
"min-width": col - col_pre + 1- 8,
"min-height": row - row_pre + 1- 4,
// "transform":"scale("+ Store.zoomRatio +")",
// "transform-origin":"center top",
"max-width": winW*2/3,
"max-height": winH + scrollTop - row_pre - 20 - 15 - Store.toolbarHeight - Store.infobarHeight - Store.calculatebarHeight - Store.sheetBarHeight - Store.statisticBarHeight,
"left": col_pre + container_offset.left + Store.rowHeaderWidth - scrollLeft - 2,
"top": row_pre + container_offset.top + Store.infobarHeight + Store.toolbarHeight + Store.calculatebarHeight + Store.columeHeaderHeight - scrollTop - 2,
}

if(Store.zoomRatio<1){
leftOrigin = "center";
}

isCenter = true;
}
else if(htValue == "2"){
input_postition = {
"min-width": col - col_pre + 1 - 8,
"min-height": row - row_pre + 1 - 4,
"max-width": col + container_offset.left - scrollLeft - 8,
"min-width": col - col_pre+ 1- 8,
"min-height": row - row_pre + 1- 4,
// "transform":"scale("+ Store.zoomRatio +")",
// "transform-origin":"right top",
"max-width": col + container_offset.left - scrollLeft - 8,
"max-height": winH + scrollTop - row_pre - 20 - 15 - Store.toolbarHeight - Store.infobarHeight - Store.calculatebarHeight - Store.sheetBarHeight - Store.statisticBarHeight,
"right": winW - (container_offset.left + Store.rowHeaderWidth - scrollLeft) - col,
"right": winW - (container_offset.left + (Store.rowHeaderWidth-1) - scrollLeft) - col,
"top": row_pre + container_offset.top + Store.infobarHeight + Store.toolbarHeight + Store.calculatebarHeight + Store.columeHeaderHeight - scrollTop - 2,
}

if(Store.zoomRatio<1){
leftOrigin = "right";
}
}

if(cell["vt"]=="0"){
topOrigin = "center";
}
else if(cell["vt"]=="2"){
topOrigin = "bottom";
}

inputContentScale["transform-origin"] = leftOrigin +" " + topOrigin;


if (!cover) {
if(cell.f!=null){
Expand Down Expand Up @@ -164,6 +195,7 @@ export function luckysheetupdateCell(row_index1, col_index1, d, cover, isnotfocu
}

$("#luckysheet-input-box").css(input_postition);
$("#luckysheet-rich-text-editor").css(inputContentScale);

formula.rangetosheet = Store.currentSheetIndex;
formula.createRangeHightlight();
Expand Down
19 changes: 19 additions & 0 deletions src/controllers/zoom.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import Store from '../store';
import locale from '../locale/locale';
import { replaceHtml } from '../utils/util';
import rhchInit from '../global/rhchInit';
import luckysheetConfigsetting from './luckysheetConfigsetting';


export function zoomInitial(){
//zoom
Store.rowHeaderWidth = luckysheetConfigsetting.rowHeaderWidth * Store.zoomRatio;
Store.columeHeaderHeight = luckysheetConfigsetting.columeHeaderHeight *Store.zoomRatio;
$("#luckysheet-rows-h").width((Store.rowHeaderWidth-1.5));
$("#luckysheet-cols-h-c").height((Store.columeHeaderHeight-1.5));
$("#luckysheet-left-top").css({width:Store.rowHeaderWidth-1.5, height:Store.columeHeaderHeight-1.5});
}

export function zoomChange(){

}
3 changes: 3 additions & 0 deletions src/core.js
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,9 @@ luckysheet.create = function (setting) {
luckysheetConfigsetting.forceCalculation = extendsetting.forceCalculation;
luckysheetConfigsetting.plugins = extendsetting.plugins;

luckysheetConfigsetting.rowHeaderWidth = extendsetting.rowHeaderWidth;
luckysheetConfigsetting.columeHeaderHeight = extendsetting.columeHeaderHeight;

// Register plugins
initPlugins(extendsetting.plugins , extendsetting.data);

Expand Down
Loading

0 comments on commit 249aa02

Please sign in to comment.