Objects from registerhelper in Handlebars.js / Browserify bundle not printing in Django app on some servers - django

I have a Django site that I'm deploying where I'm using Handlebars.js for templateing. I'm using Browserify to bundle the Javascript. I'm using registerhelper in Handlebars.js to iterate over some objects and print them in modals on click. A sample of this code is below.
I have my Django app deployed on a live dev server (Digital Ocean) and these text boxes are being populated without problem. When I pushed to the production server (university server) these text boxes are not getting populated. Otherwise the Django app is working fine on both live dev and production servers. There are no errors in the console.
The servers are similar but not totally the same. Both are running Ubuntu and Python 2.7 and have the same pip dependancies. We are using the same bundle.js from Browserify on both servers.
I don't know if this is a code problem or a dependency problem and it's driving me nuts because the deployment completely works on the live dev server. Any advice would be welcome.
Below is an example of my Handlebars code:
{{#countryListTitle attributes.works 'Projects'}}
<div class="row">
<div class="col-sm-12"><h3>Projects</h3></div>
{{#each attributes.works}}
{{#countryListContent attributes ../attributes.full_name 'Projects'}}
{{/countryListContent}}
{{/each}}
</div>
{{else}}
{{/countryListTitle}}
Below is an example of my related Javascript code:
registerHBHelpers: function(){
Handlebars.registerHelper('countryListTitle', function(works, needle, options) {
var yes = 0;
$.each(works, function(key, value) {
if (value.attributes.work_types[0].attributes.name == needle) {
yes = 1;
}
});
if(yes == 1) {
return options.fn(this);
} else {
return options.inverse(this);
}
});
Handlebars.registerHelper('countryListContent', function(attributes, full_name, type, options) {
var output = '';
var periodicals = '';
var publishers = '';
for(var i=0, l=attributes.work_types.length; i<l; i++) {
// add item name if the type is the type passed to the helper
if (attributes.work_types[i].attributes.name == type) {
output = output + '<div class="col-sm-12"><h4>' + attributes.title + '</h4></div>';
// add publication info if a publication
if (attributes.publicationinfo) {
var d = new Date(attributes.publicationinfo.date_published);
var month = d.getMonth() + 1; //Months are zero based
var year = d.getFullYear();
switch (month)
{
case 1:
month = 'January';
break;
case 2:
month = 'February';
break;
case 3:
month = 'March';
break;
case 4:
month = 'April';
break;
case 5:
month = 'May';
break;
case 6:
month = 'June';
break;
case 7:
month = 'July';
break;
case 8:
month = 'August';
break;
case 9:
month = 'September';
break;
case 10:
month = 'October';
break;
case 11:
month = 'November';
break;
case 12:
month = 'December';
break;
default:
month = '';
break;
}
if (attributes.publicationinfo.periodicals.length > 0) {
periodicals = attributes.publicationinfo.periodicals[0].trim() + ', ';
}
if (attributes.publicationinfo.publishers.length > 0) {
publishers = attributes.publicationinfo.publishers[0].trim() + ', ';
}
output = output + '<div class="col-sm-12"><p class="modal-fine-print">' + periodicals + publishers + 'Published ' + month + ' ' + year + '</p></div>';
// add buffer of no unordered lists will appear
if (attributes.topics.length === 0 && attributes.faculty.length === 0) {
output = output + '<div class="buffer"></div>';
}
}
if (attributes.faculty.length > 0) {
output = output + '<div class="col-sm-12"><p class="modal-list-first-element"><strong>Faculty</strong></p><p>';
for(var e=0, p=attributes.faculty.length; e<p; e++) {
if (attributes.faculty[e].attributes.home_page !== '') {
output = output + '' + attributes.faculty[e].attributes.full_name + '<br />';
} else {
output = output + '' + attributes.faculty[e].attributes.full_name + '<br />';
}
}
output = output + '</p></div>';
}
if (attributes.topics.length > 0) {
output = output + '<div class="col-sm-12"><p class="modal-list-first-element"><strong>Topics</strong></p><p>';
for(var h=0, m=attributes.topics.length; h<m; h++) {
output = output + attributes.topics[h].attributes.name + '<br />';
}
output = output + '</p></div>';
}
output = output + '<div class="buffer"></div>';
}
}
return new Handlebars.SafeString(output);
});
},
Lee

Figured this out - there was a change in an object name in the database. It was hard to debug, but simple problem in the end.

Related

Ember Cli - Added Polyfill Internet Explorer Error Object Expected

I have a problem and I don't see someone who has this kind of problem with this.
Basically I made a helper to format a date, it has some syntax of EcmaScript like let, or expoorts.
Its working in all the browsers except INTERNET EXPLORER, so I though ok its time to configure Polyfill, so I read the documentation to configure it with ember-cli-babel and I am not able to see the results as expected.
I have an ember app, with ember cli
DEBUG: -------------------------------
DEBUG: Ember : 2.14.1
DEBUG: jQuery : 2.2.4
DEBUG: -------------------------------
I include POLYFILL in my broccoli file like this
ember-cli
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
'ember-cli-babel': {
includePolyfill: true
},
storeConfigInMeta: false,
minifyJS: {
enabled: false
},
minifyCSS: {
enabled: false
},
vendorFiles: {
'jquery.js': {
development: 'bower_components/jquery/dist/jquery.js',
production: false,
development: false
}
}
});
app.import('vendor/jquery.lumanetix.all.min.js');
return app.toTree();
};
I have a ember helper to format a date here it is:
import Ember from 'ember';
export function dateAuctionFormat(date/*, hash*/) {
let dateObj = new Date(date);
let monthName = getMonthName(dateObj.getUTCMonth());
let dayNumber = dateObj.getUTCDate();
dayNumber = dayNumber + formatDateNotation(dayNumber);
let dayName = getWeekDayName(dateObj.getDay());
let time = dateObj.toLocaleString('en-US', { hour: 'numeric', minute:'numeric', hour12: true });
return dayName + ' ' + dayNumber + ' ' + monthName + ' ' + time;
}
function getMonthName(date) {
let month = [];
month[0] = "Jan";
month[1] = "Feb";
month[2] = "March";
month[3] = "April";
month[4] = "May";
month[5] = "June";
month[6] = "July";
month[7] = "Aug";
month[8] = "Sept";
month[9] = "Oct";
month[10] = "Nov";
month[11] = "Dec";
return month[date];
}
function getWeekDayName(date) {
let weekday = new Array(7);
weekday[0] = "Sunday";
weekday[1] = "Monday";
weekday[2] = "Tuesday";
weekday[3] = "Wednesday";
weekday[4] = "Thursday";
weekday[5] = "Friday";
weekday[6] = "Saturday";
return weekday[date];
}
function formatDateNotation(d) {
if (d > 3 && d < 21) {
return 'th';
}
switch (d % 10) {
case 1: return "st";
case 2: return "nd";
case 3: return "rd";
default: return "th";
}
}
export default Ember.Helper.helper(dateAuctionFormat);
But when Internet Explorer 11 is rendering the site, I have an error in the debugger like this:
The error said Object Expected.
and you can see the error showing just after the line
export default App.extend({
// rootElement: '#listings-search'
});
So I don't know from where start, I try to modify a little bit, app.js, but no luck, also I tried to convert my ES6 code to ES5 with this converter:
https://babeljs.io/repl/
But of course it didn't work and also its not the idea.
I believe you need to add target to your targets config. You can use this list:
https://github.com/ai/browserslist#queries
This targets file is later used by Babel to determine which features are supported by browsers and this later affects transpiled JavaScript.

App Part issues, spPageContextInfo

I am trying to create an SharePoint hosted app that contains an app part, this app part should show what the user is following. I have used working code as an example in the app, but I don't get it to work inside of the App Part.
I get this within the app part: "Uncaught ReferenceError: _spPageContextInfo is not defined".
If anyone has a real example how to make this work inside an app part, and using social.following, please help!
This is the code in App.js:
var headline = new Array("People", "Documents", "Sites");
var ActorImg = new Array("/_layouts/15/images/person.gif", "/_layouts/15/images/lg_ICGEN.gif", "/_layouts/15/images/siteicon_16x16.png");
function doJSON(RESTuri, success, fail) {
var restUrl = _spPageContextInfo.webAbsoluteUrl + RESTuri;
var executor = new SP.RequestExecutor(_spPageContextInfo.webAbsoluteUrl);
executor.executeAsync(
{
url: restUrl,
method: "GET",
headers: { "Accept": "application/json; odata=verbose" },
success: success,
error: fail
}
);
}
function renderSuccess(data) {
var jsonObject = JSON.parse(data.body);
var n = document.getElementById('jsonout');
n.innerHTML = data.body;
var results = jsonObject.d.Followed.results;
var str = '';
var old = -1;
var img = null;
for (j = 0; j < 5; j++) {
str += "<div class=\"container container" + j + "\">";
for (i = 0; i < results.length; i++) {
if (j != results[i].ActorType) continue;
if (old != results[i].ActorType) str += "<h1 class=\"headline" + results[i].ActorType + "\">" + headline[results[i].ActorType] + "</h1>";
img = results[i].ImageUri;
if (img == null) img = ActorImg[results[i].ActorType];
switch (results[i].ActorType) {
case 0:
// Use case: depending on ActorType if you want to use indiviual markup for every item-type
str += "<a title=\"" + results[i].Name + "\" class=\"link" + results[i].ActorType + "\" style=\"background-image:url(" + img + ")\" href=\"" + results[i].Uri + "\">" + results[i].Name + "</a>";
break;
default:
str += "<a title=\"" + results[i].Name + "\" class=\"link" + results[i].ActorType + "\" style=\"background-image:url(" + img + ")\" href=\"" + results[i].Uri + "\">" + results[i].Name + "</a>";
break;
}
old = results[i].ActorType;
}
str += "</div>";
}
n = document.getElementById('htmlout');
n.innerHTML = str + "<h1></h1>";
}
function renderFail(data, errorCode, errorMessage) {
n = document.getElementById('htmlout');
n.innerHTML = errorMessage;
}
$(document).ready(function () {
doJSON("/_api/social.following/my/followed%28types=15%29", renderSuccess, renderFail);
});
This is the div that's being used in both the app page(default.aspx) and the app part page(AppPart.aspx):
<div class="classic">
<pre id="jsonout" style="display: none;"></pre>
<div id="htmlout"></div>
</div>
Sorry guys. I solved it by just adding a reference to the sp.requestexecutor.js file, and parsed the host- and app-url from the querystring

Random alert text and pop up only once

I'm try to write up code that will allow me to create a message with text that randomly displays one of three messages. In addition, this message will appear as an alert after you click a button. I now want to also program the button so it will only appear once per user. I've been able to make the random text part work, but not the one-time pop up feature. Let me know what I should do! Below is my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Random thingy</title>
<script language type="text/javascript">
<!--
function getMessage() {
var ar = new Array(20)
ar[0] = "your assignment will be GRADED"
ar[1] = "your assignment will be UNGRADED"
ar[2] = "your assignment will be FUN"
// add as many more that you can stand but make
// sure you update the value '7' in the alert box
var now = new Date()
var sec = now.getSeconds()
alert("Your Grading Scheme:\n\n" + ar[sec % 3])
}
<!-- Begin
var expDays = 1; // number of days the cookie should last
var page = "only-popup-once.html";
var windowprops = "width=300,height=200,location=no,toolbar=no,menubar=no,scrollbars=no,resizable=yes";
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
}
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function checkCount() {
var count = GetCookie('count');
if (count == null) {
count=1;
SetCookie('count', count, exp);
alert('MESSAGE');
}
else {
count++;
SetCookie('count', count, exp);
}
}
// End -->
</script>
</head>
<body onLoad="getMessage(); checkCount()">
<form>
<input type="button" name="again" value="Your Self-Assessment Grading Scheme. Click To Find Out." onClick="getMessage()">
</form>
</body>
</html>

jQuery DatePicker calendar not returning correct month

I am soooo close here. I'm hoping a guru can help me with this last piece. I'm populating a jQuery DatePicker calendar with XML from an RSS feed. Upon clicking a highlighted date where there's an event, I'm creating a URL with a query string so I can display all the event for the clicked day. Everything is working... until I change the month by clicking previous or next month. My script will return the correct day, but is only returning the current month. For example, I navigate to May and click the 5th, my URL will be events.htm?month=june&day=5. Any ideas on why it will not return my selected month? Here's my code:
var data = $.ajax({
url: "news.xml",
type: "GET",
dataType: "xml",
async:false,
success: function(xml){
return xml;
}
} ).responseText;
$(document).ready(function() {
var events = getSelectedDates();
$("div.datepicker").datepicker({
beforeShowDay: function(date) {
var result = [true, '', null];
var matching = $.grep(events, function(event) {
return event.published.getDate() === date.getDate() && event.published.getMonth() === date.getMonth() && event.published.getFullYear() === date.getFullYear();
});
if (matching.length) {
result = [true, 'highlight', null];
}
return result;
},
onSelect: function(dateText) {
var date, selectedDate = new Date(dateText),
i = 0,
event = null;
while (i < events.length && !event) {
date = events[i].published;
if (selectedDate.getFullYear() === date.getFullYear() &&
selectedDate.getMonth() === date.getMonth() &&
selectedDate.getDate() === date.getDate()) {
event = events[i];
}
i++;
}
if (event) {
var eMonNum = event.published.getMonth();
var d = new Date();
var eMonNum = new Array();
eMonNum[0] = "january";
eMonNum[1] = "february";
eMonNum[2] = "march";
eMonNum[3] = "april";
eMonNum[4] = "may";
eMonNum[5] = "june";
eMonNum[6] = "july";
eMonNum[7] = "august";
eMonNum[8] = "september";
eMonNum[9] = "october";
eMonNum[10] = "november";
eMonNum[11] = "december";
var eMon = eMonNum[d.getMonth()];
var eDay = event.published.getDate();
window.location = "events.htm?month="+eMon+"&day="+eDay;
}
}
});
});
function getSelectedDates() {
return $(data).find('entry').map(function() {
return {
title: $('title', this).text(),
published: new Date($('published', this).text())
};
}).get();
}
Found the problem, when you copied this list from a resource, you forgot to replace the variables.
CHANGE (at the end of month list)
var eMon = eMonNum[d.getMonth()];
TO:
var eMon = eMonNum[event.published.getMonth()];
All I did was get rid of the bad variable and reassigned your month variable to the one you used for the day. You can also remove the declaration of the d variable, as you will not need it.
Best of luck!

Google Friend Connect fcauth cookie in php

this may be easy for most of you .. but not me.
I am using some "sample" Google code - as it fits my purpose so why change what works - but for the life of me I cannot access/find/get etc the FCAuth cookie after a user is logged in.
Help please - thanks in advance.
Here is my code (the Site ID is in a set variable, and all the calls work todate. just need to find/get the FCAuth cookie.
var viewer, ownerFriends, activities;
google.friendconnect.container.setParentUrl('/api/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.loadOpenSocialApi({
site: SITE_ID,
onload: function() { initAllData(); }});
function initAllData() {
var params = {};
params[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] =
[opensocial.Person.Field.ID,opensocial.Person.Field.NAME,opensocial.Person.Field.THUMBNAIL_URL,opensocial.Person.Field.PROFILE_URL];
var req = opensocial.newDataRequest();
req.add(req.newFetchPersonRequest('VIEWER', params), 'viewer');
req.add(req.newFetchPeopleRequest(
new opensocial.IdSpec({'userId' : 'OWNER', 'groupId' : 'FRIENDS'}), params),
'ownerFriends');
req.add(req.newFetchActivitiesRequest(new opensocial.IdSpec({'userId' : 'OWNER', 'groupId' : 'FRIENDS'})), 'activities');
var idspec = new opensocial.IdSpec({ 'userId' : 'VIEWER','groupId' : 'FRIENDS' });
req.add(req.newFetchPeopleRequest(idspec), 'viewer_friends');
req.send(onData);
req.send(setupData);
};
function setupData(data) {
ownerFriends = data.get('ownerFriends').getData().asArray();
var html = "";
for (var i = 0; i < ownerFriends.length && i < 8; i++) {
var person = ownerFriends[i];
html += "<a title='" + person.getField("displayName") + "' href='" + person.getField("profileUrl") + "'>";
html += "<img class='memberPhoto' src='" + person.getField("thumbnailUrl") + "' width='50px' alt='" + person.getField("displayName") + "'/>";
html += "</a> ";
};
document.getElementById('members').innerHTML = html;
viewer = data.get('viewer').getData();
if (viewer) {
document.getElementById('memberstate').innerHTML =
'<h2>' + viewer.getField("displayName") + ' welcome to the Yoga Council of Canada </h2>' ;
} else {
document.getElementById('memberstate').innerHTML =
'<h2>Join with one click</h2> After joining, you will automatically appear as a recent member.';
}
viewer = data.get('viewer').getData();
if (viewer) {
document.getElementById('profile').innerHTML =
'<img align="left" src="' + viewer.getField("thumbnailUrl") + '" style="margin-right: 20px;" >' +
'<strong>' + viewer.getField("displayName") + '</strong><br>' +
'Settings<br>' +
'Invite a friend<br>' +
'Sign out<br>';
} else {
google.friendconnect.renderSignInButton({ 'id': 'profile' });
}
};
function onData(data) {
if (!data.get("viewer_friends").hadError()) {
var site_friends = data.get("viewer_friends").getData();
var list = document.getElementById("friends-list");
list.innerHTML = "";
site_friends.each(function(friend) {
list.innerHTML += "<li>" + friend.getDisplayName() + "</li>";
});
}
};
OK, I am/was being totally thick, the cookie is automatically set as
$_COOKIE['fcauth<your appID>'];
So you can "just call it" i.e.
<?php if($_COOKIE['fcauth<your appID>']): do something endif; ?>