Trying to use Mustasche in Tinymce preview - tinymce

As the title suggests I am trying to get Mustasche templates to work in the Tinymce preview but it does not work.
In Tinymce Plugins/Preview/plugin.js
previewHtml = (
'<!DOCTYPE html>' +
'<html>' +
'<head>' +
'<script type="text/javascript" src="~/Scripts/mustache.js"></script>' +
headHtml +
'</head>' +
'<body id="' + bodyId + '" class="mce-content-body ' + bodyClass + '"' + dirAttr + '>' +
editor.getContent() +
'</body>' +
'</html>'
);
Stuff to preview:
var obj1 = { user: "John", age: 22, country: "United States" };
{{obj1.user}}

It is fixed now and this is how it's done:
In Tinymce Plugins/Preview/plugin.js
var json = $.parseJSON($('#yourtextarea').val());
previewHtml = (
'<!DOCTYPE html>' +
'<html>' +
'<head>' +
headHtml +
'</head>' +
'<body id="' + bodyId + '" class="mce-content-body ' +
bodyClass + '"' + dirAttr + '>' +
Mustache.to_html(editor.getContent(),json)
+
'</body>' +
'</html>'
);

Related

HTML String on Object Property Won't Update

I have an object constructor that sets some properties, and later uses them to concatenate a string to write to the DOM. I can see that this works in some cases, but not in others.
function Fighter(name, level, attackPts, defencePts, imgSource) {
// TRUNCATED PROPERTY ASSIGNMENTS AREA:
this.attackPts = attackPts;
this.defencePts = defencePts;
// DOM ELEMENT CONSTRUCTORS:
this.img = "style='background: #444 url(" + imgSource + ") no-repeat center'";
this.char_card_name = "<h3>" + this.name + "</h3>";
this.char_card_hitdef = "<h4>" + this.attackPts + "/" + this.defencePts + "</h4>";
this.char_card = "<div class='fighter " + faction + "' " + "id='" + this.name + "'>" + this.img + this.char_card_name + this.char_card_hitdef + "</div>";
In a game function later on I modify the attack and defense points for this "Fighter" object, and that works as expected, and my console.log() tests verify that the concatenated properties also update . . . . up until the final string to pull it all together and display:
this.char_card = "<div class='fighter " + faction + "' " + "id='" + this.name + "'>" + this.img + this.char_card_name + this.char_card_hitdef + "</div>";
When I log this property, those attack and defense numbers don't budge, even though they update successfully in the previous property, this.char_card_hitdef
What could I be overlooking here? I crawled all over the web looking for scope or variable reference issues, but my log statements bring me right back to this one pinching point.
Because you are still in the constructor, you need to refer to the variables without this. that are a parameter AND property of the Object Fighter.
So change
this.char_card = "<div class='fighter " + faction + "' " + "id='" + this.name + "'>" + this.img + this.char_card_name + this.char_card_hitdef + "</div>";
to
this.char_card = "<div class='fighter " + faction + "' " + "id='" + name + "'>" + this.img + this.char_card_name + this.char_card_hitdef + "</div>"
And all other properties that refer to properties above them.
You can read more about constructors here

How to add 2 lines of label on X axis on Fusion Chart?

The purpose is to have 2 lines of text on the X axis for each bar.
e.g
JUN
2018
and style each line in a different way ( like color the year label in green ) .
Can we do it?
This is how I populate the bars in a custom way.
str += '<set label="' + months[i].toUpperCase() + ' ' + currentyear + '" value="' + amount + '" color="08cf77" toolText="' + cur_symbol + amount + '" />\n';
Simply use
'
'
So the line should be updated as;
str += '<set label="' + months[i].toUpperCase() + '
' + currentyear + '" value="' + amount + '" color="08cf77" toolText="' + cur_symbol + amount + '" />\n';

Cordova geolocation timestamp

Timestamp(location.getTime()) returned by this plugin is same as mobile device and not of GPS server. I have tested the same on Android 5 version. Please advise.
Given below is the code.
navigator.geolocation.getCurrentPosition(onSuccess, onError);
var onSuccess = function(position) {
$scope.currentPosition.lat = position.coords.latitude;
$scope.currentPosition.lon = position.coords.longitude;
$scope.currentPosition.timestamp = position.timestamp;
alert('Latitude: ' + position.coords.latitude + '\n' +
'Longitude: ' + position.coords.longitude + '\n' +
'Altitude: ' + position.coords.altitude + '\n' +
'Accuracy: ' + position.coords.accuracy + '\n' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '\n' +
'Heading: ' + position.coords.heading + '\n' +
'Speed: ' + position.coords.speed + '\n' +
'Timestamp: ' + position.timestamp + '\n' +
'Date time: ' + new Date(position.timestamp) + '\n');
};
I need to store this position.timestamp for some purpose but it is giving mobile time and not of GPS server. User can manipulate this time which will defeat the application purpose. Let me know if any more info is required.

Retargeting in Fb,Google

I have a campaign and pixel Id for Fb and Google both which looks something like this.
Can some one tell me how can I implement retargeting pixel in FB, google. What are the changes do I need to make in this dynamicaly generated Pixel script?
PixelScript = PixelScript + "<script>(function(){" + Environment.NewLine +
"window._fbds = window._fbds || {};" + Environment.NewLine +
"_fbds.pixelId = " + FB_Pixel + ";" + Environment.NewLine +
"var fbds = document.createElement(\"script\");" + Environment.NewLine +
"fbds.async = true;" + Environment.NewLine +
"fbds.src = \"//connect.facebook.net/en_US/fbds.js\";" + Environment.NewLine +
"var s = document.getElementsByTagName(\"script\")[0];" + Environment.NewLine +
"s.parentNode.insertBefore(fbds, s);" + Environment.NewLine +
"})();" + Environment.NewLine +
"window._fbq = window._fbq || [];" + Environment.NewLine +
"window._fbq.push([\"track\", \"PixelInitialized\", {}]);" + Environment.NewLine +
"</script>" + Environment.NewLine +
"<noscript><img height=\"1\" width=\"1\" border=\"0\" alt=\"\" style=\"display:none\" src=\"https://www.facebook.com/tr?id=" + FB_Pixel + "&ev=NoScript\" /></noscript>";
The given pixel is enough to drop cookies on the website. No need to add anything.

minimum update time in phoneGap App with watchPosition or getCurrentPosition?

I am having some trouble when update GPS location very fast, I need update location every 100ms. In my solutions I observe that the GPS location will update every second and not faster :(
I've try with setInterval:
function localize(){
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(function(position){
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
'Longitude: ' + position.coords.longitude + '<br />' +
'Altitude: ' + position.coords.altitude + '<br />' +
'Accuracy: ' + position.coords.accuracy + '<br />' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '<br />' +
'Heading: ' + position.coords.heading + '<br />' +
'Speed: ' + position.coords.speed + '<br />' +
'Timestamp: ' + position.timestamp + '<br />';
},function(error){
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}, { maximumAge:100, timeout:100, enableHighAccuracy:true });
}else{
handleNoGeolocation(false);
}
}
localize();
setInterval(localize, 100);
}
with setTimeout:
localize();
function localize(){
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(function(position){
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
'Longitude: ' + position.coords.longitude + '<br />' +
'Altitude: ' + position.coords.altitude + '<br />' +
'Accuracy: ' + position.coords.accuracy + '<br />' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '<br />' +
'Heading: ' + position.coords.heading + '<br />' +
'Speed: ' + position.coords.speed + '<br />' +
'Timestamp: ' + position.timestamp + '<br />';
},function(error){
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}, { maximumAge:100, timeout:100, enableHighAccuracy:true });
setTimeout(localize, 100);
}else{
handleNoGeolocation(false);
}
}
setInterval(localize, 100);
}
or whatchPosition:
localize();
function localize(){
if(navigator.geolocation)
{
navigator.geolocation.watchPosition(function(position){
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
'Longitude: ' + position.coords.longitude + '<br />' +
'Altitude: ' + position.coords.altitude + '<br />' +
'Accuracy: ' + position.coords.accuracy + '<br />' +
'Altitude Accuracy: ' + position.coords.altitudeAccuracy + '<br />' +
'Heading: ' + position.coords.heading + '<br />' +
'Speed: ' + position.coords.speed + '<br />' +
'Timestamp: ' + position.timestamp + '<br />';
},function(error){
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}, { maximumAge:100, timeout:100, enableHighAccuracy:true });
setTimeout(localize, 100); //with or without
}else{
handleNoGeolocation(false);
}
}
}
I've tried with or without maximumAge and timeout option.
My device is iPhone 5.
GPS devices in consumer phones update not more than once a second.
You will not get a 100ms interval, whatever you do.
So change your algorithm (interpolate) to work with 1 s.
Yes Gps can't send an update up to 1s.
And I find this in the Android project made by Cordova. I think this can help you. Maybe it's the same thing in IOS project ?
I just discover one masive problem in Cordova/PhoneGap : - When you open the Android project built by cordova (in commandline), the requestUpdate is set at ..... 60 Seconds !!!!!!!!!!! You have a new Location every Minute ! Evenif you use GPS (enableHighAccuracy="true"). So try to set this at 1000 where you find LocationManager.GPS_PROVIDER in org.apache.cordova.geolocation package -> GPSListener class !
Coco