VRFS-1020 share dialog

This commit is contained in:
Brian Smith 2014-02-07 02:14:34 -05:00
parent 003b5f8d33
commit f7e4a49fa9
7 changed files with 637 additions and 9 deletions

View File

@ -20,6 +20,7 @@
//= require jquery.Jcrop //= require jquery.Jcrop
//= require jquery.naturalsize //= require jquery.naturalsize
//= require jquery.queryparams //= require jquery.queryparams
//= require jquery.clipboard
//= require jquery.timeago //= require jquery.timeago
//= require globals //= require globals
//= require_directory . //= require_directory .

View File

@ -219,12 +219,10 @@
function handleFbStateChange(response) { function handleFbStateChange(response) {
if(response && response.status == "connected") if (response && response.status == "connected") {
{
enableFacebook(); enableFacebook();
} }
else else{
{
disableFacebook(); disableFacebook();
} }
} }
@ -237,7 +235,25 @@
$(dialogId + ' .share-with-facebook a').unbind('click').click(function(e) { $(dialogId + ' .share-with-facebook a').unbind('click').click(function(e) {
facebookHelper.promptLogin(); facebookHelper.promptLogin();
return false; return false;
}) });
/*
$("#btn-share-copy").zclip({
path: 'zeroclipboard.swf',
copy: function() {
// console.log("copied " + $(".link-contents").text());
return "TEXT";
}
});*/
$("#btn-share-copy").clipboard({
path: '/assets/jquery.clipboard.swf',
copy: function() {
// Return text in closest element (useful when you have multiple boxes that can be copied)
console.log("copying " + $(".link-contents").text());
return "TEST";
}
});
} }
function showDialog() { function showDialog() {

View File

@ -2,6 +2,7 @@
//= require jquery_ujs //= require jquery_ujs
//= require jquery.queryparams //= require jquery.queryparams
//= require jquery.hoverIntent //= require jquery.hoverIntent
//= require jquery.clipboard
//= require AAA_Log //= require AAA_Log
//= require AAC_underscore //= require AAC_underscore
//= require globals //= require globals

View File

@ -41,7 +41,7 @@
<div class="link-contents"> <div class="link-contents">
</div> </div>
<div class="right"><a class="button-orange">COPY LINK</a></div> <div class="right"><a id="btn-share-copy" class="button-orange">COPY LINK</a></div>
</div> </div>
<!-- contains syndication widget code --> <!-- contains syndication widget code -->

View File

@ -107,9 +107,6 @@
var invitationDialog = new JK.InvitationDialog(JK.app); var invitationDialog = new JK.InvitationDialog(JK.app);
invitationDialog.initialize(gon.global.facebook_app_id); invitationDialog.initialize(gon.global.facebook_app_id);
var shareDialog = new JK.ShareDialog(JK.app);
shareDialog.initialize(facebookHelper);
var localRecordingsDialog = new JK.LocalRecordingsDialog(JK.app); var localRecordingsDialog = new JK.LocalRecordingsDialog(JK.app);
localRecordingsDialog.initialize(); localRecordingsDialog.initialize();

View File

@ -0,0 +1,613 @@
/*
* jQuery Clipboard :: Fork of zClip :: Uses ZeroClipboard v1.2.3
*
* https://github.com/valeriansaliou/jquery.clipboard
* http://www.steamdev.com/zclip/
*
* Copyright 2013, Valérian Saliou
* Copyright 2011, SteamDev
*
* Released under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*
* Version: v1.2
* Date: Sun Dec 1, 2013
*/
/* Component: jQuery Clipboard */
(function ($) {
var $clip = null;
var $is_loaded = false;
$.fn.clipboard = function (params) {
if ((typeof params == 'object' && !params.length) || (typeof params == 'undefined')) {
var settings = $.extend({
path: 'jquery.clipboard.swf',
copy: null,
beforeCopy: null,
afterCopy: null,
clickAfter: true
}, (params || {}));
console.log(settings);
return this.each(function () {
var o = $(this);
if (o.is(':visible') && (typeof settings.copy == 'string' || $.isFunction(settings.copy))) {
if ($.isFunction(settings.copy)) {
o.bind('Clipboard_copy',settings.copy);
}
if ($.isFunction(settings.beforeCopy)) {
o.bind('Clipboard_beforeCopy',settings.beforeCopy);
}
if ($.isFunction(settings.afterCopy)) {
o.bind('Clipboard_afterCopy',settings.afterCopy);
}
if($clip === null) {
$clip = new ZeroClipboard(null, {
moviePath: settings.path,
trustedDomains: '*',
hoverClass: 'hover',
activeClass: 'active'
});
$clip.on('load', function(client) {
client.on('mouseover', function (client) {
$(this).trigger('mouseenter');
});
client.on('mouseout', function (client) {
$(this).trigger('mouseleave');
});
client.on('mousedown', function (client) {
$(this).trigger('mousedown');
if (!$.isFunction(settings.copy)) {
client.setText(settings.copy);
} else {
client.setText($(this).triggerHandler('Clipboard_copy'));
}
if ($.isFunction(settings.beforeCopy)) {
$(this).trigger('Clipboard_beforeCopy');
}
});
client.on('complete', function (client, args) {
if ($.isFunction(settings.afterCopy)) {
$(this).trigger('Clipboard_afterCopy');
} else {
$(this).removeClass('hover');
}
if (settings.clickAfter) {
$(this).trigger('click');
}
});
});
}
$clip.glue(o[0]);
}
});
}
};
})(jQuery);
/* Component: ZeroClipboard */
(function() {
"use strict";
var _camelizeCssPropName = function() {
var matcherRegex = /\-([a-z])/g, replacerFn = function(match, group) {
return group.toUpperCase();
};
return function(prop) {
return prop.replace(matcherRegex, replacerFn);
};
}();
var _getStyle = function(el, prop) {
var value, camelProp, tagName, possiblePointers, i, len;
if (window.getComputedStyle) {
value = window.getComputedStyle(el, null).getPropertyValue(prop);
} else {
camelProp = _camelizeCssPropName(prop);
if (el.currentStyle) {
value = el.currentStyle[camelProp];
} else {
value = el.style[camelProp];
}
}
if (prop === "cursor") {
if (!value || value === "auto") {
tagName = el.tagName.toLowerCase();
possiblePointers = [ "a" ];
for (i = 0, len = possiblePointers.length; i < len; i++) {
if (tagName === possiblePointers[i]) {
return "pointer";
}
}
}
}
return value;
};
var _elementMouseOver = function(event) {
if (!ZeroClipboard.prototype._singleton) return;
if (!event) {
event = window.event;
}
var target;
if (this !== window) {
target = this;
} else if (event.target) {
target = event.target;
} else if (event.srcElement) {
target = event.srcElement;
}
ZeroClipboard.prototype._singleton.setCurrent(target);
};
var _addEventHandler = function(element, method, func) {
if (element.addEventListener) {
element.addEventListener(method, func, false);
} else if (element.attachEvent) {
element.attachEvent("on" + method, func);
}
};
var _removeEventHandler = function(element, method, func) {
if (element.removeEventListener) {
element.removeEventListener(method, func, false);
} else if (element.detachEvent) {
element.detachEvent("on" + method, func);
}
};
var _addClass = function(element, value) {
if (element.addClass) {
element.addClass(value);
return element;
}
if (value && typeof value === "string") {
var classNames = (value || "").split(/\s+/);
if (element.nodeType === 1) {
if (!element.className) {
element.className = value;
} else {
var className = " " + element.className + " ", setClass = element.className;
for (var c = 0, cl = classNames.length; c < cl; c++) {
if (className.indexOf(" " + classNames[c] + " ") < 0) {
setClass += " " + classNames[c];
}
}
element.className = setClass.replace(/^\s+|\s+$/g, "");
}
}
}
return element;
};
var _removeClass = function(element, value) {
if (element.removeClass) {
element.removeClass(value);
return element;
}
if (value && typeof value === "string" || value === undefined) {
var classNames = (value || "").split(/\s+/);
if (element.nodeType === 1 && element.className) {
if (value) {
var className = (" " + element.className + " ").replace(/[\n\t]/g, " ");
for (var c = 0, cl = classNames.length; c < cl; c++) {
className = className.replace(" " + classNames[c] + " ", " ");
}
element.className = className.replace(/^\s+|\s+$/g, "");
} else {
element.className = "";
}
}
}
return element;
};
var _getZoomFactor = function() {
var rect, physicalWidth, logicalWidth, zoomFactor = 1;
if (typeof document.body.getBoundingClientRect === "function") {
rect = document.body.getBoundingClientRect();
physicalWidth = rect.right - rect.left;
logicalWidth = document.body.offsetWidth;
zoomFactor = Math.round(physicalWidth / logicalWidth * 100) / 100;
}
return zoomFactor;
};
var _getDOMObjectPosition = function(obj) {
var info = {
left: 0,
top: 0,
width: 0,
height: 0,
zIndex: 999999999
};
var zi = _getStyle(obj, "z-index");
if (zi && zi !== "auto") {
info.zIndex = parseInt(zi, 10);
}
if (obj.getBoundingClientRect) {
var rect = obj.getBoundingClientRect();
var pageXOffset, pageYOffset, zoomFactor;
if ("pageXOffset" in window && "pageYOffset" in window) {
pageXOffset = window.pageXOffset;
pageYOffset = window.pageYOffset;
} else {
zoomFactor = _getZoomFactor();
pageXOffset = Math.round(document.documentElement.scrollLeft / zoomFactor);
pageYOffset = Math.round(document.documentElement.scrollTop / zoomFactor);
}
var leftBorderWidth = document.documentElement.clientLeft || 0;
var topBorderWidth = document.documentElement.clientTop || 0;
info.left = rect.left + pageXOffset - leftBorderWidth;
info.top = rect.top + pageYOffset - topBorderWidth;
info.width = "width" in rect ? rect.width : rect.right - rect.left;
info.height = "height" in rect ? rect.height : rect.bottom - rect.top;
}
return info;
};
var _noCache = function(path, options) {
var useNoCache = !(options && options.useNoCache === false);
if (useNoCache) {
return (path.indexOf("?") === -1 ? "?" : "&") + "nocache=" + new Date().getTime();
} else {
return "";
}
};
var _vars = function(options) {
var str = [];
var origins = [];
if (options.trustedOrigins) {
if (typeof options.trustedOrigins === "string") {
origins.push(options.trustedOrigins);
} else if (typeof options.trustedOrigins === "object" && "length" in options.trustedOrigins) {
origins = origins.concat(options.trustedOrigins);
}
}
if (options.trustedDomains) {
if (typeof options.trustedDomains === "string") {
origins.push(options.trustedDomains);
} else if (typeof options.trustedDomains === "object" && "length" in options.trustedDomains) {
origins = origins.concat(options.trustedDomains);
}
}
if (origins.length) {
str.push("trustedOrigins=" + encodeURIComponent(origins.join(",")));
}
if (typeof options.amdModuleId === "string" && options.amdModuleId) {
str.push("amdModuleId=" + encodeURIComponent(options.amdModuleId));
}
if (typeof options.cjsModuleId === "string" && options.cjsModuleId) {
str.push("cjsModuleId=" + encodeURIComponent(options.cjsModuleId));
}
return str.join("&");
};
var _inArray = function(elem, array) {
if (array.indexOf) {
return array.indexOf(elem);
}
for (var i = 0, length = array.length; i < length; i++) {
if (array[i] === elem) {
return i;
}
}
return -1;
};
var _prepGlue = function(elements) {
if (typeof elements === "string") throw new TypeError("ZeroClipboard doesn't accept query strings.");
if (!elements.length) return [ elements ];
return elements;
};
var _dispatchCallback = function(func, element, instance, args, async) {
if (async) {
window.setTimeout(function() {
func.call(element, instance, args);
}, 0);
} else {
func.call(element, instance, args);
}
};
var currentElement, gluedElements = [], flashState = {};
var ZeroClipboard = function(elements, options) {
if (elements) (ZeroClipboard.prototype._singleton || this).glue(elements);
if (ZeroClipboard.prototype._singleton) return ZeroClipboard.prototype._singleton;
ZeroClipboard.prototype._singleton = this;
this.options = {};
for (var kd in _defaults) this.options[kd] = _defaults[kd];
for (var ko in options) this.options[ko] = options[ko];
this.handlers = {};
if (!flashState.hasOwnProperty(this.options.moviePath)) {
flashState[this.options.moviePath] = {
noflash: !ZeroClipboard.detectFlashSupport(),
wrongflash: false,
ready: false,
version: "0.0.0"
};
}
if (flashState[this.options.moviePath].noflash === false) {
_bridge();
}
};
ZeroClipboard.prototype.setCurrent = function(element) {
currentElement = element;
this.reposition();
var titleAttr = element.getAttribute("title");
if (titleAttr) {
this.setTitle(titleAttr);
}
var useHandCursor = this.options.forceHandCursor === true || _getStyle(element, "cursor") === "pointer";
_setHandCursor.call(this, useHandCursor);
return this;
};
ZeroClipboard.prototype.setText = function(newText) {
if (newText && newText !== "") {
this.options.text = newText;
if (this.ready()) this.flashBridge.setText(newText);
}
return this;
};
ZeroClipboard.prototype.setTitle = function(newTitle) {
if (newTitle && newTitle !== "") this.htmlBridge.setAttribute("title", newTitle);
return this;
};
ZeroClipboard.prototype.setSize = function(width, height) {
if (this.ready()) this.flashBridge.setSize(width, height);
return this;
};
ZeroClipboard.prototype.setHandCursor = function(enabled) {
enabled = typeof enabled === "boolean" ? enabled : !!enabled;
_setHandCursor.call(this, enabled);
this.options.forceHandCursor = enabled;
return this;
};
var _setHandCursor = function(enabled) {
if (this.ready()) this.flashBridge.setHandCursor(enabled);
};
ZeroClipboard.version = "1.2.3";
var _defaults = {
moviePath: "ZeroClipboard.swf",
trustedOrigins: null,
text: null,
hoverClass: "zeroclipboard-is-hover",
activeClass: "zeroclipboard-is-active",
allowScriptAccess: "sameDomain",
useNoCache: true,
forceHandCursor: false
};
ZeroClipboard.setDefaults = function(options) {
for (var ko in options) _defaults[ko] = options[ko];
};
ZeroClipboard.destroy = function() {
if (ZeroClipboard.prototype._singleton) {
ZeroClipboard.prototype._singleton.unglue(gluedElements);
var bridge = ZeroClipboard.prototype._singleton.htmlBridge;
if (bridge && bridge.parentNode) {
bridge.parentNode.removeChild(bridge);
}
delete ZeroClipboard.prototype._singleton;
}
};
ZeroClipboard.detectFlashSupport = function() {
var hasFlash = false;
if (typeof ActiveXObject === "function") {
try {
if (new ActiveXObject("ShockwaveFlash.ShockwaveFlash")) {
hasFlash = true;
}
} catch (error) {}
}
if (!hasFlash && navigator.mimeTypes["application/x-shockwave-flash"]) {
hasFlash = true;
}
return hasFlash;
};
var _amdModuleId = null;
var _cjsModuleId = null;
var _bridge = function() {
var flashBridge, len;
var client = ZeroClipboard.prototype._singleton;
var container = document.getElementById("global-zeroclipboard-html-bridge");
if (!container) {
var opts = {};
for (var ko in client.options) opts[ko] = client.options[ko];
opts.amdModuleId = _amdModuleId;
opts.cjsModuleId = _cjsModuleId;
var flashvars = _vars(opts);
var html = ' <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" id="global-zeroclipboard-flash-bridge" width="100%" height="100%"> <param name="movie" value="' + client.options.moviePath + _noCache(client.options.moviePath, client.options) + '"/> <param name="allowScriptAccess" value="' + client.options.allowScriptAccess + '"/> <param name="scale" value="exactfit"/> <param name="loop" value="false"/> <param name="menu" value="false"/> <param name="quality" value="best" /> <param name="bgcolor" value="#ffffff"/> <param name="wmode" value="transparent"/> <param name="flashvars" value="' + flashvars + '"/> <embed src="' + client.options.moviePath + _noCache(client.options.moviePath, client.options) + '" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="100%" height="100%" name="global-zeroclipboard-flash-bridge" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="' + flashvars + '" scale="exactfit"> </embed> </object>';
container = document.createElement("div");
container.id = "global-zeroclipboard-html-bridge";
container.setAttribute("class", "global-zeroclipboard-container");
container.style.position = "absolute";
container.style.left = "0px";
container.style.top = "-9999px";
container.style.width = "15px";
container.style.height = "15px";
container.style.zIndex = "9999";
document.body.appendChild(container);
container.innerHTML = html;
}
client.htmlBridge = container;
flashBridge = document["global-zeroclipboard-flash-bridge"];
if (flashBridge && (len = flashBridge.length)) {
flashBridge = flashBridge[len - 1];
}
client.flashBridge = flashBridge || container.children[0].lastElementChild;
};
ZeroClipboard.prototype.resetBridge = function() {
if (this.htmlBridge) {
this.htmlBridge.style.left = "0px";
this.htmlBridge.style.top = "-9999px";
this.htmlBridge.removeAttribute("title");
}
if (currentElement) {
_removeClass(currentElement, this.options.activeClass);
currentElement = null;
}
this.options.text = null;
return this;
};
ZeroClipboard.prototype.ready = function() {
return flashState[this.options.moviePath].ready === true;
};
ZeroClipboard.prototype.reposition = function() {
if (!currentElement) return false;
var pos = _getDOMObjectPosition(currentElement);
this.htmlBridge.style.top = pos.top + "px";
this.htmlBridge.style.left = pos.left + "px";
this.htmlBridge.style.width = pos.width + "px";
this.htmlBridge.style.height = pos.height + "px";
this.htmlBridge.style.zIndex = pos.zIndex + 1;
this.setSize(pos.width, pos.height);
return this;
};
ZeroClipboard.dispatch = function(eventName, args) {
ZeroClipboard.prototype._singleton.receiveEvent(eventName, args);
};
ZeroClipboard.prototype.on = function(eventName, func) {
var events = eventName.toString().split(/\s/g), added = {};
for (var i = 0, len = events.length; i < len; i++) {
eventName = events[i].toLowerCase().replace(/^on/, "");
added[eventName] = true;
if (!this.handlers[eventName]) {
this.handlers[eventName] = func;
}
}
if (added.noflash && flashState[this.options.moviePath].noflash) {
this.receiveEvent("onNoFlash", {});
}
if (added.wrongflash && flashState[this.options.moviePath].wrongflash) {
this.receiveEvent("onWrongFlash", {
flashVersion: flashState[this.options.moviePath].version
});
}
if (added.load && flashState[this.options.moviePath].ready) {
this.receiveEvent("onLoad", {
flashVersion: flashState[this.options.moviePath].version
});
}
return this;
};
ZeroClipboard.prototype.addEventListener = ZeroClipboard.prototype.on;
ZeroClipboard.prototype.off = function(eventName, func) {
var events = eventName.toString().split(/\s/g);
for (var i = 0; i < events.length; i++) {
eventName = events[i].toLowerCase().replace(/^on/, "");
for (var event in this.handlers) {
if (event === eventName && this.handlers[event] === func) {
delete this.handlers[event];
}
}
}
return this;
};
ZeroClipboard.prototype.removeEventListener = ZeroClipboard.prototype.off;
ZeroClipboard.prototype.receiveEvent = function(eventName, args) {
eventName = eventName.toString().toLowerCase().replace(/^on/, "");
var element = currentElement;
var performCallbackAsync = true;
switch (eventName) {
case "load":
if (args && args.flashVersion) {
if (!_isFlashVersionSupported(args.flashVersion)) {
this.receiveEvent("onWrongFlash", {
flashVersion: args.flashVersion
});
return;
}
flashState[this.options.moviePath].ready = true;
flashState[this.options.moviePath].version = args.flashVersion;
}
break;
case "wrongflash":
if (args && args.flashVersion && !_isFlashVersionSupported(args.flashVersion)) {
flashState[this.options.moviePath].wrongflash = true;
flashState[this.options.moviePath].version = args.flashVersion;
}
break;
case "mouseover":
_addClass(element, this.options.hoverClass);
break;
case "mouseout":
_removeClass(element, this.options.hoverClass);
this.resetBridge();
break;
case "mousedown":
_addClass(element, this.options.activeClass);
break;
case "mouseup":
_removeClass(element, this.options.activeClass);
break;
case "datarequested":
var targetId = element.getAttribute("data-clipboard-target"), targetEl = !targetId ? null : document.getElementById(targetId);
if (targetEl) {
var textContent = targetEl.value || targetEl.textContent || targetEl.innerText;
if (textContent) {
this.setText(textContent);
}
} else {
var defaultText = element.getAttribute("data-clipboard-text");
if (defaultText) {
this.setText(defaultText);
}
}
performCallbackAsync = false;
break;
case "complete":
this.options.text = null;
break;
}
if (this.handlers[eventName]) {
var func = this.handlers[eventName];
if (typeof func === "string" && typeof window[func] === "function") {
func = window[func];
}
if (typeof func === "function") {
_dispatchCallback(func, element, this, args, performCallbackAsync);
}
}
};
ZeroClipboard.prototype.glue = function(elements) {
elements = _prepGlue(elements);
for (var i = 0; i < elements.length; i++) {
if (elements[i] && elements[i].nodeType === 1) {
if (_inArray(elements[i], gluedElements) == -1) {
gluedElements.push(elements[i]);
_addEventHandler(elements[i], "mouseover", _elementMouseOver);
}
}
}
return this;
};
ZeroClipboard.prototype.unglue = function(elements) {
elements = _prepGlue(elements);
for (var i = 0; i < elements.length; i++) {
_removeEventHandler(elements[i], "mouseover", _elementMouseOver);
var arrayIndex = _inArray(elements[i], gluedElements);
if (arrayIndex != -1) gluedElements.splice(arrayIndex, 1);
}
return this;
};
function _isFlashVersionSupported(flashVersion) {
return parseFloat(flashVersion.replace(/,/g, ".").replace(/[^0-9\.]/g, "")) >= 10;
}
if (typeof define === "function" && define.amd) {
define([ "require", "exports", "module" ], function(require, exports, module) {
_amdModuleId = module && module.id || null;
return ZeroClipboard;
});
} else if (typeof module === "object" && module && typeof module.exports === "object" && module.exports) {
_cjsModuleId = module.id || null;
module.exports = ZeroClipboard;
} else {
window.ZeroClipboard = ZeroClipboard;
}
})();

Binary file not shown.