mirror of
https://github.com/zadam/trilium.git
synced 2025-06-06 18:08:33 +02:00
zoom icons
This commit is contained in:
parent
93d152eae5
commit
31abec5d1c
BIN
src/public/images/icons/zoom-in-24.png
Normal file
BIN
src/public/images/icons/zoom-in-24.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 455 B |
BIN
src/public/images/icons/zoom-out-24.png
Normal file
BIN
src/public/images/icons/zoom-out-24.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 455 B |
@ -6,6 +6,8 @@ import libraryLoader from "./library_loader.js";
|
|||||||
const $noteDetailRelationMap = $("#note-detail-relation-map");
|
const $noteDetailRelationMap = $("#note-detail-relation-map");
|
||||||
const $relationMapCanvas = $("#relation-map-canvas");
|
const $relationMapCanvas = $("#relation-map-canvas");
|
||||||
const $addChildNotesButton = $("#relation-map-add-child-notes");
|
const $addChildNotesButton = $("#relation-map-add-child-notes");
|
||||||
|
const $zoomInButton = $("#relation-map-zoom-in");
|
||||||
|
const $zoomOutButton = $("#relation-map-zoom-out");
|
||||||
|
|
||||||
let mapData;
|
let mapData;
|
||||||
let instance;
|
let instance;
|
||||||
@ -87,25 +89,10 @@ async function loadNotesAndRelations() {
|
|||||||
mapData.notes = mapData.notes.filter(note => note.id in data.noteTitles);
|
mapData.notes = mapData.notes.filter(note => note.id in data.noteTitles);
|
||||||
|
|
||||||
instance.batch(async function () {
|
instance.batch(async function () {
|
||||||
const maxY = mapData.notes.filter(note => !!note.y).map(note => note.y).reduce((a, b) => Math.max(a, b), 0);
|
|
||||||
let curX = 100;
|
|
||||||
let curY = maxY + 200;
|
|
||||||
|
|
||||||
for (const note of mapData.notes) {
|
for (const note of mapData.notes) {
|
||||||
const title = data.noteTitles[note.id];
|
const title = data.noteTitles[note.id];
|
||||||
|
|
||||||
if (note.x && note.y) {
|
|
||||||
await createNoteBox(note.id, title, note.x, note.y);
|
await createNoteBox(note.id, title, note.x, note.y);
|
||||||
} else {
|
|
||||||
await createNoteBox(note.id, title, curX, curY);
|
|
||||||
|
|
||||||
if (curX > 1000) {
|
|
||||||
curX = 100;
|
|
||||||
curY += 200;
|
|
||||||
} else {
|
|
||||||
curX += 200;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const relation of relations) {
|
for (const relation of relations) {
|
||||||
@ -134,19 +121,37 @@ function initPanZoom() {
|
|||||||
});
|
});
|
||||||
|
|
||||||
if (mapData.transform) {
|
if (mapData.transform) {
|
||||||
|
console.log(mapData.transform);
|
||||||
|
|
||||||
pz.moveTo(mapData.transform.x, mapData.transform.y);
|
pz.moveTo(mapData.transform.x, mapData.transform.y);
|
||||||
pz.zoomTo(0, 0, mapData.transform.scale);
|
pz.zoomTo(0, 0, mapData.transform.scale);
|
||||||
}
|
}
|
||||||
|
|
||||||
$relationMapCanvas[0].addEventListener('zoom', function (e) {
|
pz.on('zoom', function (e) {
|
||||||
mapData.transform = pz.getTransform();
|
mapData.transform = pz.getTransform();
|
||||||
|
|
||||||
|
console.log(mapData.transform);
|
||||||
|
|
||||||
saveData();
|
saveData();
|
||||||
});
|
});
|
||||||
|
|
||||||
$relationMapCanvas[0].addEventListener('panend', function (e) {
|
pz.on('panend', function (e) {
|
||||||
mapData.transform = pz.getTransform();
|
mapData.transform = pz.getTransform();
|
||||||
|
|
||||||
saveData();
|
saveData();
|
||||||
}, true);
|
}, true);
|
||||||
|
|
||||||
|
$zoomInButton.click(() => {
|
||||||
|
const transform = pz.getTransform();
|
||||||
|
|
||||||
|
pz.zoomTo(0, 0, 1.2);
|
||||||
|
});
|
||||||
|
|
||||||
|
$zoomOutButton.click(() => {
|
||||||
|
const transform = pz.getTransform();
|
||||||
|
|
||||||
|
pz.zoomTo(0, 0, 0.8);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async function initJsPlumb () {
|
async function initJsPlumb () {
|
||||||
@ -206,6 +211,7 @@ async function connectionCreatedHandler(info, originalEvent) {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const connection = info.connection;
|
||||||
const name = prompt("Specify new relation name:");
|
const name = prompt("Specify new relation name:");
|
||||||
|
|
||||||
if (!name || !name.trim()) {
|
if (!name || !name.trim()) {
|
||||||
@ -214,8 +220,6 @@ async function connectionCreatedHandler(info, originalEvent) {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const connection = info.connection;
|
|
||||||
|
|
||||||
const targetNoteId = connection.target.id;
|
const targetNoteId = connection.target.id;
|
||||||
const sourceNoteId = connection.source.id;
|
const sourceNoteId = connection.source.id;
|
||||||
|
|
||||||
@ -300,7 +304,7 @@ async function createNoteBox(id, title, x, y) {
|
|||||||
.addClass("note-box")
|
.addClass("note-box")
|
||||||
.prop("id", id)
|
.prop("id", id)
|
||||||
.append($("<span>").addClass("title").html(await linkService.createNoteLink(id, title)))
|
.append($("<span>").addClass("title").html(await linkService.createNoteLink(id, title)))
|
||||||
.append($("<div>").addClass("endpoint"))
|
.append($("<div>").addClass("endpoint").attr("title", "Start dragging relations from here and drop them on another note."))
|
||||||
.css("left", x + "px")
|
.css("left", x + "px")
|
||||||
.css("top", y + "px");
|
.css("top", y + "px");
|
||||||
|
|
||||||
@ -340,12 +344,16 @@ async function createNoteBox(id, title, x, y) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function getFreePosition() {
|
||||||
|
const maxY = mapData.notes.filter(note => !!note.y).map(note => note.y).reduce((a, b) => Math.max(a, b), 0);
|
||||||
|
|
||||||
|
return [100, maxY + 200];
|
||||||
|
}
|
||||||
|
|
||||||
$addChildNotesButton.click(async () => {
|
$addChildNotesButton.click(async () => {
|
||||||
const children = await server.get("notes/" + noteDetailService.getCurrentNoteId() + "/children");
|
const children = await server.get("notes/" + noteDetailService.getCurrentNoteId() + "/children");
|
||||||
|
|
||||||
const maxY = mapData.notes.filter(note => !!note.y).map(note => note.y).reduce((a, b) => Math.max(a, b), 0);
|
let [curX, curY] = getFreePosition();
|
||||||
let curX = 100;
|
|
||||||
let curY = maxY + 200;
|
|
||||||
|
|
||||||
for (const child of children) {
|
for (const child of children) {
|
||||||
if (mapData.notes.some(note => note.id === child.noteId)) {
|
if (mapData.notes.some(note => note.id === child.noteId)) {
|
||||||
@ -353,11 +361,11 @@ $addChildNotesButton.click(async () => {
|
|||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
const note = { id: child.noteId };
|
mapData.notes.push({
|
||||||
|
id: child.noteId,
|
||||||
mapData.notes.push(note);
|
x: curX,
|
||||||
|
y: curY
|
||||||
await createNoteBox(note.id, note.title, curX, curY);
|
});
|
||||||
|
|
||||||
if (curX > 1000) {
|
if (curX > 1000) {
|
||||||
curX = 100;
|
curX = 100;
|
||||||
@ -368,25 +376,12 @@ $addChildNotesButton.click(async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const child of children) {
|
|
||||||
for (const relation of child.relations) {
|
|
||||||
const connection = instance.connect({
|
|
||||||
id: relation.attributeId,
|
|
||||||
source: child.noteId,
|
|
||||||
target: relation.targetNoteId,
|
|
||||||
type: "basic"
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!connection) {
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
|
|
||||||
connection.getOverlay("label").setLabel(relation.name);
|
|
||||||
connection.canvas.setAttribute("data-connection-id", connection.id);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
saveData();
|
saveData();
|
||||||
|
|
||||||
|
// delete all endpoints and connections
|
||||||
|
instance.deleteEveryEndpoint();
|
||||||
|
|
||||||
|
await loadNotesAndRelations();
|
||||||
});
|
});
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -1,50 +1,50 @@
|
|||||||
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.panzoom = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
|
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.panzoom = f()}})(function(){var define,module,exports;return (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
/* globals SVGElement */
|
/* globals SVGElement */
|
||||||
/**
|
/**
|
||||||
* Allows to drag and zoom svg elements
|
* Allows to drag and zoom svg elements
|
||||||
*/
|
*/
|
||||||
var wheel = require('wheel')
|
var wheel = require('wheel')
|
||||||
var animate = require('amator')
|
var animate = require('amator')
|
||||||
var kinetic = require('./lib/kinetic.js')
|
var eventify = require('ngraph.events');
|
||||||
var createEvent = require('./lib/createEvent.js')
|
var kinetic = require('./lib/kinetic.js')
|
||||||
var preventTextSelection = require('./lib/textSelectionInterceptor.js')()
|
var preventTextSelection = require('./lib/textSelectionInterceptor.js')()
|
||||||
var Transform = require('./lib/transform.js');
|
var Transform = require('./lib/transform.js');
|
||||||
var makeSvgController = require('./lib/svgController.js')
|
var makeSvgController = require('./lib/svgController.js')
|
||||||
var makeDomController = require('./lib/domController.js')
|
var makeDomController = require('./lib/domController.js')
|
||||||
|
|
||||||
var defaultZoomSpeed = 0.065
|
var defaultZoomSpeed = 0.065
|
||||||
var defaultDoubleTapZoomSpeed = 1.75
|
var defaultDoubleTapZoomSpeed = 1.75
|
||||||
var doubleTapSpeedInMS = 300
|
var doubleTapSpeedInMS = 300
|
||||||
|
|
||||||
module.exports = createPanZoom
|
module.exports = createPanZoom
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Creates a new instance of panzoom, so that an object can be panned and zoomed
|
* Creates a new instance of panzoom, so that an object can be panned and zoomed
|
||||||
*
|
*
|
||||||
* @param {DOMElement} domElement where panzoom should be attached.
|
* @param {DOMElement} domElement where panzoom should be attached.
|
||||||
* @param {Object} options that configure behavior.
|
* @param {Object} options that configure behavior.
|
||||||
*/
|
*/
|
||||||
function createPanZoom(domElement, options) {
|
function createPanZoom(domElement, options) {
|
||||||
options = options || {}
|
options = options || {}
|
||||||
|
|
||||||
var domController = options.controller
|
var panController = options.controller
|
||||||
|
|
||||||
if (!domController) {
|
if (!panController) {
|
||||||
if (domElement instanceof SVGElement) {
|
if (domElement instanceof SVGElement) {
|
||||||
domController = makeSvgController(domElement)
|
panController = makeSvgController(domElement)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (domElement instanceof HTMLElement) {
|
if (domElement instanceof HTMLElement) {
|
||||||
domController = makeDomController(domElement)
|
panController = makeDomController(domElement)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!domController) {
|
if (!panController) {
|
||||||
throw new Error('Cannot create panzoom for the current type of dom element')
|
throw new Error('Cannot create panzoom for the current type of dom element')
|
||||||
}
|
}
|
||||||
var owner = domController.getOwner()
|
var owner = panController.getOwner()
|
||||||
// just to avoid GC pressure, every time we do intermediate transform
|
// just to avoid GC pressure, every time we do intermediate transform
|
||||||
// we return this object. For internal use only. Never give it back to the consumer of this library
|
// we return this object. For internal use only. Never give it back to the consumer of this library
|
||||||
var storedCTMResult = {x: 0, y: 0}
|
var storedCTMResult = {x: 0, y: 0}
|
||||||
@ -52,8 +52,8 @@
|
|||||||
var isDirty = false
|
var isDirty = false
|
||||||
var transform = new Transform()
|
var transform = new Transform()
|
||||||
|
|
||||||
if (domController.initTransform) {
|
if (panController.initTransform) {
|
||||||
domController.initTransform(transform)
|
panController.initTransform(transform)
|
||||||
}
|
}
|
||||||
|
|
||||||
var filterKey = typeof options.filterKey === 'function' ? options.filterKey : noop;
|
var filterKey = typeof options.filterKey === 'function' ? options.filterKey : noop;
|
||||||
@ -106,7 +106,7 @@
|
|||||||
|
|
||||||
listenForEvents()
|
listenForEvents()
|
||||||
|
|
||||||
return {
|
var api = {
|
||||||
dispose: dispose,
|
dispose: dispose,
|
||||||
moveBy: internalMoveBy,
|
moveBy: internalMoveBy,
|
||||||
moveTo: moveTo,
|
moveTo: moveTo,
|
||||||
@ -122,6 +122,10 @@
|
|||||||
isPaused: isPaused,
|
isPaused: isPaused,
|
||||||
}
|
}
|
||||||
|
|
||||||
|
eventify(api);
|
||||||
|
|
||||||
|
return api;
|
||||||
|
|
||||||
function pause() {
|
function pause() {
|
||||||
releaseEvents()
|
releaseEvents()
|
||||||
paused = true
|
paused = true
|
||||||
@ -157,8 +161,8 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function transformToScreen(x, y) {
|
function transformToScreen(x, y) {
|
||||||
if (domController.getScreenCTM) {
|
if (panController.getScreenCTM) {
|
||||||
var parentCTM = domController.getScreenCTM()
|
var parentCTM = panController.getScreenCTM()
|
||||||
var parentScaleX = parentCTM.a
|
var parentScaleX = parentCTM.a
|
||||||
var parentScaleY = parentCTM.d
|
var parentScaleY = parentCTM.d
|
||||||
var parentOffsetX = parentCTM.e
|
var parentOffsetX = parentCTM.e
|
||||||
@ -191,7 +195,7 @@
|
|||||||
w = ownerRect.width
|
w = ownerRect.width
|
||||||
h = ownerRect.height
|
h = ownerRect.height
|
||||||
}
|
}
|
||||||
var bbox = domController.getBBox()
|
var bbox = panController.getBBox()
|
||||||
if (bbox.width === 0 || bbox.height === 0) {
|
if (bbox.width === 0 || bbox.height === 0) {
|
||||||
// we probably do not have any elements in the SVG
|
// we probably do not have any elements in the SVG
|
||||||
// just bail out;
|
// just bail out;
|
||||||
@ -293,7 +297,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function getClientRect() {
|
function getClientRect() {
|
||||||
var bbox = domController.getBBox()
|
var bbox = panController.getBBox()
|
||||||
var leftTop = client(bbox.left, bbox.top)
|
var leftTop = client(bbox.left, bbox.top)
|
||||||
|
|
||||||
return {
|
return {
|
||||||
@ -441,7 +445,7 @@
|
|||||||
isDirty = false
|
isDirty = false
|
||||||
|
|
||||||
// TODO: Should I allow to cancel this?
|
// TODO: Should I allow to cancel this?
|
||||||
domController.applyTransform(transform)
|
panController.applyTransform(transform)
|
||||||
|
|
||||||
triggerEvent('transform')
|
triggerEvent('transform')
|
||||||
frameAnimation = 0
|
frameAnimation = 0
|
||||||
@ -532,6 +536,7 @@
|
|||||||
mouseX = offset.x
|
mouseX = offset.x
|
||||||
mouseY = offset.y
|
mouseY = offset.y
|
||||||
|
|
||||||
|
smoothScroll.cancel()
|
||||||
startTouchListenerIfNeeded()
|
startTouchListenerIfNeeded()
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -636,6 +641,8 @@
|
|||||||
var isLeftButton = ((e.button === 1 && window.event !== null) || e.button === 0)
|
var isLeftButton = ((e.button === 1 && window.event !== null) || e.button === 0)
|
||||||
if (!isLeftButton) return
|
if (!isLeftButton) return
|
||||||
|
|
||||||
|
smoothScroll.cancel()
|
||||||
|
|
||||||
var offset = getOffsetXY(e);
|
var offset = getOffsetXY(e);
|
||||||
var point = transformToScreen(offset.x, offset.y)
|
var point = transformToScreen(offset.x, offset.y)
|
||||||
mouseX = point.x
|
mouseX = point.x
|
||||||
@ -721,9 +728,6 @@
|
|||||||
smoothScroll.cancel()
|
smoothScroll.cancel()
|
||||||
cancelZoomAnimation()
|
cancelZoomAnimation()
|
||||||
|
|
||||||
// TODO: should consolidate this and publicZoomTo
|
|
||||||
triggerEvent('zoom')
|
|
||||||
|
|
||||||
zoomToAnimation = animate(from, to, {
|
zoomToAnimation = animate(from, to, {
|
||||||
step: function(v) {
|
step: function(v) {
|
||||||
zoomAbs(clientX, clientY, v.scale)
|
zoomAbs(clientX, clientY, v.scale)
|
||||||
@ -772,14 +776,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function triggerEvent(name) {
|
function triggerEvent(name) {
|
||||||
var event = createEvent(name)
|
api.fire(name, api);
|
||||||
domElement.dispatchEvent(event)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function noop() { }
|
function noop() { }
|
||||||
|
|
||||||
function validateBounds(bounds) {
|
function validateBounds(bounds) {
|
||||||
var boundsType = typeof bounds
|
var boundsType = typeof bounds
|
||||||
if (boundsType === 'undefined' || boundsType === 'boolean') return // this is okay
|
if (boundsType === 'undefined' || boundsType === 'boolean') return // this is okay
|
||||||
// otherwise need to be more thorough:
|
// otherwise need to be more thorough:
|
||||||
@ -788,31 +791,31 @@
|
|||||||
|
|
||||||
if (!validBounds) throw new Error('Bounds object is not valid. It can be: ' +
|
if (!validBounds) throw new Error('Bounds object is not valid. It can be: ' +
|
||||||
'undefined, boolean (true|false) or an object {left, top, right, bottom}')
|
'undefined, boolean (true|false) or an object {left, top, right, bottom}')
|
||||||
}
|
}
|
||||||
|
|
||||||
function isNumber(x) {
|
function isNumber(x) {
|
||||||
return Number.isFinite(x)
|
return Number.isFinite(x)
|
||||||
}
|
}
|
||||||
|
|
||||||
// IE 11 does not support isNaN:
|
// IE 11 does not support isNaN:
|
||||||
function isNaN(value) {
|
function isNaN(value) {
|
||||||
if (Number.isNaN) {
|
if (Number.isNaN) {
|
||||||
return Number.isNaN(value)
|
return Number.isNaN(value)
|
||||||
}
|
}
|
||||||
|
|
||||||
return value !== value
|
return value !== value
|
||||||
}
|
}
|
||||||
|
|
||||||
function rigidScroll() {
|
function rigidScroll() {
|
||||||
return {
|
return {
|
||||||
start: noop,
|
start: noop,
|
||||||
stop: noop,
|
stop: noop,
|
||||||
cancel: noop
|
cancel: noop
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function autoRun() {
|
function autoRun() {
|
||||||
if (typeof document === 'undefined') return
|
if (typeof document === 'undefined') return
|
||||||
|
|
||||||
var scripts = document.getElementsByTagName('script');
|
var scripts = document.getElementsByTagName('script');
|
||||||
@ -878,35 +881,14 @@
|
|||||||
var value = JSON.parse(attr.value);
|
var value = JSON.parse(attr.value);
|
||||||
return {name: name, value: value};
|
return {name: name, value: value};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
autoRun();
|
autoRun();
|
||||||
|
|
||||||
},{"./lib/createEvent.js":2,"./lib/domController.js":3,"./lib/kinetic.js":4,"./lib/svgController.js":5,"./lib/textSelectionInterceptor.js":6,"./lib/transform.js":7,"amator":8,"wheel":10}],2:[function(require,module,exports){
|
},{"./lib/domController.js":2,"./lib/kinetic.js":3,"./lib/svgController.js":4,"./lib/textSelectionInterceptor.js":5,"./lib/transform.js":6,"amator":7,"ngraph.events":9,"wheel":10}],2:[function(require,module,exports){
|
||||||
/* global Event */
|
module.exports = makeDomController
|
||||||
module.exports = createEvent;
|
|
||||||
|
|
||||||
var isIE = typeof Event !== 'function'
|
function makeDomController(domElement) {
|
||||||
|
|
||||||
/**
|
|
||||||
* Constructs custom event. Works in IE too
|
|
||||||
*/
|
|
||||||
function createEvent(name) {
|
|
||||||
if (isIE) {
|
|
||||||
var evt = document.createEvent('CustomEvent')
|
|
||||||
evt.initCustomEvent(name, true, true, undefined)
|
|
||||||
return evt
|
|
||||||
} else {
|
|
||||||
return new Event(name, {
|
|
||||||
bubbles: true
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
},{}],3:[function(require,module,exports){
|
|
||||||
module.exports = makeDomController
|
|
||||||
|
|
||||||
function makeDomController(domElement) {
|
|
||||||
var elementValid = (domElement instanceof HTMLElement)
|
var elementValid = (domElement instanceof HTMLElement)
|
||||||
if (!elementValid) {
|
if (!elementValid) {
|
||||||
throw new Error('svg element is required for svg.panzoom to work')
|
throw new Error('svg element is required for svg.panzoom to work')
|
||||||
@ -952,15 +934,15 @@
|
|||||||
transform.scale + ', ' +
|
transform.scale + ', ' +
|
||||||
transform.x + ', ' + transform.y + ')'
|
transform.x + ', ' + transform.y + ')'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},{}],4:[function(require,module,exports){
|
},{}],3:[function(require,module,exports){
|
||||||
/**
|
/**
|
||||||
* Allows smooth kinetic scrolling of the surface
|
* Allows smooth kinetic scrolling of the surface
|
||||||
*/
|
*/
|
||||||
module.exports = kinetic;
|
module.exports = kinetic;
|
||||||
|
|
||||||
function kinetic(getPoint, scroll, settings) {
|
function kinetic(getPoint, scroll, settings) {
|
||||||
if (typeof settings !== 'object') {
|
if (typeof settings !== 'object') {
|
||||||
// setting could come as boolean, we should ignore it, and use an object.
|
// setting could come as boolean, we should ignore it, and use an object.
|
||||||
settings = {}
|
settings = {}
|
||||||
@ -1074,12 +1056,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},{}],5:[function(require,module,exports){
|
},{}],4:[function(require,module,exports){
|
||||||
module.exports = makeSvgController
|
module.exports = makeSvgController
|
||||||
|
|
||||||
function makeSvgController(svgElement) {
|
function makeSvgController(svgElement) {
|
||||||
var elementValid = (svgElement instanceof SVGElement)
|
var elementValid = (svgElement instanceof SVGElement)
|
||||||
if (!elementValid) {
|
if (!elementValid) {
|
||||||
throw new Error('svg element is required for svg.panzoom to work')
|
throw new Error('svg element is required for svg.panzoom to work')
|
||||||
@ -1137,14 +1119,14 @@
|
|||||||
transform.scale + ' ' +
|
transform.scale + ' ' +
|
||||||
transform.x + ' ' + transform.y + ')')
|
transform.x + ' ' + transform.y + ')')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},{}],6:[function(require,module,exports){
|
},{}],5:[function(require,module,exports){
|
||||||
/**
|
/**
|
||||||
* Disallows selecting text.
|
* Disallows selecting text.
|
||||||
*/
|
*/
|
||||||
module.exports = createTextSelectionInterceptor
|
module.exports = createTextSelectionInterceptor
|
||||||
|
|
||||||
function createTextSelectionInterceptor() {
|
function createTextSelectionInterceptor() {
|
||||||
var dragObject
|
var dragObject
|
||||||
var prevSelectStart
|
var prevSelectStart
|
||||||
var prevDragStart
|
var prevDragStart
|
||||||
@ -1168,41 +1150,41 @@
|
|||||||
window.document.onselectstart = prevSelectStart
|
window.document.onselectstart = prevSelectStart
|
||||||
if (dragObject) dragObject.ondragstart = prevDragStart
|
if (dragObject) dragObject.ondragstart = prevDragStart
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function disabled(e) {
|
function disabled(e) {
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
},{}],7:[function(require,module,exports){
|
},{}],6:[function(require,module,exports){
|
||||||
module.exports = Transform;
|
module.exports = Transform;
|
||||||
|
|
||||||
function Transform() {
|
function Transform() {
|
||||||
this.x = 0;
|
this.x = 0;
|
||||||
this.y = 0;
|
this.y = 0;
|
||||||
this.scale = 1;
|
this.scale = 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
},{}],8:[function(require,module,exports){
|
},{}],7:[function(require,module,exports){
|
||||||
var BezierEasing = require('bezier-easing')
|
var BezierEasing = require('bezier-easing')
|
||||||
|
|
||||||
// Predefined set of animations. Similar to CSS easing functions
|
// Predefined set of animations. Similar to CSS easing functions
|
||||||
var animations = {
|
var animations = {
|
||||||
ease: BezierEasing(0.25, 0.1, 0.25, 1),
|
ease: BezierEasing(0.25, 0.1, 0.25, 1),
|
||||||
easeIn: BezierEasing(0.42, 0, 1, 1),
|
easeIn: BezierEasing(0.42, 0, 1, 1),
|
||||||
easeOut: BezierEasing(0, 0, 0.58, 1),
|
easeOut: BezierEasing(0, 0, 0.58, 1),
|
||||||
easeInOut: BezierEasing(0.42, 0, 0.58, 1),
|
easeInOut: BezierEasing(0.42, 0, 0.58, 1),
|
||||||
linear: BezierEasing(0, 0, 1, 1)
|
linear: BezierEasing(0, 0, 1, 1)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
module.exports = animate;
|
module.exports = animate;
|
||||||
module.exports.makeAggregateRaf = makeAggregateRaf;
|
module.exports.makeAggregateRaf = makeAggregateRaf;
|
||||||
module.exports.sharedScheduler = makeAggregateRaf();
|
module.exports.sharedScheduler = makeAggregateRaf();
|
||||||
|
|
||||||
|
|
||||||
function animate(source, target, options) {
|
function animate(source, target, options) {
|
||||||
var start = Object.create(null)
|
var start = Object.create(null)
|
||||||
var diff = Object.create(null)
|
var diff = Object.create(null)
|
||||||
options = options || {}
|
options = options || {}
|
||||||
@ -1262,11 +1244,11 @@
|
|||||||
source[key] = diff[key] * t + start[key]
|
source[key] = diff[key] * t + start[key]
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function noop() { }
|
function noop() { }
|
||||||
|
|
||||||
function getScheduler(scheduler) {
|
function getScheduler(scheduler) {
|
||||||
if (!scheduler) {
|
if (!scheduler) {
|
||||||
var canRaf = typeof window !== 'undefined' && window.requestAnimationFrame
|
var canRaf = typeof window !== 'undefined' && window.requestAnimationFrame
|
||||||
return canRaf ? rafScheduler() : timeoutScheduler()
|
return canRaf ? rafScheduler() : timeoutScheduler()
|
||||||
@ -1275,16 +1257,16 @@
|
|||||||
if (typeof scheduler.cancel !== 'function') throw new Error('Scheduler is supposed to have cancel(handle) function')
|
if (typeof scheduler.cancel !== 'function') throw new Error('Scheduler is supposed to have cancel(handle) function')
|
||||||
|
|
||||||
return scheduler
|
return scheduler
|
||||||
}
|
}
|
||||||
|
|
||||||
function rafScheduler() {
|
function rafScheduler() {
|
||||||
return {
|
return {
|
||||||
next: window.requestAnimationFrame.bind(window),
|
next: window.requestAnimationFrame.bind(window),
|
||||||
cancel: window.cancelAnimationFrame.bind(window)
|
cancel: window.cancelAnimationFrame.bind(window)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function timeoutScheduler() {
|
function timeoutScheduler() {
|
||||||
return {
|
return {
|
||||||
next: function(cb) {
|
next: function(cb) {
|
||||||
return setTimeout(cb, 1000/60)
|
return setTimeout(cb, 1000/60)
|
||||||
@ -1293,9 +1275,9 @@
|
|||||||
return clearTimeout(id)
|
return clearTimeout(id)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function makeAggregateRaf() {
|
function makeAggregateRaf() {
|
||||||
var frontBuffer = new Set();
|
var frontBuffer = new Set();
|
||||||
var backBuffer = new Set();
|
var backBuffer = new Set();
|
||||||
var frameToken = 0;
|
var frameToken = 0;
|
||||||
@ -1338,37 +1320,37 @@
|
|||||||
function cancel(callback) {
|
function cancel(callback) {
|
||||||
backBuffer.delete(callback);
|
backBuffer.delete(callback);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},{"bezier-easing":9}],9:[function(require,module,exports){
|
},{"bezier-easing":8}],8:[function(require,module,exports){
|
||||||
/**
|
/**
|
||||||
* https://github.com/gre/bezier-easing
|
* https://github.com/gre/bezier-easing
|
||||||
* BezierEasing - use bezier curve for transition easing function
|
* BezierEasing - use bezier curve for transition easing function
|
||||||
* by Gaëtan Renaudeau 2014 - 2015 – MIT License
|
* by Gaëtan Renaudeau 2014 - 2015 – MIT License
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// These values are established by empiricism with tests (tradeoff: performance VS precision)
|
// These values are established by empiricism with tests (tradeoff: performance VS precision)
|
||||||
var NEWTON_ITERATIONS = 4;
|
var NEWTON_ITERATIONS = 4;
|
||||||
var NEWTON_MIN_SLOPE = 0.001;
|
var NEWTON_MIN_SLOPE = 0.001;
|
||||||
var SUBDIVISION_PRECISION = 0.0000001;
|
var SUBDIVISION_PRECISION = 0.0000001;
|
||||||
var SUBDIVISION_MAX_ITERATIONS = 10;
|
var SUBDIVISION_MAX_ITERATIONS = 10;
|
||||||
|
|
||||||
var kSplineTableSize = 11;
|
var kSplineTableSize = 11;
|
||||||
var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
|
var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
|
||||||
|
|
||||||
var float32ArraySupported = typeof Float32Array === 'function';
|
var float32ArraySupported = typeof Float32Array === 'function';
|
||||||
|
|
||||||
function A (aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; }
|
function A (aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; }
|
||||||
function B (aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1; }
|
function B (aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1; }
|
||||||
function C (aA1) { return 3.0 * aA1; }
|
function C (aA1) { return 3.0 * aA1; }
|
||||||
|
|
||||||
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
|
// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
|
||||||
function calcBezier (aT, aA1, aA2) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT; }
|
function calcBezier (aT, aA1, aA2) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT; }
|
||||||
|
|
||||||
// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
|
// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
|
||||||
function getSlope (aT, aA1, aA2) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1); }
|
function getSlope (aT, aA1, aA2) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1); }
|
||||||
|
|
||||||
function binarySubdivide (aX, aA, aB, mX1, mX2) {
|
function binarySubdivide (aX, aA, aB, mX1, mX2) {
|
||||||
var currentX, currentT, i = 0;
|
var currentX, currentT, i = 0;
|
||||||
do {
|
do {
|
||||||
currentT = aA + (aB - aA) / 2.0;
|
currentT = aA + (aB - aA) / 2.0;
|
||||||
@ -1380,9 +1362,9 @@
|
|||||||
}
|
}
|
||||||
} while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS);
|
} while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS);
|
||||||
return currentT;
|
return currentT;
|
||||||
}
|
}
|
||||||
|
|
||||||
function newtonRaphsonIterate (aX, aGuessT, mX1, mX2) {
|
function newtonRaphsonIterate (aX, aGuessT, mX1, mX2) {
|
||||||
for (var i = 0; i < NEWTON_ITERATIONS; ++i) {
|
for (var i = 0; i < NEWTON_ITERATIONS; ++i) {
|
||||||
var currentSlope = getSlope(aGuessT, mX1, mX2);
|
var currentSlope = getSlope(aGuessT, mX1, mX2);
|
||||||
if (currentSlope === 0.0) {
|
if (currentSlope === 0.0) {
|
||||||
@ -1392,13 +1374,13 @@
|
|||||||
aGuessT -= currentX / currentSlope;
|
aGuessT -= currentX / currentSlope;
|
||||||
}
|
}
|
||||||
return aGuessT;
|
return aGuessT;
|
||||||
}
|
}
|
||||||
|
|
||||||
function LinearEasing (x) {
|
function LinearEasing (x) {
|
||||||
return x;
|
return x;
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = function bezier (mX1, mY1, mX2, mY2) {
|
module.exports = function bezier (mX1, mY1, mX2, mY2) {
|
||||||
if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) {
|
if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) {
|
||||||
throw new Error('bezier x values must be in [0, 1] range');
|
throw new Error('bezier x values must be in [0, 1] range');
|
||||||
}
|
}
|
||||||
@ -1447,10 +1429,100 @@
|
|||||||
}
|
}
|
||||||
return calcBezier(getTForX(x), mY1, mY2);
|
return calcBezier(getTForX(x), mY1, mY2);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
},{}],10:[function(require,module,exports){
|
},{}],9:[function(require,module,exports){
|
||||||
/**
|
module.exports = function(subject) {
|
||||||
|
validateSubject(subject);
|
||||||
|
|
||||||
|
var eventsStorage = createEventsStorage(subject);
|
||||||
|
subject.on = eventsStorage.on;
|
||||||
|
subject.off = eventsStorage.off;
|
||||||
|
subject.fire = eventsStorage.fire;
|
||||||
|
return subject;
|
||||||
|
};
|
||||||
|
|
||||||
|
function createEventsStorage(subject) {
|
||||||
|
// Store all event listeners to this hash. Key is event name, value is array
|
||||||
|
// of callback records.
|
||||||
|
//
|
||||||
|
// A callback record consists of callback function and its optional context:
|
||||||
|
// { 'eventName' => [{callback: function, ctx: object}] }
|
||||||
|
var registeredEvents = Object.create(null);
|
||||||
|
|
||||||
|
return {
|
||||||
|
on: function (eventName, callback, ctx) {
|
||||||
|
if (typeof callback !== 'function') {
|
||||||
|
throw new Error('callback is expected to be a function');
|
||||||
|
}
|
||||||
|
var handlers = registeredEvents[eventName];
|
||||||
|
if (!handlers) {
|
||||||
|
handlers = registeredEvents[eventName] = [];
|
||||||
|
}
|
||||||
|
handlers.push({callback: callback, ctx: ctx});
|
||||||
|
|
||||||
|
return subject;
|
||||||
|
},
|
||||||
|
|
||||||
|
off: function (eventName, callback) {
|
||||||
|
var wantToRemoveAll = (typeof eventName === 'undefined');
|
||||||
|
if (wantToRemoveAll) {
|
||||||
|
// Killing old events storage should be enough in this case:
|
||||||
|
registeredEvents = Object.create(null);
|
||||||
|
return subject;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (registeredEvents[eventName]) {
|
||||||
|
var deleteAllCallbacksForEvent = (typeof callback !== 'function');
|
||||||
|
if (deleteAllCallbacksForEvent) {
|
||||||
|
delete registeredEvents[eventName];
|
||||||
|
} else {
|
||||||
|
var callbacks = registeredEvents[eventName];
|
||||||
|
for (var i = 0; i < callbacks.length; ++i) {
|
||||||
|
if (callbacks[i].callback === callback) {
|
||||||
|
callbacks.splice(i, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return subject;
|
||||||
|
},
|
||||||
|
|
||||||
|
fire: function (eventName) {
|
||||||
|
var callbacks = registeredEvents[eventName];
|
||||||
|
if (!callbacks) {
|
||||||
|
return subject;
|
||||||
|
}
|
||||||
|
|
||||||
|
var fireArguments;
|
||||||
|
if (arguments.length > 1) {
|
||||||
|
fireArguments = Array.prototype.splice.call(arguments, 1);
|
||||||
|
}
|
||||||
|
for(var i = 0; i < callbacks.length; ++i) {
|
||||||
|
var callbackInfo = callbacks[i];
|
||||||
|
callbackInfo.callback.apply(callbackInfo.ctx, fireArguments);
|
||||||
|
}
|
||||||
|
|
||||||
|
return subject;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
function validateSubject(subject) {
|
||||||
|
if (!subject) {
|
||||||
|
throw new Error('Eventify cannot use falsy object as events subject');
|
||||||
|
}
|
||||||
|
var reservedWords = ['on', 'fire', 'off'];
|
||||||
|
for (var i = 0; i < reservedWords.length; ++i) {
|
||||||
|
if (subject.hasOwnProperty(reservedWords[i])) {
|
||||||
|
throw new Error("Subject cannot be eventified, since it already has property '" + reservedWords[i] + "'");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},{}],10:[function(require,module,exports){
|
||||||
|
/**
|
||||||
* This module unifies handling of mouse whee event across different browsers
|
* This module unifies handling of mouse whee event across different browsers
|
||||||
*
|
*
|
||||||
* See https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel?redirectlocale=en-US&redirectslug=DOM%2FMozilla_event_reference%2Fwheel
|
* See https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel?redirectlocale=en-US&redirectslug=DOM%2FMozilla_event_reference%2Fwheel
|
||||||
@ -1466,40 +1538,40 @@
|
|||||||
*/
|
*/
|
||||||
// by default we shortcut to 'addEventListener':
|
// by default we shortcut to 'addEventListener':
|
||||||
|
|
||||||
module.exports = addWheelListener;
|
module.exports = addWheelListener;
|
||||||
|
|
||||||
// But also expose "advanced" api with unsubscribe:
|
// But also expose "advanced" api with unsubscribe:
|
||||||
module.exports.addWheelListener = addWheelListener;
|
module.exports.addWheelListener = addWheelListener;
|
||||||
module.exports.removeWheelListener = removeWheelListener;
|
module.exports.removeWheelListener = removeWheelListener;
|
||||||
|
|
||||||
|
|
||||||
var prefix = "", _addEventListener, _removeEventListener, support;
|
var prefix = "", _addEventListener, _removeEventListener, support;
|
||||||
|
|
||||||
detectEventModel(typeof window !== 'undefined' && window,
|
detectEventModel(typeof window !== 'undefined' && window,
|
||||||
typeof document !== 'undefined' && document);
|
typeof document !== 'undefined' && document);
|
||||||
|
|
||||||
function addWheelListener( elem, callback, useCapture ) {
|
function addWheelListener( elem, callback, useCapture ) {
|
||||||
_addWheelListener( elem, support, callback, useCapture );
|
_addWheelListener( elem, support, callback, useCapture );
|
||||||
|
|
||||||
// handle MozMousePixelScroll in older Firefox
|
// handle MozMousePixelScroll in older Firefox
|
||||||
if( support == "DOMMouseScroll" ) {
|
if( support == "DOMMouseScroll" ) {
|
||||||
_addWheelListener( elem, "MozMousePixelScroll", callback, useCapture );
|
_addWheelListener( elem, "MozMousePixelScroll", callback, useCapture );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function removeWheelListener( elem, callback, useCapture ) {
|
function removeWheelListener( elem, callback, useCapture ) {
|
||||||
_removeWheelListener( elem, support, callback, useCapture );
|
_removeWheelListener( elem, support, callback, useCapture );
|
||||||
|
|
||||||
// handle MozMousePixelScroll in older Firefox
|
// handle MozMousePixelScroll in older Firefox
|
||||||
if( support == "DOMMouseScroll" ) {
|
if( support == "DOMMouseScroll" ) {
|
||||||
_removeWheelListener( elem, "MozMousePixelScroll", callback, useCapture );
|
_removeWheelListener( elem, "MozMousePixelScroll", callback, useCapture );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// TODO: in theory this anonymous function may result in incorrect
|
// TODO: in theory this anonymous function may result in incorrect
|
||||||
// unsubscription in some browsers. But in practice, I don't think we should
|
// unsubscription in some browsers. But in practice, I don't think we should
|
||||||
// worry too much about it (those browsers are on the way out)
|
// worry too much about it (those browsers are on the way out)
|
||||||
function _addWheelListener( elem, eventName, callback, useCapture ) {
|
function _addWheelListener( elem, eventName, callback, useCapture ) {
|
||||||
elem[ _addEventListener ]( prefix + eventName, support == "wheel" ? callback : function( originalEvent ) {
|
elem[ _addEventListener ]( prefix + eventName, support == "wheel" ? callback : function( originalEvent ) {
|
||||||
!originalEvent && ( originalEvent = window.event );
|
!originalEvent && ( originalEvent = window.event );
|
||||||
|
|
||||||
@ -1543,13 +1615,13 @@
|
|||||||
return callback( event );
|
return callback( event );
|
||||||
|
|
||||||
}, useCapture || false );
|
}, useCapture || false );
|
||||||
}
|
}
|
||||||
|
|
||||||
function _removeWheelListener( elem, eventName, callback, useCapture ) {
|
function _removeWheelListener( elem, eventName, callback, useCapture ) {
|
||||||
elem[ _removeEventListener ]( prefix + eventName, callback, useCapture || false );
|
elem[ _removeEventListener ]( prefix + eventName, callback, useCapture || false );
|
||||||
}
|
}
|
||||||
|
|
||||||
function detectEventModel(window, document) {
|
function detectEventModel(window, document) {
|
||||||
if ( window && window.addEventListener ) {
|
if ( window && window.addEventListener ) {
|
||||||
_addEventListener = "addEventListener";
|
_addEventListener = "addEventListener";
|
||||||
_removeEventListener = "removeEventListener";
|
_removeEventListener = "removeEventListener";
|
||||||
@ -1567,7 +1639,7 @@
|
|||||||
} else {
|
} else {
|
||||||
support = "wheel";
|
support = "wheel";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},{}]},{},[1])(1)
|
},{}]},{},[1])(1)
|
||||||
});
|
});
|
@ -433,6 +433,12 @@ button.icon-button {
|
|||||||
background: no-repeat center;
|
background: no-repeat center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button.icon-button24 {
|
||||||
|
height: 32px;
|
||||||
|
width: 32px;
|
||||||
|
background: no-repeat center;
|
||||||
|
}
|
||||||
|
|
||||||
#note-actions {
|
#note-actions {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
|
@ -265,6 +265,20 @@
|
|||||||
<div id="note-detail-relation-map" class="note-detail-component">
|
<div id="note-detail-relation-map" class="note-detail-component">
|
||||||
<button id="relation-map-add-child-notes" class="btn" type="button">Add child notes</button>
|
<button id="relation-map-add-child-notes" class="btn" type="button">Add child notes</button>
|
||||||
|
|
||||||
|
<div class="btn-group" style="float: right; padding-right: 20px;">
|
||||||
|
<button type="button"
|
||||||
|
class="btn icon-button24"
|
||||||
|
title="Zoom In"
|
||||||
|
id="relation-map-zoom-in"
|
||||||
|
style="background-image: url('/images/icons/zoom-in-24.png');"/>
|
||||||
|
|
||||||
|
<button type="button"
|
||||||
|
class="btn icon-button24"
|
||||||
|
title="Zoom Out"
|
||||||
|
id="relation-map-zoom-out"
|
||||||
|
style="background-image: url('/images/icons/zoom-out-24.png');"/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="relation-map-canvas"></div>
|
<div id="relation-map-canvas"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user