Project for the Web Accelerator Integration - Pre-Integration Setup – Support

This article explains how to set up an integration between OnePlan and Project for the Web (P4W) using the Accelerator. The Accelerator applies useful customizations to the Project for the Web Power App.

The integration focuses on streamlining data between OnePlan and Project for the Web.

Files

OnePlan Backup: OnePlan(!Power Apps Accelerator Project Template)2022_09_15.backup

OnePlan Accelerator: OnePlanProjectAccelerator_21_0_0_15.zip

Licenses

Accelerator + Project for the Web: Project Plan 1

Accelerator + Project for the Web + Power BI: M365 / Project Plan 1 & Power BI

OnePlan Pre-Integration Setup

Create a Blank OnePlan Group

Log into my.oneplan.ai/home/newgroup.
Give the group a Name.
Click Create Group. This will create a new completely blank OnePlan group.
Once the group has been made, contact OnePlan to enable Advanced settings in the OnePlan configuration.

Import Backup into OnePlan

In the OnePlan Configuration, navigate to Backup / Restore.
Click Import Backup.
Check the Include Content box.
Select Browse to locate the backup.
Select the OnePlan(!Power Apps Accelerator Project Template)2022_09_15.backup file.
Select Restore.

Set Up Timesheet Periods

In the OnePlan Config, navigate to Time Plan.
Click on the + next to Periods.
Select Bulk Periods.
Choose a Start date for your periods to begin on.
Pick how many days are assigned in a period.
Pick the number of periods to be made in bulk.
Click Add.

Power Apps Pre-Integration Setup

Project for the Web Accelerator

Log into make.powerapps.com.
On the Top right of the page, click on the environment that has Project for the Web.
Expand the Navigation Menu on the left (three horizontal lines), click on Solutions.
You should see a few Display Names with the name of Project and variations of the name with msdyn_ProjectServiceCore.
At the top of the page, click on Import Solution.
Click Browse to locate Project_for_the_Web_Accelerator_1_7_0_5.zip.
Click Next.
Click Next.
Expand the Select a connection dropdown and click on + New Connection. This will bring the Microsoft Dataverse window appear asking for consent of use.
Click Create.
Login using Mod Administrator credentials.
Return to the Import a Solution page and click on Refresh. The connection information will be filled in.
Click Import. This will take a few minutes to import.

OnePlan Project Accelerator

Click Import Solution.
Click Browse to locate the OnePlanProjectAccelerator_21_0_0_15.zip.
Click Next.
Click Import. Wait until solution successfully imports.
Once both Accelerators are imported into the new environment, click on Publish All Customizations.

Modify OnePlan Project Accelerator

Remote the Extra Financials Tab

In make.powerapps.com, click on Solutions.
Click on OnePlan Project Accelerator. A new page will load.
Make sure that in the far-left panel, the Objects section is highlighted.
In the Objects panel, expand Tables, expand Project, click on Forms.
Click on Information. The Forms Template page will load.
Click on the ellipses and select Switch to Classic. A new tab will load with the classic editor.
Click Ok.
In the top left corner of the page, there is the Quick Launch that shows all the sections of the OnePlan Accelerator.
Important

Notice there are two Financials tabs:
- The top Financials tab, when clicked, will have the words Solution: OnePlan Project Accelerator, and Form: Project. Beneath the words are two boxes: Financials > Section > oneplan_FinancialPlanner. This is the Financials tab to keep.
- The second Financials tab will only have the OnePlan Project Accelerator, and Form: Project words (no boxes underneath). This is the Financials tab that must be deleted.
Click on the second Financials tab.
Click Remove. An alert will appear confirming the deletion.
Click Ok.
Click Save.
Click Publish. A yellow box will appear with the word Publishing Customizations in the middle.
Return to the previous browser tab that shows the Forms Template, in the top right of the page, click Publish.

Update code for Timesheets

Change the URL in the Code Snippet

<html><head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="ClientGlobalContext.js.aspx" type="text/javascript"></script>
    <meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta><meta></head>
    
    <body style="word-wrap: break-word;"onfocusout="parent.setEmailRange();" lang="en-US">
    
        <iframe id="iframe" allowfullscreen="true" style="margin: 0px; padding: 0px; border: currentColor; border-image: none; left: 0px; top: 0px; width: 100%; height: 100%; right: 0px; bottom: 0px; overflow: hidden; position: fixed; z-index: 999999;">
        </iframe> 
        <script language="javascript">
        debugger;
            var IntegrationId;
            var EventManagerUrl = "https://services.oneconnect.ai/projectconnect/events";
            var ConfigId ;
            var currentUrl = parent.window.Xrm.Page.context.getClientUrl();
   
            var settings = {
                "async":true,
                "crossDomain":true,
                "url": EventManagerUrl + "/GetIntegrationsForSite?siteid=" + currentUrl + "&strategy=OnePlanUpdate", "method":"GET",
                "headers":{
                    "cache-control":"no-cache",
                    "postman-token":"971b5492-1473-90fb-be27-f60a623f4425"
                }
            }
            debugger;
            $.ajax(settings).done(function(response) {
                debugger;
                if(response.length > 0) {
                        //***********************need to change back to 0 $$$$$$$$$$$$$$$$44
                        IntegrationId=response[0].integrationId;
                        GetConfig();
debugger;
                   }
                else {
                    alert("This site has not been configured for integrations.");
               }
            });
    
            function GetConfig()
            {
                var settings = {
                    "async": true,
                    "crossDomain": true,
                    "url": EventManagerUrl  + "/GetButtonUrl?IntegrationId=" + IntegrationId + "&Direction=1&Buttons=ItemUrl&ItemId=",
                    "method": "GET",
                    "headers":{
                        "cache-control": "no-cache"
                  }
                }
                $.ajax(settings).done(function(data) {
                    var  reg = new RegExp( '[?&]ConfigId=([^&#]*)', 'i' );
                    var queryString = reg.exec(data[0].url);
                    ConfigId = queryString[1];
                    document.getElementById("iframe").src = "https://my.oneplan.ai?ConfigId=2ca864fc-XXXX-XXXX-XXXX-1ec2281bXXXX&AppId=64a1b4e5-XXXX-XXXX-XXXX-71b7e7dcXXXX&hideui=true"; debugger;
                });
          }
        </script>
    </body></html>

Log into OnePlan.
Click on the user icon on the top right of the page.
Click Share With.
Copy the Shareable URL. (e.g., https://my.oneplan.ai?ConfigId=2ca864fc-XXXX-XXXX-XXXX-1ec2281bXXXX&AppId=64a1b4e5-XXXX-XXXX-XXXX-71b7e7dcXXXX)
Replace the bolded code with the Shareable URL.

Replace Code Snippet for Timesheets

Copy the modified code snippet above.
Go to make.powerapps.com.
Click Solutions.
Click on OnePlan Project Accelerator.
Ensure the Objects tab is selected in the far-left column.
Expand Web Resources.
Click Code.
Locate OnePlan Timesheet, click on the 3 vertical dots.
Expand the Edit options, select Edit in Classic. A new tab will load with the classic editor.
Locate and click the Text Editor button. A new window will appear.
Click on the Source tab.
Delete the code in this tab.
Replace code with the modified snippet from above.
Click Ok.
Click Save.
Click Publish. A yellow window will appear.
Return to previous tab and click Done.