Automation Widget

From Memsource
Jump to: navigation, search

Introduction

Automation Widget

The Automation widget makes it extremely easy (but secure thanks to using HTTPS) to embed an 'Upload files' functionality into a website or intranet. After it has been set up, all a person needs to do is:

  • click on a link
  • select source and target language
  • select Service (if there is more than one provided)
  • upload or drag&drop their files for translation (unsupported file formats -such as jpg - are added as reference files; files can be removed if needed)
  • set their email (it has to be verified once)
  • set due date and time
  • enter Purchase Order # if they want to
  • add note if they want to
  • check the wordcount and the price
  • Submit

A project is automatically created and files are imported as jobs. No Memsource login information is needed. The project owner (set in Automation widget) is automatically notified about new project via email, containing project info and Submitter's contact details.

Once the jobs are translated and project is set to Complete, the person is notified by email and can download the translated files. In this way the Automation widget can serve as a mini client portal.

  • Translation agencies can provide Automation widgets to their customers and so receive more jobs for translation from them – because the Automation widget is so easy and convenient to use.
  • Translation buyers can distribute Automation widgets to any number of their business units and streamline the internal translation process.

The Automation widget is essentially a URL that can be generated by a Memsource administrator or project manager under Setup – Automation Widgets. The Automation widget is associated with Services and can be also associated with a Project template in order to apply specific project settings, use a specific price list, translation memories for the analysis, term bases for terminology, linguists, etc.

A Memsource organization can create any number of Automation widgets. For instance, a translation company could create an Automation widget:

  • For each of their major customers
  • For their website

The Automation widget is available to subscribers of all Memsource editions except Personal and 1+ Freelancers.

Setting Up the Automation Widget

Before you create Automation widget, you should have at least one Price List and one Service for the languages you intend to offer to your clients. You can also prepare Project Template for your Automation widget (optional).

Price List Preparation

Price List Preparation
  1. Go to Setup - Price Lists
  2. Click on the pre-configured Default Price List (EUR) or Default Price List (USD) or create a price list with another currency.
  3. Once in the price list, click on Add Rows and select the Source Languages and Target Languages for which you wish to add rates into the price list by clicking on the Add button. Multiple rows can be created by selecting mutliple source/target languages.
  4. Click on Save and your price list is ready for use.

Please note that if rates do not exist for a specific language pair or if a price list has not been selected at all during widget setup, the quote will not include any price information, just the wordcount.

Once the Price list is created, it can be edited and Cloned (using the "Clone" button on Edit page).

Due Date Scheme Preparation

Due Date Scheme Creation

Go to Setup - Due Date Schemes to define how the automatic deadline will be calculated. Then attach the corresponding Due Date Scheme to the Service which you wish to offer via the Automation Widget (see below), to account for various types of orders you wish to provide through this Automation Widget.

Specify:

  • Quota
  • Working days and non-business days
  • Office hours
  • Automation extension of the deadline for projects of a specific size
  • The project start and delivery rules allow you to define when the project will start or be delivered.

Services Preparation

Your Services

Go to Setup - Services and define Service which will be used in your Automation widgets.

