Focal Point Banner


As of December 1, 2020, Focal Point is retired and repurposed as a reference repository. We value the wealth of knowledge that's been shared here over the years. You'll continue to have access to this treasure trove of knowledge, for search purposes only.

Join the TIBCO Community
TIBCO Community is a collaborative space for users to share knowledge and support one another in making the best use of TIBCO products and services. There are several TIBCO WebFOCUS resources in the community.

  • From the Home page, select Predict: WebFOCUS to view articles, questions, and trending articles.
  • Select Products from the top navigation bar, scroll, and then select the TIBCO WebFOCUS product page to view product overview, articles, and discussions.
  • Request access to the private WebFOCUS User Group (login required) to network with fellow members.

Former myibi community members should have received an email on 8/3/22 to activate their user accounts to join the community. Check your Spam folder for the email. Please get in touch with us at community@tibco.com for further assistance. Reference the community FAQ to learn more about the community.


Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Gadgets / Widgets Creation used in the Portal 201 Lab at Summit 2015

Read-Only Read-Only Topic
Go
Search
Notify
Tools
[SOLVED] Gadgets / Widgets Creation used in the Portal 201 Lab at Summit 2015
 Login/Join
 
Member
posted
Hello,

I was in the lab 'Portal 201' at Summit 2015 and I was looking back at some of my documentation. The webfocus forum won't let me attach a screenshot of the document that IBI handed out that shows them putting four KPI metric gadgets/widgets into a portal. I did post a message in the PMF forum so if you go look there you can see the screenshot. In case you can't see the screenhot, the first one is a blue rectangle with 'Gross Profit', and number of 12,111K in white font. It has four other pieces of data in the gadget. I don't remember them mentioning where the four gadgets were created. Did they use PMF to create them or did they create them using Report Painter or HTML Composer? We haven't upgraded to App Studio yet but I still thought I could create something similar. I wanted to put a sample dashboard together with four gadgets like they had for my team so they could see whats possible in the portal. Any help pointing me to where they developed the gadgets would be a great help!

Thanks!

This message has been edited. Last edited by: <Kathryn Henning>,


WebFOCUS 8.104
Windows, All Outputs
 
Posts: 28 | Location: Holland, MI USA | Registered: September 30, 2010Report This Post
Virtuoso
posted Hide Post
Hey kfreers,

I have used them myself already and they are being demoed today at my company.

You need to be on AppStudio 8.1.03 to get them to work correctly (responsive design part in portal).

They, along with other goodies are in IBI's 8.1.03 Responsive Demo that can be found on their site. You get the files, and then import them using the instructions provided.

Here are a bunch of different ones:
http://www.informationbuilders.com/demos

You must be logged into InfoResponse to access it.

Here's the link:
https://techsupport.informatio...nsive_BI_Portal.html

This message has been edited. Last edited by: CoolGuy,


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
Member
posted Hide Post
CoolGuy,

Thanks for the info. This is exactly what I wanted!! I just asked my boss when we were going to upgrade to 8.1 and he couldn't give me a firm date so it might be awhile before I can use the responsive design feature.

I tried to just get the code for the 'Gross_Profit_KPI_Gadget.fex' file from the zip file but it's in XML. In the documentation instructions they warn you about it but it's assuming I'm on 8.1. Could you post the code for that specific fex file in this thread and then I should be able to at least create something similar while still using Dev Studio.

Thanks Again!


WebFOCUS 8.104
Windows, All Outputs
 
Posts: 28 | Location: Holland, MI USA | Registered: September 30, 2010Report This Post
Virtuoso
posted Hide Post
kfreers,

No prob. These demo KPIs were way helpful for us getting the ball rolling on overhauling one of our then dashboard...now portal pieces. I took from the code provided in the demo and took out some things and added additional things. These demos are a great way to get your hands dirty without having to search for how something is done via online docs or forums when possible.

The gadgets are actually functioning through several file dependencies. Not just the "Gross Profit KPI Widget" .fex. All that .fex does is -SET a bunch of ampers specific to that KPI. It then -INCLUDEs 2 other files with an additional dependency on a gadget.css style sheet, .js, etc. I'll share the code for some of it to get you started:

