Skip to content

C
coopwire-hypothesis
Commit 85d4e5b2 authored by Randall Leeds's avatar Randall Leeds
Browse files
Options

Actually remove jquery.scrollintoview totally 

This change requires us to introduce proxyquire for stubbing modules
that have a single function as their default export, such as the
scroll-into-view module.
parent 06b379d2
Show whitespace changes
Inline Side-by-side
Showing with 47 additions and 232 deletions
h/static/scripts/annotator/guest.coffee
View file @ 85d4e5b2
baseURI = require('base-url')()
scrollIntoView = require('scroll-into-view')
Annotator = require('annotator')
Annotator.Plugin.CrossFrame = require('./plugin/cross-frame')
$ = Annotator.$
highlighter = require('./highlighter')
......@@ -117,7 +120,7 @@ module.exports = class Guest extends Annotator
crossframe.on 'scrollToAnnotation', (tag) =>
for anchor in @anchors when anchor.highlights?
if anchor.annotation.$$tag is tag
$(anchor.highlights).scrollintoview()
scrollIntoView(anchor.highlights[0])
return
crossframe.on 'getDocumentInfo', (cb) =>
this.getDocumentInfo()
......
h/static/scripts/annotator/test/guest-test.coffee
View file @ 85d4e5b2
Annotator = require('annotator')
Guest = require('../guest')
anchoring = require('../anchoring/html')
highlighter = require('../highlighter')
highlighter = {}
anchoring = {}
CrossFrame = sinon.stub()
CrossFrame['@noCallThru'] = true
scrollIntoView = sinon.stub()
scrollIntoView['@noCallThru'] = true
proxyquire = require('proxyquire')
Guest = proxyquire('../guest', {
'./highlighter': highlighter,
'./anchoring/html': anchoring,
'./plugin/cross-frame': CrossFrame,
'scroll-into-view': scrollIntoView,
})
$ = require('jquery')
waitForSync = (annotation) ->
if annotation.$anchors?
......@@ -20,14 +34,14 @@ describe 'Guest', ->
beforeEach ->
sandbox = sinon.sandbox.create()
fakeCrossFrame = {
onConnect: sinon.stub()
on: sinon.stub()
sync: sinon.stub()
}
fakeCrossFrame =
onConnect: sandbox.stub()
on: sandbox.stub()
sync: sandbox.stub()
Annotator.Plugin.CrossFrame = -> fakeCrossFrame
sandbox.spy(Annotator.Plugin, 'CrossFrame')
CrossFrame.reset()
CrossFrame.returns(fakeCrossFrame)
afterEach ->
sandbox.restore()
......@@ -36,13 +50,13 @@ describe 'Guest', ->
it 'provides an event bus for the annotation sync module', ->
guest = createGuest()
options = Annotator.Plugin.CrossFrame.lastCall.args[1]
options = CrossFrame.lastCall.args[1]
assert.isFunction(options.on)
assert.isFunction(options.emit)
it 'provides a formatter for the annotation sync module', ->
guest = createGuest()
options = Annotator.Plugin.CrossFrame.lastCall.args[1]
options = CrossFrame.lastCall.args[1]
assert.isFunction(options.formatter)
it 'publishes the "panelReady" event when a connection is established', ->
......@@ -58,7 +72,7 @@ describe 'Guest', ->
beforeEach ->
guest = createGuest()
options = Annotator.Plugin.CrossFrame.lastCall.args[1]
options = CrossFrame.lastCall.args[1]
it 'proxies the event into the annotator event system', ->
fooHandler = sandbox.stub()
......@@ -79,7 +93,7 @@ describe 'Guest', ->
beforeEach ->
guest = createGuest()
options = Annotator.Plugin.CrossFrame.lastCall.args[1]
options = CrossFrame.lastCall.args[1]
it 'calls deleteAnnotation when an annotationDeleted event is received', ->
ann = {id: 1, $$tag: 'tag1'}
......@@ -131,7 +145,7 @@ describe 'Guest', ->
beforeEach ->
guest = createGuest()
options = Annotator.Plugin.CrossFrame.lastCall.args[1]
options = CrossFrame.lastCall.args[1]
it 'keeps an existing uri property', ->
ann = {$$tag: 'tag1', uri: 'http://example.com/foo'}
......@@ -190,11 +204,9 @@ describe 'Guest', ->
assert.isFalse(highlight1.hasClass('annotator-hl-focused'))
describe 'on "scrollToAnnotation" event', ->
beforeEach ->
$.fn.scrollintoview = sandbox.stub()
afterEach ->
delete $.fn.scrollintoview
beforeEach ->
scrollIntoView.reset()
it 'scrolls to the anchor with the matching tag', ->
highlight = $('<span></span>')
......@@ -203,7 +215,8 @@ describe 'Guest', ->
{annotation: {$$tag: 'tag1'}, highlights: highlight.toArray()}
]
emitGuestEvent('scrollToAnnotation', 'tag1')
assert.calledOn($.fn.scrollintoview, sinon.match(highlight))
assert.called(scrollIntoView)
assert.calledWith(scrollIntoView, highlight[0])
describe 'on "getDocumentInfo" event', ->
guest = null
......
h/static/scripts/karma.config.js
View file @ 85d4e5b2
......@@ -66,7 +66,12 @@ module.exports = function(config) {
browserify: {
debug: true,
extensions: ['.coffee']
extensions: ['.coffee'],
configure: function (bundle) {
bundle
.transform('coffeeify')
.plugin('proxyquire-universal');
}
},
// test results reporter to use
......
h/static/scripts/vendor/jquery.scrollintoview.js deleted 100644 → 0
View file @ 06b379d2
/*!
* jQuery scrollintoview() plugin and :scrollable selector filter
*
* Version 1.8 (14 Jul 2011)
* Requires jQuery 1.4 or newer
*
* Copyright (c) 2011 Robert Koritnik
* Licensed under the terms of the MIT license
* http://www.opensource.org/licenses/mit-license.php
*/
(function ($) {
var converter = {
vertical: { x: false, y: true },
horizontal: { x: true, y: false },
both: { x: true, y: true },
x: { x: true, y: false },
y: { x: false, y: true }
};
var settings = {
duration: "fast",
direction: "both"
};
var rootrx = /^(?:html)$/i;
// gets border dimensions
var borders = function (domElement, styles) {
styles = styles || (document.defaultView && document.defaultView.getComputedStyle ? document.defaultView.getComputedStyle(domElement, null) : domElement.currentStyle);
var px = document.defaultView && document.defaultView.getComputedStyle ? true : false;
var b = {
top: (parseFloat(px ? styles.borderTopWidth : $.css(domElement, "borderTopWidth")) || 0),
left: (parseFloat(px ? styles.borderLeftWidth : $.css(domElement, "borderLeftWidth")) || 0),
bottom: (parseFloat(px ? styles.borderBottomWidth : $.css(domElement, "borderBottomWidth")) || 0),
right: (parseFloat(px ? styles.borderRightWidth : $.css(domElement, "borderRightWidth")) || 0)
};
return {
top: b.top,
left: b.left,
bottom: b.bottom,
right: b.right,
vertical: b.top + b.bottom,
horizontal: b.left + b.right
};
};
var dimensions = function ($element) {
var win = $(window);
var isRoot = rootrx.test($element[0].nodeName);
return {
border: isRoot ? { top: 0, left: 0, bottom: 0, right: 0} : borders($element[0]),
scroll: {
top: (isRoot ? win : $element).scrollTop(),
left: (isRoot ? win : $element).scrollLeft()
},
scrollbar: {
right: isRoot ? 0 : $element.innerWidth() - $element[0].clientWidth,
bottom: isRoot ? 0 : $element.innerHeight() - $element[0].clientHeight
},
rect: (function () {
var r = $element[0].getBoundingClientRect();
return {
top: isRoot ? 0 : r.top,
left: isRoot ? 0 : r.left,
bottom: isRoot ? $element[0].clientHeight : r.bottom,
right: isRoot ? $element[0].clientWidth : r.right
};
})()
};
};
$.fn.extend({
scrollintoview: function (options) {
/// <summary>Scrolls the first element in the set into view by scrolling its closest scrollable parent.</summary>
/// <param name="options" type="Object">Additional options that can configure scrolling:
/// duration (default: "fast") - jQuery animation speed (can be a duration string or number of milliseconds)
/// direction (default: "both") - select possible scrollings ("vertical" or "y", "horizontal" or "x", "both")
/// complete (default: none) - a function to call when scrolling completes (called in context of the DOM element being scrolled)
/// </param>
/// <return type="jQuery">Returns the same jQuery set that this function was run on.</return>
options = $.extend({}, settings, options);
options.direction = converter[typeof (options.direction) === "string" && options.direction.toLowerCase()] || converter.both;
var dirStr = "";
if (options.direction.x === true) dirStr = "horizontal";
if (options.direction.y === true) dirStr = dirStr ? "both" : "vertical";
var el = this.eq(0);
var scroller = el.closest(":scrollable(" + dirStr + ")");
// check if there's anything to scroll in the first place
if (scroller.length > 0)
{
scroller = scroller.eq(0);
var dim = {
e: dimensions(el),
s: dimensions(scroller)
};
var rel = {
top: dim.e.rect.top - (dim.s.rect.top + dim.s.border.top),
bottom: dim.s.rect.bottom - dim.s.border.bottom - dim.s.scrollbar.bottom - dim.e.rect.bottom,
left: dim.e.rect.left - (dim.s.rect.left + dim.s.border.left),
right: dim.s.rect.right - dim.s.border.right - dim.s.scrollbar.right - dim.e.rect.right
};
var animOptions = {};
// vertical scroll
if (options.direction.y === true)
{
if (rel.top < 0)
{
animOptions.scrollTop = dim.s.scroll.top + rel.top;
}
else if (rel.top > 0 && rel.bottom < 0)
{
animOptions.scrollTop = dim.s.scroll.top + Math.min(rel.top, -rel.bottom);
}
}
// horizontal scroll
if (options.direction.x === true)
{
if (rel.left < 0)
{
animOptions.scrollLeft = dim.s.scroll.left + rel.left;
}
else if (rel.left > 0 && rel.right < 0)
{
animOptions.scrollLeft = dim.s.scroll.left + Math.min(rel.left, -rel.right);
}
}
// scroll if needed
if (!$.isEmptyObject(animOptions))
{
if (rootrx.test(scroller[0].nodeName))
{
scroller = $("html,body");
}
scroller
.animate(animOptions, options.duration)
.eq(0) // we want function to be called just once (ref. "html,body")
.queue(function (next) {
$.isFunction(options.complete) && options.complete.call(scroller[0]);
next();
});
}
else
{
// when there's nothing to scroll, just call the "complete" function
$.isFunction(options.complete) && options.complete.call(scroller[0]);
}
}
// return set back
return this;
}
});
var scrollValue = {
auto: true,
scroll: true,
visible: false,
hidden: false
};
$.extend($.expr[":"], {
scrollable: function (element, index, meta, stack) {
var direction = converter[typeof (meta[3]) === "string" && meta[3].toLowerCase()] || converter.both;
var styles = (document.defaultView && document.defaultView.getComputedStyle ? document.defaultView.getComputedStyle(element, null) : element.currentStyle);
var overflow = {
x: scrollValue[styles.overflowX.toLowerCase()] || false,
y: scrollValue[styles.overflowY.toLowerCase()] || false,
isRoot: rootrx.test(element.nodeName)
};
// check if completely unscrollable (exclude HTML element because it's special)
if (!overflow.x && !overflow.y && !overflow.isRoot)
{
return false;
}
var size = {
height: {
scroll: element.scrollHeight,
client: element.clientHeight
},
width: {
scroll: element.scrollWidth,
client: element.clientWidth
},
// check overflow.x/y because iPad (and possibly other tablets) don't dislay scrollbars
scrollableX: function () {
return (overflow.x || overflow.isRoot) && this.width.scroll > this.width.client;
},
scrollableY: function () {
return (overflow.y || overflow.isRoot) && this.height.scroll > this.height.client;
}
};
return direction.y && size.scrollableY() || direction.x && size.scrollableX();
}
});
})(jQuery);
package.json
View file @ 85d4e5b2
......@@ -56,6 +56,9 @@
"karma-sinon": "^1.0.4",
"mocha": "^1.20.1",
"phantomjs": "^1.9.7",
"proxyquire": "^1.6.0",
"proxyquire-universal": "^1.0.8",
"proxyquireify": "^3.0.0",
"sinon": "^1.15.4"
},
"engines": {
......@@ -75,7 +78,6 @@
"homepage": "https://github.com/hypothesis/h",
"browserify": {
"transform": [
"coffeeify",
"browserify-ngannotate",
"browserify-shim"
]
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment