277 lines
11 KiB
HTML
277 lines
11 KiB
HTML
<!--
|
|
|
|
Advanced panes for new virtual machine wizard. Logic in vboxWizard()
|
|
Copyright (C) 2010-2015 Ian Moore (imoore76 at yahoo dot com)
|
|
|
|
$Id: wizardNewVMAdvanced.html 595 2015-04-17 09:50:36Z imoore76 $
|
|
|
|
-->
|
|
|
|
<!-- Step 1 -->
|
|
<div id='wizardNewVMStep1' style='display: none'>
|
|
|
|
<span class='vboxTableLabel translate'>Name and operating system</span>
|
|
<div class='vboxOptions'>
|
|
<table class='vboxOptions vboxOSTypeOptions' style='width:100%'>
|
|
<tr>
|
|
<th style='width: 1%'><span class='translate'>Name:</span></th>
|
|
<td colspan='2'><input type='text' class='vboxText' name='newVMName' style='width: 95%' /></td>
|
|
</tr>
|
|
<tr>
|
|
<th><span class='translate'>Type:</span></th>
|
|
<td style='width: 100%'><select name='newVMOSFamily' id='newVMOSFamily' style='width: 100%'>
|
|
<option value='Linux'>Linux</option>
|
|
</select></td>
|
|
<td rowspan='2'><img name='vboxOSTypeImg' height='32' width='32' /></td>
|
|
</tr>
|
|
<tr>
|
|
<th><span class='translate'>Version:</span></th>
|
|
<td><select id='newVMOSType' name='newVMOSType' style='width: 100%'>
|
|
<option value='Debian'>Debian</option>
|
|
</select></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<span class='vboxTableLabel translate'>Memory size</span>
|
|
<div class='vboxOptions'>
|
|
|
|
<table style='width: 100%'>
|
|
<tr>
|
|
<td style='width: 100%; border: 0px; margin: 0px; padding: 0px;'>
|
|
<div style='margin-top: 4px' id='wizardNewVMSize' class='slider translateglob'><div class='sliderScale'></div></div>
|
|
</td>
|
|
<td style='white-space: nowrap'><input type='text' class='vboxText' name='wizardNewVMSizeValue' size='5' class='sliderValue' /> <span class='translate'>MB</span></td>
|
|
</tr>
|
|
<tr style='vertical-align: top;'>
|
|
<td style='border: 0px; margin: 0px; padding: 0px;'>
|
|
<table style='width: 100%; border: 0px; margin: 0px; padding: 0px;'>
|
|
<tr style='vertical-align: top'>
|
|
<td style='text-align: left;'><span id='wizardNewVMMin'>1</span> <span class='translate'>MB</span></td>
|
|
<td style='text-align: right;'><span id='wizardNewVMMax'>128</span> <span class='translate'>MB</span></td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
<td></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
|
|
<span class='vboxTableLabel translate'>Hard disk</span>
|
|
<div class='vboxOptions'>
|
|
|
|
<table class='vboxOptions' id='newVMBootDiskTable' style='width:100%;'>
|
|
<tr>
|
|
<td style='padding:2px; padding-left: 14px'><label><input type="radio" class="vboxRadio" name="newVMDisk" value="none" onClick="newVMToggleNewDisk(true)" /> <span class='translate vboxEnablerListen'>Do not add a virtual hard disk</span></label></td>
|
|
</tr>
|
|
<tr id='newVMHDTriggerBind' class='vboxEnablerTrigger'>
|
|
<td style='padding:2px; padding-left: 14px'><label><input type="radio" class="vboxRadio" name="newVMDisk" value="create" onClick="newVMToggleNewDisk(true)" checked='checked' /> <span class='translate vboxEnablerListen'>Create a virtual hard disk now</span></label></td>
|
|
</tr>
|
|
<tr>
|
|
<td style='padding:2px; padding-left: 14px'><label><input type="radio" class="vboxRadio" name="newVMDisk" value="existing" onClick="newVMToggleNewDisk(false)" /> <span class='translate vboxEnablerListen'>Use an existing virtual hard disk file</span></label></td>
|
|
</tr>
|
|
<tr>
|
|
<td style='padding-left: 24px; white-space: nowrap'>
|
|
<table class='vboxInvisible' style='width: 99%;'>
|
|
<tr>
|
|
<td><select id="newVMDiskSelectId" name="newVMDiskSelect" disabled='disabled'></select></td>
|
|
<td style='width:1%' id='newVMDiskVMM'></td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script type='text/javascript'>
|
|
|
|
/* Translations */
|
|
$('#wizardNewVMStep1').find('table.vboxOSTypeOptions').find('span.translate').html(function(i,h) {
|
|
return trans(h,'UINameAndSystemEditor');
|
|
}).removeClass('translate');
|
|
|
|
|
|
var wizardNewVMToolbar = new vboxToolbarSingle({button: {
|
|
/* Add Attachment Button */
|
|
'name' : 'mselecthdbtn',
|
|
'label' : 'Choose a virtual hard disk file...',
|
|
'language_context': 'UIMachineSettingsStorage',
|
|
'icon' : 'select_file',
|
|
'click' : function () {
|
|
vboxMedia.actions.choose(null,'HardDisk',function(med){
|
|
if(med) vmNewFillExistingDisks(med.base);
|
|
});
|
|
}
|
|
}});
|
|
wizardNewVMToolbar.renderTo('newVMDiskVMM');
|
|
|
|
/* Toggle new / existing */
|
|
function newVMToggleNewDisk(dis) {
|
|
|
|
if(dis) {
|
|
wizardNewVMToolbar.disable();
|
|
document.forms['frmwizardNewVM'].newVMDiskSelect.disabled = true;
|
|
$('#wizardNewVMStep1').find('.vboxMediumSelect').trigger('disable');
|
|
} else {
|
|
wizardNewVMToolbar.enable();
|
|
document.forms['frmwizardNewVM'].newVMDiskSelect.disabled = (document.forms['frmwizardNewVM'].newVMDiskSelect.options.length > 0 ? false : true);
|
|
$('#wizardNewVMStep1').find('.vboxMediumSelect').trigger('enable');
|
|
}
|
|
|
|
}
|
|
|
|
/* Mem size slider */
|
|
var min = 4;
|
|
var max = parseInt($('#vboxPane').data('vboxHostDetails').memorySize);
|
|
|
|
$('#wizardNewVMSize').data('form','frmwizardNewVM');
|
|
|
|
$('#wizardNewVMSize').slider({'min':min,'max':max,'step':1});
|
|
$('#wizardNewVMSize').slider('value',4);
|
|
|
|
$('#wizardNewVMMin').html(min);
|
|
$('#wizardNewVMMax').html(max);
|
|
|
|
/* Fill existing attachments */
|
|
function vmNewFillExistingDisks(sel) {
|
|
|
|
document.forms['frmwizardNewVM'].newVMDiskSelect.options.length = 0;
|
|
$(document.forms['frmwizardNewVM'].newVMDiskSelect).children().remove();
|
|
|
|
var s = vboxMedia.mediaForAttachmentType('HardDisk');
|
|
|
|
// Sort media
|
|
s.sort(function(a,b){return strnatcasecmp(a.name,b.name);});
|
|
|
|
var mediumSelects = [];
|
|
var selectedIndex = -1;
|
|
for(var i = 0; i < s.length; i++) {
|
|
document.forms['frmwizardNewVM'].newVMDiskSelect.options[i] = new Option(vboxMedia.mediumPrint(s[i]),s[i].id, (sel && sel == s[i].id));
|
|
if(s[i].readOnly && s[i].deviceType == 'HardDisk') $(document.forms['frmwizardNewVM'].newVMDiskSelect.options[i]).addClass('vboxMediumReadOnly');
|
|
mediumSelects[i] = {'attachedId':s[i].id,'id':s[i].id,'base':s[i].base,'label':vboxMedia.mediumPrint(s[i])};
|
|
if(sel == s[i].id) {
|
|
selectedIndex = i;
|
|
}
|
|
}
|
|
if(selectedIndex > -1) {
|
|
document.forms['frmwizardNewVM'].newVMDiskSelect.selectedIndex = selectedIndex;
|
|
}
|
|
|
|
$(document.forms['frmwizardNewVM'].newVMDiskSelect).mediumselect({'type':'HardDisk','showdiff':false,'media':mediumSelects});
|
|
|
|
if(sel) {
|
|
$(document.forms['frmwizardNewVM'].newVMDiskSelect).mediumselect({'selectMedium':sel});
|
|
$(document.forms['frmwizardNewVM'].newVMDiskSelect).val(sel);
|
|
}
|
|
}
|
|
|
|
vmNewFillExistingDisks();
|
|
|
|
/*
|
|
*
|
|
* Called when OS family type changes
|
|
*
|
|
*/
|
|
function newVMUpdateOSList(osfam) {
|
|
|
|
document.forms['frmwizardNewVM'].newVMOSType.options.length = 0;
|
|
$(document.forms['frmwizardNewVM'].newVMOSType).children().remove();
|
|
for(var i = 0; i < newVMOSTypes[osfam].osTypes.length; i++) {
|
|
document.forms['frmwizardNewVM'].newVMOSType.options[i] = new Option(newVMOSTypes[osfam].osTypes[i].description, newVMOSTypes[osfam].osTypes[i].id);
|
|
}
|
|
// Trigger change
|
|
newVMUpdateOS(newVMOSTypes[osfam].osTypes[0].id);
|
|
}
|
|
|
|
function newVMUpdateOS(ostype) {
|
|
|
|
document.images["vboxOSTypeImg"].src = "images/vbox/" + vboxGuestOSTypeIcon(ostype);
|
|
|
|
ostype = newVMOSTypesObj[ostype];
|
|
|
|
$('#wizardNewVMSize').slider('value',ostype.recommendedRAM);
|
|
$('#newVMSizeLabel').html(trans('The recommended memory size is <b>%1</b> MB.','UIWizardNewVMPage3').replace('%1',ostype.recommendedRAM));
|
|
$('#newVMHDSizeLabel').html(trans('<p>If you wish you can add a virtual hard disk to the new machine. You can either create a new hard disk file or select one from the list or from another location using the folder icon.</p><p>If you need a more complex storage set-up you can skip this step and make the changes to the machine settings once the machine is created.</p><p>The recommended size of the hard disk is <b>%1</b>.</p>','UIWizardNewVMPage4').replace('%1',vboxMbytesConvert(ostype.recommendedHDD)));
|
|
|
|
}
|
|
|
|
var newVMOSTypes = new Array();
|
|
var newVMOSTypesObj = {};
|
|
|
|
// shorthand
|
|
var vboxOSTypes = $('#vboxPane').data('vboxOSTypes');
|
|
|
|
// Default OS Type set to my fav :) Eventually will move to config.php
|
|
var vboxDefaultOSTypeId = 'Debian';
|
|
|
|
|
|
var dosfam = null; // holds defaultostype family id
|
|
for(var i in vboxOSTypes) {
|
|
|
|
// Skip unsupported OS types
|
|
if(!vboxOSTypes[i].supported) continue;
|
|
|
|
// create array of os family types
|
|
if(!newVMOSTypes[vboxOSTypes[i].familyId]) {
|
|
newVMOSTypes[vboxOSTypes[i].familyId] = {'id':vboxOSTypes[i].familyId,'description':vboxOSTypes[i].familyDescription,'osTypes':[]};
|
|
}
|
|
|
|
// We're on the default os type, record family id and index number
|
|
// so that we can set it later on
|
|
if(vboxOSTypes[i].id == vboxDefaultOSTypeId) {
|
|
dosfam = vboxOSTypes[i].familyId;
|
|
vboxDefaultOSTypeId = newVMOSTypes[vboxOSTypes[i].familyId].osTypes.length;
|
|
}
|
|
|
|
newVMOSTypes[vboxOSTypes[i].familyId].osTypes[newVMOSTypes[vboxOSTypes[i].familyId].osTypes.length] = {'id':vboxOSTypes[i].id,'description':vboxOSTypes[i].description };
|
|
|
|
newVMOSTypesObj[vboxOSTypes[i].id] = vboxOSTypes[i];
|
|
|
|
// Preload icons
|
|
vboxOSTypes[i].icon = new Image();
|
|
vboxOSTypes[i].icon.src = "images/vbox/" + vboxGuestOSTypeIcon(vboxOSTypes[i].id);
|
|
|
|
}
|
|
// clear all options
|
|
document.forms['frmwizardNewVM'].newVMOSFamily.options.length = 0;
|
|
$(document.forms['frmwizardNewVM'].newVMOSFamily).children().remove();
|
|
for(var i in newVMOSTypes) {
|
|
// default os type family? record in dosfam
|
|
if(i == dosfam) dosfam = document.forms['frmwizardNewVM'].newVMOSFamily.options.length;
|
|
document.forms['frmwizardNewVM'].newVMOSFamily.options[document.forms['frmwizardNewVM'].newVMOSFamily.options.length] = new Option(newVMOSTypes[i].description, newVMOSTypes[i].id);
|
|
}
|
|
// OnChange, update os type list and icon
|
|
document.getElementById('newVMOSFamily').setAttribute('onChange','newVMUpdateOSList(this.value)');
|
|
document.getElementById('newVMOSType').setAttribute('onChange','newVMUpdateOS(this.value)');
|
|
|
|
document.forms['frmwizardNewVM'].newVMOSFamily.selectedIndex = dosfam;
|
|
newVMUpdateOSList(document.forms['frmwizardNewVM'].newVMOSFamily.value);
|
|
document.forms['frmwizardNewVM'].newVMOSType.selectedIndex = vboxDefaultOSTypeId;
|
|
newVMUpdateOS(document.forms['frmwizardNewVM'].newVMOSType.options[document.forms['frmwizardNewVM'].newVMOSType.selectedIndex].value);
|
|
|
|
/*
|
|
* END OS TYPES
|
|
*/
|
|
|
|
/* When hard disk is enabled / disabled */
|
|
$('#newVMHDTriggerBind').on('enable',function(){
|
|
|
|
// Update disabled / enabled items
|
|
if(document.forms['frmwizardNewVM'].newVMDisk[0].checked) {
|
|
$(document.forms['frmwizardNewVM'].newVMDisk[0]).trigger('click');
|
|
} else {
|
|
$(document.forms['frmwizardNewVM'].newVMDisk[1]).trigger('click');
|
|
}
|
|
|
|
}).on('disable',function(){
|
|
newVMToggleNewDisk(true);
|
|
}).trigger('disable');
|
|
|
|
$('#wizardNewVMStep1').on('show',function() {
|
|
$(document.forms['frmwizardNewVM'].newVMName).focus();
|
|
});
|
|
|
|
</script>
|