widget.html

---
layout: bt_about
title: Widget
category: Widget
---

	<section id="content" >
		<div class="container" ng-app="widgetApp" >
			<div id="resultsDiv" class="DocumentsWrap"></div>
			<div id="pageContent" ng-controller="widgetController">
				<div class="row">
					<div class="span4">
						<div class="inner-heading">
							<h1><i class="icon-picture"></i>Cloudify Online Trial</h1>
						</div>

                        <p>Click the 'Try It Now button' below, we'll set up a dedicated Cloudify manager instance for you to play with for the next 30 minutes. If you're new to Cloudify, we recommend that you watch the short introductory video on the left before launching the actual instance. </p>

                        <form name="tryNowForm" ng-disabled="!widgetController.loadingMachine" disabled="disabled" ng-show="!widgetController.machineStarted">
                            <fieldset>
                                <legend></legend>
                                <div ng-show="!widgetController.alreadyRegistered">
                                    <label class="span1">Name</label>
                                    <input class="span3" name="nameInput" type="text" placeholder="Name" ng-model="widgetController.name" required/>
                                    <label class="span1">Email</label>
                                    <input class="span3" name="emailInput" type="email" placeholder="Email" ng-model="widgetController.email" required/>
                                </div>
                                <br/>
                                <button id="tryNowBtn" disabled="disabled" ng-disabled="!widgetController.widgetLoaded " type="submit" class="btn btn-primary span4" ng-click="tryItNowBtn()" ng-bind="widgetController.buttonText">Loading...</button>
                            </fieldset>
                        </form>

                        <div class="text-warning" ng-bind="widgetController.widgetOutput"></div>

                        <div  class="well text-success ng-hide" ng-show="widgetController.machineStarted">
                            We've started a Cloudify manager just for you at: <a ng-href="http://[[widgetController.machineIp]]/" ng-bind="widgetController.machineIp"></a>
                            You have <span ng-bind="widgetController.timeLeft | date:'mm'"></span> minutes left for your trial.
                            <button style="display: block;width: 100%;margin-top: 10px;" class="btn btn-primary" ng-click="stopTrial()" ng-bind="widgetController.stopButtonText" ng-disabled="!widgetController.machineStarted">I'm done, thanks</button>
                        </div>

					</div>
					<div class="span7 offset1">
                        <div class="videoContainer">
                            Here comes the video
                        </div>
					</div>
				</div>
			</div>
		</div>
        <iframe id="widgetFrame"
                class="ng-scope"
                style="margin: 20px;display:none;">
        </iframe>

    </section>