Merged PR 4089: Indication, tooltip, interact mobile switch fix & clean up
  Button clicked indication added 
This commit is contained in:
Amit Shuster
Родитель
6b38600a1e
Коммит
35bf845a12
|
|
@ -1,52 +0,0 @@
|
|||
<div id="userReport" class="line">
|
||||
<div class="pageTitle">
|
||||
<h3>Embed your own report</h3>
|
||||
<h8>You can also embed your own report by following the instructions below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<div id="EmbedWithSpecificReportDiv">
|
||||
<div class="line">
|
||||
<h5>Prerequisites:</h5>
|
||||
<ul>
|
||||
<li>A workspace in the <a href="https://azure.microsoft.com/en-us/documentation/articles/power-bi-embedded-get-started/">Power BI embedded service.</a></li>
|
||||
<li>Power BI report imported to your workspace.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="line">
|
||||
<h5>Instructions to generate an Embed Token</h5>
|
||||
Once you have imported a report into Power BI workspace, you are ready to embed it.
|
||||
|
||||
To embed a report, you need to get an Embed Token. You can create this token in multiple ways.
|
||||
<ul>
|
||||
<li>Using <a href="https://github.com/Microsoft/PowerBI-cli">PowerBI-Cli</a> tool.</li>
|
||||
<li>From .Net Code using <a href="http://www.nuget.org/packages/Microsoft.PowerBI.Core/">Microsoft.PowerBI.Core</a> package.</li>
|
||||
<li>From NodeJS code using <a href="https://github.com/Microsoft/PowerBI-Node">powerbi-api</a> package.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="authorizeParameterDiv" class="line">
|
||||
<h5>Enter embed details:</h5>
|
||||
|
||||
<table id="user-embed-details">
|
||||
<tr>
|
||||
<td class="td-field-name">Embed Token</td>
|
||||
<td><input type="text" id="auth_txtAccessToken" onchange="UpdateSession(this, SessionKeys.AccessToken);" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="td-field-name">Embed URL</td>
|
||||
<td>
|
||||
<input type="text" id="auth_txtReportEmbed" onchange="UpdateSession(this, SessionKeys.EmbedUrl);" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="td-field-name">Report Id</td>
|
||||
<td><input type="text" id="auth_txtEmbedReportId" onchange="UpdateSession(this, SessionKeys.EmbedId);"/></td>
|
||||
</tr>
|
||||
</table>
|
||||
<button id="nextStep" class="blueButton" onclick="OpenEmbedStepFromUserSettings()">Next step - Embed</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -4,7 +4,7 @@
|
|||
<button id="btnRunCode" class="textAreaControl">
|
||||
<img src="images\run.png" /> Run
|
||||
</button>
|
||||
<button id="btnCopyCode" class="textAreaControl" onclick="CopyCode();">
|
||||
<button id="btnCopyCode" class="textAreaControl" onclick="elementClicked(this);CopyCode();">
|
||||
<img src="images\copy.png" /> Copy
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
<iframe width="330" height="186" src="https://www.youtube.com/embed/NbsLRDMWNRI" frameborder="0" allow="encrypted-media" allowfullscreen></iframe>
|
||||
</div>
|
||||
<div class="docs-video">
|
||||
Get an embed token<br>
|
||||
Get an Embed Token & Embed Your Analytics<br>
|
||||
<iframe width="330" height="186" src="https://www.youtube.com/embed/GPHHdDRSlis" frameborder="0" allow="encrypted-media" allowfullscreen></iframe>
|
||||
</div>
|
||||
<div class="docs-video">
|
||||
|
|
|
|||
|
|
@ -46,9 +46,6 @@
|
|||
|
||||
<div id ="documentationContent" class="content">
|
||||
</div>
|
||||
|
||||
<div id ="anyReportContent" class="content">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<div id="response" class="responseDiv">
|
||||
<div class="editorTitle">Log</div>
|
||||
<div class="textAreaControls">
|
||||
<button id="btnCopyResponse" class="textAreaControl" onclick="CopyResponseWindow();">
|
||||
<button id="btnCopyResponse" class="textAreaControl" onclick="elementClicked(this);CopyResponseWindow();">
|
||||
<img src="images\copy.png"/> Copy
|
||||
</button>
|
||||
<button id="btnClearResponse" class="textAreaControl" onclick="ClearTextArea('#txtResponse');">
|
||||
<button id="btnClearResponse" class="textAreaControl" onclick="elementClicked(this);ClearTextArea('#txtResponse');">
|
||||
<img src="images\clear.png"/> Clear
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,10 @@
|
|||
<div><a href="#">Embed</a></div>
|
||||
</li>
|
||||
<li id="interact-tab" onclick="OpenInteractTab();">
|
||||
<div><a href="#">Interact</a></div>
|
||||
<div class="interactTooltip">
|
||||
<div><a href="#">Interact</a></div>
|
||||
<span class="tooltipText">Please click 'Run' before switching to 'Interact' tab</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
@ -26,10 +29,10 @@
|
|||
<div class="editorTitleText">Embedded view</div>
|
||||
</div>
|
||||
<div class="textAreaControls">
|
||||
<button id="btnDesktopView" class="textAreaControl wide" onclick="EmbedAreaDesktopView();">
|
||||
<button id="btnDesktopView" class="textAreaControl wide" onclick="elementClicked(this);EmbedAreaDesktopView();">
|
||||
<img src="images\pc.png"/> Desktop
|
||||
</button>
|
||||
<button id="btnPhoneView" class="textAreaControl narrow" onclick="EmbedAreaMobileView();">
|
||||
<button id="btnPhoneView" class="textAreaControl narrow" onclick="elementClicked(this);EmbedAreaMobileView();">
|
||||
<img src="images\phone.png"/> Phone
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -67,11 +70,11 @@ $(document).ready(function() {
|
|||
|
||||
LoadLogWindow("#logWindow");
|
||||
|
||||
var modeUrlParam = GetParameterByName("mode");
|
||||
var mode = modeUrlParam ? modeUrlParam : "view";
|
||||
const modeUrlParam = GetParameterByName("mode");
|
||||
const mode = modeUrlParam ? modeUrlParam : "view";
|
||||
|
||||
var entityTypeUrlParam = GetParameterByName("entityType");
|
||||
var entityType;
|
||||
const entityTypeUrlParam = GetParameterByName("entityType");
|
||||
let entityType;
|
||||
if (entityTypeUrlParam == "dashboard") {
|
||||
entityType = EntityType.Dashboard;
|
||||
} else if (entityTypeUrlParam == "tile") {
|
||||
|
|
|
|||
|
|
@ -26,20 +26,20 @@ function datasetNotSupported() {
|
|||
}
|
||||
|
||||
function IsSaveMock(funcName) {
|
||||
var sampleId = GetSession(SessionKeys.SampleId);
|
||||
var isSample = sampleId && (_session.embedId === sampleId);
|
||||
const sampleId = GetSession(SessionKeys.SampleId);
|
||||
const isSample = sampleId && (_session.embedId === sampleId);
|
||||
return ((funcName === '_Report_save' || funcName === '_Report_saveAs') && isSample);
|
||||
}
|
||||
|
||||
function IsBasicMock(funcName) {
|
||||
var sampleId = GetSession(SessionKeys.SampleId);
|
||||
var isSample = sampleId && (_session.embedId === sampleId);
|
||||
const sampleId = GetSession(SessionKeys.SampleId);
|
||||
const isSample = sampleId && (_session.embedId === sampleId);
|
||||
return ((funcName === '_Embed_BasicEmbed' || funcName === '_Embed_BasicEmbed_EditMode') && isSample);
|
||||
}
|
||||
|
||||
function IsCreateMock(funcName) {
|
||||
var sampleId = GetSession(SessionKeys.SampleId);
|
||||
var isSample = sampleId && (_session.embedId === sampleId);
|
||||
const sampleId = GetSession(SessionKeys.SampleId);
|
||||
const isSample = sampleId && (_session.embedId === sampleId);
|
||||
return (funcName === '_Embed_Create' && isSample);
|
||||
}
|
||||
|
||||
|
|
@ -54,13 +54,13 @@ function IsNotSupported(funcName) {
|
|||
}
|
||||
|
||||
// Get a reference to the embedded element
|
||||
var container = '#embedContainer';
|
||||
var embed = powerbi.get($(container)[0]);
|
||||
const container = '#embedContainer';
|
||||
let embed = powerbi.get($(container)[0]);
|
||||
if (embed.config.type !== 'create') {
|
||||
return false;
|
||||
}
|
||||
|
||||
var runFunc = mockDict[funcName];
|
||||
const runFunc = mockDict[funcName];
|
||||
return (runFunc && runFunc === datasetNotSupported) ? true : false;
|
||||
}
|
||||
|
||||
|
|
@ -69,12 +69,12 @@ function IsMock(funcName) {
|
|||
}
|
||||
|
||||
function mapFunc(func) {
|
||||
var funcName = getFuncName(func);
|
||||
const funcName = getFuncName(func);
|
||||
return IsMock(funcName) ? mockDict[funcName] : func;
|
||||
}
|
||||
|
||||
function getFuncName(func) {
|
||||
var funcName = func.name;
|
||||
let funcName = func.name;
|
||||
|
||||
if (!funcName)
|
||||
{
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
var sampleContentLoaded = false;
|
||||
var documentationContentLoaded = false;
|
||||
var demosContentLoaded = false;
|
||||
var anyReportSectionLoaded = false;
|
||||
|
||||
$(function() {
|
||||
OpenSampleSection();
|
||||
|
|
@ -12,13 +11,8 @@ function OpenSampleSection() {
|
|||
OpenEmbedWorkspace("#main-sample", "step_samples.html");
|
||||
}
|
||||
|
||||
function OpenAnyReportSection() {
|
||||
OpenEmbedWorkspace("#main-anyReport", "anyReport.html");
|
||||
}
|
||||
|
||||
function OpenEmbedWorkspace(activeTabSelector, authStepHtml)
|
||||
function OpenEmbedWorkspace(activeTabSelector, samplesStepHtml)
|
||||
{
|
||||
// Any report, uses the same settings as sample report. ony changes the auth step.
|
||||
if (!sampleContentLoaded)
|
||||
{
|
||||
// Open Report Sample.
|
||||
|
|
@ -28,7 +22,7 @@ function OpenEmbedWorkspace(activeTabSelector, authStepHtml)
|
|||
});
|
||||
}
|
||||
|
||||
$("#samples-step-wrapper").load(authStepHtml);
|
||||
$("#samples-step-wrapper").load(samplesStepHtml);
|
||||
SetActiveStyle(activeTabSelector);
|
||||
|
||||
$(".content").hide();
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ function InitLogger(divId) {
|
|||
};
|
||||
|
||||
Logger.logText = function name(text) {
|
||||
var textbox = document.getElementById(divId);
|
||||
let textbox = document.getElementById(divId);
|
||||
|
||||
if (!textbox.value)
|
||||
{
|
||||
|
|
|
|||
|
|
@ -7,6 +7,11 @@ const EmbedEditMode = "edit";
|
|||
const EmbedCreateMode = "create";
|
||||
|
||||
const runEmbedCodeTimeout = 500;
|
||||
const interactTooltipTimeout = 2000;
|
||||
|
||||
const defualtTokenType = 1;
|
||||
const defaultQnaQuestion = "This year sales by store type by postal code as map";
|
||||
const defaultQnaMode = "Interactive";
|
||||
|
||||
function OpenSamplesStep() {
|
||||
$('#steps-ul a').removeClass(active_class);
|
||||
|
|
@ -15,16 +20,19 @@ function OpenSamplesStep() {
|
|||
$("#steps-samples a").addClass(active_class);
|
||||
$("#steps-samples").addClass(active_steps_li);
|
||||
|
||||
// Hide Embed view in authorization step.
|
||||
$('#interact-tab').removeClass('enableTransition');
|
||||
$('#interact-tab').removeClass('changeColor');
|
||||
|
||||
// Hide Embed view in samples step.
|
||||
$("#samples-step-wrapper").show();
|
||||
$("#embed-and-interact-steps-wrapper").hide();
|
||||
}
|
||||
|
||||
function OpenCodeStepFromNavPane()
|
||||
{
|
||||
var mode = GetSession(SessionKeys.EmbedMode);
|
||||
var entityType = GetSession(SessionKeys.EntityType);
|
||||
var tokenType = GetSession(SessionKeys.TokenType);
|
||||
const mode = GetSession(SessionKeys.EmbedMode);
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
const tokenType = GetSession(SessionKeys.TokenType);
|
||||
|
||||
OpenCodeStep(mode, entityType, tokenType);
|
||||
}
|
||||
|
|
@ -36,20 +44,20 @@ function OpenCodeStep(mode, entityType, tokenType) {
|
|||
$('#steps-code a').addClass(active_class);
|
||||
$('#steps-code').addClass(active_steps_li);
|
||||
|
||||
// Hide Embed view in authorization step.
|
||||
// Hide Embed view in samples step.
|
||||
$("#samples-step-wrapper").hide();
|
||||
$("#embed-and-interact-steps-wrapper").show();
|
||||
|
||||
let containers = $(".iframeContainer");
|
||||
containers.removeClass(active_class);
|
||||
|
||||
var containerID = getEmbedContainerID(entityType);
|
||||
var classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
const containerID = getEmbedContainerID(entityType);
|
||||
const classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
|
||||
$(classPrefix + 'Container').removeAttr('id');
|
||||
$(classPrefix + 'MobileContainer').removeAttr('id');
|
||||
|
||||
var activeContainer = classPrefix + ($(".desktop-view").hasClass(active_class) ? 'Container' : 'MobileContainer');
|
||||
const activeContainer = classPrefix + ($(".desktop-view").hasClass(active_class) ? 'Container' : 'MobileContainer');
|
||||
|
||||
$(activeContainer).attr('id', containerID);
|
||||
$(activeContainer).addClass(active_class);
|
||||
|
|
@ -104,28 +112,33 @@ function OpenEmbedTab() {
|
|||
|
||||
$('#embed-tab').addClass(active_tabs_li);
|
||||
|
||||
var mode = GetSession(SessionKeys.EmbedMode);
|
||||
var entityType = GetSession(SessionKeys.EntityType);
|
||||
var tokenType = GetSession(SessionKeys.TokenType);
|
||||
const mode = GetSession(SessionKeys.EmbedMode);
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
const tokenType = GetSession(SessionKeys.TokenType);
|
||||
|
||||
LoadEmbedSettings(mode, entityType, tokenType);
|
||||
}
|
||||
|
||||
function isInteractStepEnabled(entityType) {
|
||||
var classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
var activeContainer = classPrefix + ($(".desktop-view").hasClass(active_class) ? 'Container' : 'MobileContainer');
|
||||
const classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
const activeContainer = classPrefix + ($(".desktop-view").hasClass(active_class) ? 'Container' : 'MobileContainer');
|
||||
|
||||
// Check if active container has an iframe
|
||||
return $(activeContainer + " iframe").length > 0;
|
||||
}
|
||||
|
||||
function OpenInteractTab() {
|
||||
var entityType = GetSession(SessionKeys.EntityType);
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
// Interact step is disabled unless active container has an iframe
|
||||
if (!isInteractStepEnabled(entityType)) {
|
||||
// TODO: SHOW TOOLTIP "Press the run button in order to embed, before interacting"
|
||||
$('.interactTooltip .tooltipText').addClass("showTooltip");
|
||||
setTimeout(function() {
|
||||
$('.interactTooltip .tooltipText').removeClass("showTooltip");
|
||||
}, interactTooltipTimeout);
|
||||
return;
|
||||
}
|
||||
$('#interact-tab').removeClass('enableTransition');
|
||||
$('#interact-tab').removeClass('changeColor');
|
||||
|
||||
$('.' + active_tabs_li).removeClass(active_tabs_li);
|
||||
$('#interact-tab').addClass(active_tabs_li);
|
||||
|
|
@ -168,50 +181,53 @@ function OpenInteractTab() {
|
|||
}
|
||||
|
||||
function setCodeArea(mode, entityType)
|
||||
{
|
||||
LoadCodeArea("#embedCodeDiv", getEmbedCode(mode, entityType));
|
||||
}
|
||||
|
||||
function getEmbedCode(mode, entityType)
|
||||
{
|
||||
const isDesktop = $(".desktop-view").hasClass(active_class);
|
||||
let code = "";
|
||||
if (entityType == EntityType.Report)
|
||||
{
|
||||
if (mode === EmbedViewMode)
|
||||
{
|
||||
const code = isDesktop ? _Embed_BasicEmbed : _Embed_BasicEmbed_Mobile;
|
||||
LoadCodeArea("#embedCodeDiv", code);
|
||||
code = isDesktop ? _Embed_BasicEmbed : _Embed_BasicEmbed_Mobile;
|
||||
}
|
||||
else if (mode === EmbedEditMode)
|
||||
{
|
||||
const code = isDesktop ? _Embed_BasicEmbed_EditMode : _Embed_MobileEditNotSupported;
|
||||
LoadCodeArea("#embedCodeDiv", code);
|
||||
code = isDesktop ? _Embed_BasicEmbed_EditMode : _Embed_MobileEditNotSupported;
|
||||
}
|
||||
else if (mode === EmbedCreateMode)
|
||||
{
|
||||
const code = isDesktop ? _Embed_BasicEmbed_EditMode : _Embed_MobileCreateNotSupported;
|
||||
LoadCodeArea("#embedCodeDiv", code);
|
||||
code = isDesktop ? _Embed_BasicEmbed_EditMode : _Embed_MobileCreateNotSupported;
|
||||
}
|
||||
}
|
||||
else if (entityType == EntityType.Visual) {
|
||||
LoadCodeArea("#embedCodeDiv", _Embed_VisualEmbed);
|
||||
code = _Embed_VisualEmbed;
|
||||
}
|
||||
else if (entityType == EntityType.Dashboard)
|
||||
{
|
||||
const code = isDesktop ? _Embed_DashboardEmbed : _Embed_DashboardEmbed_Mobile;
|
||||
LoadCodeArea("#embedCodeDiv", code);
|
||||
code = isDesktop ? _Embed_DashboardEmbed : _Embed_DashboardEmbed_Mobile;
|
||||
}
|
||||
else if (entityType == EntityType.Tile)
|
||||
{
|
||||
LoadCodeArea("#embedCodeDiv", _Embed_TileEmbed);
|
||||
code = _Embed_TileEmbed;
|
||||
}
|
||||
else if (entityType == EntityType.Qna)
|
||||
{
|
||||
LoadCodeArea("#embedCodeDiv", _Embed_QnaEmbed);
|
||||
code = _Embed_QnaEmbed;
|
||||
}
|
||||
return code;
|
||||
}
|
||||
|
||||
function showEmbedSettings(mode, entityType, tokenType)
|
||||
{
|
||||
if (entityType == EntityType.Report)
|
||||
{
|
||||
var inputDivToShow = "#embedModeInput";
|
||||
var inputDivToHide = "#createModeInput";
|
||||
let inputDivToShow = "#embedModeInput";
|
||||
let inputDivToHide = "#createModeInput";
|
||||
|
||||
if (mode === EmbedCreateMode)
|
||||
{
|
||||
|
|
@ -222,15 +238,15 @@ function showEmbedSettings(mode, entityType, tokenType)
|
|||
$(inputDivToShow).show();
|
||||
$(inputDivToHide).hide();
|
||||
|
||||
var embedModeRadios = $('input:radio[name=embedMode]');
|
||||
let embedModeRadios = $('input:radio[name=embedMode]');
|
||||
embedModeRadios.filter('[value=' + mode + ']').prop('checked', true);
|
||||
|
||||
var embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
let embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
embedTypeRadios.filter('[value=' + tokenType + ']').prop('checked', true);
|
||||
}
|
||||
else if (entityType == EntityType.Visual) {
|
||||
$("#embedModeInput").show();
|
||||
var embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
let embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
embedTypeRadios.filter('[value=' + tokenType + ']').prop('checked', true);
|
||||
}
|
||||
else if (entityType == EntityType.Dashboard)
|
||||
|
|
@ -383,9 +399,12 @@ function IsEmbeddingSampleQna() {
|
|||
}
|
||||
|
||||
function ToggleQuestionBox(enabled) {
|
||||
UpdateSession($("input[name='qnaMode']:checked").val(), SessionKeys.QnaMode);
|
||||
let txtQuestion = $("#txtQuestion");
|
||||
if (enabled === true) {
|
||||
txtQuestion.val("This year sales by store type by postal code as map");
|
||||
let question = GetSession(SessionKeys.QnaQuestion);
|
||||
question = question? question : defaultQnaQuestion;
|
||||
txtQuestion.val(question);
|
||||
txtQuestion.prop('disabled', false);
|
||||
}
|
||||
else {
|
||||
|
|
@ -399,8 +418,8 @@ function EmbedAreaDesktopView() {
|
|||
return;
|
||||
}
|
||||
|
||||
var entityType = GetSession(SessionKeys.EntityType);
|
||||
var mode = GetSession(SessionKeys.EmbedMode);
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
const mode = GetSession(SessionKeys.EmbedMode);
|
||||
|
||||
$(".desktop-view").show();
|
||||
$(".mobile-view").hide();
|
||||
|
|
@ -408,8 +427,8 @@ function EmbedAreaDesktopView() {
|
|||
$(".desktop-view").addClass(active_class);
|
||||
$(".mobile-view").removeClass(active_class);
|
||||
|
||||
var containerID = getEmbedContainerID(entityType);
|
||||
var classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
const containerID = getEmbedContainerID(entityType);
|
||||
const classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
|
||||
$(classPrefix + 'MobileContainer').removeAttr('id');
|
||||
$(classPrefix + 'Container').attr('id', containerID);
|
||||
|
|
@ -417,18 +436,20 @@ function EmbedAreaDesktopView() {
|
|||
$(classPrefix + 'MobileContainer').removeClass(active_class);
|
||||
$(classPrefix + 'Container').addClass(active_class);
|
||||
|
||||
if(!$('#embed-tab').hasClass("tabs-li-active")) {
|
||||
return;
|
||||
if($('#embed-tab').hasClass("tabs-li-active")) {
|
||||
// Update embed code area
|
||||
setCodeArea(mode, entityType)
|
||||
}
|
||||
|
||||
// Update embed code area
|
||||
setCodeArea(mode, entityType)
|
||||
|
||||
// Check if run button was clicked in the other mode and wasn't clicked on the new mode
|
||||
if ($(classPrefix + "MobileContainer iframe").length && !$(classPrefix + "Container iframe").length) {
|
||||
setTimeout(function() {
|
||||
$('#btnRunCode').click();
|
||||
}, runEmbedCodeTimeout);
|
||||
let runFunc = getEmbedCode(mode, entityType);
|
||||
if ($('#interact-tab').hasClass("tabs-li-active")) {
|
||||
runFunc = updateRunFuncSessionParameters(runFunc);
|
||||
eval(runFunc);
|
||||
} else {
|
||||
runFunc();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -437,8 +458,8 @@ function EmbedAreaMobileView() {
|
|||
return;
|
||||
}
|
||||
|
||||
var entityType = GetSession(SessionKeys.EntityType);
|
||||
var mode = GetSession(SessionKeys.EmbedMode);
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
const mode = GetSession(SessionKeys.EmbedMode);
|
||||
|
||||
$(".desktop-view").hide();
|
||||
$(".mobile-view").show();
|
||||
|
|
@ -446,8 +467,8 @@ function EmbedAreaMobileView() {
|
|||
$(".desktop-view").removeClass(active_class);
|
||||
$(".mobile-view").addClass(active_class);
|
||||
|
||||
var containerID = getEmbedContainerID(entityType);
|
||||
var classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
const containerID = getEmbedContainerID(entityType);
|
||||
const classPrefix = getEmbedContainerClassPrefix(entityType);
|
||||
|
||||
$(classPrefix + 'Container').removeAttr('id');
|
||||
$(classPrefix + 'MobileContainer').attr('id', containerID);
|
||||
|
|
@ -455,17 +476,63 @@ function EmbedAreaMobileView() {
|
|||
$(classPrefix + 'Container').removeClass(active_class);
|
||||
$(classPrefix + 'MobileContainer').addClass(active_class);
|
||||
|
||||
if(!$('#embed-tab').hasClass("tabs-li-active")) {
|
||||
return;
|
||||
if($('#embed-tab').hasClass("tabs-li-active")) {
|
||||
// Update embed code area
|
||||
setCodeArea(mode, entityType)
|
||||
}
|
||||
|
||||
// Update embed code area
|
||||
setCodeArea(mode, entityType)
|
||||
|
||||
// Check if run button was clicked in the other mode and wasn't clicked on the new mode
|
||||
if ($(classPrefix + "Container iframe").length && !$(classPrefix + "MobileContainer iframe").length) {
|
||||
setTimeout(function() {
|
||||
$('#btnRunCode').click();
|
||||
}, runEmbedCodeTimeout);
|
||||
let runFunc = getEmbedCode(mode, entityType);
|
||||
if ($('#interact-tab').hasClass("tabs-li-active")) {
|
||||
runFunc = updateRunFuncSessionParameters(runFunc);
|
||||
eval(runFunc);
|
||||
} else {
|
||||
runFunc();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateRunFuncSessionParameters(runFunc) {
|
||||
const entityType = GetSession(SessionKeys.EntityType);
|
||||
const accessToken = '"' + GetSession(SessionKeys.AccessToken) + '"';
|
||||
const embedUrl = '"' + GetSession(SessionKeys.EmbedUrl) + '"';
|
||||
const embedId = '"' + GetSession(SessionKeys.EmbedId) + '"';
|
||||
const dashboardId = '"' + GetSession(SessionKeys.DashboardId) + '"';
|
||||
const pageName = '"' + GetSession(SessionKeys.PageName) + '"';
|
||||
const visualName = '"' + GetSession(SessionKeys.VisualName) + '"';
|
||||
|
||||
let code = BodyCodeOfFunction(runFunc);
|
||||
let tokenType = GetSession(SessionKeys.TokenType);
|
||||
tokenType = tokenType? tokenType : defualtTokenType;
|
||||
code = code.replace("$('#txtAccessToken').val()", accessToken)
|
||||
.replace("$('input:radio[name=tokenType]:checked').val()", tokenType);
|
||||
|
||||
if (entityType == EntityType.Report) {
|
||||
code = code.replace("$('#txtReportEmbed').val()", embedUrl)
|
||||
.replace("$('#txtEmbedReportId').val()", embedId);
|
||||
} else if (entityType == EntityType.Dashboard) {
|
||||
code = code.replace("$('#txtDashboardEmbed').val()", embedUrl)
|
||||
.replace("$('#txtEmbedDashboardId').val()", embedId);
|
||||
} else if (entityType == EntityType.Tile) {
|
||||
code = code.replace("$('#txtTileEmbed').val()", embedUrl)
|
||||
.replace("$('#txtEmbedDashboardId').val()", dashboardId)
|
||||
.replace("$('#txtEmbedTileId').val()", embedId);
|
||||
} else if (entityType == EntityType.Visual) {
|
||||
code = code.replace("$('#txtReportEmbed').val()", embedUrl)
|
||||
.replace("$('#txtEmbedReportId').val()", embedId)
|
||||
.replace("$('#txtPageName').val()", pageName)
|
||||
.replace("$('#txtVisualName').val()", visualName);
|
||||
} else if (entityType == EntityType.Qna) {
|
||||
let question = GetSession(SessionKeys.QnaQuestion);
|
||||
question = question? question : defaultQnaQuestion;
|
||||
let mode = GetSession(SessionKeys.QnaMode);
|
||||
mode = mode? mode : defaultQnaMode;
|
||||
code = code.replace("$('#txtQnaEmbed').val()", embedUrl)
|
||||
.replace("$('#txtDatasetId').val()", embedId)
|
||||
.replace("$('#txtQuestion').val()", '"' + question + '"')
|
||||
.replace('$("input[name=' + "'qnaMode'" + ']:checked").val()', '"' + mode + '"');
|
||||
}
|
||||
|
||||
return code;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,9 @@ const SessionKeys = {
|
|||
EntityType: "entityType",
|
||||
SampleId: "SampleId",
|
||||
PageName: "PageName",
|
||||
VisualName: "VisualName"
|
||||
VisualName: "VisualName",
|
||||
QnaQuestion: "QnaQuestion",
|
||||
QnaMode: "QnaMode"
|
||||
};
|
||||
|
||||
function GetParameterByName(name, url) {
|
||||
|
|
@ -23,7 +25,7 @@ function GetParameterByName(name, url) {
|
|||
url = window.location.href;
|
||||
}
|
||||
name = name.replace(/[\[\]]/g, "\\$&");
|
||||
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
|
||||
let regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
|
||||
results = regex.exec(url);
|
||||
if (!results) return null;
|
||||
if (!results[2]) return '';
|
||||
|
|
@ -41,7 +43,7 @@ function GetSession(key) {
|
|||
}
|
||||
|
||||
function UpdateSession(button, sessionKey) {
|
||||
var value = $(button).val();
|
||||
const value = $(button).val();
|
||||
if (value)
|
||||
{
|
||||
SetSession(sessionKey, value);
|
||||
|
|
@ -49,7 +51,7 @@ function UpdateSession(button, sessionKey) {
|
|||
}
|
||||
|
||||
function SetTextboxFromSessionOrUrlParam(sessionKey, textboxSelector) {
|
||||
var value = GetParameterByName(sessionKey);
|
||||
let value = GetParameterByName(sessionKey);
|
||||
if (!value)
|
||||
{
|
||||
value = GetSession(sessionKey);
|
||||
|
|
@ -58,18 +60,18 @@ function SetTextboxFromSessionOrUrlParam(sessionKey, textboxSelector) {
|
|||
}
|
||||
|
||||
function SetTextBoxesFromSessionOrUrlParam(accessTokenSelector, embedUrlSelector, embedIdSelector, dashboardIdSelector) {
|
||||
var accessToken = GetParameterByName(SessionKeys.AccessToken);
|
||||
let accessToken = GetParameterByName(SessionKeys.AccessToken);
|
||||
if (!accessToken)
|
||||
{
|
||||
accessToken = GetSession(SessionKeys.AccessToken);
|
||||
}
|
||||
|
||||
var embedUrl = GetParameterByName(SessionKeys.EmbedUrl);
|
||||
let embedUrl = GetParameterByName(SessionKeys.EmbedUrl);
|
||||
if (!embedUrl)
|
||||
{
|
||||
embedUrl = GetSession(SessionKeys.EmbedUrl);
|
||||
} else {
|
||||
var groupId = GetParameterByName(SessionKeys.GroupId);
|
||||
let groupId = GetParameterByName(SessionKeys.GroupId);
|
||||
if(groupId)
|
||||
{
|
||||
if (embedUrl.indexOf("?") != -1)
|
||||
|
|
@ -81,19 +83,19 @@ function SetTextBoxesFromSessionOrUrlParam(accessTokenSelector, embedUrlSelector
|
|||
}
|
||||
}
|
||||
|
||||
var embedId = GetParameterByName(SessionKeys.EmbedId);
|
||||
let embedId = GetParameterByName(SessionKeys.EmbedId);
|
||||
if (!embedId)
|
||||
{
|
||||
embedId = GetSession(SessionKeys.EmbedId);
|
||||
}
|
||||
|
||||
var tokenType = GetParameterByName(SessionKeys.TokenType);
|
||||
let tokenType = GetParameterByName(SessionKeys.TokenType);
|
||||
if (!tokenType)
|
||||
{
|
||||
tokenType = GetSession(SessionKeys.TokenType);
|
||||
}
|
||||
|
||||
var dashboardId = GetParameterByName(SessionKeys.DashboardId);
|
||||
let dashboardId = GetParameterByName(SessionKeys.DashboardId);
|
||||
if (!dashboardId) {
|
||||
dashboardId = GetSession(SessionKeys.DashboardId);
|
||||
}
|
||||
|
|
@ -106,6 +108,6 @@ function SetTextBoxesFromSessionOrUrlParam(accessTokenSelector, embedUrlSelector
|
|||
//
|
||||
// Set the embed type (Saas or Embed token)
|
||||
//
|
||||
var embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
let embedTypeRadios = $('input:radio[name=tokenType]');
|
||||
embedTypeRadios.filter('[value=' + tokenType + ']').prop('checked', true);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ function OpenQnaEventsOperations() {
|
|||
}
|
||||
|
||||
function SetToggleHandler(devId) {
|
||||
var selector = "#" + devId + " .function-ul li";
|
||||
const selector = "#" + devId + " .function-ul li";
|
||||
$(selector).each(function(index, li) {
|
||||
$(li).click(function() {
|
||||
$(selector).removeClass('active');
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ function FetchUrlIntoSession(url, updateCurrentToken) {
|
|||
|
||||
if (updateCurrentToken)
|
||||
{
|
||||
var embedContainerId;
|
||||
let embedContainerId;
|
||||
if (embedConfig.type === "dashboard") {
|
||||
embedContainerId = "dashboardContainer";
|
||||
} else if (embedConfig.type === "report") {
|
||||
|
|
@ -34,7 +34,7 @@ function FetchUrlIntoSession(url, updateCurrentToken) {
|
|||
embedContainerId = "tileContainer"
|
||||
}
|
||||
|
||||
var embedContainer = powerbi.embeds.find(function(embedElement) {return (embedElement.element.id == embedContainerId)});
|
||||
let embedContainer = powerbi.embeds.find(function(embedElement) {return (embedElement.element.id == embedContainerId)});
|
||||
if (embedContainer)
|
||||
{
|
||||
embedContainer.setAccessToken(embedConfig.embedToken.token);
|
||||
|
|
@ -66,7 +66,7 @@ function FetchUrlIntoSession(url, updateCurrentToken) {
|
|||
}
|
||||
|
||||
function TokenExpirationRefreshListener(minutesToExpiration, entityType) {
|
||||
var updateAfterMilliSeconds = (minutesToExpiration - 2) * 60 * 1000;
|
||||
const updateAfterMilliSeconds = (minutesToExpiration - 2) * 60 * 1000;
|
||||
|
||||
if (entityType == EntityType.Report || entityType == EntityType.Visual)
|
||||
{
|
||||
|
|
@ -185,31 +185,17 @@ function OpenCodeStepWithSample(entityType) {
|
|||
}
|
||||
}
|
||||
|
||||
function OpenCodeStepCreateWithSample() {
|
||||
SetSession(SessionKeys.IsSampleReport, true);
|
||||
SetSession(SessionKeys.EntityType, EntityType.Report);
|
||||
|
||||
OpenCodeStep(EmbedCreateMode, EntityType.Report);
|
||||
}
|
||||
|
||||
function OpenCodeStepFromUserSettings() {
|
||||
SetSession(SessionKeys.IsSampleReport, false);
|
||||
SetSession(SessionKeys.EntityType, EntityType.Report);
|
||||
|
||||
OpenCodeStep(EmbedViewMode, EntityType.Report);
|
||||
}
|
||||
|
||||
function WarmStartSampleReportEmbed() {
|
||||
var embedUrl = GetParameterByName(SessionKeys.EmbedUrl);
|
||||
let embedUrl = GetParameterByName(SessionKeys.EmbedUrl);
|
||||
if (embedUrl) {
|
||||
preload(embedUrl);
|
||||
return;
|
||||
}
|
||||
|
||||
FetchUrlIntoSession(reportUrl, false /* updateCurrentToken */).then(function (response) {
|
||||
embedUrl = GetSession(SessionKeys.EmbedUrl);
|
||||
preload(embedUrl);
|
||||
});
|
||||
FetchUrlIntoSession(reportUrl, false /* updateCurrentToken */).then(function (response) {
|
||||
embedUrl = GetSession(SessionKeys.EmbedUrl);
|
||||
preload(embedUrl);
|
||||
});
|
||||
}
|
||||
|
||||
function preload(embedUrl) {
|
||||
|
|
|
|||
|
|
@ -1,38 +1,12 @@
|
|||
var currentCode = "";
|
||||
|
||||
function ValidateEmbedUrl(embedUrl) {
|
||||
var embedUrl = $('#txtReportEmbed').val();
|
||||
|
||||
if (!embedUrl)
|
||||
{
|
||||
alert("You must specify an embed url.");
|
||||
return false;
|
||||
}
|
||||
var id = null;
|
||||
var parts = embedUrl.split("reportId=");
|
||||
if (parts && parts.length > 0)
|
||||
{
|
||||
var guidParts = parts[parts.length -1].split("&");
|
||||
if (guidParts && guidParts.length > 0)
|
||||
{
|
||||
id = guidParts[0];
|
||||
}
|
||||
}
|
||||
|
||||
if (!id)
|
||||
{
|
||||
alert("Could not find report ID in url");
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
const interactIndicationTimeout = 5000;
|
||||
const elementClickedTimeout = 250;
|
||||
|
||||
function BodyCodeOfFunction(func) {
|
||||
var lines = func.toString().split('\n');
|
||||
let lines = func.toString().split('\n');
|
||||
lines = lines.slice(1, lines.length-1);
|
||||
|
||||
for (var i = 0; i < lines.length; ++i)
|
||||
for (let i = 0; i < lines.length; ++i)
|
||||
{
|
||||
// remove trailing spaces.
|
||||
lines[i] = lines[i].substring(4);
|
||||
|
|
@ -53,22 +27,36 @@ function LoadLogWindow(divSelector) {
|
|||
|
||||
function SetCode(func) {
|
||||
currentCode = BodyCodeOfFunction(func);
|
||||
var codeHtml = '<pre id="txtCode" class="brush: js; gutter: false;">';
|
||||
let codeHtml = '<pre id="txtCode" class="brush: js; gutter: false;">';
|
||||
codeHtml = codeHtml + currentCode + '</pre><script type="text/javascript" src="syntaxHighlighter/syntaxhighlighter.js"></script>';
|
||||
$("#highlighter").html(codeHtml);
|
||||
|
||||
if (func != "") {
|
||||
var runFunc = mapFunc(func);
|
||||
let runFunc = mapFunc(func);
|
||||
|
||||
if (getFuncName(runFunc).match(/Embed/)) {
|
||||
let oldFunc = runFunc;
|
||||
runFunc = function() {
|
||||
oldFunc();
|
||||
$('#interact-tab').addClass('enableTransition');
|
||||
setTimeout(function() {
|
||||
$('#interact-tab').addClass('changeColor');
|
||||
}, interactIndicationTimeout);
|
||||
}
|
||||
}
|
||||
|
||||
$('#btnRunCode').off('click');
|
||||
$('#btnRunCode').click(runFunc);
|
||||
$('#btnRunCode').click(function() {
|
||||
elementClicked('#btnRunCode');
|
||||
runFunc();
|
||||
});
|
||||
// TODO: add indication to click Interact tab on first embedding
|
||||
}
|
||||
}
|
||||
|
||||
function CopyCode() {
|
||||
var id = "clipboard-textarea";
|
||||
var textarea = document.getElementById(id);
|
||||
const id = "clipboard-textarea";
|
||||
let textarea = document.getElementById(id);
|
||||
|
||||
if (!textarea) {
|
||||
textarea = document.createElement("textarea");
|
||||
|
|
@ -126,3 +114,10 @@ function getEmbedContainerClassPrefix(entityType, isMobile) {
|
|||
return ".report";
|
||||
}
|
||||
}
|
||||
|
||||
function elementClicked(element) {
|
||||
$(element).addClass('elementClicked');
|
||||
setTimeout(function() {
|
||||
$(element).removeClass('elementClicked');
|
||||
}, elementClickedTimeout);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<div id="questionDiv">
|
||||
<h8>Q&A input question</h8>
|
||||
<div class="spacer" />
|
||||
<input type="text" id="txtQuestion" style="width: 100%" value="This year sales by store type by postal code as map"/>
|
||||
<input type="text" id="txtQuestion" style="width: 100%" value="This year sales by store type by postal code as map" onchange="UpdateSession(this, SessionKeys.QnaQuestion);"/>
|
||||
</div>
|
||||
|
||||
<div id="embedModeInput">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<div id="authStepDiv">
|
||||
<div id="samplesStepDiv">
|
||||
<div id="sampleReport" class="pbi-line">
|
||||
<div class="sampleImg" id="sampleReportImg"></div>
|
||||
<div class="sampleTextButton">
|
||||
|
|
@ -8,7 +8,7 @@
|
|||
<h8>You can embed a sample report and interact with Power BI Embedded firsthand by clicking below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<button id="GoToEmbedStepButton" class="authorizeButton" onclick="OpenCodeStepWithSample('Report')">Select</button>
|
||||
<button id="GoToEmbedStepButton" class="selectButton" onclick="OpenCodeStepWithSample('Report')">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
<h8>You can embed a sample report visual and interact with Power BI Embedded firsthand by clicking below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<button id="GoToEmbedStepButton" class="authorizeButton" onclick="OpenCodeStepWithSample('Visual')">Select</button>
|
||||
<button id="GoToEmbedStepButton" class="selectButton" onclick="OpenCodeStepWithSample('Visual')">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
<h8>You can embed a sample Q&A and interact with Power BI Embedded firsthand by clicking below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<button id="GoToEmbedStepButton_Qna" class="authorizeButton" onclick="OpenCodeStepWithSample('Qna')">Select</button>
|
||||
<button id="GoToEmbedStepButton_Qna" class="selectButton" onclick="OpenCodeStepWithSample('Qna')">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
<h8>You can embed a sample dashboard and interact with Power BI Embedded firsthand by clicking below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<button id="GoToEmbedStepButton_Dashboard" class="authorizeButton" onclick="OpenCodeStepWithSample('Dashboard')">Select</button>
|
||||
<button id="GoToEmbedStepButton_Dashboard" class="selectButton" onclick="OpenCodeStepWithSample('Dashboard')">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -60,7 +60,7 @@
|
|||
<h8>You can embed a sample Tile and interact with Power BI Embedded firsthand by clicking below.</h8>
|
||||
</div>
|
||||
<div class="settings">
|
||||
<button id="GoToEmbedStepButton_Tile" class="authorizeButton" onclick="OpenCodeStepWithSample('Tile')">Select</button>
|
||||
<button id="GoToEmbedStepButton_Tile" class="selectButton" onclick="OpenCodeStepWithSample('Tile')">Select</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -68,7 +68,6 @@
|
|||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
SetTextBoxesFromSessionOrUrlParam("#auth_txtAccessToken", "#auth_txtReportEmbed", "#auth_txtEmbedReportId");
|
||||
SetSession(SessionKeys.IsSampleReport, false);
|
||||
SetSession(SessionKeys.IsSampleDashboard, false);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@ header
|
|||
{
|
||||
position: relative;
|
||||
height: 60px;
|
||||
|
||||
background: #121212;
|
||||
}
|
||||
|
||||
|
|
@ -109,7 +108,7 @@ header
|
|||
.topFrame {
|
||||
display: table-cell;
|
||||
width: 32%;
|
||||
width: calc((100% - 20px)/3);
|
||||
width: calc((100% - 20.1px)/3);
|
||||
height: 330px;
|
||||
}
|
||||
|
||||
|
|
@ -203,6 +202,21 @@ header
|
|||
.topFrame {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.customTooltip .tooltipText {
|
||||
top: -21px;
|
||||
left: -170px;
|
||||
}
|
||||
|
||||
.customTooltip .tooltipText::after {
|
||||
top: 50%;
|
||||
left: 100%; /* To the right of the tooltip */
|
||||
margin-top: -5px;
|
||||
border-width: 5px;
|
||||
border-style: solid;
|
||||
border-color: transparent transparent transparent black;
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
|
|
@ -213,6 +227,15 @@ header
|
|||
body {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.interactTooltip .tooltipText {
|
||||
left: -105px;
|
||||
top: 35px;
|
||||
}
|
||||
|
||||
.interactTooltip .tooltipText::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 460px) {
|
||||
|
|
|
|||
|
|
@ -24,19 +24,6 @@ h8 {
|
|||
font-weight: 600;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-color: #DDDDDD;
|
||||
}
|
||||
|
||||
header {
|
||||
display: block;
|
||||
width: 100%;
|
||||
z-index: 1030;
|
||||
color: rgb(8, 122, 165);
|
||||
background-color: rgb(24, 24, 25);
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
a:hover, a:visited, a:link, a:active
|
||||
{
|
||||
text-decoration: none;
|
||||
|
|
@ -54,28 +41,6 @@ a:hover, a:visited, a:link, a:active
|
|||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
#nextStep {
|
||||
float: right;
|
||||
}
|
||||
|
||||
#result-wrap {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#user-embed-details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#user-embed-details tr {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#user-embed-details input[type="text"] {
|
||||
width: 100%;
|
||||
border: none;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.embed-table, #qna-embed-table {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -120,65 +85,10 @@ a:hover, a:visited, a:link, a:active
|
|||
padding-left: 4px;
|
||||
}
|
||||
|
||||
#report-embed-checkbox input {
|
||||
width: auto;
|
||||
border: none;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
#oldSample {
|
||||
display: block;
|
||||
float: right;
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
#sampleReportImgDiv img {
|
||||
width: 265px;
|
||||
height: 180px;
|
||||
}
|
||||
|
||||
#sampleReportImgDiv {
|
||||
margin-top: 17px;
|
||||
margin-right: 32px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
#sampleReportDescription {
|
||||
float: left;
|
||||
margin-top: 17px;
|
||||
max-width: 400px;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn.btn-margin {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.halfWidth.right {
|
||||
width: 750px;
|
||||
min-height: 100px;
|
||||
float: left;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.halfWidth.left {
|
||||
width: 750px;
|
||||
min-height: 100px;
|
||||
float: left;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.break-float {
|
||||
clear: both;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.pbi-line {
|
||||
float: left;
|
||||
width: 384px;
|
||||
|
|
@ -249,12 +159,6 @@ a {
|
|||
background-color: rgb(245, 211, 65);
|
||||
}
|
||||
|
||||
.main-title {
|
||||
font-family: 'Segoe UI Web Light', 'Segoe UI Light', 'Segoe WP Light', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif;
|
||||
font-size: 28px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.main-ul li {
|
||||
float: none;
|
||||
text-align: left;
|
||||
|
|
@ -451,6 +355,7 @@ a {
|
|||
bottom: 0px;
|
||||
position: absolute;
|
||||
font-weight: 600;
|
||||
padding: 0.5px;
|
||||
}
|
||||
|
||||
.newFeature {
|
||||
|
|
@ -465,6 +370,7 @@ a {
|
|||
display: inline-block;
|
||||
position: relative;
|
||||
font-weight: 600;
|
||||
padding: 0.5px;
|
||||
}
|
||||
|
||||
.highlightSection {
|
||||
|
|
@ -485,14 +391,13 @@ a {
|
|||
padding: 5px 0 0 8px;
|
||||
}
|
||||
|
||||
#tab-wrapper {
|
||||
#tabs-wrapper {
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
#tabs-ul {
|
||||
list-style-type: none;
|
||||
margin: 0px;
|
||||
overflow: hidden;
|
||||
padding-left: 0;
|
||||
-webkit-margin-before: 0;
|
||||
-webkit-padding-start: 0;
|
||||
|
|
@ -540,6 +445,7 @@ a {
|
|||
border: none;
|
||||
outline:none;
|
||||
margin-right: 40px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.textAreaControl img {
|
||||
|
|
@ -584,7 +490,7 @@ a {
|
|||
float: left;
|
||||
}
|
||||
|
||||
.authorizeButton {
|
||||
.selectButton {
|
||||
border: none;
|
||||
color: black;
|
||||
background-color: #FFFFFF;
|
||||
|
|
@ -596,7 +502,7 @@ a {
|
|||
height: 32px;
|
||||
}
|
||||
|
||||
.authorizeButton:hover {
|
||||
.selectButton:hover {
|
||||
background-color: #3E65FF;
|
||||
color: white;
|
||||
border: none;
|
||||
|
|
@ -651,43 +557,16 @@ a {
|
|||
border: solid black 1px;
|
||||
}
|
||||
|
||||
.active-top {
|
||||
background-color: rgb(36, 169, 225);
|
||||
}
|
||||
|
||||
.step-div {
|
||||
border-radius: 50%;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
display: inline-block;
|
||||
background-color: white;
|
||||
border: solid black 1px;
|
||||
}
|
||||
|
||||
.active-step {
|
||||
background-color: rgb(36, 169, 225);
|
||||
}
|
||||
|
||||
.editorTitleText {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.checkbox.input {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.stepsButton {
|
||||
height: 100%;
|
||||
padding-top: 20px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.video {
|
||||
width: 90%;
|
||||
height: 500px;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
#createModeInput {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -698,10 +577,6 @@ a {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.inputLineBody {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#modeSelector {
|
||||
margin-bottom: 8px;
|
||||
cursor: default;
|
||||
|
|
@ -753,6 +628,42 @@ a {
|
|||
border-color: transparent transparent black transparent;
|
||||
}
|
||||
|
||||
.interactTooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.interactTooltip .tooltipText {
|
||||
transition: opacity 0.5s ease-in-out;
|
||||
-webkit-transition: opacity 0.5s ease-in-out;
|
||||
opacity: 0;
|
||||
width: 290px;
|
||||
background-color: #121212;
|
||||
color: #F1F1F1;
|
||||
text-align: left;
|
||||
padding: 4px 12px;
|
||||
font-size: 12px;
|
||||
top: -5px;
|
||||
left: 145%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.interactTooltip .tooltipText.showTooltip {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.interactTooltip .tooltipText::after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 100%;
|
||||
margin-top: -5px;
|
||||
border-width: 5px;
|
||||
border-style: solid;
|
||||
border-color: transparent black transparent transparent;
|
||||
}
|
||||
|
||||
.mobile-view {
|
||||
display: none;
|
||||
background: #FFFFFF;
|
||||
|
|
@ -957,3 +868,20 @@ a {
|
|||
#docs-content {
|
||||
max-width: 1080px;
|
||||
}
|
||||
|
||||
#interact-tab.enableTransition {
|
||||
transition: all 1s ease 0s;
|
||||
-webkit-transition: all 1s ease 0s;
|
||||
}
|
||||
|
||||
#interact-tab.changeColor {
|
||||
background-color: #F2C811;
|
||||
}
|
||||
|
||||
#interact-tab.changeColor a {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.elementClicked {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче