\
',
overlayConfirmationHtml : '\
\
\
${templates.getConfirmationLabel()}
\
\
\
\
${templates.getThankYouText()}\
\
\
\
'
};
(function() {
var classes = HD.CSS_CLASSES;
/**
* The collection of hooks
*/
HD.UploadWidget.hooks = {
/**
* Standalone: (1)
* Use: Contains action buttons
* @memberOf HD.UploadWidget
*/
CONF_ACTIONS : classes.CONFIRMATION + '-' + classes.ACTION + 's',
/**
* Standalone: (1)
* Use: Tag cloud container
* Type: Form
* @memberOf HD.UploadWidget
*/
FORM : classes.UPLOAD + '-form',
/**
* Standalone: 0..n
* Use: Error string
* @memberOf HD.UploadWidget
*/
ERRORS : classes.UPLOAD + '-' + classes.ERROR + 's',
/**
* Standalone: 0..n
* Use: Validation error string
* @memberOf HD.UploadWidget
*/
ERROR_VALIDATION : classes.UPLOAD + '-validation-' + classes.ERROR,
/**
* Standalone: (1)
* Use: Progessbar container
* @memberOf HD.UploadWidget
*/
PROGRESSBAR : classes.UPLOAD + '-progressbar',
/**
* Standalone: (1)
* Use: Progessbar container
* @memberOf HD.UploadWidget
*/
PROGRESSBAR_METER : classes.UPLOAD + '-progressbar-meter',
/**
* Standalone: (1)
* Use: Progessbar container
* @memberOf HD.UploadWidget
*/
PROGRESSBAR_TEXT : classes.UPLOAD + '-progressbar-text',
/**
* Standalone: (1)
* Use: Terms and conditions container
* @memberOf HD.UploadWidget
*/
TERMS_CONDITIONS : classes.UPLOAD + '-terms',
/**
* Standalone: (1)
* Use: Swivel character for terms and conditions
* @memberOf HD.UploadWidget
*/
TERMS_SWIVEL : classes.UPLOAD + '-terms-swivel',
/**
* Standalone: (1)
* Use: Scroller container for overlay
* @memberOf HD.UploadWidget
*/
SCROLLER : classes.UPLOAD + '-scroller',
/**
* Standalone: (1)
* Use: Suggestions container
* @memberOf HD.UploadWidget
*/
SUGGESTIONS : classes.UPLOAD + '-suggestions',
/**
* Standalone: (1)
* Use: Swivel character for suggestions
* @memberOf HD.UploadWidget
*/
SUGGESTIONS_SWIVEL : classes.UPLOAD + '-suggestions-swivel',
/**
* Standalone: (1)
* Use: Suggestions button
* @memberOf HD.UploadWidget
*/
SUGGESTIONS_BUTTON : classes.UPLOAD + '-suggestions-button'
};
})();
HD.UploadWidget.prototype = {
supportedVideoTypes : [".flv", ".wmv", ".asf", ".avi", ".mov", ".3gp", ".mpg", ".mpeg", ".mp4"],
supportedPhotoTypes : [".jpeg", ".jpg", ".gif"],
getUnsupportedFileTypeError : function(extension) {
return HD.UploadWidget.templates.getUnsupportedFileTypeText();
},
render: function(contentType, category, categories, categoriesFriendly) {
this.config.contentType = contentType || this.config.contentType;
this.config.category = category || this.config.category;
this.config.categories = categories || this.config.categories;
this.config.categoriesFriendly = categoriesFriendly || categories || this.config.categoriesFriendly;
var cb=this;
// TODO: This is for older communities. Once all community sites are converted to HD.Profile
// this should be changed
if(!login){
login = HD.Profile.profile;
}
login.model.isUserLoggedIn(function(userResponse) {
if(userResponse.loggedInLevel > 1 || (userResponse.token && userResponse.user && userResponse.user.hasScreenName)) {
// Store the user for the overlay
cb.user = userResponse.user;
cb.loggedInLevel = userResponse.loggedInLevel;
cb.getHtml(null);
var observer = {
update : function(eventName, eventData) {
if (eventName == "overlayClose_Click") {
HD.util.Common.getObservable().removeObserver(this);
cb.clearProgress();
}
}
};
HD.util.Common.getObservable().addObserver(observer);
}
else {
var observer = {
update : function(eventName, eventData) {
if (eventName == "logged_In" || eventName == "LOGGED_IN") {
// TODO: remove the old login code after profile is migrated everywhere
if (!eventData && HD.Profile && HD.Profile.token){
login.model.getUser(function(userResponse){});
}
else{
// Store the user for the overlay
cb.user = eventData.user;
cb.loggedInLevel = eventData.loggedInLevel;
// Only show the new member message once
var thisUser = cb.user;
if (thisUser.passwordConfirm != null){
cb.config.showNewMemberMessage = true;
}
cb.getHtml(null);
cb.config.showNewMemberMessage = false;
login.model.removeObserver(this);
HD.util.Common.getObservable().removeObserver(this);
}
} else if (eventName == "overlayClose_Click") {
login.model.removeObserver(this);
HD.util.Common.getObservable().removeObserver(this);
}
}
};
HD.util.Common.getObservable().addObserver(observer);
login.model.addObserver(observer);
login.model.addObserver(observer);
if(userResponse.loggedInLevel > 0 || (userResponse.user && !userResponse.user.hasScreenName)){
login.view.promptCreateScreenName();
}else{
login.view.promptAuthentication();
}
}
});
},
renderPhoto: function(category, categories, categoriesFriendly) {
this.render('photo', category, categories, categoriesFriendly);
},
renderVideo: function(category, categories, categoriesFriendly) {
this.render('video', category, categories, categoriesFriendly);
},
renderBoth: function(category, categories, categoriesFriendly) {
this.render('both', category, categories, categoriesFriendly);
},
loading : function(isShow) {
var parentEl = this.getParent();
if(isShow) {
HD.addClass(parentEl, HD.CSS_CLASSES.LOADING);
} else {
HD.removeClass(parentEl, HD.CSS_CLASSES.LOADING);
}
},
update : function(eventName, eventData) {
var config = this.config;
var uploadEl = HD.get('hdwcLoginSaveButton');
if(eventName == "submitMedium_Start") {
this.loading(true);
if (uploadEl){
uploadEl.onclick = null;
}
} else if(eventName == "submitMedium_Finish") {
this.loading(false);
if (uploadEl){
uploadEl.onclick = function() {
document.getElementById('submitVideoButton').click();
};
}
this.clearProgress();
this.getConfirmationHtml(eventData);
} else if(eventName == "submitMedium_Error") {
this.loading(false);
if (uploadEl){
uploadEl.onclick = function() {
document.getElementById('submitVideoButton').click();
};
}
this.clearProgress();
this.getHtml(eventData);
}
},
getHtml : function(eventData, selectedCategory) {
var cb = this;
var config = this.config;
var timestamp = HD.util.Common.timestamp();
var category = config.category;
if(selectedCategory != null) {
category = selectedCategory;
}
HD.util.Analytics.track(this.analyticsUploadString());
var overlayEl = HD.util.Common.showOverlay(this.processTemplate(config.templates.getOverlayHtml(), {
errors: (eventData && eventData.errors) || [],
upload : (eventData && eventData.media) || [],
user : cb.user || {},
loggedInLevel : cb.loggedInLevel || 0
}), config.templates.getOverlayTitle(), config.overlayWidth, config.overlayHeight);
cb.setListeners.call(cb);
},
getConfirmationHtml : function(eventData) {
var cb = this;
var config = this.config;
var classes = HD.CSS_CLASSES;
HD.util.Analytics.track(this.analyticsUploadConfirmationString(eventData[3] || '', eventData[4] || ''));
var overlayEl = HD.util.Common.showOverlay(this.processTemplate(config.templates.getOverlayConfirmationHtml()),
config.templates.getOverlayTitle(), config.overlayConfirmationWidth, config.overlayConfirmationHeight);
// Add action buttons.
if (config.actions.length > 0) {
var wrapper = HD.getByClass(this.config.hooks.CONF_ACTIONS, '*', overlayEl)[0];
if(wrapper){
var actionEl = document.createElement('div');
actionEl.className = "btnOrange " + classes.ACTION;
actionEl.innerHTML = "
";
for (var i = 0; i < config.actions.length; i++) {
var el = actionEl.cloneNode(true);
(function() {
var action = config.actions[i];
el.firstChild.innerHTML = action;
el.firstChild.onclick = function() {
HD.util.Common.hideOverlay();
self.model.notifyObservers("submitMedium_Action", action);
};
})();
wrapper.appendChild(el);
}
}
}
},
setListeners : function() {
var cb = this;
var modelCb = this.model;
this.getByHook("FORM", function(el) {
el.onsubmit = function() {
var formEl = this;
var filePath = formEl.path.value;
var extension = cb.getFileExtension.call(cb, filePath);
var type = null;
cb.removeErrors(formEl);
if(cb.isSupportedVideoFile(extension) || cb.config.contentType == 'video') {
formEl.type.value = "video";
} else if(cb.isSupportedPhotoFile(extension) || cb.config.contentType == 'photo') {
formEl.type.value = "photo";
} else {
formEl.type.value = "";
}
var selectedCategory = formEl.category.value;
var mediaObj = {
title: formEl.title.value,
path: formEl.path.value,
story: formEl.story.value,
type: formEl.type.value,
category : selectedCategory
};
ValidationService.validateUpload(mediaObj, function(mediaResponse){
if(mediaResponse.errors.length > 0){
cb.getHtml(mediaResponse, selectedCategory);
} else {
cb.startProgress();
cb.file = modelCb.submitMedium.call(modelCb, formEl);
}
return false;
});
return false;
};
}, 'form', this.config.overlayParent);
cb.setToggleSuggestions();
},
removeErrors : function(formEl) {
this.getByHook('ERRORS', function(el){
el.parentNode.removeChild(el);
}, '*', formEl);
this.getByHook('ERROR_VALIDATION', function(el){
for (var i = 0, l = el.length; i < l; i++) {
HD.removeClass(el[i], 'hdwcValidationError');
}
},'*', formEl);
},
refreshProgress : function (delay) {
var cb = this;
this.progress = setTimeout(function() {
UploadMonitor.getUploadInfo(function(data){
cb.updateProgress(data);
return false;
});
}, delay || 5000);
},
updateProgress : function (uploadInfo){
if (uploadInfo.inProgress){
try{
var fileIndex = uploadInfo.fileIndex;
var progressPercent = Math.ceil((uploadInfo.bytesRead / uploadInfo.totalSize) * 100);
if (this.progress) {
this.refreshProgress();
}
this.getByHook('PROGRESSBAR_TEXT', function(el){
el.innerHTML = progressPercent + '%';
},'*', this.config.overlayParent);
this.getByHook('PROGRESSBAR_METER', function(el){
el.style.width = parseInt(progressPercent * 3.5) + 'px';
},'*', this.config.overlayParent);
} catch (e){}
}
},
startProgress : function () {
this.getByHook('PROGRESSBAR', function(el){
el.style.display = 'block';
},'*', this.config.overlayParent);
this.getByHook('PROGRESSBAR_TEXT', function(el){
el.innerHTML = '0%';
},'*', this.config.overlayParent);
// wait a little while to make sure the upload has started ..
this.refreshProgress(500);
},
clearProgress : function() {
this.progress = null;
if (this.file) {
try {
YAHOO.util.Connect.abort(this.file);
} catch(e) {}
this.file = null;
}
},
toggleSuggestions : function(){
var self = this;
var swivelEl = HD.util.Common.get('sgSwivel');
this.getByHook('SUGGESTIONS', function(el){
if (el.style.display != 'block'){
YAHOO.util.Dom.setStyle(el, 'display', 'block');
el.innerHTML = HD.UploadWidget.templates.getSuggestionsAndGuidelinesText();
swivelEl.innerHTML = self.config.templates.getSuggestionsSwivelTextActive();
}
else{
YAHOO.util.Dom.setStyle(el, 'display', 'none');
swivelEl.innerHTML = self.config.templates.getSuggestionsSwivelText();
}
},'*', this.config.overlayParent);
},
setToggleSuggestions : function(){
var cb = this;
var suggestionsEl = HD.util.Common.get('sgButton');
if(suggestionsEl){
suggestionsEl.onclick = function(){
cb.toggleSuggestions();
return false;
};
}
},
getFileExtension : function(file) {
if(file == null) {
return "";
}
return file.substring(file.lastIndexOf("."));
},
isSupportedVideoFile : function(fileExtension) {
return this.isSupportedType(fileExtension, this.supportedVideoTypes);
},
isSupportedPhotoFile : function(fileExtension) {
return this.isSupportedType(fileExtension, this.supportedPhotoTypes);
},
isSupportedType : function(type, supportedTypes) {
if(type == null || supportedTypes == null) {
return false;
}
type = type.toLowerCase();
for(var i = 0, len = supportedTypes.length; i < len; i++) {
if(supportedTypes[i] == type) {
return true;
}
}
return false;
},
showError : function(errorText, refEl) {
refEl = HD.get(refEl);
refEl.innerHTML += "
" + errorText + "
"
},
analyticsUploadBothString : function() {
return "default_analyticsUploadBothString";
},
analyticsUploadPhotoString : function() {
return "default_analyticsUploadPhotoString";
},
analyticsUploadVideoString : function() {
return "default_analyticsUploadVideoString";
},
analyticsUploadString : function() {
if (this.config.contentType == 'photo') {
HD.util.Analytics.track(this.analyticsUploadPhotoString());
}
else if (this.config.contentType == 'video') {
HD.util.Analytics.track(this.analyticsUploadVideoString());
}
else if (this.config.contentType == 'both') {
HD.util.Analytics.track(this.analyticsUploadBothString());
}
else {
return "default_analyticsUploadString";
}
},
analyticsUploadConfirmationString : function(contentType, category) {
return "default_analyticsUploadConfirmationString";
}
};
HD.extend(HD.UploadWidget, [HD.Widget]);
HD.register('hd_upload_widget', 'HD.UploadWidget', {version: "1.0", build: "1"});