Gross_Profit_KPI_Gadget.fex:
-SET &KPI_NAME = 'Nov. Gross Profit';
-SET &AS_OF_DT = 'As of 11/30/2013';
-SET &ACT_VAL = '5,906K';
-SET &COMP_LBL1 = 'Prev Yr.';
-SET &COMP_LBL2 = '% Change';
-SET &COMP_LBL3 = 'Trend';
-SET &COMP_VAL1 = '250';
-SET &COMP_VAL2 = '+20%';
-SET &COMP_VAL3 = '&|#x25B2;';
-SET &CLASS = 'blue-alert';
-SET &FMTR1 = 'K';
-SET &FMTR2 = 'K';
-SET &FMTR3 = '%';
-DEFAULTH &BUSINESS_REGION = '_FOC_NULL';

-SET &MEASURE = 'WF_RETAIL.WF_RETAIL_SALES.GROSS_PROFIT_US';
-INCLUDE IBFS:/WFC/Repository/WFPMResponsiveDemo/Hidden_Content/gadget/get_wfretail81_kpi.fex

-INCLUDE IBFS:/WFC/Repository/WFPMResponsiveDemo/Hidden_Content/gadget/big_number_gadget_4.fex


get_wfretail81_kpi.fex:
-DEFAULTH &PRODUCT_CATEGORY = '_FOC_NULL';
-DEFAULTH &CUR_YEAR = '2013';
-DEFAULTH &CUR_MTH = '11';
-DEFAULTH &TARGET = '2.0';
-DEFAULTH &MEASURE = 'WF_RETAIL.WF_RETAIL_SALES.REVENUE_US';
-DEFAULTH &BUSINESS_REGION = '_FOC_NULL';

-SET &PREV_YEAR = &CUR_YEAR -1;

DEFINE FILE wfretail81/wf_retail
SALE_UNITY2/D20.2C = SALE_UNITY;
PY_MEASURE/D20.2C = IF WF_RETAIL.WF_RETAIL_TIME_SALES.TIME_YEAR LT &CUR_YEAR THEN &MEASURE ELSE 0;
CY_MEASURE/D20.2C = IF WF_RETAIL.WF_RETAIL_TIME_SALES.TIME_YEAR EQ &CUR_YEAR THEN &MEASURE ELSE 0;
END

TABLE FILE wfretail81/wf_retail
SUM
&MEASURE NOPRINT
CY_MEASURE AS 'ACT_VAL'
PY_MEASURE AS 'COMP_VAL1'
COMPUTE COMP_VAL2/D5 = (CY_MEASURE - PY_MEASURE) / PY_MEASURE * 100;
COMPUTE COMP_VAL3/A10 = IF COMP_VAL2 GE 0 THEN '&|#x25B2;' ELSE '&|#x25BC;';
BY WF_RETAIL.WF_RETAIL_TIME_SALES.TIME_MTH NOPRINT
WHERE WF_RETAIL.WF_RETAIL_TIME_SALES.TIME_YEAR FROM &PREV_YEAR TO &CUR_YEAR
AND WF_RETAIL.WF_RETAIL_TIME_SALES.TIME_MTH EQ &CUR_MTH ;
WHERE WF_RETAIL.WF_RETAIL_PRODUCT.PRODUCT_CATEGORY EQ '&PRODUCT_CATEGORY';
WHERE WF_RETAIL.WF_RETAIL_GEOGRAPHY_CUSTOMER.BUSINESS_REGION EQ '&BUSINESS_REGION';
ON TABLE SET ASNAMES ON
ON TABLE HOLD AS HOLD1 FORMAT BINARY
END
-RUN

-READFILE HOLD1
-RUN


big_number_gadget_4.fex:
-DEFAULTH &KPI_NAME = 'New Patient Visits';
-DEFAULTH &AS_OF_DT = 'Week of 08/17/2014';
-DEFAULTH &ACT_VAL = '300';
-DEFAULTH &COMP_LBL1 = 'Prev Wk.';
-DEFAULTH &COMP_LBL2 = '% Change';
-DEFAULTH &COMP_LBL3 = 'RTO %';
-DEFAULTH &COMP_VAL1 = '250';
-DEFAULTH &COMP_VAL2 = '+20%';
-DEFAULTH &COMP_VAL3 = '+32%';
-DEFAULTH &CLASS = 'blue-alert';
-DEFAULTH &DRILLDOWN = '/ibi_apps/run.bip?BIP_REQUEST_TYPE=BIP_RUN&|BIP_folder=IBFS%253A%252FWFC%252FRepository%252FWFPMResponsiveDemo%252FHidden_Content%252Ffex&|&|BIP_item=coming_soon.fex&|ICD9=';
-DEFAULTH &TOOLTIP = 'Download Longitudinal';
-DEFAULTH &FMTR1 = 'NaN';
-DEFAULTH &FMTR2 = 'NaN';
-DEFAULTH &FMTR3 = 'NaN';
-DEFAULTH &FMTR4 = 'NaN';

