How to use OOB report widget as embedded servicenow - widget

For simple listing OOB (out of the box) widget, I can able to write code like this:
HTML:
<widget id="widget-simple-list" options="data.approvalsOption" ></widget>
Server script:
data.approvalsOption = {
"secondary_fields":"u_incident_title",
"always_show":"true",
"table":"incident",
"filter":"",
"display_field":"number",
"maximum_entries":"5"
};
In a similar way, I want to add an embedded report widget, I tried something like this:
HTML inside another widget:
<widget id="report" options="data.reportData" ></widget>
Server script:
data.reportData = {
"report_id":"45ytrhg43trgfgerewrfdads" //My report sys_id
};
I am able to achieve this with page designer and Edit->select_report (but I want as the embedded widget)

Try this:
HTML inside another widget:
<sp-widget widget="c.data.embeddedReport"></sp-widget>
Server Script
var reportOptions = {
report_id: "45ytrhg43trgfgerewrfdads", // Report sys_id
widget_parameters: '{"report_id":{"displayValue":"Report Title" }}'
};
data.embeddedReport = $sp.getWidget("report", reportOptions);

Related

Adding html elements to page with MVC Razor pages

On the html for my page I have a <script id="pagedata"></script> element which I would like to add an element to only if a certain partial is rendered. In my layout.cshtml I have the following:
#if (Brand != null)
{
#Html.Partial("_UseApp");
}
And in my _UseApp.cshtml:
#{
var iosAppUrl = // retrieve iosLink from our CRM database
var androidUrl = // retrieve android link from our CRM database
// Here I want to add the above variables to the <script id=pagedata> in the html page. Something
like this:
PageData.AddPageData("appstore", iosAppUrl);
PageData.AddPageData("playstore", androidUrl);
I cannot work out how to do this - I set breakpoints in the UseApp.cshtml file and the file is being called, but I don't know how to add these script elements. I don't want to just add them into the layout file because I want to keep the app logic separate. Can anyone help? Thanks
My approach to this would be to use jQuery, as reading HTML elements in C# is rather difficult.
In the script below, it checks if the HTML exists, and if it does, we will assign an attribute to it. The second argument in attr() will be your link, note that you can use C# to get the value from your Db, by using the model or ViewBag.
#section Scripts{
<script>
$(document).ready(function () { // on ready
if ($("#replaceWithYourId").length) { // check if ID exists
$("#pagedata").attr("data-playstore", "link") // use jQuery attr method.
}
});
</script>
}

Post HTML code from R to Wordpress

I succesfully put together an RMarkdown file which produces a nice HTML page. You can see the output here: https://www.crazy-geese.at/updates/schedule.html
What I would like to do now is to post the HTML Code to this page on our Wordpress Site: http://www.crazy-geese.at/spielplann-bbl-2018/
So my specific problem is to get the content to the page. I would need to update it regularly and would like to automate it.
Here are some solutions I see:
Update the page directly from R (from RMarkdown?) with the html code (that would be awesome)
Write an external script that does this job (a bash script maybe?)
I'm aware of the packages RWordpress and knit2wp but couldn't figure out how to do it. I also tried iframe but I couldn't get rid of the iframe scrollbars.
Every help would be much appreciated. Thanks!
Using RWordpress works for me using the following code:
if (!require('knitr')) {
install.packages("knitr")
}
if (!require('devtools')) {
install.packages("devtools")
}
if (!require('RWordPress')) {
devtools::install_github(c("duncantl/XMLRPC", "duncantl/RWordPress"))
}
library(RWordPress)
library(knitr)
options(WordpressLogin = c(<user> = '<pwd>'),
WordpressURL = '<blog_url>/xmlrpc.php')
## new post; memorize the returned id
# knit2wp("<Rmd-file>", title = '<title>',
# publish = FALSE, action = "newPost")
## update post
knit2wp("<Rmd-file>", title = '<title>',
publish = FALSE, action = "editPost", postid = <id>)
I typically do some further changes in wordpress's interface, which is why I have publish = FALSE. You can use publish = TRUE if you do not need that.

Dynamic XML Template in TVML/TVJS

