Create Javascript localStorage for website background change - javascript

Hello and big thanks for a all S.O community
I come today because i try to create local storage with Javascript for my users can change background and page settings on my website and find it back when page reload.
I tried many attempt but i'm so beginner for do make it work
var m = new s.a.Store({
modules: {
programs: p,
preferences: {
state: {
background: "images/backgrounds/background2.jpg",
preferredColor: "#1e90ff",
isWiFiConnected: !1
},
getters: {
background: function(t) {
return t.background
},
preferredColor: function(t) {
return t.preferredColor
},
isWiFiConnected: function(t) {
return t.isWiFiConnected
}
},
actions: {},
mutations: {
changePreferredColor: function(t, e) {
t.preferredColor = e
},
changeBackground: function(t, e) {
t.background = e
},
toggleWiFiConnection: function(t) {
t.isWiFiConnected = !t.isWiFiConnected
}
}
},
filesystem: d
},
strict: !1
});
i.a.prototype.$t = function(t) {
return t
}, i.a.config.devtools = !0, new i.a({
el: "#app",
store: m,
components: {
App: a.a
}
})
},
function(t, e, n) {
"use strict";
(function(e, n) {
var r = Object.freeze({});
function i(t) {
return null == t
}
function o(t) {
return null != t
}
function a(t) {
return !0 === t
}
function s(t) {
return "string" == typeof t || "number" == typeof t || "symbol" == typeof t || "boolean" == typeof t
}
function u(t) {
return null !== t && "object" == typeof t
}
there is the code i tried to add just before without sucess (blank page) :
var m = { ...localStorage };
localStorage.getItem("background");
localStorage.setItem("background");
Thanks for your support
Best regards

Related

call a function in google console

is there a way to call this function in the google console?
I am new to coding but I need this.
e[dt.a.LUCKY_POT] = function(e) {
return j.createElement(j.Suspense, {
fallback: null
}, j.createElement(bt, {
onClose: function() {
return m(e)
},
notification: e,
userId: null == d ? void 0 : d.id
}))
}
you're basically assigning a function to a variable called e[dt.a.LUCKY_POT]
so just call e[dt.a.LUCKY_POT](), but the question is what is the e object?
if you just want to run it and get the results - run the folloing:
(function(e) {
return j.createElement(j.Suspense, {
fallback: null
}, j.createElement(bt, {
onClose: function() {
return m(e)
},
notification: e,
userId: null == d ? void 0 : d.id
}))
})()
but then I'll ask who's the j object?

how to add custom speech in botframe work

I am working on Custom speech in bot framework.I add Bing simple speech it is working on my website: here is link :https://envolvebot.azurewebsites.net/
but now i want to know how can we add custom speech (LUIS custom speech) in our webchat bot?
I create custom speech using : https://westus.cris.ai/Home/CustomSpeech
Now i want to add it and want it to work like bing speech .
i am using following code.
/*! modernizr 3.6.0 (Custom Build) | MIT *
* https://modernizr.com/download/?-getusermedia-speechsynthesis !*/
!function (e, n, s) { function i(e, n) { return typeof e === n } function o() { var e, n, s, o, a, f, d; for (var c in t) if (t.hasOwnProperty(c)) { if (e = [], n = t[c], n.name && (e.push(n.name.toLowerCase()), n.options && n.options.aliases && n.options.aliases.length)) for (s = 0; s < n.options.aliases.length; s++)e.push(n.options.aliases[s].toLowerCase()); for (o = i(n.fn, "function") ? n.fn() : n.fn, a = 0; a < e.length; a++)f = e[a], d = f.split("."), 1 === d.length ? Modernizr[d[0]] = o : (!Modernizr[d[0]] || Modernizr[d[0]] instanceof Boolean || (Modernizr[d[0]] = new Boolean(Modernizr[d[0]])), Modernizr[d[0]][d[1]] = o), r.push((o ? "" : "no-") + d.join("-")) } } var t = [], a = { _version: "3.6.0", _config: { classPrefix: "", enableClasses: !0, enableJSClass: !0, usePrefixes: !0 }, _q: [], on: function (e, n) { var s = this; setTimeout(function () { n(s[e]) }, 0) }, addTest: function (e, n, s) { t.push({ name: e, fn: n, options: s }) }, addAsyncTest: function (e) { t.push({ name: null, fn: e }) } }, Modernizr = function () { }; Modernizr.prototype = a, Modernizr = new Modernizr, Modernizr.addTest("speechsynthesis", "SpeechSynthesisUtterance" in e), Modernizr.addTest("getUserMedia", "mediaDevices" in navigator && "getUserMedia" in navigator.mediaDevices); var r = []; o(), delete a.addTest, delete a.addAsyncTest; for (var f = 0; f < Modernizr._q.length; f++)Modernizr._q[f](); e.Modernizr = Modernizr }(window, document);
// Necessary for safari
// Safari will only speak after speaking from a button click
var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
const params = BotChat.queryParams(location.search);
debugger;
function SpeakText() {
var msg = new SpeechSynthesisUtterance();
window.speechSynthesis.speak(msg);
document.getElementsByClassName("wc-mic")[0].removeEventListener("click", SpeakText);
}
if (isSafari) {
window.addEventListener("load", function () {
document.getElementsByClassName("wc-mic")[0].addEventListener("click", SpeakText);
});
}
var femaleVoice = null;
if (Modernizr.speechsynthesis) {
var baseSpeechPrototype = SpeechSynthesisUtterance.prototype;
SpeechSynthesisUtterance = function (msg) {
var utterance = new baseSpeechPrototype.constructor(msg);
if (femaleVoice != null)
utterance.voice = femaleVoice;
return utterance;
}
window.speechSynthesis.onvoiceschanged = function () {
var voice = "Microsoft Zira";
var safariVoice = "Samantha";
var voices = window.speechSynthesis.getVoices();
voices.forEach(function (v) {
if (v.name.startsWith(voice))
femaleVoice = v;
else if (v.name == safariVoice && v.lang == "en-US")
femaleVoice = v;
})
}
}
//// Needed to change between the two audio contexts
var AudioContext = window.AudioContext || window.webkitAudioContext;
//// Sets the old style getUserMedia to use the new style that is supported in more browsers even though the framework uses the new style
if (window.navigator.mediaDevices.getUserMedia && !window.navigator.getUserMedia) {
window.navigator.getUserMedia = function (constraints, successCallback, errorCallback) {
window.navigator.mediaDevices.getUserMedia(constraints)
.then(function (e) {
successCallback(e);
})
.catch(function (e) {
errorCallback(e);
});
};
}
const bot = {
id: params['botid'] || 'botid',
name: params['botname'] || 'botname'
};
window.botchatDebug = params['debug'] && params['debug'] === 'true';
var speechOptions;
if (Modernizr.speechsynthesis) {
speechOptions = {
speechRecognizer: new CognitiveServices.SpeechRecognizer({
fetchCallback: function (authFetchEventId) { return getBingToken() },
fetchOnExpiryCallback: function (authFetchEventId) { getBingToken() }
}),
speechSynthesizer: new BotChat.Speech.BrowserSpeechSynthesizer()
};
}
else if (Modernizr.getusermedia) {
speechOptions = {
speechRecognizer: new CognitiveServices.SpeechRecognizer({
fetchCallback: function (authFetchEventId) { return getBingToken() },
fetchOnExpiryCallback: function (authFetchEventId) { getBingToken() }
}),
speechSynthesizer: null
};
}
else {
speechOptions = null;
}
// for bot
var botConnection = new BotChat.DirectLine({
domain: params['domain'],
//token: document.getElementById("directLineToken").value,
secret: 'Secret',
webSocket: params['webSocket'] && params['webSocket'] === 'true' // defaults to true
});
BotChat.App({
sendTyping: true,
locale: params['locale'],
resize: 'detect',
speechOptions: speechOptions,
user: { id:'ID' name: "You" },
bot: { id: 'Vera', name: "Vera" },
botConnection: botConnection
}, document.getElementById('BotChatElement'));
function getBingToken() {
// Normally this token fetch is done from your secured backend to avoid exposing the API key and this call
// would be to your backend, or to retrieve a token that was served as part of the original page.
return fetch(
'https://api.cognitive.microsoft.com/sts/v1.0/issueToken',
{
headers: {
'Ocp-Apim-Subscription-Key': 'Key'
},
method: 'POST'
}
//).then(res => res.text());
).then(function (res) { return res.text() });
}
aNY BODY Know how to do this ?
Thank in advance .

Loop through an Object to check the functions that return true

I have an object like this one:
var BrowserDetect = {
uniqueProps: [],
browserUID: '',
browserFonts: '',
isIPhonePad: function() {
return navigator.userAgent.match(/iPhone|iPod/i);
},
isDesktop: function() {
return !navigator.userAgent.match(/iPhone|iPad|android/i);
},
isAndroid: function() {
return navigator.userAgent.match(/android/i);
},
isFirefox: function() {
return navigator.userAgent.match(/firefox/i);
},
isIOS7: function() {
return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
},
isChromeCrios: function() {
return navigator.userAgent.match(/chrome|crios/i);
},
isIPad: function() {
return navigator.userAgent.match(/iPad/i);
}
}
(FYI: There are more functions inside the object)
So I want to go through "BrowserDetect" and check which of those functions inside it return "true" and get the function's name too.
What's the easy way to achieve that? I tried to use the jquery $.each, but without success.
Use Object.keys() with Array#filter to iterate the object and return all truthy function names:
Object.keys(BrowserDetect).filter(function(key) {
var f = BrowserDetect[key];
return typeof f === 'function' && f();
});
var BrowserDetect = {
uniqueProps: [],
browserUID: '',
browserFonts: '',
isIPhonePad: function() {
return navigator.userAgent.match(/iPhone|iPod/i);
},
isDesktop: function() {
return !navigator.userAgent.match(/iPhone|iPad|android/i);
},
isAndroid: function() {
return navigator.userAgent.match(/android/i);
},
isFirefox: function() {
return navigator.userAgent.match(/firefox/i);
},
isIOS7: function() {
return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
},
isChromeCrios: function() {
return navigator.userAgent.match(/chrome|crios/i);
},
isIPad: function() {
return navigator.userAgent.match(/iPad/i);
}
};
var result = Object.keys(BrowserDetect).filter(function(key) {
var f = BrowserDetect[key];
return typeof f === 'function' && f();
});
console.log(result);
I implemented a non-functional solution in pure js. It's fairly straightforward once you consider that a property can be a function as well. Once you use call() method on the property it will run the underlying function.
var BrowserDetect = {
uniqueProps: [],
browserUID: '',
browserFonts: '',
isIPhonePad: function() {
return navigator.userAgent.match(/iPhone|iPod/i);
},
isDesktop: function() {
return !navigator.userAgent.match(/iPhone|iPad|android/i);
},
isAndroid: function() {
return navigator.userAgent.match(/android/i);
},
isFirefox: function() {
return navigator.userAgent.match(/firefox/i);
},
isIOS7: function() {
return navigator.userAgent.match(/.*CPU.*OS 7_\d/i);
},
isChromeCrios: function() {
return navigator.userAgent.match(/chrome|crios/i);
},
isIPad: function() {
return navigator.userAgent.match(/iPad/i);
}
}
var functions = [];
for(var prop in BrowserDetect){
if(typeof(BrowserDetect[prop])=="function" && BrowserDetect[prop].call()){
functions.push(prop);
}
}
console.log(functions);
You can use common for ... in loop
for (var functionName in BrowserDetect) {
if (!BrowserDetect.hasOwnProperty(functionName)
|| typeof BrowserDetect[functionName] !== "function") continue
if (BrowserDetect[functionName]())
return functionName
}
or Object.keys
Object.keys(BrowserDetect).reduce(
(current, fnName) => typeof BrowserDetect[fnName] === "function" && BrowserDetect[fnName]() ? fnName : current )

How to define custom mode in ng2-codemirror?

I'd like to define my custom mode that extends one of available modes (e.g. javascript)? I've tried to use below code, but no effect.
CodeMirror.defineMode("foo", function (config, parserConfig) {
var fooOverlay = {
token: function (stream, state) {
var ch;
if (stream.match("{{")) {
while ((ch = stream.next()) != null)
if (ch == "}" && stream.next() == "}") {
stream.eat("}");
return "foo";
}
}
while (stream.next() != null && !stream.match("{{", false)) { }
return null;
}
};
return CodeMirror.overlayMode(CodeMirror.getMode(config, parserConfig.backdrop || "javascript"), fooOverlay);
});
this.config = {
lineNumbers: true,
mode: 'foo'
};
UPDATE:
CodeMirror.defineSimpleMode("foo", {
start = [
{ regex: /"(?:[^\\]|\\.)*?(?:"|$)/, token: "string" },
{ regex: /'(?:[^\\]|\\.)*?(?:'|$)/, token: "string" },
{
regex: /(?:if|foreach|in|while)\b/,
token: "keyword"
},
{ regex: /true|false|null|undefined/, token: "atom" },
];
});

How check object to undefined?

I have had object
dataSourceConfig.transport.read.url
remoteDataSourceConfig: {
transport: {
read: {
url: null,
},
},
},
How to check dataSourceConfig.transport.read.url for undefiend?
If I understand your question crrectly, you have to check all the intermediary objects for existence:
if (dataSourceConfig &&
dataSourceConfig.transport &&
dataSourceConfig.transport.read &&
dataSourceConfig.transport.read.url != null
) {
// is not null or undefined
}
Otherwise you can do something like this:
function isKeySet(obj, key) {
var keys = key.split('.');
return keys.reduce(function(o,k){ return o[k]; }, obj) != null;
}
isKeySet(dataSourceConfig, 'transport.read.url'); // false

Categories

Resources