-HTMLFORM BEGIN
<html>
<head>
<link rel='stylesheet' id='options_typography_Montserrat-regular-css'  href='https://fonts.googleapis.com/css?family=Montserrat:regular' type='text/css' media='all' />
<link rel='stylesheet' id='options_typography_Montserrat-400-css'  href='https://fonts.googleapis.com/css?family=Montserrat:400' type='text/css' media='all' />
<link rel="stylesheet" type="text/css" href="/ibi_apps/jquery/css/smoothness/jquery-ui.custom.min.css">
<script type="text/javascript" src="/ibi_apps/jquery/js/jquery.min.js"></script>
<script type="text/javascript" src="/ibi_apps/jquery/js/jquery-ui.custom.min.js"></script>
<link rel='stylesheet' href='/ibi_apps/run.bip?BIP_REQUEST_TYPE=BIP_RUN&|BIP_folder=IBFS%253A%252FWFC%252FRepository%252FWFPMResponsiveDemo%252FHidden_Content%252Fcss%252F&|BIP_item=gadget.css' type='text/css' media='all' />
<script>
function downloadLongitudinal() {
window.open("!IBI.AMP.DRILLDOWN;");
}
function formatter(num,mode) {
   if (!isNaN(parseFloat(num))) {
      if (mode == 'K') {
         num = num / 1000;
         if (num < 1000)
            return num.toFixed(1).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'K';
         else
            return num.toFixed(0).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'K';
      }
      if (mode == 'M') {
         num = num / 1000000;
         if (num < 1000)
            return num.toFixed(1).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'M';
         else
            return num.toFixed(0).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'M';
      }
      if (mode == '%') {
         return num.trim() + '%';
      }
   }
   return num;
}

function loadNumbers() {
  $('#num1').html( formatter('!IBI.AMP.ACT_VAL;','!IBI.AMP.FMTR1;') );
  $('#num2').html( formatter('!IBI.AMP.COMP_VAL1;','!IBI.AMP.FMTR2;') );
  $('#num3').html( formatter('!IBI.AMP.COMP_VAL2;','!IBI.AMP.FMTR3;') );
  $('#num4').html( formatter('!IBI.AMP.COMP_VAL3;','!IBI.AMP.FMTR4;') );
}
$(function() {
$( document ).tooltip();
});
</script>
</head>
<body onLoad="loadNumbers()">
<div class="!IBI.AMP.CLASS;" style="border-radius: 0px; padding-top: 5px; padding-bottom: 5px">
<div style="width:100%">
<span style="font-size:1em">!IBI.AMP.KPI_NAME;</span><br>
<span style="font-size:.5em">!IBI.AMP.AS_OF_DT;</span><br>
<span id="num1" style="font-size:2em"></span>
</div>
<div style="width:33%;float:left;padding:0;margin:0">
<span style="font-size:.6em">!IBI.AMP.COMP_LBL1;</span><br><span id="num2"></span>
</div>
<div style="width:33%;float:left;padding:0;margin:0">
<span style="font-size:.6em">!IBI.AMP.COMP_LBL2;</span><br><span id="num3"></span>
</div>
<div style="width:33%;float:left;padding:0;margin:0">
<span style="font-size:.6em">!IBI.AMP.COMP_LBL3;</span><br><span id="num4"></span>
</div>
</div>
</body>
</html>
-HTMLFORM END


gadget.css:
body {
    margin: 0px;
}
.blue-alert {
    position:absolute;
    left:0;
    right:0;
    background-color: #539CD0;
    background: -webkit-linear-gradient(left top, #539CD0, #4B8FBC); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, #539CD0, #4B8FBC); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, #539CD0, #4B8FBC); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, #539CD0, #396D8E); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.green-alert {
    position:absolute;
    left:0;
    right:0;
    background-color: #6CBF6F;
    background: -webkit-linear-gradient(left top, #6CBF6F, #447745); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, #6CBF6F, #447745); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, #6CBF6F, #447745); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, #6CBF6F, #447745); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.orange-alert {
    position:absolute;
    left:0;
    right:0;
    background-color: #EFB662;
    background: -webkit-linear-gradient(left top, #EFB662, #B5894C); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, #EFB662, #B5894C); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, #EFB662, #B5894C); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, #EFB662, #B5894C); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.purple-alert {
    position:absolute;
    left:0;
    right:0;
    background-color: #68548E;
    background: -webkit-linear-gradient(left top, #68548E, #483B63); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, #68548E, #483B63); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, #68548E, #483B63); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, #68548E, #483B63); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.blue2-alert {
    position:absolute;
    left:0;
    right:0;
    background-color: rgb(9,102,179);
    background: -webkit-linear-gradient(left top, rgb(9,102,179), rgb(7,87,152)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, rgb(9,102,179), rgb(7,87,152)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, rgb(9,102,179), rgb(7,87,152)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, rgb(9,102,179), rgb(7,87,152)); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.red-alert {
    position:absolute;
    left:0;
    right:0;
    background: rgb(210,71,38);
    background: -webkit-linear-gradient(left top, rgb(210,71,38), rgb(172,60,32)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, rgb(210,71,38), rgb(172,60,32)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, rgb(210,71,38), rgb(172,60,32)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, rgb(210,71,38), rgb(172,60,32)); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.green2-alert {
    position:absolute;
    left:0;
    right:0;
    background: rgb(43,168,131);
    background: -webkit-linear-gradient(left top, rgb(43,168,131), rgb(35,139,108)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(left top, rgb(43,168,131), rgb(35,139,108)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(left top, rgb(43,168,131), rgb(35,139,108)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to left top, rgb(43,168,131), rgb(35,139,108)); /* Standard syntax */
    color: white;
    font-family: Montserrat;
    font-size: 1.2em;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    border-radius: 10px;
    text-align: center;
    float: left;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
}
.add-green {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    width: 64px;
    height: 64px;
    cursor: pointer;
    background-repeat: no-repeat;
    background: url('/ibi_apps/views.bip?BIP_REQUEST_TYPE=BIP_RUN&BIP_folder=IBFS%253A%252FWFC%252FRepository%252FRDF%252FCommon%252Fimage&BIP_item=button-add_green.png');
}
.add-green:hover {
    opacity: .7;
    filter: alpha(opacity=70);
}
.ui-tooltip {
    display: none;
    background: rgb(240,236,174);
    font-size: 11px;
    padding: 8px;
    color: black;
    z-index: 99;
    border: 2px solid rgb(242,219,70);
    /* for IE */
    filter: alpha(opacity=90);
    /* CSS3 standard */
    opacity: 0.9;
}


The above code should be enough to give you an idea of what the dev did to prep these KPIs for demo. It's nice of IBI to give us some starting points for our projects using their products. I know this code has been a big help to me in learning what I can do with WF8103+.

Good luck!

This message has been edited. Last edited by: CoolGuy,


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
Member
posted Hide Post
Thanks Again! This will give me plenty to work with!!


WebFOCUS 8.104
Windows, All Outputs
 
Posts: 28 | Location: Holland, MI USA | Registered: September 30, 2010Report This Post
Master
posted Hide Post
KFreers,

I haven't built any of those yet, but they do look pretty cool. Essentially its just a real simple report. Its a one line report with the rest of the text as headers. You don't need App studio or a newer version of WebFOCUS to create the gadgets. You can do it in the Report Painter, or just in the text editor if you are comfortable with coding in Text.


Eric Woerle
8.1.05M Gen 913- Reporting Server Unix
8.1.05 Client Unix
Oracle 11.2.0.2
 
Posts: 750 | Location: Warrenville, IL | Registered: January 08, 2013Report This Post
Virtuoso
posted Hide Post
To clarify: I meant in order to get the responsive portal features, you need to be on AppStudio 8.1.03. For everything else, it's open season.


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
Gold member
posted Hide Post
quote:
-DEFAULTH &DRILLDOWN = '/ibi_apps/run.bip?BIP_REQUEST_TYPE=BIP_RUN&|BIP_folder=IBFS%253A%252FWFC%252FRepository%252FWFPMResponsiveDemo%252FHidden_Content%252Ffex&|&|BIP_item=coming_soon.fex&|ICD9=';


CookGuy,

Thank you so much for the demo code. I am working on one of my portal with something similar to this. However I have a question regarding this amp drilldown. What is the coming_soon.fex is doing? Is it a dummy report template or somthing?


WebFOCUS 8.1.05
Windows, All Outputs
 
Posts: 60 | Registered: March 02, 2015Report This Post
Virtuoso
posted Hide Post
WebFocusDiver,

Hello! I don't see myself as much of a cook, but I do like to eat. lol (referencing your having called me CookGuy) No biggie though. ;-)

For the above example, &DRILLDOWN was meant to be a reference URL that would run a simple HTML document that states "Coming soon." until an actual drillable report/graph would switch that out. At this point of development, the IBIer never fully implemented that functionality. I, however, took the idea and finished my own implementation of it.

You simply build your URL string and assign it to either &DRILLDOWN or whatever you'd like to name it. Then, down in your -HTMLFORM markup where you have your Js, add a simple function like the following (if you want to be able to manage your target window):

function runReport() {
     window.open("!IBI.AMP.DRILLDOWN;", "Drilldown", "height=100, width=360, left=200, top=200");
}


Then, finally, you add that function call as an onclick event handler to whatever element you want it for. Like so:

[*]<a href="#" onclick="runReport()">Run report.</a>


Works nicely if you don't want to mess with IBI's HTML Composer tool.

Hope this helps.

P.S.: With the following URL build, you can attach params at its end:
'/ibi_apps/WFServlet.ibfs?IBFS1_action=RUNFEX&IBFS_path=/WFC/Repository/domainFolder/subFolder/drill_report.fex&var1=value1&var2=&otherVar.EVAL&anotherVar=anotherValue&etc=etc';


Took me a bit to figure that out, so I thought I'd share that.

This message has been edited. Last edited by: CoolGuy,


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
Gold member
posted Hide Post
quote:
the following (if you want to be able to manage your target window):

Sorry for not checking my spelling before I sent. Sweating I must be too exited of finding this post. Big Grin Thank you for sharing this. I will try it.


WebFOCUS 8.1.05
Windows, All Outputs
 
Posts: 60 | Registered: March 02, 2015Report This Post
Virtuoso
posted Hide Post
WebFocusDiver,

Don't even sweat it. I was just pulling your chain a bit. That's how I am.

Glad this thread has been helpful for you. This way of building content has been very nice as an option. I eventually found a way to build a top/bottom 5 performers widget that reads the top 5 records from a request and stores them in DM amper variables for later use in my own custom HTML found below the loop construct I created to do just that.


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
Gold member
posted Hide Post
This is nice. I made it to work except the number format convert my negative value to positive. I feel like it's something related to Javacript. But I don't know much about coding. Can someone help me, please? Thanks

function formatter(num,mode) {
if (!isNaN(parseFloat(num))) {
if (mode == 'K') {
num = num / 1000;
if (num < 1000)
return num.toFixed(1).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'K';
else
return num.toFixed(0).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'K';
}
if (mode == 'M') {
num = num / 1000000;
if (num < 1000)
return num.toFixed(1).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'M';
else
return num.toFixed(0).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + 'M';
}
if (mode == '%') {
return num.trim() + '%';
}
}
return num;
}


WebFOCUS 8.1.05
Windows, All Outputs
 
Posts: 60 | Registered: March 02, 2015Report This Post
Virtuoso
posted Hide Post
WebFocusDiver,

Like I was saying above, the IBI person that implemented these examples never really finished everything.

Here is my fleshed out function for formatting big numbers down to a size that is manageable. It takes care of both positive and negative ranges, and also has a way to stick a $ (or whatever you'd like) in front of the values that will be displayed if desired:

function formatNum(num) {
	var suffixK = "K";
	var suffixM = "M";
	if ((num > 999 && num < 1000000)||(num < -999 && num > -1000000)) {
		num = num / 1000;
		num = num.toFixed(1).concat(suffixK);
		return "$" + num;
	}
	else if ((num > 999999)||(num < -999999)){
		num = num / 1000000;
		num = num.toFixed(1).concat(suffixM);
		return "$" + num;
	}
	else {
		return "$" + num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
	}
}


Questions? Let me know.


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1113 | Location: USA | Registered: January 27, 2015Report This Post
  Powered by Social Strata  

Read-Only Read-Only Topic

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Gadgets / Widgets Creation used in the Portal 201 Lab at Summit 2015

Copyright © 1996-2020 Information Builders