123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320 |
- <!--
-
- Advanced export appliance wizard panes. Logic in vboxWizard() class
- Copyright (C) 2010-2015 Ian Moore (imoore76 at yahoo dot com)
-
- $Id: wizardExportApplianceAdvanced.html 595 2015-04-17 09:50:36Z imoore76 $
-
- -->
- <!-- Step 1 -->
- <div id='wizardExportApplianceStep1' style='display: none;'>
-
- <table class='vboxInvisible' style='border: 0px solid transparent; border-spacing: 4px; height: 100%;'>
- <tr style='vertical-align: top'>
- <td style='width: 50%'>
-
- <span class='translate vboxTableLabel'>Virtual machines to export</span>
- <hr style='width: 100%; margin: 0px; margin-bottom: 6px; display: block' class='vboxSeparatorLine'/>
-
- <div id='vboxExportAppVMListContainer' style='overflow:auto;padding:0px;margin:0px;' class='vboxBordered'>
- <ul style='width: 100%;margin:0px;' id='vboxExportAppVMList' class='vboxList'>
- <li><img src='images/spinner.gif' /></li>
- </ul>
- </div>
- </td>
- <td>
- <span class='translate vboxTableLabel'>Appliance settings</span>
- <hr style='width: 100%; margin: 0px; margin-bottom: 6px; display: block' class='vboxSeparatorLine'/>
-
- <div class='vboxBordered' id='vboxExportPropsContainer' style='overflow: auto' style='width: 100%'>
- <table class='vboxHorizontal' style='width: 100%; font-size: 0.9em'>
- <tbody id='vboxExportProps'>
- </tbody>
- </table>
- </div>
-
- </td>
- </tr>
-
- <tr style='vertical-align: top; height: 1%;'>
- <td colspan='2'>
-
- <table style='width: 100%;' class='vboxOptions'>
- <tr>
- <th width='1%'><span class='translate'>File:</span></th>
- <td class='vboxFileFolderInput'>
- <input type='text' class='vboxText' name='wizardExportApplianceLocation' />
- <input type="button" class="vboxImgButton" style="background-image: url(images/vbox/select_file_16px.png)" onClick="wizardExportApplianceBrowseLocation()" />
- </td>
- </tr>
- <tr>
- <th width='1%'><span class='translate'>Format:</span></th>
- <td>
- <select name='wizardExportApplianceFormat'>
- <option value="ovf-0.9">OVF 0.9</option>
- <option value="ovf-1.0" selected>OVF 1.0</option>
- <option value="ovf-2.0">OVF 2.0</option>
- </select>
- </td>
- </tr>
- <tr>
- <td colspan='2'>
- <label><input type='checkbox' class='vboxCheckbox' name='wizardExportApplianceManifest'/>
- <span class='translate'>Write Manifest file</span></label>
- </td>
- </tr>
- </table>
- </td>
- </tr>
- </table>
- </div>
-
-
- <script type='text/javascript'>
-
- //Add format options
- $(document.forms['frmwizardExportAppliance'].wizardExportApplianceFormat).find('option').html(function(i,h){return trans(h,'UIWizardExportApp');});
-
-
- // Load list of exportable machines
- var l = new vboxLoader();
- l.add('vboxGetExportableMachines',function(d){$('#wizardExportApplianceStep1').data('vms',d.responseData);});
- l.onLoad = function() {
- var vms = $('#wizardExportApplianceStep1').data('vms');
- var vmlist = $('#vboxExportAppVMList');
- $(vmlist).children().remove();
- vms.sort(function(a,b){return strnatcasecmp(a.name,b.name);});
- for(var i in vms) {
- var li = $('<li />').data({'vm':vms[i]});
- if(vboxVMStates.isPaused(vms[i]) || vboxVMStates.isRunning(vms[i])) {
- $(li).addClass('vboxDisabled disabled');
- } else {
-
- /* Exportable appliance clicked */
- $(li).click(function(){
-
- $(this).toggleClass('vboxListItemSelected');
-
- vboxWizardExportApplianceUpdateList();
- vboxWizardExportApplianceOVFName();
-
-
- }).addClass('vboxListItem');
-
- if(vboxChooser.isVMSelected(vms[i].id))
- $(li).addClass('vboxListItemSelected');
-
- }
- $(li).html("<img style='width: 16px; height: 16px;' src='images/vbox/" + vboxGuestOSTypeIcon(vms[i].OSTypeId) + "' /> " + vms[i].name);
- $(vmlist).append(li);
- }
- vboxColorRows(vmlist);
- vboxWizardExportApplianceUpdateList();
- vboxWizardExportApplianceOVFName();
-
- };
- l.run();
-
- // Resize panes function
- function wizardExportApplianceStepResizeList() {
-
- $('#wizardExportApplianceStep1').hide();
- $('#vboxExportAppVMListContainer').hide();
- $('#vboxExportPropsContainer').hide();
-
- $('#wizardExportApplianceStep1').css({'height':($('#wizardExportApplianceStep1').parent().height()-8)+'px'}).show();
- $('#vboxExportAppVMListContainer').css({'height':($('#vboxExportAppVMListContainer').parent().height()-16)+'px'}).show();
- $('#vboxExportPropsContainer').css({'height':$('#vboxExportAppVMListContainer').css('height'),
- 'width':$('#vboxExportAppVMListContainer').parent().width()}).show();
-
- }
-
- // Resize panes when wizard is resized
- $('#wizardExportApplianceDialog').on('dialogresizestop',wizardExportApplianceStepResizeList);
- //Resize panes after this div is shown
- $('#wizardExportApplianceStep1').on('show', wizardExportApplianceStepResizeList);
-
-
- /*
- *
- * VM Properties to edit / export
- *
- */
- var vboxApplianceProps = {
- 'name' : {'label':'Name','icon':'name'},
- 'product' : {'label':'Product','icon':'description'},
- 'product-url' : {'label':'Product-URL','icon':'description'},
- 'vendor' : {'label':'Vendor','icon':'description'},
- 'vendor-url' : {'label':'Vendor-URL','icon':'description'},
- 'version' : {'label':'Version','icon':'description'},
- 'description' : {'label':'Description','icon':'description','textarea':true},
- 'license' : {'label':'License','icon':'description','textarea':true}
- };
-
- /* Browse for export location */
- function wizardExportApplianceBrowseLocation() {
-
- var dsepRegEx = $('#vboxPane').data('vboxConfig').DSEP;
- if(dsepRegEx == '\\') dsepRegEx += '\\';
-
- // Get current location
- var loc = document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation.value;
- if(loc.indexOf($('#vboxPane').data('vboxConfig').DSEP) > -1) {
- var r = new RegExp(dsepRegEx+'([^'+dsepRegEx+']*)?$');
- loc = loc.replace(r,'');
- } else {
- // no path set
- loc = vboxDirname($('#vboxPane').data('vboxConfig').version.settingsFilePath) + $('#vboxPane').data('vboxConfig').DSEP;
- }
- vboxFileBrowser(loc,function(f){
- if(!f) return;
- // get file name
- var r = new RegExp('.*'+dsepRegEx);
- file = $(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).val().replace(r,'');
- document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation.value = f+($('#vboxPane').data('vboxConfig').DSEP)+file;
- },true,trans('Select a file to export into','UIWizardExportAppPage3'));
-
- }
-
- /* Determine default OVF name */
- function vboxWizardExportApplianceOVFName() {
-
- // Keep track of where we were
- var vmSel = $('#vboxExportAppVMList').children('li.vboxListItemSelected');
-
- /* When going to step3, make sure vms are selected */
- if(!vmSel.length) {
- $('#vboxExportAppVMListContainer').addClass('vboxRequired');
- return;
- }
- $('#vboxExportAppVMListContainer').removeClass('vboxRequired');
-
-
- if(jQuery.trim($(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).val()) && $(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).data('userChanged'))
- return;
-
- $(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).data('userChanged', false);
-
- var name = '';
- if(vmSel.length > 1) {
- name = 'Appliance';
- } else {
- name = jQuery.trim($(vmSel[0]).text());
- }
-
- // If there is already a folder chosen, don't change it
- if(jQuery.trim($(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).val())) {
- name = vboxDirname(jQuery.trim($(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).val())) + $('#vboxPane').data('vboxConfig').DSEP + name + '.ova';
- } else {
- name = vboxDirname($('#vboxPane').data('vboxConfig').version.settingsFilePath) + $('#vboxPane').data('vboxConfig').DSEP + name + '.ova';
- }
-
- $(document.forms['frmwizardExportAppliance'].elements.wizardExportApplianceLocation).val(name);
-
- };
-
- function vboxWizardExportApplianceUpdateList() {
-
- var vms = $('#vboxExportAppVMList').children('li');
-
- var tbl = $('#vboxExportProps');
-
- for(var i = 0; i < vms.length; i++) {
-
- var vmid = $(vms[i]).data('vm').id;
-
- // Selected ?
- if($(vms[i]).hasClass('vboxListItemSelected')) {
- if($('#vboxAppliance-'+vmid).attr('id')) continue;
- } else {
- $(tbl).children('tr.vboxAppliance-'+vmid).remove();
- continue;
- }
-
- // VM header row
- var trparent = $('<tr />').attr({'id':'vboxAppliance-'+vmid}).addClass('vboxAppliance-'+vmid + ' vboxTableParent');
- var td = $('<td />').attr({'colspan':'2','class':'vboxApplianceHeader'}).append(
- $('<div />').css({'font-weight':'bold','padding-left':'6px'}).append(
- $('<input />').attr({'type':'button','class':'vboxImgButton','style':'background-image: url(images/downArrow.png); margin:0px;margin-right:4px;padding:0px;vspace:0px;hspace:0px;width: 12px; height: 12px;'}).click(function(){
-
- if(!$(this).data('toggleClicked')) {
-
- $(this).data('toggleClicked', true);
-
- $(this).css({'background-image':'url(images/rightArrow.png)'});
- var tr = $(this).closest('tr');
- $(tr).siblings('tr.vboxChildOf'+$(tr).data('vboxOrder')).hide();
- } else {
-
- $(this).data('toggleClicked', false);
-
- $(this).css({'background-image':'url(images/downArrow.png)'});
- var tr = $(this).closest('tr');
- $(tr).siblings('tr.vboxChildOf'+$(tr).data('vboxOrder')).show();
- }
- })
- ).append(
- //trans('Virtual System X').replace('%s',(i+1))
- $('<div />').text($(vms[i]).data('vm').name).html()
- )
- ).disableSelection();
- $(trparent).append(td).data({'vm':$(vms[i]).data('vm'),'vboxOrder':i}).appendTo(tbl);
-
- // VM properties
- for(var p in vboxApplianceProps) {
-
- var tr = $('<tr />').attr({'class':'vboxAppliance-'+vmid+' vboxChildOf' + i}).data({'vmprop':p});
-
- $('<td />').css({'padding-left':'18px','white-space':'nowrap','width':'1%'}).html('<img src="images/vbox/'+vboxApplianceProps[p].icon+'_16px.png" /> ' + trans(vboxApplianceProps[p].label,'UIApplianceEditorWidget')).appendTo(tr);
-
- $('<td />').attr({'class':'vboxHideOverflow vboxAppProp'+p}).css({'width':'100%','padding-left':'10px','padding-right':'2px'}).html('<div>'+$('<div />').text(($(trparent).data('vm')[p]||'')).html()+'</div>').dblclick((vboxApplianceProps[p].textarea ? vboxExportAppliancePropEditArea : vboxExportAppliancePropEdit )).appendTo(tr);
-
- $(tbl).append(tr);
- }
- }
- vboxColorRows(tbl,false,'vboxTableParent');
-
-
- };
-
-
- /* Edit property that has a text area */
- function vboxExportAppliancePropEditArea(evt,elm) {
- vboxExportAppliancePropEditDialog(evt.target, $('<span />').html($(evt.target).html()).text());
- }
-
- /* Edit property dialog */
- function vboxExportAppliancePropEditDialog(elm, defaults) {
-
- var d = $('<div />').css({'display':'none'});
- var frm = $('<form />').attr({'onSubmit':'return false;'}).css({'margin':'0px','border':'0px','padding':'0px','width':'100%','height':'100%'});
- $('<textarea />').attr({'id':'vboxExportAppliancePropTextarea'}).css({'height':'99%','width':'99%'}).val(defaults).appendTo(frm);
- $(d).append(frm);
-
- var buttons = {};
- buttons[trans('OK','QIMessageBox')] = function(){
- var d = vboxDivOverflowHidden(elm);
- $(d).html($('<div />').text($('#vboxExportAppliancePropTextarea').val()).html());
- $(elm).html('').append(d);
- $(this).empty().remove();
- };
- buttons[trans('Cancel','QIMessageBox')] = function(){
- $(this).empty().remove();
- };
- $(d).dialog({'height':300,'width':300,'closeOnEscape':false,'modal':true,'resizable':true,'dialogClass':'vboxDialogContent','draggable':true,'buttons':buttons,'title':$(elm).parent().siblings().first().html()});
-
- }
- /* Edit property that has a text box */
- function vboxExportAppliancePropEdit(evt,elm) {
- var input = $('<input />').attr({'type':'text','class':'vboxText'}).css({'width':($(this).innerWidth()-12)+'px','margin':'0px'}).val($('<div />').html($(this).children().first().html()).text()).blur(function(){
- var v = $(this).val();
- var p = $(this).parent();
- var d = vboxDivOverflowHidden(p);
- $(this).remove();
- $(d).html($('<div />').text(v).html());
- $(p).html('').append(d);
- }).keydown(function(e){if(e.keyCode == 13) $(this).trigger('blur');});
- $(this).html('').append(input).children().first().focus();
- }
-
- </script>
|