CEO

Risk free trial offers

Because we are now able to offer a Free trial and low subscription based pricing, many more businesses or even individuals can now use the NetNow service. You can now evaluate our product without making investments in hardware and software. We can provide a risk free / investment free approach to the evaluation process for those interested in the NetNow service. For those prospects who like the product we can then offer either a cost effective subscription service with NetNow or alternatively they may engage with Interlink Software for on premise solutions.

CEO

Develop applications in the cloud

New enterprise projects can often get off to a slow start while project managers have to wait for testing and development resources to be put in place. SaaS offers a great way for the enterprises to bypass this headache. Many managers have projects they run that need solutions to be developed / piloted quickly and don’t have time to wait for harware to be pocured or systems to be built. SaaS is the perfect place to do this type of work and develop or test out your ideas and prototypes without the cost of designing/purchasing/deploying internal systems to facilitate the work. Assuming your company does not want to run the production application in a cloud environment the solutions built in the SaaS environment can be later moved in house to secure production ready systems.  This ability to cheaply leverage a SaaS environment when deploying new solutions in development and testing environments can present huge project cost saving opportunities to enterprise businesses.

CEO

Online Tutorials

Make learning easy with on-line tutorials

We are working on building a library of online tutorials which will be accompanied by video tutorials, code snippets & useful resource links. We want to make it easy for users to get results with NetNow and sometimes getting the most from a software product means getting trained, not everything can be wrapped up in a wizard! Although we want to provide as many of those wizards as possible I believe having a good background understanding of the product you are working with makes for faster and more professional results!

About NetNow

NetNow is a Software-as-a-Service (SaaS) or on-demand cloud-based service, meaning there is no software installation or maintenance required and new features are automatically added without the need for expensive and lengthy upgrades. Data is accessed live, meaning there is no need to upload data into the cloud.

Connect to any data source

NetNow creates a single version of the truth through connection to multiple and diverse (on-premise and online) data sources from a single, easy-to-use, cloud-based interface.

Working with alerts – Part2

Alerts Tutorial

Difficulty: Advanced

Estimated Completion Time: 20 Mins

Version 1.7+

In part2 of this tutorial we will be performing some analysis of the alerts data that has been returned by the web service to help decide what styles and formatting should be applied to the alerts before displaying them. So let’s get started! You will first need to Login to the dashboard builder to start the tutorial.

Step 1 – Style the alerts table with CSS

Once again locate and press the spanner icon for the Dynamic Text widget and locate the Chart Template property. In this property insert the following code snippet at the top of the window before all the existing code. This CSS will apply styling to the the table. Now scroll to the bottom and press update and then close the dialog.

Note: you may need to drag and expand the Dynamic text box widget to accommodate the new styling

[snippet id=”24″]

 

Step 2 – Check & Set the state colour

Once again locate and press the spanner icon for the Dynamic Text widget and locate the Chart Template property. In this property insert the following code snippet at the top of the window before all the existing code. This is a function to check the state field and return a colour depending on its value. We will use this function in the next step of the tutorial to style this column of the table dynamically.

[snippet id=”25″]

Step3 – Call the function to set the colour of the state field

Scroll down through the code in the Chart Template section until you reach the bottom where the code to populate the table is located. Now replace the entire line that reads <td class=’c4′>${a.ServiceState[0]!}…… with the following code snippet. This is a revised version of the previous line of code that incorporates the function to check the state and assign the correct colour.

[snippet id=”26″]

Step4 – Assign CSS style to State column

Now replace the entire line that reads <td class=’c7′>${a.ObjectState[0]!}….. with the following code snippet. This is a revised version of the previous line of code that checks the Obectstate and assigns it to the CSS class “error” if its is “unavailable”. This CSS class will cause the field to display in red. Finally set the “Refresh Interval” property to a value of 4 so that you alerts table keeps updating regularly. Now scroll to the bottom and press update and then close the dialog.

[snippet id=”27″]

