Skip to content

Instantly share code, notes, and snippets.

@lamp
Created July 8, 2010 14:46
Show Gist options
  • Save lamp/468102 to your computer and use it in GitHub Desktop.
Save lamp/468102 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<!--
Rendered against a get request to /campaigns/new
-->
<meta charset="utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="shortcut icon" href="/images/bookmark.png" type="image/png">
<link type="text/css" charset="utf-8" rel="Stylesheet" media="all" href="/stylesheets/default.css?070815461856" />
<title>New Campaign - Videojuicer</title>
<!--[if IE]><script type="text/javascript" charset="utf-8" src="/javascripts/lib/html5.js?070815461829"></script><![endif]-->
</head>
<body class="development" data-ingest-url="http://ingest.videojuicer.com:3000">
<div id="header">
<h1 id="logo"><a href="/" title="Return to the Panel Dashboard">Videojuicer</a></h1>
<span class="environment">Development Environment</span>
<div id="userseed">
Logged into <strong>development</strong> as <a href="/users/my_account">sufficingly</a>. <a data-exclude-asynchronous="true" href="/logout?return_to=%2Fcampaigns%2Fnew">Log out</a>?
</div>
<nav id="navigation">
<ul>
<li class=" selected" absolute_path=""><a href="/campaigns">Campaigns</a></li>
<li class="" absolute_path=""><a href="/presentations">Presentations</a></li>
<li class="" absolute_path=""><a href="/assets">Assets</a></li>
<li class="" absolute_path=""><a href="/users">Users</a></li>
<li class="utility" absolute_path=""><a href="/help">Help</a></li>
<li absolute="true" class="utility" absolute_path=""><a data-updates="section#content; a[href=campaigns]" href="/users/my_account">My Preferences</a></li>
</ul>
</nav>
<!--[if !IE]> End <nav #main> <![endif]-->
<div id="breadcrumbs">
<a href="/campaigns">Campaigns</a>
<a href="/campaigns/new">New Campaign</a>
</div>
</div>
<!--[if !IE]> End <header> <![endif]-->
<div id="wrapper">
<section id="content">
<form method="post" id="campaigns" action="/campaigns">
<div id="campaigns">
<h3 data-campaign-step-name="campaign_name" class="first step active">
1. What should this campaign be called?
</h3>
<div class="step" id="campaign_title">
<dl>
<dt><label for="campaign_name">Name</label></dt>
<dd><input type="text" value="" class="text" name="campaign[name]" id="campaign_name"/></dd>
</dl>
</div> <!-- /div.step -->
<h3 data-campaign-step-name="campaign_criteria" class="step active">
2. When should this campaign be active?
</h3>
<div id="campaign_criteria" class="step">
<h4>
When <select name="when_active" id="when_active"><option selected="selected" value="all">all</option><option value="any">any</option><option value="none">none</option></select> of the following rules are met
<button class="addrule">Add new rule</button>
</h4>
<ul class="rules">
<li class="rule blank">This campaign currently has no rules.</li>
</ul>
<div class="rulebottom"></div>
</div><!-- /div.step -->
<h3 data-campaign-step-name="campaign_presentations" class="step active">
3. Which presentations should be included in this campaign?
</h3>
<div class="step" id="campaign_presentations">
<input type="hidden" value="com.videojuicer.core.Presentation" class="hidden" name="campaign[target_type]" id="campaign_target_type"/>
<ul class="radiogroup">
<li>
<label for="radio_presentations_all">
<input type="radio" id="radio_presentations_all" name="radio_presentations" value="all" checked="checked">
All presentations
</label>
</li>
<li class="tags">
<label for="radio_presentations_tagged">
<input type="radio" id="radio_presentations_tagged" name="radio_presentations" value="tagged">
Presentations tagged* with any of:
</label>
<input type="text" id="presentation_tags" value="">
<p>*Separate tags with commas, e.g. <span class="tag">Trailer ‘09</span>, <span class="tag">Cinema</span></p>
</li>
</ul>
</div> <!-- /div.step -->
<h3 data-campaign-step-name="campaign_inserts" class="step show active">
4. What conditional content do you want to use in this campaign?
</h3>
<div id="campaign_inserts" class="step show">
<table id="included_inserts" class="list child header">
<thead>
<tr class="header">
<th colspan="6">
Display this conditional content
</th>
</tr>
</thead>
<tbody>
<tr class="blank">
<th colspan="5">This campaign currently has no conditional content</th>
<td></td>
</tr>
<tr style="display:none;" class="template">
<th scope="row" class="role"><span>{insert role}</span></th>
<td class="title">{name}</td>
<td class="attributes" data-insert-asset-url="/path/to/asset/preview.ext" data-insert-asset-name="Asset Name">
<input type="hidden" class="role">
<input type="hidden" class="asset_id">
<input type="hidden" class="asset_type">
<input type="hidden" class="offset_x">
<input type="hidden" class="offset_y">
<input type="hidden" class="anchor_x">
<input type="hidden" class="anchor_y">
<input type="hidden" class="action">
<input type="hidden" class="start">
<input type="hidden" class="duration">
<a href="#" class="action">http://action.url/</a>
</td>
<td class="start">{start}</td>
<td class="duration">{duration}</td>
<td class="actions">
<a href="#" class="iconbutton edit">Edit</a>
<a href="#" class="iconbutton minus">Delete</a>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="6">
Add a New
<select id="new_insert_role">
<optgroup label="Select an insert type">
<option value="overlay">Overlay</option>
<option value="preroll">Pre-roll</option>
<option value="postroll">Post-roll</option>
</optgroup>
</select>
<input type="hidden" class="assetpicker" name="insert_asset" data-asset-type="image,audio,flash,text" data-asset-type-field="asset_type" data-asset-id-field="asset_id">
</th>
</tr>
<tr class="inserteditor overlay" style="display:none;">
<td colspan="6">
<div id="preview">
<div id="inserteditor_new_overlay" class="preview_overlay"></div>
</div>
<dl class="controls">
<dt>Overlay Position</dt>
<dd class="overlay_position">
<input class="alignment">
</dd>
<dt>
<label for="padding_horizontal">Horizontal Padding</label>
</dt>
<dd>
<input type="number" class="spinbox" min="0" step="1" value="0" data-insert-field="padding_horizontal">
</dd>
<dt>
<label for="padding_vertical">Vertical Padding</label>
</dt>
<dd>
<input type="number" class="spinbox" min="0" step="1" value="0" data-insert-field="padding_vertical">
</dd>
</dl>
<dl class="controls other">
<dt><label for="action_url">Link Destination</label></dt>
<dd class="action_url"><input type="text" data-insert-field="action_url"></dd>
<dt><label for="start" class="optional">Start Time</label></dt>
<dd class="duration"><input type="text" data-insert-field="start"> <span class="example">e.g. <strong>0:10</strong> to display 10 seconds in.</span></dd>
<dt><label for="duration" class="optional">Display Duration</label></dt>
<dd class="duration"><input type="text" data-insert-field="duration"> <span class="example">e.g. <strong>0:30</strong> for 30 seconds.</span></dd>
</dl>
<div class="confirm">
<button class="add">Add insert</button>
<button class="discard">Discard insert</button>
</div>
</td>
</tr>
<tr class="inserteditor video" style="display:none;">
<td colspan="6">
<div id="preview">
<div id="inserteditor_new_video" class="preview_video"></div>
</div>
<dl class="controls other">
<dt><label for="action_url">Link Destination</label></dt>
<dd class="action_url"><input type="text" data-insert-field="action_url"></dd>
<dt><label for="duration">Display Duration</label></dt>
<dd class="duration"><input type="text" data-insert-field="duration"> <span class="example">e.g. <strong>0:30</strong> for 30 seconds.</span></dd>
</dl>
<div class="confirm">
<button class="add">Add insert</button>
<button class="discard">Discard insert</button>
</div>
</td>
</tr>
</tfoot>
</table>
</div> <!-- /div#campaign_inserts.step -->
<div id="confirm" class="active">
<span class="message">Ready to save this campaign?</span>
<button class="large">Save Campaign</button>
</div>
</div> <!-- /div#campaigns -->
</form>
</section> <!-- /section#content -->
<footer>
<div id="copyright"><span class="container">&copy; Videojuicer 2010, All rights Reserved</span></div>
</footer>
</div> <!-- /div#wrapper -->
<div id="file-input-container"></div>
<!--[if !IE]> END The page <![endif]-->
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/jquery-1.4.2.js?07081546189"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/swfobject.js?070815461862"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/Math.uuid.js?070815461883"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/date.js?070815461818"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/inflector.js?070815461875"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/json2.js?070815461859"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/lib/soundManager.js?070815461851"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.easing.js?070815461886"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.field.min.js?07081546186"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.bindo.js?070815461898"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/effects.jquery.js?070815461818"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.datePicker.min-2.1.2.js?070815461821"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.ba-hashchange.min.js?070815461821"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.scrollTo.min.js?07081546188"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/jquery_ext/jquery.spritely-0.2.1.js?070815461833"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/page_model.jquery.js?070815461888"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/view.controller.jquery.js?07081546189"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/easter_egg.jquery.js?070815461854"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/utilities.jquery.js?070815461825"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/widgets.jquery.js?070815461855"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/default.jquery.js?070815461849"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/notifications.jquery.js?070815461852"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/modals.jquery.js?070815461823"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/spinners.jquery.js?07081546180"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/assetpicker.jquery.js?070815461847"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/validation_messages.jquery.js?070815461825"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/cookie_db.jquery.js?070815461845"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/asset_upload_iframe_strategy.interface.jquery.js?070815461893"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/asset_upload.model.jquery.js?070815461878"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/asset_upload.controller.jquery.js?070815461886"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/asset_upload_notification.jquery.js?070815461893"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/campaigncriteria.jquery.js?070815461844"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/campaigninserts.jquery.js?070815461812"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/campaign.jquery.js?070815461842"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/presentations.jquery.js?070815461869"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/presentations_batch.controller.jquery.js?070815461868"></script>
<script type="text/javascript" charset="utf-8" src="/javascripts/application.js?070815461848"></script>
<div id="caught-content">
<script type="text/javascript">
$(document).ready(function(){
// $('table#included_inserts tfoot tr div.assetpicker button').unbind('.assetpicker');
$('*').unbind('.campaigncriteria');
$('*').unbind('.campaigninserts');
$('*').unbind('.campaigns');
$('div#campaign_criteria h4 button.addrule').bind('click.campaigncriteria', addRuleHandler);
$('select#new_insert_role').bind('change.campaigninserts', updateInsertAssetPicker);
$('table#included_inserts tfoot tr div.assetpicker button').bind('assetPicked.assetpicker', assetPickedHandler);
$('table#included_inserts tfoot tr.inserteditor div.confirm button.add').bind('click.campaigninserts', addInsert);
$('table#included_inserts tfoot tr.inserteditor div.confirm button.discard').bind('click.campaigninserts', discardInsert);
$('table#included_inserts tbody tr td.actions a.iconbutton.minus').live('click.campaigninserts', removeInsert);
$('table#included_inserts tbody tr td.actions a.iconbutton.edit').live('click.campaigninserts', editInsert);
$('div#campaigns div#confirm button').bind('click.campaigns', campaignEditSubmitHandler);
$('input.alignment').alignmentWidget();
ViewController.withScope(function(){
this.setPageOptions({
init : function(){
},
unload : function(){
// TODO: warning about unsaved changes if navigating away.
campaignFormDirty();
}
});
});
});
</script>
</div>
</body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment