using localforage with clojurescript for firefoxos - clojurescript

I'm using [cljsjs/localforage "1.2.10-0"]
When I do:
(.setItem (.localforage js/window) "mynumber" (clj->js {:number (.-value number)}))
I get this error in WebIDE console:
TypeError: *TypeError: window.localforage is not a function*
If I test it in firefox browser, it says the same, whilst if I introduce in the console window.localforage.setItem() it works :|
BONUS: each time I compile with lein cljsbuild auto I get this:
*Upstream deps.cljs found on classpath. {:foreign-libs [{
:file "cljsjs/localforage/development/localforage.inc.js",
:provides ["cljsjs.localforage"],
:file-min "cljsjs/localforage/production/localforage.min.inc.js"
}],
:externs ["cljsjs/localForage/common/localforage.ext.js"]}
This is an EXPERIMENTAL FEATURE and is not guarenteed to remain
stable in future versions.*

well, seems the correct calling manner is (.-localforage js/window) [note the dash]
(.setItem (.-localforage js/window) "mynumber" (clj->js {:number (.-value number)}))
so far so good :D

Related

Angular 6 - Ng-fullcalendar issue

The following is my runtime enviroment:
Angular CLI version 6.
ng-fullcalendar version 1.6.2.
fullcalendar vesion 3.6.1
HTML code:
<div *ngIf="calendarOptions">
<ng-fullcalendar
#ucCalendar
[options]="calendarOptions"
(select)="select($event.detail)"
(eventClick)="eventClick($event.detail)"
(eventDrop)="updateEvent($event.detail)"
(eventResize)="updateEvent($event.detail)"
[(eventsModel)]="events"
(viewRender)="loadEvents($event.detail)"
></ng-fullcalendar>
</div>
Component code:
this.events = resp.data.items.map(item => ({
start: moment(item.startTime).toDate(),
end: moment(item.toTime).toDate(),
item
}));
When I try to load events, it shows this error:
core.js:1673 ERROR TypeError: Cannot read property 'footprint' of undefined
at HTMLDivElement.<anonymous> (fullcalendar.js:5773)
at Function.each (jquery.js:381)
at jQuery.fn.init.each (jquery.js:203)
at constructor.renderFgSegEls (fullcalendar.js:5768)
at constructor.renderFgRanges (fullcalendar.js:5668)
at constructor.render (fullcalendar.js:5652)
at members.constructor.executeEventRender (fullcalendar.js:6559)
at constructor.executeEventRender (fullcalendar.js:17772)
at Object.func (fullcalendar.js:8294)
at constructor.runTask (fullcalendar.js:2667)
This might not be the solution but it is a workaround. I had the same error as yours but I'm running FullCalendar v3.10.1.
The issue might not be in your code but in the jQuery version you are running. FullCalendar broke when I went from jQuery v3.2.1 to v3.5.1.
I reverted back to jQuery v3.4.1 and it's working again.
For those that for whatever reason need jQuery#^3.5.0, you can use similar method described in the jQuery issue describing 3.5 incompatible with FullCalendar 3. The code fixing this problem can be found at the top of this jsfiddle:
var rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^\/\0>\x20\t\r\n\f]*)[^>]*)\/>/gi;
jQuery.htmlPrefilter = function( html ) {
return html.replace( rxhtmlTag, "<$1></$2>" );
};
But please be aware that this functionality was removed from jQuery as a security fix and by using this, you're exposing yourself to that attack vector again.

compiling Promises with babel and core-js causes infinite window reload

I want to run the following piece of code on IE11
let myPromise = Promise.resolve(123);
myPromise.then((value) => {
console.log(value);
});
My recipe is Rollup and babel (& core-js for polyfilling) with the following .babelrc configuration:
{
"presets": [
["#babel/preset-env", {
"useBuiltIns": "usage",
"corejs": 3,
"targets": {
"browsers": ["last 2 versions", "ie >= 11"]
}
}]
]
}
When I try to load the code, I get some infinite loop. The browser's tab seems to reload every couple of milliseconds.
I just wanted you to know that your question/issue in core-js (https://github.com/zloirock/core-js/issues/627) was really helpful and solved the problem for me, which was exactly the same as yours there and here.
So I wanted to leave here the solution provided there by Denis Pushkarev - as I did find this topic first and it may help other developers to quick get an answer:
You could change options to format: 'iife' to make it work.

How do you run optimized ClojureScript output?

I have a ClojureScript project that I was compiling in "dev" mode, with no compiler optimizations. I would "run" it like this, from HTML, a described in the quick start docs.
<script src="/js/out/goog/base.js"></script>
<script src="/js/out/main.js"></script>
<script> goog.require("myapp.mymodule"); </script>
The main.js file is the one generated by the ClojureScript compiler, from .cljs source files.
Now I have a second profile in my Leiningen project that enables advanced compiler optimizations. As expected, main.js changes to include a lot of obfuscated Javascript. But now the require line above fails:
Error: goog.require could not find: myapp.mymodule
I also tried marking one of my functions with :export:
(defn ^:export foo [] ...)
But the docs don't mention where that symbol will be, and I don't see it on window or anywhere else.
So, how does the HTML call into the compiled ClojureScript to get the program started?
Here are the relevant sections of my project.clj
:cljsbuild {
:builds {
:app {
:source-paths ["src/main/clj"]
:compiler {
:output-to "target/resources/public/js/out/main.js"
:output-dir "target/resources/public/js/out"
:asset-path "/js/out"
}
}
}
}
...
:profiles {
:uberjar {
:hooks [leiningen.cljsbuild]
:omit-source true
:cljsbuild {
:builds {
:app {
:compiler {:optimizations :advanced
:pretty-print false}
}
}
}
}
And to compile with the optimizations I ran:
lein with-profile uberjar cljsbuild once
You need to add some compiler options, like :output-to and :source-path.
You can find the list of options at https://clojurescript.org/reference/compiler-options.
If you want to see what a minimal production build looks like, create a new empty project using lein new cljsbuild-template <project-name>

Browser capabilities - check if object exists in ClojureScript

What is the way to test if something exists in ClojureScript ? For instance, I am trying to access the browser geolocation API. In javascript, I would do a simple check like that :
// check for Geolocation support
if (navigator.geolocation) {
console.log('Geolocation is supported!');
}
else {
console.log('Geolocation is not supported for this Browser/OS version yet.');
}
But translating it to ClojureScript, I get an error :
(if (js/navigator.geolocation) ;; Uncaught TypeError: navigator.geolocation is not a function
(println "Geolocation is supported")
(println "Geolocation is not supported"))
What is the proper way to check browser capabilities in ClojureScript ?
There is multiple options:
exists?:
http://dev.clojure.org/jira/browse/CLJS-495
Only exists in clojurescript and not clojure.
If you look at the macro in core.cljc you'll see it's just a if( typeof ... !== 'undefined' ).
Example use :
(if (exists? js/navigator.geolocation)
(println "Geolocation is supported"))
(println "Geolocation is not supported"))
(js-in "geolocation" js/window) which expands to "geolocation" in windows.
(undefined? js/window.geolocation) which expands to void 0 === window.geolocation
IMO, the right one is js-in.
For now, I am using :
(if (not (nil? js/navigator.geolocation))
(println "Geolocation is supported")
(println "Geolocation is not supported"))
Not sure if this idiomatic/cover all use cases, I would gladly accept another answer with a proper explanation.

res/baseResource.plist is not a plist file or you forgot to preload the plist file

I am trying out the samples that come with
Cocos2d-html-v2.2.2
The frameworks seems to run fine, but there is a problem with theincluded games.
FruitAttack gives me the following error on the Developer Console
Uncaught cocos2d: res/baseResource.plist is not a plist file or you forgot to preload the plist file CCSAXParser.js:62
cc.SAXParser.cc.Class.extend.parse CCSAXParser.js:62
cc.FileUtils.cc.Class.extend.dictionaryWithContentsOfFileThreadSafe CCFileUtils.js:612
cc.SpriteFrameCache.cc.Class.extend.addSpriteFrames CCSpriteFrameCache.js:190
cc.Scene.extend.onEnter WelcomeLayer.js:52
(anonymous function) CCClass.js:136
cc.Director.cc.Class.extend.setNextScene CCDirector.js:743
cc.Director.cc.Class.extend.drawScene CCDirector.js:348
cc.DisplayLinkDirector.cc.Director.extend.mainLoop CCDirector.js:1235
callback
The same error shows up with MoonWarriors (the other game of the bundle)
Could you tell me what could be the problem? I am using Chrome (32.0.1700.107 m) and IIS as a web server
Maybe you forget add s_runnerplist to array of g_resources
var g_resources = [
//image
s_HelloBG,
s_start_n,
s_start_s,
s_PlayBG,
s_runner,
s_runnerplist
];