That’s all done!.Please enjoy your improved alert table Advanced users should check out the resources below where you will find a link to the Freemarker Template’s documentation.

TIP: You can use Freemarker Templates in the Chart Data Source too!

Freemarker templating can also be used in the Chart Data Source of the edit properties dialog, not just on the Chart Template section.

For extra information, guidance and troubleshooting consult:

 

Working with alerts – Part1

Alerts Tutorial

Difficulty: Advanced

Estimated Completion Time: 20 Mins

Version 1.7+

In this two part tutorial we will show you how to read and manipulate alerts from the dashboards testing data service. This service can aid development by providing simulated alert data to design and develop you solution with. Once you have finished development switching to a live data feed is usually quick and easy to do. In part 1 we will focus of connecting to the alert data and displaying it on the screen. Part 2 will build on this tutorial by performing analysis and formatting of the alerts before displaying them. So let’s get started. You will first need to Login to the dashboard builder to start the tutorial.

Step 1 – Connect to the alerts service

Add a dynamic text box widget to the dashboard using the new widget button in the bottom left hand corner of the dashboard builder. Locate and press the spanner icon to edit the widget. While inside the edit properties dialog locate the Chart Data Source property and paste the following code snippet into the property box. While still inside the edit properties dialog locate the Data Source Type drop down and assign it to XML.

Note: we are fetching only 15 alerts.

[snippet id=”19″]

 

Step 2 – Display the Title Text

Continue to scroll down and locate the Chart Template property. In this property paste the following code snippet to display the title text. Now scroll down and press update to save and close the dialog to see the results.

[snippet id=”20″]

Step 3 – Create a table for the Alerts

Once again locate and press the spanner icon for the Dynamic Text widget and locate the Chart Template property. In this property append the following code snippet at the bottom after the snippet from Step 2. This will create the table for the the alerts. Note: Each “th” line in the code adds a new column to the table. The classes c1-c7 can be used later to style the table. Now scroll to the bottom and press update and then close the dialog.

[snippet id=”21″]

Step 4 – Populate the table with the alerts

Finally you need to paste this code snippet after the snippet entered in step 3. Each “td” line in the code adds data to the table. The code snippet uses Freemarker templating language to store the alerts in a variable called “a”. It then loops all the data adding a row to the table for each of the alerts. We cover more on how to use freemarker templating in later tutorials. Again save by pressing update and close the to see the results.

[snippet id=”22″]

That’s all done!.Please enjoy your alert table. Now be sure to continue to Part 2 where we will see how to apply some nice formatting to our alerts table!

TIP: You can see the raw XML testing alert data

Advanced users can may want to access the test alert web service directly from the NetNow home menu system. Look under Web Services -> TestAlert you where you can browse the raw XML data that gets return to the dashboard from the web services.

For extra information, guidance and troubleshooting consult:

 

Using the test data services

Test data services

Difficulty: Advanced

Estimated Completion Time: 20 Mins

Version 1.7+

In this tutorial we will show you how to attach a widget to the dashboards testing data via the testing data web services. The testing data services provide three main types of data – random text, random numbers and test alerts. In this tutorial we will focus of the first 2 types, text and numbers, test alerts in covered in a later tutorial. So let’s get started. You will first need to Login to the dashboard builder to start the tutorial.

Step1 – Add two dynamic text box widgets to the dashboard.

Using the new widget button in the bottom left hand corner of the dashboard builder screen add two Dynamic text box widgets to the dashboard. Now position the widgets in the centre of the screen one below the other.

Step2 – Assign the random text datasource

