{"id":32483,"date":"2023-03-08T16:29:03","date_gmt":"2023-03-08T15:29:03","guid":{"rendered":"https:\/\/mimolive.com\/?post_type=user-manual&#038;p=32483"},"modified":"2025-06-16T19:35:00","modified_gmt":"2025-06-16T17:35:00","slug":"fjarrkontroll-presets-api","status":"publish","type":"user-manual","link":"https:\/\/mimolive.com\/sv\/user-manual\/custom-layers\/remote-control-presets-api\/","title":{"rendered":"API f\u00f6r fj\u00e4rrkontrollens f\u00f6rinst\u00e4llningar"},"content":{"rendered":"<p>Om du skapar ett anpassat lager finns det m\u00f6jlighet att \u00e4ven inkludera f\u00f6rinst\u00e4llningar f\u00f6r anpassad kontroll med ditt lager. Detta \u00e4r praktiskt om ditt lager har tryckknappar som styr beteendet hos ditt lager n\u00e4r det \u00e4r live.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"data-structure\">Datastruktur<\/h3>\n\n\n\n<p>F\u00f6ljande datastruktur \u00e4r ett exempel p\u00e5 utdata som m\u00e5ste finnas i din sammans\u00e4ttning under strukturutdatanyckeln `tvOut_ControlRepresentations`:<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>{\n  \"tvOut_ControlRepresentations\": &#91;\n    {\n      \"title\": \"Compact Cut's\",\n      \"buttons\": &#91;\n        {\n          \"actions\": &#91;\n            {\n              \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n              \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n              \"type\": \"signal\",\n              \"signalKey\": \"tvGroup_Control__Cut_1_TypeSignal\",\n              \"signalName\": \"Cut 1\"\n            }\n          ],\n          \"liveState\": {\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n            \"dynamicSourceId\": \"tvIn_VideoSourceAImage\"\n          },\n          \"sourcePreview\": {\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\",\n            \"dynamicSourceId\": \"tvIn_VideoSourceAImage\"\n          },\n          \"color\": \"#BBBBBB\",\n          \"width\": 1,\n          \"height\": 1,\n          \"x\": 0,\n          \"y\": 0,\n          \"icon\": \"facetime-video\",\n          \"dynamicText\": {\n            \"template\": \"{{inputputValues.tvIn_VideoSourceAName}}\",\n            \"layerId\": \"03627C25-CC8A-474F-A738-C4DEB3353FA4\",\n            \"variantId\": \"F6F52194-06DE-462E-983A-8D505C533A69\"\n          }\n        }\n      ]\n    }\n  ]\n}<\/code><\/pre>\n\n\n\n<p>En f\u00f6rinst\u00e4llning har en \"titel\" och en upps\u00e4ttning \"knappar\", men en enda knapp \u00e4r ocks\u00e5 ok.<\/p>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Nycklarna `layerId` och `variantId` m\u00e5ste fyllas i dynamiskt med str\u00e4ngdata fr\u00e5n sammans\u00e4ttningens inmatningsnycklar `tvIn_LayerIdentifier` och `tvIn_RuntimeIdentifier`.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\t\t<style>.boinx_section {\n    margin:30px 0;\n    padding:10px;\n    background-color:rgb(217,237,248);\n    border-radius: 8px;\n  \n}\n\n.icon_highlight {\n    display:block;\n    padding:5px;\n    font-size:80px;\n    color:rgb(58,134,172);\n    line-height:60px;\n}\n\n.text_highlight {\n    color:rgb(58,134,172);\n}\n\n.text_highlight_headline{\n    font-weight:bold;\n    color:rgb(58,134,172);\n}\n\n.main_div\n{\n    display:flex !IMPORTANT;\n    flex-wrap: wrap;\n    flex-direction: row;\n    justify-content : flex-start;\n    align-items : flex-start\n    align-content : flex-start;\n}\n.left_div_icon{\n    display:flex !IMPORTANT;\n    width:40px;\n    padding:0;\n    margin:10px 20px 10px 10px;\n    \n}\n.right_div_text{\n    display:flex !IMPORTANT;\n    flex-direction: column;\n    flex-grow: 1;\n    padding:10px;\n    margin:0;\n    width:200px;\n    }<\/style>\n\t\t\n\n\n<h3 class=\"wp-block-heading\" id=\"using-the-remote-control-preset-api-in-quartz-composer\">Anv\u00e4nda fj\u00e4rrkontrollen F\u00f6rinst\u00e4llning <span class=\"caps\">API<\/span> i Quartz Komposit\u00f6r<\/h3>\n\n\n\n\n\n<p>De inbyggda lagren i mimoLive anv\u00e4nder en <span class=\"caps\">LUA<\/span> skript f\u00f6r att dynamiskt generera denna datastruktur eftersom Quartz Composer inte st\u00f6der generering av datastrukturer p\u00e5 egen hand. Den <span class=\"caps\">LUA<\/span> inneh\u00e5ller en komplex funktion addButton() som kan anv\u00e4ndas f\u00f6r att skapa strukturen f\u00f6r en enda knapp. Vanligtvis kan du bara anv\u00e4nda den h\u00e4r funktionen och beh\u00f6ver inte modifiera den. D\u00e4rf\u00f6r \u00e4r det ganska enkelt att bygga nya standardinst\u00e4llningar f\u00f6r fj\u00e4rrkontrollen f\u00f6r ditt eget lager.<\/p>\n\n\n\n<p>Detta \u00e4r till exempel <span class=\"caps\">LUA<\/span> skript f\u00f6r att generera fj\u00e4rrkontrollerna f\u00f6r Stop Watch-lagret. Observera att du kan anpassa denna kod genom att bara \u00e4ndra raderna 15 till 29 i koden.<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>inLayerIdentifier = QC_STRING\ninVariantIdentifier = QC_STRING\noutControlRepresentations = QC_STRUCT\nmain = function()\n  controlRepresentations = {}\n  -- first representation\n  controlRepresenation = {}\n  -- {\n    controlRepresenation&#91;\"Title\"] = \"Stop Watch\"\n    buttons = {}\n    -- {\n      -- addButton(buttonsTable, buttonTitle, subTitle, positionX, positionY, width, height, color, icon, actionTarget, liveStateSource, previewSource)\n      -- first row\n      addButton(buttons, \"{{outputValues.tvOut_TimeString}}\", \"\", 0, 0, 2, 1, \"#333333\", \"\", \"\", \"\", \"\")\n      addButton(buttons, \"Live\", \"{\\{name\\}}\", 2, 0, 1, 1, \"#333333\", \"\", \"toggleLive\", \"layerVariant\", \"\")\n      -- second row\n      addButton(buttons, \"Start\", \"\", 0, 1, 1, 1, \"#33cc33\", \"play\", \"tvGroup_Control__Start_TypeSignal\", \"\", \"\")\n      addButton(buttons, \"Stop\", \"\", 1, 1, 1, 1, \"#cc3333\", \"pause\", \"tvGroup_Control__Stop_TypeSignal\", \"\", \"\")\n      addButton(buttons, \"Reset\", \"\", 2, 1, 1, 1, \"#cccc33\", \"stop\", \"tvGroup_Control__Reset_TypeSignal\", \"\", \"\")\n    -- }\n    controlRepresenation&#91;\"buttons\"] = buttons\n  -- }\n  table.insert(controlRepresentations , controlRepresenation)\n  outControlRepresentations = controlRepresentations\nend\nfunction addButton(buttonsTable, buttonTitle, buttonSubTitle, positionX, positionY, width, height, color, icon, actionTarget, liveStateSource, previewSource)\n  local button = {}\n  -- {\n  if #buttonTitle &amp;gt; 0 then\n    if string.find(buttonTitle, \"{{\") then\n      -- dynamic titel\n      local dynamicText = {}\n      -- {\n        dynamicText&#91;\"layerId\"] = inLayerIdentifier\n        dynamicText&#91;\"variantId\"] = inVariantIdentifier\n        dynamicText&#91;\"template\"] = buttonTitle\n      -- }\n      button&#91;\"dynamicText\"] = dynamicText\n    else\n      -- static title\n      button&#91;\"text\"] = buttonTitle\n    end -- if dynamic\n  end -- if buttonTitle\n  if #buttonSubTitle &amp;gt; 0 then\n    if string.find(buttonSubTitle, \"{{\") then\n      -- dynamic titel\n      local dynamicSubText = {}\n      -- {\n        dynamicSubText&#91;\"layerId\"] = inLayerIdentifier\n        dynamicSubText&#91;\"variantId\"] = inVariantIdentifier\n        dynamicSubText&#91;\"template\"] = buttonSubTitle\n      -- }\n      button&#91;\"dynamicSubText\"] = dynamicSubText\n    else\n      -- static title\n      button&#91;\"subtext\"] = buttonSubTitle\n    end -- if dynamic\n  end -- if buttonSubTitle\n  button&#91;\"x\"] = positionX\n  button&#91;\"y\"] = positionY\n  button&#91;\"width\"] = width\n  button&#91;\"height\"] = height\n  if #color &amp;gt; 0 then\n    button&#91;\"color\"] = color\n  end -- if\n  if #actionTarget &amp;gt; 0 then\n    local actions = {}\n    -- {\n      local action = {}\n      -- {\n        action&#91;\"layerId\"] = inLayerIdentifier\n        action&#91;\"variantId\"] = inVariantIdentifier\n        if string.ends(actionTarget, \"_TypeSignal\") then\n          action&#91;\"type\"] = \"signal\"\n          action&#91;\"signalKey\"] = actionTarget\n          action&#91;\"signalName\"] = buttonTitle\n        elseif actionTarget == \"toggleLive\" then\n          action&#91;\"type\"] = \"toggleLive\"\n        else\n          action&#91;\"type\"] = \"toggleSwitch\"\n          action&#91;\"toggleSwitchKey\"] = actionTarget\n          action&#91;\"toggleSwitchName\"] = buttonTitle\n        end -- if\n      -- }\n      table.insert(actions , action)\n    -- }\n    button&#91;\"actions\"] = actions\n  end -- if actionTarget\n  if #liveStateSource &amp;gt; 0 then\n    local liveState = {}\n    -- {\n      liveState&#91;\"layerId\"] = inLayerIdentifier\n      liveState&#91;\"variantId\"] = inVariantIdentifier\n      if string.starts(liveStateSource,\"tvIn_VideoSource\") then\n        -- get the live state from a dynamic video source\n        liveState&#91;\"dynamicSourceId\"] = liveStateSource\n      elseif liveStateSource == \"layerVariant\" then\n        -- nor more information needed\n      else\n        liveState&#91;\"propertyPath\"] = liveStateSource            end -- if\n    -- }\n    button&#91;\"liveState\"] = liveState\n  end -- if liveState Source\n  if #previewSource &amp;gt; 0 then\n    local sourcePreview = {}\n    -- {\n      sourcePreview&#91;\"layerId\"] = inLayerIdentifier\n      sourcePreview&#91;\"variantId\"] = inVariantIdentifier\n      sourcePreview&#91;\"dynamicSourceId\"] = previewSource\n    -- }\n    button&#91;\"sourcePreview\"] = sourcePreview\n  end -- if\n  if #icon &amp;gt; 0 then\n    -- See bottom of documentation page for list of avaiable icon names\n    button&#91;\"icon\"] = icon\n  end -- if\n  -- }\n  table.insert(buttonsTable, button)\nend -- func\nfunction string.starts(String,Start)\n   return string.sub(String,1,string.len(Start))==Start\nend\nfunction string.ends(String,End)\n   return End=='' or string.sub(String,-string.len(End))==End\nend<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Button Positionering<\/h3>\n\n\n\n<p>N\u00e4r du anv\u00e4nder flera knappar m\u00e5ste knapplayouten styras manuellt. Det inneb\u00e4r att knapparna positioneras p\u00e5 rutn\u00e4tet med hj\u00e4lp av attributen \"x\" och \"y\", som precis som attributen \"bredd\" och \"h\u00f6jd\" anges i multiplar av rutn\u00e4tsceller. Positionerna \u00e4r relativa till den \u00f6vre v\u00e4nstra rutn\u00e4tscellen som knappgruppen drogs till.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-positioning\">Button \u00c5tg\u00e4rder<\/h3>\n\n\n\n<p>Buttons kan ha flera \u00e5tg\u00e4rder, en enda \u00e5tg\u00e4rd eller ingen alls. Det finns olika giltiga kombinationer av \u00e5tg\u00e4rdsm\u00e5l och \u00e5tg\u00e4rdstyper.<br>Observera att \u00e5tg\u00e4rderna \"textInput\" och \"numericInput\" b\u00f6r vara frist\u00e5ende, eftersom en konsekvent anv\u00e4ndarupplevelse i fj\u00e4rrkontrollen inte kan garanteras.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"action-targets\">M\u00e5l f\u00f6r \u00e5tg\u00e4rder<\/h4>\n\n\n\n<p>\u00c5tg\u00e4rdsm\u00e5l \u00e4r element inuti mimoLive-dokumentet. De adresseras p\u00e5 ett hierarkiskt s\u00e4tt:<\/p>\n\n\n\n<p>\"Dokument-ID\" ritas alltid vid k\u00f6rning, s\u00e5 det beh\u00f6ver inte finnas med i f\u00f6rinst\u00e4llningen.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Om varken \"layerId\" eller \"variantId\" anges kommer \u00e5tg\u00e4rden att utl\u00f6sas p\u00e5 sj\u00e4lva dokumentet.<\/li>\n\n\n\n<li>Om \"layerId\" anges kommer \u00e5tg\u00e4rden att utl\u00f6sas p\u00e5 det angivna lagret.<\/li>\n\n\n\n<li>Om \"layerId\" <b>och<\/b> \"variantId\" anges kommer \u00e5tg\u00e4rden att utl\u00f6sas p\u00e5 den angivna varianten. Endast i detta fall kan till\u00e4gget \"toggleSwitchKey\" eller \"signalKey\" anges (se \u00c5tg\u00e4rdstyper nedan).<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"action-types\">Typer av \u00e5tg\u00e4rder<\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><th>Typ av \u00e5tg\u00e4rd<\/th><th>F\u00f6rklaring<\/th><th>Ytterligare attribut<\/th><th>Giltiga m\u00e5l<\/th><\/tr><tr><td>v\u00e4xlaLive<\/td><td>V\u00e4xla levande tillst\u00e5nd<\/td><td>ingen<\/td><td>Dokument (Start\/Stop show), Lager, Variant<\/td><\/tr><tr><td>inst\u00e4lld p\u00e5 liv<\/td><td>St\u00e4ll in live-status till \"live\"<\/td><td>ingen<\/td><td>Dokument (Start Show), Lager, Variant<\/td><\/tr><tr><td>setOff<\/td><td>S\u00e4tt live-status till \"av\"<\/td><td>ingen<\/td><td>Dokument (Stop Show), Lager, Variant<\/td><\/tr><tr><td>signal<\/td><td>Utl\u00f6sa en signal<\/td><td>signalKey, signalName (rekommenderas)<\/td><td>Variant<\/td><\/tr><tr><td>ToggleSwitch<\/td><td>V\u00e4xla ett booleskt ing\u00e5ngsv\u00e4rde<\/td><td>toggleSwitchKey, toggleSwitchName (rekommenderas)<\/td><td>Variant<\/td><\/tr><tr><td>textInput<\/td><td>\u00d6ppnar ett textinmatningsf\u00e4lt som, n\u00e4r det skickas, uppdaterar v\u00e4rdet i inputKey.<\/td><td>inputKey, inputName (rekommenderas)<\/td><td>Lager, Variant, K\u00e4lla<\/td><\/tr><tr><td>numeriskIng\u00e5ng<\/td><td>Slider som styr ett numeriskt v\u00e4rde p\u00e5 inputKey.<\/td><td>inputKey, inputDescription (objekt med b\u00e5de min- och maxv\u00e4rden), inputName (rekommenderas)<\/td><td>Lager, Variant, K\u00e4lla<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Handlingstyperna \"textInput\" och \"numericInput\" \u00e4r tillg\u00e4ngliga sedan mimoLive 5.2.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-live-state\">Button Live State<\/h3>\n\n\n\n<p>Objektet \"liveState\" kan anv\u00e4ndas f\u00f6r att konfigurera knappens tally-ljusstatus, som kan vara p\u00e5 (r\u00f6d markering), \u00f6verg\u00e5ng (gul markering) eller av (ingen markering).<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"live-state-sources\">Levande statliga k\u00e4llor<\/h4>\n\n\n\n<p>I likhet med m\u00e5l f\u00f6r knapp\u00e5tg\u00e4rder kan live-status erh\u00e5llas fr\u00e5n flera k\u00e4llor:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\"Dokument-ID\" ritas alltid vid k\u00f6rning, s\u00e5 det beh\u00f6ver inte finnas med i f\u00f6rinst\u00e4llningen.<\/li>\n\n\n\n<li>Om varken \"layerId\" eller \"variantId\" anges, anv\u00e4nds dokumentets live-status (showen har startat eller inte).<\/li>\n\n\n\n<li>Om \"layerId\" anges anv\u00e4nds lagrets live-status.<\/li>\n\n\n\n<li>Om \"layerId\" och \"variantId\" anges anv\u00e4nds variantens live-status.<br>- Endast i detta fall kan till\u00e4gget \"propertyPath\" anges f\u00f6r att indikera att en boolesk egenskap p\u00e5 variantens in- eller utg\u00e5ngsv\u00e4rden m\u00e5ste anv\u00e4ndas.<br>- En annan m\u00f6jlighet (\u00f6msesidigt uteslutande med propertyPath!) \u00e4r att ange en egenskap \"dynamicSourceId\" som omdirigerar live state-uppslagningen till en k\u00e4lla (h\u00e4mtad med ID), som respekterar dynamiska f\u00f6r\u00e4ndringar av den valda k\u00e4llan (t.ex. i video switcher). V\u00e4rdet f\u00f6r \"dynamicSourceId\" s\u00f6ks upp i variantens ing\u00e5ngsv\u00e4rden.<\/li>\n<\/ul>\n\n\n\n<p><i>*<\/i>Ange den fullst\u00e4ndiga s\u00f6kv\u00e4gen till egenskapen, med utg\u00e5ngspunkt fr\u00e5n varianten som rot, t.ex. \"inputValues.some_Boolean_Property\" eller \"outputValues.other_Property\".<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Om \"sourceId\" anges anv\u00e4nds k\u00e4llans live-status.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"button-text\">Button Text<\/h3>\n\n\n\n<p>Aktionsknappar kan visa prim\u00e4ra och sekund\u00e4ra textrader, b\u00e5da kan vara av statisk eller dynamisk natur.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"primary-text\">Prim\u00e4r text<\/h4>\n\n\n\n<p>Denna text kommer att vara den prim\u00e4ra indikatorn p\u00e5 vad knappen kommer att g\u00f6ra f\u00f6r anv\u00e4ndaren. Om knappf\u00f6rinst\u00e4llningen inneh\u00e5ller en text-egenskap \u00e4r det en statisk text som kommer att visas som den \u00e4r.<\/p>\n\n\n\n<p>Alternativt kan en dynamicText anges som m\u00f6jligg\u00f6r inkludering av mimoLive-skikt eller variantegenskaper med hj\u00e4lp av en enkel mallsyntax. I mallstr\u00e4ngen kan vanliga tecken kombineras med egenskapss\u00f6kv\u00e4gar som omsluts av hakparenteser:<\/p>\n\n\n\n<pre class=\"wp-block-code\" data-no-translation=\"\"><code>\"template\": \"{\\{propertyPath\\}}\"<\/code><\/pre>\n\n\n\n<p>Egenskapss\u00f6kv\u00e4gar utv\u00e4rderas i f\u00f6rh\u00e5llande till det objekt som \u00e4r uppl\u00f6st med hj\u00e4lp av \"layerId\", \"variantId\", \"sourceId\" och \"filterId\". M\u00e5luppl\u00f6sning f\u00f6ljer dessa regler:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\"Dokument-ID\" ritas alltid vid k\u00f6rning, s\u00e5 det beh\u00f6ver inte finnas med i f\u00f6rinst\u00e4llningen.<\/li>\n\n\n\n<li>Om varken \"layerId\" eller \"variantId\" anges, utv\u00e4rderas egenskapss\u00f6kv\u00e4garna relativt till dokumentet<\/li>\n\n\n\n<li>Om \"layerId\" (och eventuellt \"variantId\") anges, utv\u00e4rderas egenskapss\u00f6kv\u00e4garna i f\u00f6rh\u00e5llande till ett lager\/variant.<\/li>\n\n\n\n<li>En variants \u00f6verordnade lager kan n\u00e5s genom att starta en s\u00f6kv\u00e4g med \"lager\", t.ex. \"aslayer.name\".<\/li>\n<\/ul>\n\n\n<section class=\"boinx_section\">\n    <div class=\"main_div\">\n        <div class=\"left_div_icon\">\n                <i class=\"icon_highlight\">*<\/i>\n        <\/div>\n\n        <div class=\"right_div_text\">\n                <div><p class=\"text_highlight_headline\"><\/p><\/div>\n                <div><p class=\"text_highlight\">Det f\u00f6rsta s\u00f6kv\u00e4gssegmentet f\u00f6r ing\u00e5ngs- och utg\u00e5ngsv\u00e4rden m\u00e5ste vara camelCased (\"inputValues.tvIn...\") och inte kebab-cased (\"input-values.tvIn...\") som i API-dokumenten.<\/p><\/div>\n        <\/div>    \n    <\/div>\n<\/section>\n\n\n\n\n<ul class=\"wp-block-list\">\n<li>Statisk text har alltid f\u00f6retr\u00e4de framf\u00f6r dynamisk text, eftersom detta g\u00f6r det m\u00f6jligt f\u00f6r anv\u00e4ndare att skriva \u00f6ver den dynamiska texten med n\u00e5gon anpassad text som kan vara mer anv\u00e4ndbar i deras situation.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"secondary-text\">Sekund\u00e4r text<\/h4>\n\n\n\n<p>F\u00f6r att ge anv\u00e4ndaren mer information om en knapp, t.ex. namnet p\u00e5 det \u00f6verordnade lagret, kan en sekund\u00e4r text anges med hj\u00e4lp av egenskaperna \"subtext\" eller \"dynamicSubText\".<\/p>\n\n\n\n<p>Templating-syntax och objektuppl\u00f6sning f\u00f6ljer exakt samma regler som prim\u00e4rtexten.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"button-text-and-icon-size\">Button text och ikonstorlek<\/h4>\n\n\n\n<p>Texten och ikonerna p\u00e5 knapparna kan variera i storlek beroende p\u00e5 sammanhanget. Med alternativet \"fontScale\" kan du ange en relativ skala till en standardstorlek som ber\u00e4knas f\u00f6r den aktuella sk\u00e4rmstorleken. \"1\" kommer att vara standardstorleken. Mindre \u00e4n 1 (t.ex. 0,8) kommer att minska teckenstorleken och st\u00f6rre \u00e4n 1 (t.ex. 1,5) kommer att \u00f6ka den.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Button F\u00f6rhandsgranskning<\/h3>\n\n\n\n<p>\u00c5tg\u00e4rdsknappar kan visa en f\u00f6rhandsgranskningsbild av den k\u00e4lla de styr, eller n\u00e5gon annan k\u00e4lla som finns tillg\u00e4nglig i dokumentet.<\/p>\n\n\n\n<p>Beroende p\u00e5 om k\u00e4llan \u00e4r statisk (endast bilder som drogs in i mimoLive), en statisk <span class=\"caps\">PNG<\/span> representation av k\u00e4llan laddas en g\u00e5ng som st\u00f6der en alfakanal. F\u00f6r alla andra k\u00e4llor laddas en <span class=\"caps\">JPEG<\/span> representationen av k\u00e4llan uppdateras regelbundet. M\u00e5let f\u00f6r uppdateringshastigheten f\u00f6r dynamiska k\u00e4llor \u00e4r 5 bilder per sekund, men denna hastighet minskas om n\u00e4tanslutningshastigheten visar sig vara otillr\u00e4cklig f\u00f6r upprepad laddning av f\u00f6rhandsgranskningsbilder.<\/p>\n\n\n\n<p>Det finns f\u00f6r n\u00e4rvarande inget st\u00f6d f\u00f6r att visa dokumentets programutdata p\u00e5 en \u00e5tg\u00e4rdsknapp. Standardbilder f\u00f6r lager, \u00e4ven om de inte syns i listan \u00f6ver k\u00e4llor, \u00e4r tillg\u00e4ngliga f\u00f6r f\u00f6rhandsgranskning.<\/p>\n\n\n\n<p>F\u00f6r att specificera en k\u00e4llf\u00f6rhandsgranskning anv\u00e4nds en objektuppl\u00f6sningsmekanism:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\"Dokument-ID\" ritas alltid vid k\u00f6rning, s\u00e5 det beh\u00f6ver inte finnas med i f\u00f6rinst\u00e4llningen.<\/li>\n\n\n\n<li>Om \"sourceId\" anges anv\u00e4nds k\u00e4llan med det ID:t f\u00f6r f\u00f6rhandsgranskning.<\/li>\n\n\n\n<li>Om alla \"layerId\", \"variantId\" och \"dynamicSourceId\" anges, kommer k\u00e4llans ID att s\u00f6kas upp i det angivna lagrets variant under nyckeln i \"dynamicSourceId\". Detta kan anv\u00e4ndas f\u00f6r att referera till k\u00e4llor som videoomkopplarens k\u00e4lla A-G, \u00e4ven n\u00e4r de \u00e4ndras i dokumentet.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Button F\u00e4rg<\/h3>\n\n\n\n<p>Genom att anv\u00e4nda attributet \"color\" kan knappar f\u00e4rgl\u00e4ggas med valfri f\u00e4rgkod som kan representeras i <span class=\"caps\">HTML<\/span> (t.ex. \"#f80\", \"#ff0088\", \"orange\" eller \"rgb(255, 66, 88)\").<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Button Ikon<\/h3>\n\n\n\n<p>Buttons kan visa en ikon f\u00f6r att indikera deras funktionalitet. F\u00f6r att se en lista \u00f6ver alla tillg\u00e4ngliga ikoner, \u00f6ppna http:\/\/localhost:8989\/icons\/demo.html medan mimoLive k\u00f6rs och fj\u00e4rrkontrollerna \u00e4r aktiverade.<br>Anv\u00e4nd det vanliga namnet p\u00e5 ikonen, t.ex. \"bak\u00e5t\" eller \"pil ned\".<\/p>","protected":false},"excerpt":{"rendered":"<p>If you are creating a custom layer, there is the possibility of even including custom control presets with your layer. This come in handy if your layer has push buttons that controls the behaviour of your layer when its live. Data Structure The following data structure is a sample output which needs to be present [&hellip;]<\/p>","protected":false},"author":3,"featured_media":0,"parent":32482,"menu_order":1,"template":"","meta":{"_acf_changed":false,"_angie_page":false,"_lmt_disableupdate":"no","_lmt_disable":"","footnotes":""},"categories":[258],"tags":[],"class_list":["post-32483","user-manual","type-user-manual","status-publish","hentry","category-manual"],"acf":[],"_links":{"self":[{"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/user-manual\/32483","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/user-manual"}],"about":[{"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/types\/user-manual"}],"author":[{"embeddable":true,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/users\/3"}],"version-history":[{"count":2,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/user-manual\/32483\/revisions"}],"predecessor-version":[{"id":40973,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/user-manual\/32483\/revisions\/40973"}],"up":[{"embeddable":true,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/user-manual\/32482"}],"wp:attachment":[{"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/media?parent=32483"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/categories?post=32483"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mimolive.com\/sv\/wp-json\/wp\/v2\/tags?post=32483"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}