Specify:

  • Public and private Name
  • Type of service (Only “Professional translation” is available at the moment).
  • Source and Target languages
  • Project Templates: You can select appropriate Project Templates that should be used when this Service is selected. If multiple templates are selected, the system will select the one that best fits the selection from the Service (e.g. EN->DE Template will not be used for EN->FR translations).
  • Buyer (if it'll be used by specific Buyer)
  • Billing Unit (Page/word/character)
  • Net Rate Scheme
  • Due Date Scheme
  • Job Due Date (choose between "Manual" and "Equals project due date")
  • Price List
  • Workflow Step (if available in your edition): select workflow step(s) through which your service should be processed. For instance, when setting up "Professional Translation" type of service, you could select just "Translation" as the workflow step. Or, you could select "Translation" and "Revision" if this is what you provide under Professional Translation. Memsource projects created via the Service will have the workflow steps that you select.

Creating the Automation Widget

Create an Automation Widget
  1. Go to Setup - Automation Widgets and click on New.
  2. Choose an arbitrary Name for your widget (the name will not be displayed in the widget).
  3. Select Service
  4. Choose whether users should select languages manually or if the languages should be selected automatically (option - Automatically select all languages).
  5. Select Default Project Title - template macros {order.number}, {order.email} and {order.date} can be used to create project's name.
  6. Choose whether users should be able to set a project title themselves, from the widget page, or if the project should only have a default name (option - Allow users to specify Project Name).
  7. Select Default Project Owner, Email Template, Error Email Template and Widget UI Language.
  8. Click on Save to create the widget.

The IFrame & Appearance section makes it possible to:

  • Get the IFrame HTML Code (available only after the widget has been created) that can be used to easily embed the widget into a website (explained in more detail below).
  • Customize the widget Background Color, Content Color, and Box Color using CSS color codes or CSS color names.

After the widget has been created, a URL (web link) is displayed under Setup - Automation Widgets. Distribute this link to your clients or anyone who needs to submit translation jobs to you. The link can be very easily embedded into a website or you can choose to embed the entire widget into your website. The section below explains how.


Embedding the Widget into a Website

There are three ways in which the widget can be embedded into a website or an intranet page. The first two do not require any expert knowledge while the last one should be handled by a webmaster.

Widget URL

Widget URL

This is probably the easiest. Go to Setup - Automation Widgets and the widget URL for the widget you have created.

The URL can be used at any website or intranet page very easily.

Widget IFrame

IFrame Code

The entire widget form can be embedded into your website or intranet page. This will create a more seamless experience if you want to present the widget as an integral part of your website for instance.


To do this, paste the HTML IFrame Code into your website and that's it.

You can also change the appearance of the widget by setting custom colors. You can use names (black, red etc.) or numbers (#FF0000, #FFFFFF).

Widget IFrame with Resizing

This a more advanced version of using the IFrame. Ask your webmaster to follow these instructions to embed the widget IFrame with resizing support. This means that the widget will resize automatically when the Note or Paste Text fields are expanded. Without the resizing support the widget layout may get a little altered or a scroll bar may appear in the widget. This will not affect the widget functionality but it may not look so nice.

The iframe HTML code provided on the Automation widget setup page specifies a static height for the iframe window. However, the Automation widget form contains a few dynamic elements (e.g. paste text, note) that make the form grow or shrink in height. The iframe element on its own is unable to react to the changing size and will always keep its pre-specified dimensions, leading into either scrollbars or unreachable content. To overcome the problem, we need to use javascript. The Automation form uses the iframe-resizer (https://github.com/davidjbradshaw/iframe-resizer) javascript library to provide the desired functionality and clean and simple API.

To take advantage of the automatic resizing, the simplest steps to follow are: 1. Have access to the JQuery library, for example by including the following HTML code in the <head></head> part of your web page:

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

2. Have access to the iframe-resizer library, again by including the following HTML code in the head section:

 <script type="text/javascript" src="<path-to-iframeResizer-parent-folder>/iframeResizer.min.js"></script>

3. Provide an ID to the iframe element and disable scrollbars, for example:

 <iframe id="memsource-iq" scrolling="no" ... ></iframe>

4. Again, in the head section of your html, add the following HTML/javascript code:

 <script type="text/javascript">
	$(document).ready( function () {
		$('#memsource-iq').iFrameResize({
			heightCalculationMethod: 'documentElementScroll'
		});
	})
 </script>

For completeness, here is a simple HTML page that implements all the steps above. It assumes the iframeResizer.min.js file is located in the same folder as the example HTML page:

 <!DOCTYPE html>
 <html>
	<head>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
		<script type="text/javascript" src="./iframeResizer.min.js"></script>
		<script type="text/javascript">
			$(document).ready( function () {
				$('#memsource-iq').iFrameResize({
					heightCalculationMethod: 'documentElementScroll'
				});
			})
		</script>
	</head>

	<body>
		<div style="width: 530px; margin: 0 auto;" >
			<iframe id="memsource-iq" scrolling="no" width="530px" height="400px" frameborder="0" src="https://cloud1.memsource.com/web/submitJob/1-soXGd-xgCbx?embedded=true" /></iframe>
		</div>
	</body>
</html>

If you require help with the correct placement of the iframe-resizer library, please contact your webmaster to provide you with guidance.