Locate and press the spanner icon for the first dynamic text widget [#widget1). While inside the edit properties dialog locate the Chart Data Source property and paste the following code snippet into the property box. Now just press enter to save and close the dialog. This code snippet points the widget at a web service that generates random text.

[snippet id=”13″]

Step3 – Assign the random number datasource

Locate and press the spanner icon for the second dynamic text widget [#widget2). While inside the edit properties dialog locate the Chart Data Source property and paste the following code snippet into the property box. Now just press enter to save and close the dialog. This code snippet points the widget at a web service that generates random numbers between 20 and 95.

[snippet id=”14″]

Step4 – Display the random Text

Locate and press the spanner icon for the first dynamic text widget [#widget1). While inside the edit properties dialog locate the Data Source Type drop down and assign it to XML. Continue to scroll down the properties dialog and locate the Chart Template property. In this property paste the following code snippet to display the random text. Now just press enter to save and close the dialog.

[snippet id=”15″]

Step5 – Display the random Number

Locate and press the spanner icon for the second dynamic text widget [#widget2). While inside the edit properties dialog locate the Data Source Type drop down and assign it to XML. Continue to scroll down the properties dialog and locate the Chart Template property. In this property paste the following code snippet to display the random number. Now just press enter to save and close the dialog.

[snippet id=”16″]

That’s all done. Please enjoy your new menu random data widgets! View the dashboard using the View dashboard button located in the top right section of the dashboard builder. You should have already noticed the random data appear.

TIP

You can set the “Refresh Interval” interval property and have the widget go and collect random data at timed intervals. To try this locate and press the spanner icon for the either dynamic text widget. While inside the edit properties dialog locate the refresh interval property and assign it a value greater than 0. This property defined the number of seconds to wait before fetching a new random value. Setting the value to 0 means the widget will only fetch one value at load time. Now just press enter to save and close the dialog.

For extra information, guidance and troubleshooting consult:

Centering content css

Centering content in the browser

Difficulty: Easy

Estimated Completion Time: 5 Mins

Version: 1.7+

In this tutorial we follow on from an earlier tutorial entitled tab-menus. We will build on this example by now centering the logo and menu system using CSS. You will first need to Login to the dashboard builder to start the tutorial.

Step1 – task is to assign both the widgets we want to center an equal width.

To do this first edit the dashboard from the earlier tutorial by locating it in the dashboard list. Once inside the edit session now locate and press the spanner icon for the logo widget [#widget1) and the tab menu widget (#widget2). While inside the edit properties dialog locate the width property and set its value to 1000. Now just press enter to save and close the dialog. Advanced users could also assign the width using CSS as follows.

[snippet id=”12″]

Step 2 – Now for the magic CSS!

To center the logo and menu system add the following code snippet to the bottom of the CSS Style sheet property. This property is located in the edit dashboard window. To access the Edit dashboard window press the spanner in the top right hand corner of the dashboard builder screen.

[snippet id=”11″]

That’s all done. Please enjoy your new menu system! View the dashboard using the View dashboard button located in the top right section of the dashboard builder. Try and resize the screen or access it from a different device like a mobile and you will notice everything remains central. The trick is to set the left margin property of the widget to half it’s overall width.

TIP

You can check the widget id of any widget on your dashboard by simply hovering the mouse over the widget you want to know the if of. You will notice the id and co-ordinates of the widget appear in the bottom right hand corner of the dashboard builder screen.

For extra information, guidance and troubleshooting consult:

Tabbed menu bar

Creating a tabbed menu bar in the dashboard

Difficulty: Intermediate

Estimated Completion Time: 15 Mins

Version: 1.7+

In this tutorial we will show you how to use this HTML and CSS to create a tab based menu system. Each menu item provides a new tab section where different widgets can be placed increasing the amount of space available for widgets. You will first need to Login to the dashboard builder to start the tutorial.

 

Step1 – Let’s add a Logo to the dashboard using an image

Add a Dynamic Text box widget using the new widget button in the bottom left hand corner of the dashboard builder. Now edit the properties using the spanner. In the Chart Template section paste the following HTML code snippet. Scroll to the bottom and press update. You can now close the dialog [snippet id=”7″]

Step 2 – Now we will add the menu bar using a tab widget

Now we will add the menu bar using a tab widget. Add a tab widget using the new widget button and like in Step 1 paste the following code into the Chart Template section. This widget should be assigned id (#widget2) by default. This id will be used later on in the tutorial to style the menu system when we will assign background color and font. Once again scroll to the bottom and press the update button. You can now close the dialog. Now drag the tab widget and locate it in the centre of your screen. You can also move the logo widget from step 1 to the top [snippet id=”8″]

Step 3 – Add any other widget you like

Add any other widget you like using the new widget button in the bottom left hand corner of the dashboard builder. This widget should be assigned id (#widget3) by default. This id will not be used in this tutorial. The new widget is now going to be placed on to the “Menu Item 1″ tab section of your tab page widget. To do this simply drag the new widget and drop it in the center of the tab widget. Finnaly we will style the menu. To apply the style to the menu system add the following code snippet to the bottom of the CSS Style sheet property. This property is located in the edit dashboard window. To access the Edit dashboard window press the spanner in the top right hand corner of the dashboard builder screen. [snippet id=”9″] Don’t worry that there is a lot of code! This code snippet is applying CSS rules which we cover in another tutorial – Diving into CSS. That’s all done. Please enjoy your new menu system! View the dashboard using the View dashboard button located in the top right section of the dashboard builder screen.

TIP:

You can get fancy by using multiple menus or even combine them with a show/hide button – see the following tutorial for further details.

For extra information, guidance and troubleshooting consult:

Grant Glading

Marketing: creating the NetNow how-to ideas

We’re really excited about the first of our series of how-to video clips, our goal is to provide users of the NetNow service an informal, short, description of how to accomplish specific tasks.  The first video clip we’re finalising as I write is how to create Show/Hide Buttons that show and hide widgets on a dashboard. We plan to continually add to the repository of how-to video clips starting with the basics and building up to intermediate and finally advanced use.  Another key element to the how-to videos is the cross reference to the code Snippets (CSS/HTML/FreeMarker) that we are posting in the https://www.netnow.co/snippets/ area of the NetNow website and Tutorials section of the Blog area https://www.netnow.co/category/tutorials/.  We want to help users of the NetNow service get up to speed quickly and easily, please let us know what you think of these new resources.

Sample code snippet

 

Show hide CSS

Creating a Show / Hide widget button in the dashboard

Difficulty: Intermediate

Estimated Completion Time: 15 Mins

Version: 1.7+

In this topic we will show you how to use CSS and HTML to create a +/- button that will show and hide another widget in the dashboard. For optimum performance the process works by actually moving the widget off screen when the hide (-) button is pressed. When the show (+) button is pressed the widget is moved on screen. Because the widget was already loaded off screen it appears immediately and not data reload is needed. You will first need to Login to the dashboard builder to start the tutorial.

 

Step 1 – Add a Dynamic Text box widget

Add a Dynamic Text box widget using the new widget button in the bottom left hand corner of the dashboard builder. Now edit the properties using the spanner. In the Chart Template section paste the following CSS/HTML code snippet. Scroll to the bottom and press update. You can now close the dialog.

[snippet id=”2″]

Step 2 – Add the second Dynamic Text box widget

Add another Dynamic Text box widget and like in Step 1 paste the following code into the Chart Template section. Once again scroll to the bottom and press the update button. You can now close the dialog.

[snippet id=”3″]

Step 3 – Add the widget you want to show/hide

Add any other widget you like using the new widget button in the bottom left hand corner of the dashboard builder. This widget should be assigned id (#widget3) by default. This id is used in the following CSS code which needs to be added to the bottom of the CSS Style sheet property. This is located in the edit dashboard window. To access the Edit dashboard dialog press the spanner in the top right hand corner of the dashboard builder screen.

[snippet id=”4″]

That’s all done. Please enjoy your show/hide buttons! View the dashboard using the View dashboard button located in the top right section of the dashboard builder screen.

TIP:

You can get fancy by hiding multiple widgets or even changing their position on the screen when you press the show/hide buttons.

For extra information, guidance and troubleshooting consult: