Skip to content

z Porting v3.11 to v4.00 notes

Jump to bottom Edit New page
Scotty Franzyshen edited this page Jul 4, 2019 · 2 revisions

LCARS SDK JS API Compare:

			V3.11								V4.00

var timing_sequence = 65;					|	var lcars =
var allObjects = {};						|		colors:
var objectCount = 0;						|			pool:
								|				blue:
var LCARS =							|				green:
	templates:						|				purple:
		sdk:						|				orange:
			scrollButton:				|				red:
			levelBar:				|				grey:
			bracket:				|			primary:
			dialog:					|			secondary:
			framing:				|			tertiary:
	scrollButton:						|			custom:
								|
	levelBar:						|
		settings:					|	var LCARS =
			color:function(args)			|		active:
			label:function(args)			|		element:
			altLabel:function(args)			|			aside:
			level:function(args)			|			bar:
								|			block:
	bracket:						|			button:
								|			cap:
	dialog:							|			column:
								|			complex-button:
	scaler: function(panelW, panelH, wrapper, max)		|			content:
	childScale:function(panelW, panelH, wrapper, max)	|			details:
	zoom:function(width, height)				|			elbow:
	childZoom:function(width, height)			|			endcap:
	colorGen: function(array)				|			footer:
	colorGroupGen:function(array, iLength)			|			header:
								|			html-tag:
	settings:						|			img:
		set:function(element, args)			|			main:
		get:function(element, arg, args)		|			nav:
		click:function(args)				|			oval:
		mouseenter:function(args)			|			row:
		mouseleave:function(args)			|			section:
		hover:function(args)				|			svg:
		mousedown:function(args)			|			text:
		mouseup:function(args)				|			title:
		tap:function(args)				|			wrapper:
		singleTap:function(args)			|			sdk:
		doubleTap:function(args)			|				scrollButton:
		longTap:function(args)				|					scrollUp:function()
		swipe:function(args)				|					scrollDown:function()
		swipeLeft:function(args)			|					scrollLeft:function()
		swipeRight:function(args)			|					scrollRight:function()
		swipeUp:function(args)				|				solidLevelBar:
		swipeDown:function(args)			|					setting:
		type:function(args)				|						color:function(object, value)
		color:function(args)				|						level:function(object, value)
		version:function(args)				|				defaultBracket:
		direction:function(args)			|					setting:
		orient:function(args)				|						coloring:function(object, value)
		label:function(args)				|				defaultBarFrame:
		altLabel:function(args)				|					template:
		size:function(args)				|					setting:
		state:function(args)				|						reverse:function(object, value)
		class:function(args)				|						coloring:function(object, value)
		style:function(args)				|						content:function(object, value)
		flex:function(args)				|						headerControlsBefore:function(object, value)
		flexC:function(args)				|						headerControlsAfter:function(object, value)
		noTransition:function(args)			|						footerControlsBefore:function(object, value)
		noEvent:function(args)				|						footerControlsAfter:function(object, value)
		disabled:function(args)				|						label:function(object, value)
		hidden:function(args)				|						altLabel:function(object, value)
		fade:function(args)				|
		readOnly:function(args)				|		setting:
		checked:function(args)				|			altLabel:function(object, sValue)
		password:function(args)				|			attr:function(object, oValue)
		inputValue:function(args)			|			class:function(object, oValue)
		text:function(args)				|			children:function(object, value)
		name:function(args)				|			color:function(object, sValue)
		href:function(args)				|			colors:function(object, aValue)
		src:function(args)				|			direction:function(object, sValue)
		attrs:function(args)				|			disabled:function(object, bValue)
		children:function(args)				|			fade:function(object, bValue)
		colors:function(args)				|			flex:function(object, sValue)
		html:function(args)				|			flexc:function(object, sValue)
		leave:function(args)				|			hidden:function(object, bValue)
		arrive:function(args)				|			href:function(object, sValue)
		endcap:function(args)				|			html:function(object, sValue)
								|			inputValue:function(object, sValue)
	definition:function(element, args)			|			label:function(object, sValue)
								|			name:function(object, sValue)
	button:							|			group:function(object, sValue)
	elbow:							|			noEvent:function(object, bValue)
	bar:							|			noTransition:function(object, bValue)
	cap:							|			password:function(object, bValue)
	block:							|			readOnly:function(object, bValue)
	oval:							|			reverse:function(object, bValue)
	complexButton:						|			size:function(object, sValue)
		settings:					|			src:function(object, sValue)
			label:function(args)			|			state:function(object, sValue)
			altLabel:function(args)			|			style:function(object, oValue)
			text:function(args)			|			text:function(object, sValue)
								|			toggle:function(object, bValue)
	radioInput:						|			toggleGroup:function(object, sValue)
								|			version:function(object, sValue)
	radio:							|			arrive:function(object, fValue)
		settings:					|			leave:function(object, fValue)
			label:function(args)			|			event:function(object, oValue)
			altLabel:function(args)			|			receiver:function(object, oValue)
			text:function(args)			|			delete:function(object, oValue)
								|			click:function(object, value)
	checkboxInput:						|			mouseenter:function(object, value)
								|			mouseleave:function(object, value)
	checkbox:						|			mousedown:function(object, value)
		settings:					|			mouseup:function(object, value)
			label:function(args)			|			mousemove:function(object, value)
			altLabel:function(args)			|			mouseout:function(object, value)
			text:function(args)			|			mouseover:function(object, value)
								|			hover:function(object, value)
	wrapper:						|			tapstart:function(object, value)
	content:						|			tapend:function(object, value)
	column:							|			tap:function(object, value)
	row:							|			singletap:function(object, value)
	title:							|			doubletap:function(object, value)
	text:							|			taphold:function(object, value)
	img:							|			swipe:function(object, value)
	svg:							|			swipeup:function(object, value)
	textInput:						|			swiperight:function(object, value)
	bracket:						|			swipedown:function(object, value)
	dialog:							|			swipeleft:function(object, value)
		settings:					|			swipeend:function(object, value)
			headerTitle:function(args)		|			scrollstart:function(object, value)
			footerTitle:function(args)		|			scrollend:function(object, value)
			content:function(args)			|			orientationchange:function(object, value)
	htmlTag:						|			tap2:function(object, value)
								|			taphold2:function(object, value)
