@atlaskit/editor-plugin-loom
Version:
Loom plugin for @atlaskit/editor-core
215 lines (214 loc) • 9.03 kB
JavaScript
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
import { ACTION, ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
import { logException } from '@atlaskit/editor-common/monitoring';
import { getQuickInsertItem } from '../ui/quickInsert';
import { LoomPluginAction, loomPluginKey } from './main';
export var enableLoom = function enableLoom(_ref) {
var loomButton = _ref.loomButton;
return function (_ref2) {
var tr = _ref2.tr;
tr.setMeta(loomPluginKey, {
type: LoomPluginAction.ENABLE,
loomButton: loomButton
});
return tr;
};
};
export var disableLoom = function disableLoom(_ref3) {
var error = _ref3.error;
return function (_ref4) {
var tr = _ref4.tr;
tr.setMeta(loomPluginKey, {
type: LoomPluginAction.DISABLE,
error: error
});
return tr;
};
};
export var recordVideo = function recordVideo(_ref5) {
var inputMethod = _ref5.inputMethod,
editorAnalyticsAPI = _ref5.editorAnalyticsAPI;
return function (_ref6) {
var tr = _ref6.tr;
tr.setMeta(loomPluginKey, {
type: LoomPluginAction.RECORD_VIDEO
});
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
action: ACTION.RECORD_VIDEO,
actionSubject: ACTION_SUBJECT.LOOM,
attributes: {
inputMethod: inputMethod
},
eventType: EVENT_TYPE.TRACK
})(tr);
return tr;
};
};
export var recordVideoFailed = function recordVideoFailed(_ref7) {
var inputMethod = _ref7.inputMethod,
error = _ref7.error,
editorAnalyticsAPI = _ref7.editorAnalyticsAPI;
return function (_ref8) {
var tr = _ref8.tr;
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
action: ACTION.RECORD_VIDEO_FAILED,
actionSubject: ACTION_SUBJECT.LOOM,
attributes: {
inputMethod: inputMethod,
error: error
},
eventType: EVENT_TYPE.TRACK
})(tr);
return tr;
};
};
export var insertVideo = function insertVideo(_ref9) {
var editorAnalyticsAPI = _ref9.editorAnalyticsAPI,
video = _ref9.video;
return function (_ref0) {
var tr = _ref0.tr;
tr.setMeta(loomPluginKey, {
type: LoomPluginAction.INSERT_VIDEO
});
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
action: ACTION.INSERT_VIDEO,
actionSubject: ACTION_SUBJECT.LOOM,
eventType: EVENT_TYPE.TRACK,
attributes: {
duration: video.duration
}
})(tr);
return tr;
};
};
var getPositions = function getPositions(tr, posType) {
var selection = tr.selection;
switch (posType) {
case 'current':
return {
from: selection.from,
to: selection.from
};
case 'start':
return {
from: 0,
to: 0
};
case 'end':
return {
from: tr.doc.content.size,
to: tr.doc.content.size
};
}
};
export var insertLoom = function insertLoom(editorView, api, video, positionType) {
var _api$hyperlink$action, _api$hyperlink;
if (!editorView) {
return false;
}
var state = editorView.state,
dispatch = editorView.dispatch;
var _getPositions = getPositions(state.tr, positionType),
from = _getPositions.from,
to = _getPositions.to;
return (_api$hyperlink$action = api === null || api === void 0 || (_api$hyperlink = api.hyperlink) === null || _api$hyperlink === void 0 ? void 0 : _api$hyperlink.actions.insertLink(INPUT_METHOD.TYPEAHEAD, from, to, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
)(state, dispatch)) !== null && _api$hyperlink$action !== void 0 ? _api$hyperlink$action : false;
};
export var executeRecordVideo = function executeRecordVideo(api) {
var _api$core, _api$analytics;
api === null || api === void 0 || (_api$core = api.core) === null || _api$core === void 0 || _api$core.actions.execute(recordVideo({
inputMethod: INPUT_METHOD.TOOLBAR,
editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
}));
};
export var setupLoom = /*#__PURE__*/function () {
var _ref1 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(loomProvider, api, editorView, initViaCommand) {
var _api$core4, _api$analytics5;
var clientResult, _api$core2, _api$analytics2, attachToButton, loomButton;
return _regeneratorRuntime.wrap(function (_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
_context.next = 1;
return loomProvider.getClient();
case 1:
clientResult = _context.sent;
if (!(clientResult.status === 'error')) {
_context.next = 2;
break;
}
api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(disableLoom({
error: clientResult.message
}));
logException(new Error(clientResult.message), {
location: 'editor-plugin-loom/sdk-initialisation'
});
api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.fireAnalyticsEvent({
action: ACTION.ERRORED,
actionSubject: ACTION_SUBJECT.LOOM,
eventType: EVENT_TYPE.OPERATIONAL,
attributes: {
error: clientResult.message
}
});
return _context.abrupt("return", {
error: clientResult.message
});
case 2:
attachToButton = clientResult.client.attachToButton; // Hidden element to work around the SDK API
loomButton = document.createElement('button');
attachToButton({
button: loomButton,
onInsert: function onInsert(video) {
var _api$hyperlink2, _api$core3, _api$analytics3;
if (!editorView) {
return;
}
var state = editorView.state,
dispatch = editorView.dispatch;
var pos = state.selection.from;
api === null || api === void 0 || (_api$hyperlink2 = api.hyperlink) === null || _api$hyperlink2 === void 0 || _api$hyperlink2.actions.insertLink(INPUT_METHOD.TYPEAHEAD, pos,
// from === to, don't replace text to avoid accidental content loss
pos, video.sharedUrl, video.title, undefined, undefined, undefined, 'embed' // Convert to embed card instead of inline
)(state, dispatch);
api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(insertVideo({
editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions,
video: video
}));
}
});
api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(function (_ref10) {
var tr = _ref10.tr;
enableLoom({
loomButton: loomButton
})({
tr: tr
});
if (initViaCommand) {
var _api$quickInsert, _api$analytics4;
api === null || api === void 0 || (_api$quickInsert = api.quickInsert) === null || _api$quickInsert === void 0 || _api$quickInsert.commands.addQuickInsertItem(getQuickInsertItem(api === null || api === void 0 || (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions))({
tr: tr
});
}
return tr;
});
// We're not combining the analytics steps into the enable / disable commands because the collab-edit plugin
// filters out any transactions with steps (even analytics) when it's initialising.
// Even if `initViaCommand` is true, collab-edit might not be ready depending on when `initLoom` is called,
// hence the analytics step is added separately in both cases
api === null || api === void 0 || (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 || _api$analytics5.actions.fireAnalyticsEvent({
action: ACTION.INITIALISED,
actionSubject: ACTION_SUBJECT.LOOM,
eventType: EVENT_TYPE.OPERATIONAL
});
return _context.abrupt("return", {});
case 3:
case "end":
return _context.stop();
}
}, _callee);
}));
return function setupLoom(_x, _x2, _x3, _x4) {
return _ref1.apply(this, arguments);
};
}();