Does anyone know how to Dynamically generate a template in an apple tv app using TVJS/TVML? Basically I want to hit my API, get back an array of objects and then insert that data into my XML template.
I've been searching for info on how to accomplish it but have come up short. I've found many tutorials that use hard coded images, videos, etc but nothing dynamically generated.
Any help would be appreciated.
Finally, I've figured this out. It wouldn't be difficult to generate a template on-the-fly, but instead I wanted to reuse the Presenter and the ResourceLoader, and to have the template as a *.xml.js file. Here is the solution I managed to arrive at.
For the initial view, I used a catalogTemplate, as demonstrated in Ray Wenderlich's tutorial. Instead of conference talks, however, I was displaying categories of men's and women's merchandise. Once a category was selected, I wanted to display a stackTemplate with a number of options for that category. The problem was how to pass any information, the title of the category in the simplest case, to the second template.
In the first template, I had the lockups configured like so:
<lockup categoryTitle="Women: Dresses" categoryDir="w-dresses">
<img src="${this.BASEURL}images/dresses.jpg" width="230" height="288" />
<title>Dresses</title>
</lockup>
In application.js, I had a listener attached, in the same way how tutorials show:
doc.addEventListener("select", Presenter.load.bind(Presenter));
Here is the second template (Category.xml.js):
var Template = function(categoryTitle) {
return `<?xml version="1.0" encoding="UTF-8" ?>
<document>
<stackTemplate>
<banner>
<title>${categoryTitle}</title>
</banner>
</stackTemplate>
</document>`
}
This is a JavaScript, so in your case you can pass into the function, say, an array of values and then construct the template accordingly. The tricky part was to pass a value.
First, I made a couple of changes to the ResourceLoader (this can be done better, of course, it's just a proof of concept). I simply added categoryTitle as an additional parameter to the top-level function and when calling the Template:
ResourceLoader.prototype.loadResource = function(resource, callback, categoryTitle) {
var self = this;
evaluateScripts([resource], function(success) {
if(success) {
var resource = Template.call(self, categoryTitle);
callback.call(self, resource);
} else {
var title = "Resource Loader Error",
description = `Error loading resource '${resource}'. \n\n Try again later.`,
alert = createAlert(title, description);
navigationDocument.presentModal(alert);
}
});
}
Finally, in the Presenter, in the load, I am passing categoryTitle to the resourceLoader:
load: function(event) {
var self = this,
ele = event.target,
categoryTitle = ele.getAttribute("categoryTitle");
if (categoryTitle) {
resourceLoader.loadResource(`${baseURL}templates/Category.xml.js`, function(resource) {
var doc = self.makeDocument(resource);
self.pushDocument(doc);
}, categoryTitle);
}
},
This works for me.
One final note: for some categories, I had titles with an ampersand, like 'Tops & T-shirts'. Naturally, I replaced the ampersand with an XML entity: 'Tops & T-shirts'. This, however, didn't work, probably because this string was decoded twice: the first time the entity was turned into an ampersand, and on the second pass the single ampersand was flagged as an error. What worked for me was this: 'Tops &amp; T-shirts'!
It is simple if you are using atvjs.
// create your dynamic page
ATV.Page.create({
name: 'homepage',
url: 'path/to/your/json/data',
template: function(data) {
// your dynamic template
return `<document>
<alertTemplate>
<title>${data.title}</title>
<description>${data.description}</description>
</alertTemplate>
</document>`;
}
});
// later in your app you can navigate to your page by calling
ATV.Navigation.navigate('homepage');
Disclaimer: I am the creator and maintainer of atvjs and as of writing this answer, it is the only JavaScript framework available for Apple TV development using TVML and TVJS. Hence I could provide references only from this framework. The answer should not be mistaken as a biased opinion.
I'm using PHP to generate the TVML files dynamically, configuring the output as text/javascript format:
<?php
header("Content-type: application/x-javascript");
[run your PHP API calls here]
$template = '<?xml version="1.0" encoding="UTF-8" ?>
<document>
... [use PHP variables here] ...
</document>';
echo "var Template = function() { return `". $template . "`}";
?>
You can dynamically generate a template by creating a dynamic string that represents the xml in a TVML template.
Review the code in here: https://developer.apple.com/library/prerelease/tvos/samplecode/TVMLCatalog/Listings/client_js_Presenter_js.html#//apple_ref/doc/uid/TP40016505-client_js_Presenter_js-DontLinkElementID_6
This file has functions that can be used to create an XML document that can represent a view.
You can make an XMLHttpRequest (ex: consuming API JSon calls through TVJS-tvOS) bring back some JSON data and then dynamically generate an XML document that conforms to one of the TVML templates. Parse it into an XML document and then navigate to the document.

generating page title with razor script - umbraco

So I am trying to create a script whereby depending on the document type of the page a certain pre-defined title tag format will appear, if there is nothing already written in an overwriting custom title input. I have inserted the macro within the title tag on my master template but keep on getting an Error loading Razor Script message .
Html
<title>
<umbraco:Macro Alias="NewPageTitle" runat="server"></umbraco:Macro>
</title>
Script -
#inherits umbraco.MacroEngines.DynamicNodeContext
#using umbraco.MacroEngines
#{
if(String.IsNullOrEmpty(#Model.tabName.ToString()) == false )
{
#Model.tabName
}
else if(#Model.DescendantsOrSelf("Country"))
{
<text>
Holidays in #Model.Name
</text>
}
else
{
#Model.Name;
}
}
Any help would be greatly appreciated.
Try this code out. The problem with your original code is that you were using "#Model.DescendantsOrSelf("Country")" as a boolean, and it is a list. I also removed your comparison for if(String.IsNullOrEmpty(#Model.tabName.ToString())).
Also, if you add ?umbDebugShowTrace=true to the end of your URL, you can get some valuable debugging information. There is a Chrome Extension called "Umbraco Debug" that I use to quickly access that query string and information. You may find it useful.
#inherits umbraco.MacroEngines.DynamicNodeContext
#using umbraco.MacroEngines
#{
if(String.IsNullOrEmpty(#Model.tabName.ToString()))
{
#Model.tabName
}
else if(#Model.DescendantsOrSelf("Country").Count() > 0)
{
<text>
Holidays in #Model.Name
</text>
}
else
{
#Model.Name;
}
}
its very simple just add following code into your title tag
#Umbraco.Field("pageName")
will display pageName,you may also add custom properties from document type.
e.g. you have added new property like "metaKeywords" with value "html,javascript,xml",fetch that values as following way...
#Umbraco.Field("metaKeywords")
even you don't need to add custom properties in your model

Umbraco, razor and image gallery

I am new to Umbraco. I am creating an image gallery (called Customers). A Customer has a logo, which is an image.
How do I create a razor macro that outputs a list of customer logos?
I am after the cshtml code, probably something like this:
#inherits umbraco.MacroEngines.DynamicNodeContext
#foreach (var customer in Content.Customers) {
<img src="#customer.logo.umbracoFile" alt="#customer.Name"/>
}
Thanks in advance!
I'm assuming the script executes on the Customers page, and that the content type containing log and url is called Customer:
#foreach(var customer in Model.Customer)
{
<img src="#customer.Media("logo", "umbracoFile")" alt="#customer.Name"/>
}
Model.Customer will give you a list of all children of the current page which are Customers (content type).
Here is the code that works
#inherits umbraco.MacroEngines.DynamicNodeContext
#foreach (var customer in Model.NodeById(1062).Children) {
<img src="#umbraco.IO.IOHelper.ResolveUrl(customer.logo)" alt="#customer.Name"/>
}
for using a dynamic location (macro parameters), you could do two things:
1. setting this in your root document so the user can change the customer slider location (if you would like that):
var RootNode = #Model.NodeById(#Model.AncestorOrSelf(1).HeaderRoot);
Where HeaderRoot is the name of a property on your starting file (root)
2. Using a parameter on your razor script
var rootNode = #Parameter.RootNode;
and use it something like:
#Model.NodeById(rootNode).Children();
so in your code, it would look something like this (not tested):
#inherits umbraco.MacroEngines.DynamicNodeContext
#{ var rootNode = #Parameter.RootNode;}
#foreach (var customer in Model.NodeById(rootNode).Children()) {
<img src="#umbraco.IO.IOHelper.ResolveUrl(customer.logo)" alt="#customer.Name"/>
}