// XXX check rx versions. It's weird that it's modifying this header.
// headers: {'Content-Type': 'application/json' },
function post(url, body) {
return Rx.DOM.ajax({
url: url,
body: body,
method: 'POST'
}).pluck('response').map(JSON.parse);
}
function users(opts) {
var {page, pageLength, search} = opts;
var usersUrl = `${config.backend_url}/accounts/users/?${qs.stringify(_.pick({
'page_num': page,
'page_size': pageLength,
'search': search
}, v => v != null))}`;
return Rx.DOM.get(usersUrl).map(xhr => JSON.parse(xhr.responseText));
}
export function elementResizes (element, throttle = 250) {
function extractSize (x) {
x = x.target
let bRect = { left: 0, top: 0, bottom: 0, right: 0, width: 0, height: 0 }
if (x.getBoundingClientRect) bRect = x.getBoundingClientRect()
let res = {width: x.innerWidth, height: x.innerHeight, aspect: x.innerWidth / x.innerHeight, bRect: bRect}
return res
}
return Rx.DOM.resize(element)
.throttle(throttle /* ms */)
.map(extractSize)
}
link: function(scope, element, attrs) {
// Only remember if attribute if truthy. This is an annoying workaround to the
// inability to add directives conditionally
if (scope.$eval(attrs.grRememberScrollTop)) {
const scrollEvents$ = Rx.DOM.fromEvent(element[0], 'scroll').debounce(500);
const scrollTop$ = scrollEvents$.map(ev => ev.target.scrollTop);
subscribe$(scope, scrollTop$, ev => {
window.localStorage.setItem(storageKey, ev);
});
scope.$on('gr:remember-scroll-top:apply', () => {
// Note: Number(null) -> 0
const scrollTop = Number(window.localStorage.getItem(storageKey));
element[0].scrollTop = scrollTop;
});
}
}
link: function(scope) {
const panel = scope.panel;
const winScroll$ = Rx.DOM.fromEvent($window, 'scroll');
inject$(scope, panel.state$, scope, 'state');
// If we are quickly window scrolling whilst visible and unlocked
const scrollWhileVisAndUnlocked$ = winScroll$.
debounce(100).
windowWithCount(2).
withLatestFrom(panel.state$,
(ev, state) => !(state.locked || state.hidden)
).filter(shouldHide => shouldHide);
// Then hide the panel
subscribe$(scope, scrollWhileVisAndUnlocked$, () => {
scope.$apply(() => panel.setHidden(true));
});
}
function searchGIPHY(x) {
Rx.DOM.ajax({
url: GIPHY.searchUri + x.join('+') + '&api_key=' + GIPHY.apiKey,
responseType: 'json'
})
.subscribe(
function giphySuccess(results) {
var view = $('#view').html('');
results.response.data.forEach(function(item) {
var video = $('<video/>').appendTo(view);
videojs(video[0], {
'preload': 'auto',
'controls': true,
'loop': true
}, function() {
var player = this;
player.bigPlayButton.show();
player.on('pause', function() {
player.bigPlayButton.show();
});
player.on('play', function() {
player.bigPlayButton.hide();
});
video[0]
.parentNode
.classList.add('vjs-default-skin', 'vjs-big-play-centered');
player.src(item.images.fixed_width.mp4);
});
});
},
function giphyError(error) {
console.log(error);
}
);
}
function($scope, $window, $document, $element, vndMimeTypes,
selectedImages$) {
const windowDrag$ = Rx.DOM.fromEvent($window, 'dragstart');
const dragData$ = windowDrag$.
withLatestFrom(selectedImages$, (event, imagesList) => {
const images = imagesList.toJS();
const dt = event.dataTransfer;
return {images, dt};
});
const sub = dragData$.subscribe(({ images, dt }) => {
if (images.length > 0) {
const doc = $document[0];
const el = $element[0];
//creates an element to use as the drag icon
const dragImage = doc.createElement('div');
dragImage.classList.add('drag-icon');
const imageCount = doc.createElement('span');
imageCount.classList.add('drag-count');
imageCount.innerHTML = images.length;
// we do this as we cannot stringify Resource objects
const imageObjs = images.map(i => ({data: i.data}));
dragImage.appendChild(imageCount);
el.appendChild(dragImage);
dt.setData(
vndMimeTypes.get('gridImagesData'),
JSON.stringify(imageObjs));
dt.setDragImage(dragImage, 0, 0);
}
});
$scope.$on('$destroy', () => sub.dispose());
}]
function lollipopData(opts) {
opts.pageLength = 0;
opts.format = 'json';
opts.column = ['id', 'Genomic_Coordinate_hg38', 'Pathogenicity_expert'];
return Rx.DOM.get(url(opts)).map(xhr => JSON.parse(xhr.responseText));
}
function userLocations(search, roles) {
var url = `${config.backend_url}/accounts/user_locations/?${qs.stringify({search: search, 'roles[]': roles}, {indices: false})}`;
return Rx.DOM.get(url).map(xhr => JSON.parse(xhr.responseText));
}
function release(id) {
return Rx.DOM.get(`${config.backend_url}/data/releases?release_id=${id}`).map(xhr => JSON.parse(xhr.responseText));
}
function variantCounts() {
return Rx.DOM.get(`${config.backend_url}/data/variantcounts`).map(xhr => JSON.parse(xhr.responseText));
}
function variant(variant) {
return Rx.DOM.get(`${config.backend_url}/data/variant/?variant_id=${variant}`).map(xhr => JSON.parse(xhr.responseText));
}
function data(opts) {
return Rx.DOM.get(url(opts)).map(xhr => JSON.parse(xhr.responseText));
}
const openObs = Rx.Observer.create(e => {
console.info('socket open');
socket.onNext('{"op":"unconfirmed_sub"}');
});
const closeObs = Rx.Observer.create(() => {
console.log('socket is about to close');
});
/*
fromWebSocket takes two callbacks:
1. WS Open
2. WS Close
*/
const socket = Rx.DOM.fromWebSocket('wss://ws.blockchain.info/inv', null, openObs, closeObs);
/*
subscribe() takes three callbacks
1) onNext
2) onError
3) onComplete
*/
socket.subscribe(success => {
let data = JSON.parse(success.data),
btc = toBtc(data.x.out[0].value),
$el = $('<div class="tx-wrapper animated bounceInDown"><p class="tx animated zoomOutRight">' + btc + '</p></div>');
$('.component-tx').prepend($el);