function radioCheckboxState(func)				|
								|		helper:
$.fn.createObject = function(args)				|			toggleGroups:
$.fn.removeObject = function(success)				|			aRandColor: function(array)
$.fn.removeObjectSequence = function(args)			|			aRandColorGroup:function(array, iLength)
$.fn.showObject = function(args)				|			viewportScale: function(object, oArgs)
$.fn.showObjectSequence = function(args)			|			viewportZoom:function(object, oArgs)
$.fn.hideObject = function(args)				|			toggleCheck:function(dom, fValue)
$.fn.hideObjectSequence = function(args)			|
$.fn.objectSettings = function(setting, args, success)		|		create:function(oDef)
$.fn.getDefinition = function()					|		delete:function(object)
$.fn.getChildren = function(id)					|
$.fn.viewport = function(action, args)				|	$.fn.objectSet = function(setting, value)
$.fn.hasAttr = function(arg, string)				|
$.fn.scrollingUp = function(args)				|
$.fn.scrollingDown = function(args)				|
$.fn.scrollingLeft = function(args)				|
$.fn.scrollingRight = function(args)				|

LCARS SDK CSS Changes:

	3.11			-->			4.00

Base:

italic				-->		text-italic
span				-->		<eliminated:See ...>

Flexbox Model:

flexv				-->		flex-v
flexcv				-->		flex-c-v
flexh				-->		flex-h
flexch				-->		flex-c-h

Styling Classes:

Button:

button.pill			-->		button.round
button.right			-->		button.round-right
button.left			-->		button.round-left

Cap:

cap.left			-->		cap.round-left
cap.right			-->		cap.round-right

Complex Button:

complexButton			-->		complex-button

Duo & Duo Vertical Complex Button: (unchanged ...)

complexButton.vertical		-->		complexButton.vertical
complexButton.duo		-->		complexButton.duo

Radio Complex Button:

radio				-->		<eliminated:See ...>
radio.checked			-->		<eliminated:See ...>

Checkbox Complex Button:

checkbox			-->		<eliminated:See ...>
checkbox.checked		-->		<eliminated:See ...>

Endcap Buttons:

endcap.large			-->		endcap	(ex. endcap.large.bottom-right --> endcap.bottom-right)

Columns:

column.flexv			-->		column.flex-v

sdk.scrollButton		-->
	scrollUp:		-->
	scrollDown:		-->
	scrollLeft:		-->
	scrollRight:		-->

scrollButton.vertical		-->		sdk.scroll-button.vertical

scrollButton.horizontal		-->		sdk.scroll-button.horizontal

sdk.levelBar			-->		sdk.solid-level-bar

sdk.bracket			-->		sdk.default-bracket

sdk.dialog			-->		<eliminated:See default-bar-frame>

						sdk.default-bar-frame

LCARS SDK jquery startup change:

v3.11
var exampleUI = {type:'wrapper', id:'wpr_viewport', version:'row', flex:'h'};

$(document).on('ready', function(){
	$(exampleUI).createObject({appendTo:'body'});
});

v4.00
var exampleUI = {type:'wrapper', id:'wpr_viewport', version:'row', flex:'h'};

$( document ).ready(function() {
        $('body').append( LCARS.create(exampleUI).dom );
});

LCARS SDK javascript example changes:

v3.11	{type:'wrapper', class:'content', flexC:'v', style:' overflow:auto;'}

v4.0	{type:'wrapper', style:{'overflow':'auto'}, version:'content', flexc:'v'}


v3.11	{type:'bar', color:LCARS.colorGen(uiColors), flexC:'h'},

v4.0	{type:'bar', color:LCARS.helper.aRandColor(uiColors), flexc:'h'},


v3.11	{type:'elbow', version:'top-left', color:LCARS.colorGen(uiColors), class:'step-two'},

v4.0	{type:'elbow', version:'horizontal', direction:'top-left', color:LCARS.helper.aRandColor(uiColors), class:'step-two'},


v3.11	{type:'column', style:'justify-content: flex-end;', flexC:'v', flex:'v', children:[{type:'complexButton', text:'55', template:LCARS.templates.sdk.buttons.complexText.typeG, colors:LCARS.colorGroupGen(uiColors, 3)}]}

v4.0	{type:'column', style:{'justify-content':'flex-end'}, flexc:'v', flex:'v', children:[{type:'complexButton', children:[{type:'cap', version:'round-left'}, {type:'block'}, {type:'text', text:'55'}, {type:'button', version:'round-right'}], colors:LCARS.helper.aRandColorGroup(uiColors, 4)}]}


v3.11	{type:'bracket', template:bracket},

v4.0	{type:'defaultBracket', namespace:'sdk', coloring:{
		elbow:LCARS.helper.aRandColor(uiColors),
		column1:LCARS.helper.aRandColorGroup(uiColors, 3),
		column2:LCARS.helper.aRandColorGroup(uiColors, 3),
		column3:LCARS.helper.aRandColorGroup(uiColors, 3),
		column4:LCARS.helper.aRandColorGroup(uiColors, 3),
		animated:'bg-red-1'}},
Add a custom footer
Add a custom sidebar
Clone this wiki locally