Accordion Native Bootstrap - accordion

I have a problem with the accordion in Bootstrap Native. Everything works fine except for one thing. After expanding other .collapsed accordion, the class is not added to the former that was developed. I've tried several ways and still nothing. Adding the collapsed class is addClass (element, collapsed); just the other way removeClass ...
Below JS file:
// event targets and constants
var accordion = null, collapse = null, self = this,
isAnimating = false, // when true it will prevent click handlers
accordionData = element[getAttribute]('data-parent'),
// component strings
component = 'collapse',
collapsed = 'collapsed',
test = 'test'
// private methods
openAction = function(collapseElement) {
bootstrapCustomEvent.call(collapseElement, showEvent, component);
isAnimating = true;
addClass(collapseElement,collapsing);
addClass(collapseElement,showClass);
addClass(element,collapsed);
setTimeout(function() {
collapseElement[style][height] = getMaxHeight(collapseElement) + 'px';
(function(){
emulateTransitionEnd(collapseElement, function(){
isAnimating = false;
collapseElement[setAttribute](ariaExpanded,'true');
removeClass(collapseElement,collapsing);
collapseElement[style][height] = '';
bootstrapCustomEvent.call(collapseElement, shownEvent, component);
});
}());
}, 20);
},
closeAction = function(collapseElement) {
bootstrapCustomEvent.call(collapseElement, hideEvent, component);
isAnimating = true;
collapseElement[style][height] = getMaxHeight(collapseElement) + 'px';
setTimeout(function() {
addClass(collapseElement,collapsing);
collapseElement[style][height] = '0px';
(function() {
emulateTransitionEnd(collapseElement, function(){
isAnimating = false;
collapseElement[setAttribute](ariaExpanded,'false');
removeClass(collapseElement,collapsing);
removeClass(collapseElement,showClass);
collapseElement[style][height] = '';
bootstrapCustomEvent.call(collapseElement, hiddenEvent, component);
});
}());
},20);
},
getTarget = function() {
var href = element.href && element[getAttribute]('href'),
parent = element[getAttribute](dataTarget),
id = href || ( parent && targetsReg.test(parent) ) && parent;
return id && queryElement(id);
};
// public methods
this.toggle = function(e) {
e.preventDefault();
if (isAnimating) return;
if (!hasClass(collapse,showClass)) {
self.show();
} else {
self.hide();
}
};
this.hide = function() {
closeAction(collapse);
addClass(element,collapsed);
//jak się zwija dodaje klase
};
this.show = function() {
openAction(collapse);
removeClass(element,collapsed);
//jak się rozwija usuwa klase
if ( accordion !== null ) {
var activeCollapses = getElementsByClassName(accordion,component+' '+showClass);
for (var i=0, al=activeCollapses[length]; i<al; i++) {
if ( activeCollapses[i] !== collapse) closeAction(activeCollapses[i]);
}
}
};
// init
if ( !(stringCollapse in element ) ) { // prevent adding event handlers twice
on(element, clickEvent, this.toggle);
}
collapse = getTarget();
accordion = queryElement(options.parent) || accordionData && getClosest(element, accordionData);
element[stringCollapse] = this;
};
As you can see the code is not added to the previously developed(<a href...) .collapsed accordion.

Related

Can't figure out how to select items in the Facebook newsfeed for a Chome Extension

I'm working on a Chrome extension that inserts a button on every item in the Facebook newsfeed. I started off by using Tampermonkey to install a script that installs a button next to the subscribe video of every Youtube page (chrome-extension://dhdgffkkebhmkfjojejmpbldmpobfkfo/ask.html?aid=994ff494-1242-452f-a334-1bd616e18bb6), which worked fine.
Then I tried to modify it so it acts on the Facebook newsfeed, rather than the Youtube subscribe button. I changed the // match to go to facebook.com and targeting it to go after class='_3vuz', the Facebook div that houses the "like" button. But nothing happens when I go on Facebook; no button appears.
Here's my Tampermonkey code. Many thanks!
// ==UserScript==
// #name Facebook Fake News Button
// #namespace https://www.youtubeinmp3.com
// #version 1.2.2
// #description Adds a button to show you whether a Facebook article is true
// #author Ilana
// #match https://www.facebook.com/*
// #run-at document-end
// ==/UserScript==
function polymerInject(){
/* Create button */
var buttonDiv = document.createElement("div");
buttonDiv.style.width = "100%";
buttonDiv.id = "parentButton";
var addButton = document.createElement("button");
addButton.appendChild(document.createTextNode("Fake News"));
if(typeof(document.getElementById("iframeDownloadButton")) != 'undefined' && document.getElementById("iframeDownloadButton") !== null){
document.getElementById("iframeDownloadButton").remove();
}
addButton.style.width = "100%";
addButton.style.backgroundColor = "#181717";
addButton.style.color = "white";
addButton.style.textAlign = "center";
addButton.style.padding = "10px 0";
addButton.style.marginTop = "5px";
addButton.style.fontSize = "14px";
addButton.style.border = "0";
addButton.style.cursor = "pointer";
addButton.style.borderRadius = "2px";
addButton.style.fontFamily = "Roboto, Arial, sans-serif";
addButton.onclick = function () {
this.remove();
/* Add large button on click */
var addIframe = document.createElement("iframe");
addIframe.src = '//www.convertmp3.io/widget/button/?color=ba1717&video=' + window.location.href;
addIframe.style.width = "100%";
addIframe.style.border = "none";
addIframe.style.height = "60px";
addIframe.style.marginTop = "10px";
addIframe.style.overflow = "hidden";
addIframe.scrolling = "no";
addIframe.id = "iframeDownloadButton";
var targetElement = document.querySelectorAll("[id='meta']");
for(var i = 0; i < targetElement.length; i++){
if(targetElement[i].className.indexOf("ytd-watch") > -1){
targetElement[i].insertBefore(addIframe, targetElement[i].childNodes[0]);
}
}
};
buttonDiv.appendChild(addButton);
/* Find and add to target */
var targetElement = document.querySelectorAll("[class='_3vuz']");
for(var i = 0; i < targetElement.length; i++){
if(targetElement[i].className.indexOf("ytd-video-secondary-info-renderer") > -1){
targetElement[i].appendChild(buttonDiv);
}
}
/* Fix hidden description bug */
var descriptionBox = document.querySelectorAll("ytd-video-secondary-info-renderer");
if(descriptionBox[0].className.indexOf("loading") > -1){
descriptionBox[0].classList.remove("loading");
}
}
function standardInject() {
var pagecontainer=document.getElementById('page-container');
if (!pagecontainer) return;
if (/^https?:\/\/www\.facebook.com\/watch\?/.test(window.location.href)) run();
var isAjax=/class[\w\s"'-=]+spf\-link/.test(pagecontainer.innerHTML);
var logocontainer=document.getElementById('logo-container');
if (logocontainer && !isAjax) { // fix for blocked videos
isAjax=(' '+logocontainer.className+' ').indexOf(' spf-link ')>=0;
}
var content=document.getElementById('content');
if (isAjax && content) { // Ajax UI
var mo=window.MutationObserver||window.WebKitMutationObserver;
if(typeof mo!=='undefined') {
var observer=new mo(function(mutations) {
mutations.forEach(function(mutation) {
if(mutation.addedNodes!==null) {
for (var i=0; i<mutation.addedNodes.length; i++) {
if (mutation.addedNodes[i].id=='watch7-container' ||
mutation.addedNodes[i].id=='watch7-main-container') { // old value: movie_player
run();
break;
}
}
}
});
});
observer.observe(content, {childList: true, subtree: true}); // old value: pagecontainer
} else { // MutationObserver fallback for old browsers
pagecontainer.addEventListener('DOMNodeInserted', onNodeInserted, false);
}
}
}
function onNodeInserted(e) {
if (e && e.target && (e.target.id=='watch7-container' ||
e.target.id=='watch7-main-container')) { // old value: movie_player
run();
}
}
function finalButton(){
var buttonIframeDownload = document.createElement("iframe");
buttonIframeDownload.src = '//www.convertmp3.io/widget/button/?color=ba1717&video=' + window.location.href;
buttonIframeDownload.id = "buttonIframe";
buttonIframeDownload.style.width = "100%";
buttonIframeDownload.style.height = "60px";
buttonIframeDownload.style.paddingTop = "20px";
buttonIframeDownload.style.paddingBottom = "20px";
buttonIframeDownload.style.overflow = "hidden";
buttonIframeDownload.scrolling = "no";
document.getElementById("watch-header").appendChild(buttonIframeDownload);
}
function run(){
if(!document.getElementById("parentButton") && window.location.href.substring(0, 25).indexOf("facebook.com") > -1 && window.location.href.indexOf("watch?") > -1){
var parentButton = document.createElement("div");
parentButton.className = "yt-uix-button yt-uix-button-default";
parentButton.id = "parentButton";
parentButton.style.height = "23px";
parentButton.style.marginLeft = "28px";
parentButton.style.paddingBottom = "1px";
parentButton.onclick = function () {
this.remove();
finalButton();
};
document.getElementById("watch7-user-header").appendChild(parentButton);
var childButton = document.createElement("span");
childButton.appendChild(document.createTextNode("Download MP3"));
childButton.className = "yt-uix-button-content";
childButton.style.lineHeight = "25px";
childButton.style.fontSize = "12px";
parentButton.appendChild(childButton);
}
}
if(document.getElementById("polymer-app") || document.getElementById("masthead") || window.Polymer){
setInterval(function(){
if(window.location.href.indexOf("watch?v=") < 0){
return false;
}
if(document.getElementById("count") && document.getElementById("parentButton") === null){
polymerInject();
}
}, 100);
}
else{
standardInject();
}

$ionicLoading.hide() not working

I have this Ionic code. The problem is $ionicLoading.hide(); is not hiding the popup. I cant make the "waiting" icon Disappear
function ($scope, $q, $state, $rootScope, $stateParams, $firebaseArray, $window, $ionicLoading) {
var palabras = $rootScope.textAreaOfrecer.replace(/[.#$/]/g,'').toLowerCase().split(' ');
if($rootScope.flag == 1){
return true;
}else{
$rootScope.flag = 1;
}
console.log("0");
$ionicLoading.show();
setMyNewArray().then( function (){
console.log("3");
$ionicLoading.hide();
$rootScope.flag = 0;
console.log("4");
});
function setMyNewArray() {
var deferred = $q.defer();
console.log("1");
Promise.all(
$scope.solicitudes = palabras.map(palabra => $firebaseArray(firebase.database().ref().child("solCompras").orderByChild("palabras/" +
palabra).equalTo(true) ) )
).then( function (){
$scope.solicitudes = multiDimensionalUnique($scope.solicitudes).reduce(function(prev, curr) {
return prev.concat(curr);
});
console.log("2");
deferred.resolve();
});
return deferred.promise;
}
function multiDimensionalUnique(arr) {
var uniques = [];
var itemsFound = {};
for(var i = 0, l = arr.length; i < l; i++) {
var stringified = JSON.stringify(arr[i]);
if(itemsFound[stringified]) { continue; }
uniques.push(arr[i]);
itemsFound[stringified] = true;
}
return uniques;
}
}
I have changed location of show loader and hide loader.. try it once
function ($scope, $q, $state, $rootScope, $stateParams, $firebaseArray, $window, $ionicLoading) {
var palabras = $rootScope.textAreaOfrecer.replace(/[.#$/]/g,'').toLowerCase().split(' ');
if($rootScope.flag == 1){
return true;
}else{
$rootScope.flag = 1;
}
console.log("0");
setMyNewArray().then( function (){
console.log("3");
$rootScope.flag = 0;
console.log("4");
$ionicLoading.hide(); //use hide here
});
function setMyNewArray() {
$ionicLoading.show(); //use loader here.
var deferred = $q.defer();
console.log("1");
Promise.all(
$scope.solicitudes = palabras.map(palabra => $firebaseArray(firebase.database().ref().child("solCompras").orderByChild("palabras/" +
palabra).equalTo(true) ) )
).then( function (){
$scope.solicitudes = multiDimensionalUnique($scope.solicitudes).reduce(function(prev, curr) {
return prev.concat(curr);
});
console.log("2");
deferred.resolve();
});
return deferred.promise;
}
function multiDimensionalUnique(arr) {
var uniques = [];
var itemsFound = {};
for(var i = 0, l = arr.length; i < l; i++) {
var stringified = JSON.stringify(arr[i]);
if(itemsFound[stringified]) { continue; }
uniques.push(arr[i]);
itemsFound[stringified] = true;
}
return uniques;
}
}

jssor multiple instances - change the slide of second jssor instance on $EVT_POSITION_CHANGE event of the first jssor instance

Can anyone/jssor support help me how to change the images of second and third jssor sliders when slide show position change event trigger from the first jssor slider? I would be so much appreciated.
thanks,
c
this jssor_slider2.$GoTo(1); is not working.
++++++++++++++++++++++++++++++
function OnSlidePositionChange(slideIndex, fromIndex) {
var jssor_slider2 = new $JssorSlider$('slider2_container', { $AutoPlay: false });
if (slideIndex == 3)
jssor_slider2.$GoTo(1);
else
jssor_slider2.$GoTo(slideIndex + 1);
}
jssor_slider1.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnSlidePositionChange);
++++++++++++++++++++++++++++++
<script>
jssor_slider1_starter("slider1_container");
jssor_slider2_starter("slider2_container");
jssor_slider3_starter("slider3_container");
</script>
script.js file
jssor_slider1_starter = function (containerId) {
var jssor_slider1 = new $JssorSlider$(containerId, {
...
}
function OnSlidePositionChange(slideIndex, fromIndex) {
//HELP ME PLEASE HERE.....
//var jssor_slider2 = new $JssorSlider$('slider2_container', {});
//if (slideIndex == 3)
// nestedSliders[1].$GoTo(1);
//else
// nestedSliders[1].$GoTo(slideIndex + 1);
}
jssor_slider1.$On($JssorSlider$.$EVT_POSITION_CHANGE, OnSlidePositionChange);
}
jssor_slider2_starter = function (containerId) {
var jssor_slider2 = new $JssorSlider$(containerId, {
......
}
}
jssor_slider3_starter = function (containerId) {
var jssor_slider3 = new $JssorSlider$(containerId, {
......
}
}
$JssorSlider$.$EVT_POSITION_CHANGE fires continuously while sliding.
$JssorSlider$.$EVT_PARK fires while slide change.
Please do this job this way,
function jssor_slider3_starter(containerId_1, containerId_2, containerId_3)
{
var options1 = {};
var options2 = {};
var options3 = {};
...
var jssor_slider1 = new $JssorSlider$(containerId_1, options1);
var jssor_slider2 = new $JssorSlider$(containerId_2, options2);
var jssor_slider3 = new $JssorSlider$(containerId_3, options3);
...
function OnSlidePark(slideIndex, fromIndex) {
if (slideIndex == 3)
jssor_slider2.$GoTo(1);
else
jssor_slider2.$GoTo(slideIndex + 1);
}
jssor_slider1.$On($JssorSlider$.$EVT_PARK, OnSlidePark);
...
}

TypeError: 'undefined' is not a function (evaluating 'ime.registIMEKey()')

Despite of setting and defining everything in Samsung smart TV SDK 4.0 I am getting this error:
TypeError: 'undefined' is not a function (evaluating 'ime.registIMEKey()')
Please help!
CODE:
var widgetAPI = new Common.API.Widget();
var tvKey = new Common.API.TVKeyValue();
var wapal_magic =
{
elementIds: new Array(),
inputs: new Array(),
ready: new Array()
};
/////////////////////////
var Input = function (id, previousId, nextId) {
var previousElement = document.getElementById(previousId),
nextElement = document.getElementById(nextId);
var installFocusKeyCallbacks = function () {
ime.setKeyFunc(tvKey.KEY_UP, function (keyCode) {
previousElement.focus();
return false;
});
ime.setKeyFunc(tvKey.KEY_DOWN, function (keyCode) {
nextElement.focus();
return false;
});
ime.setKeyFunc(tvKey.KEY_RETURN, function (keyCode) {
widgetAPI.blockNavigation();
return false;
});
ime.setKeyFunc(tvKey.KEY_EXIT, function (keyCode) {
widgetAPI.blockNavigation();
return false;
});
}
var imeReady = function (imeObject) {
installFocusKeyCallbacks();
wapal_magic.ready(id);
},
ime = new IMEShell(id, imeReady, 'en'),
element = document.getElementById(id);
}
wapal_magic.createInputObjects = function () {
var index,
previousIndex,
nextIndex;
for (index in this.elementIds) {
previousIndex = index - 1;
if (previousIndex < 0) {
previousIndex = wapal_magic.inputs.length - 1;
}
nextIndex = (index + 1) % wapal_magic.inputs.length;
wapal_magic.inputs[index] = new Input(this.elementIds[index],
this.elementIds[previousIndex], this.elementIds[nextIndex]);
}
};
wapal_magic.ready = function (id) {
var ready = true,
i;
for (i in wapal_magic.elementIds) {
if (wapal_magic.elementIds[i] == id) {
wapal_magic.ready[i] = true;
}
if (wapal_magic.ready[i] == false) {
ready = false;
}
}
if (ready) {
document.getElementById("txtInp1").focus();
}
};
////////////////////////
wapal_magic.onLoad = function()
{
// Enable key event processing
//this.enableKeys();
// widgetAPI.sendReadyEvent();
this.initTextBoxes(new Array("txtInp1", "txtInp2"));
};
wapal_magic.initTextBoxes = function(textboxes){
this.elementIds = textboxes;
for(i=0;i<this.elementIds.length;i++){
this.inputs[i]=false;
this.ready[i]=null;
}
this.createInputObjects();
widgetAPI.registIMEKey();
};
wapal_magic.onUnload = function()
{
};
wapal_magic.enableKeys = function()
{
document.getElementById("anchor").focus();
};
wapal_magic.keyDown = function()
{
var keyCode = event.keyCode;
alert("Key pressed: " + keyCode);
switch(keyCode)
{
case tvKey.KEY_RETURN:
case tvKey.KEY_PANEL_RETURN:
alert("RETURN");
widgetAPI.sendReturnEvent();
break;
case tvKey.KEY_LEFT:
alert("LEFT");
break;
case tvKey.KEY_RIGHT:
alert("RIGHT");
break;
case tvKey.KEY_UP:
alert("UP");
break;
case tvKey.KEY_DOWN:
alert("DOWN");
break;
case tvKey.KEY_ENTER:
case tvKey.KEY_PANEL_ENTER:
alert("ENTER");
break;
default:
alert("Unhandled key");
break;
}
};
The registIMEKey method is part of the Plugin API.
var pluginAPI = new Common.API.Plugin();
pluginAPI.registIMEKey();
See: http://www.samsungdforum.com/Guide/ref00006/common_module_plugin_object.html#ref00006-common-module-plugin-object-registimekey
Edit: Updated to add code solution.
widgetAPI no contains method registIMEKey();, it contains in IMEShell.

Custom Menu Script AssistanceNeeded

I am using a custom menu extension from Magento. I have one issue. There is a popup dropdown box that appears on the menu. When I use firebug to trace the coding I find this:
<div id="popup6" class="wp-custom-menu-popup" onmouseover="wpPopupOver(this, event, 'popup6', 'menu6')" onmouseout="wpHideMenuPopup(this, event, 'popup6', 'menu6')" style="display: none; top: 20px; left: 20px; z-index: 10000;">
I cannot find this code any where in the files from the extension so I tracked down this:
<script type="text/javascript">
//<![CDATA[
var CUSTOMMENU_POPUP_WIDTH = <?php echo Mage::getStoreConfig('custom_menu/popup/width') + 0; ?>;
var CUSTOMMENU_POPUP_TOP_OFFSET = <?php echo Mage::getStoreConfig('custom_menu/popup/top_offset') + 0; ?>;
var CUSTOMMENU_POPUP_DELAY_BEFORE_DISPLAYING = <?php echo Mage::getStoreConfig('custom_menu/popup/delay_displaying') + 0; ?>;
var CUSTOMMENU_POPUP_DELAY_BEFORE_HIDING = <?php echo Mage::getStoreConfig('custom_menu/popup/delay_hiding') + 0; ?>;
var CUSTOMMENU_RTL_MODE = <?php echo $_rtl; ?>;
var wpCustommenuTimerShow = {};
var wpCustommenuTimerHide = {};
//]]>
I need to change the top:20px where should I look for this? Its not in the js file and not in the css file... Cannot find it anywhere. Any ideas? I am a beginer! From my understanding it would have to be the JS file, I am not sure how to read it. JS is here:
function wpShowMenuPopup(objMenu, popupId)
{
if (typeof wpCustommenuTimerHide[popupId] != 'undefined') clearTimeout(wpCustommenuTimerHide[popupId]);
objMenu = $(objMenu.id); var popup = $(popupId); if (!popup) return;
wpCustommenuTimerShow[popupId] = setTimeout(function() {
popup.style.display = 'block';
objMenu.addClassName('active');
var popupWidth = CUSTOMMENU_POPUP_WIDTH;
if (!popupWidth) popupWidth = popup.getWidth();
var pos = wpPopupPos(objMenu, popupWidth);
popup.style.top = pos.top + 'px';
popup.style.left = pos.left + 'px';
wpSetPopupZIndex(popup);
if (CUSTOMMENU_POPUP_WIDTH)
popup.style.width = CUSTOMMENU_POPUP_WIDTH + 'px';
// --- Static Block width ---
var block2 = $(popupId).select('div.block2');
if (typeof block2[0] != 'undefined') {
var wStart = block2[0].id.indexOf('_w');
if (wStart > -1) {
var w = block2[0].id.substr(wStart+2);
} else {
var w = 0;
$(popupId).select('div.block1 div.column').each(function(item) {
w += $(item).getWidth();
});
}
//console.log(w);
if (w) block2[0].style.width = w + 'px';
}
}, CUSTOMMENU_POPUP_DELAY_BEFORE_DISPLAYING);
}
function wpHideMenuPopup(element, event, popupId, menuId)
{
if (typeof wpCustommenuTimerShow[popupId] != 'undefined') clearTimeout(wpCustommenuTimerShow[popupId]);
element = $(element.id); var popup = $(popupId); if (!popup) return;
var current_mouse_target = null;
if (event.toElement) {
current_mouse_target = event.toElement;
} else if (event.relatedTarget) {
current_mouse_target = event.relatedTarget;
}
wpCustommenuTimerHide[popupId] = setTimeout(function() {
if (!wpIsChildOf(element, current_mouse_target) && element != current_mouse_target) {
if (!wpIsChildOf(popup, current_mouse_target) && popup != current_mouse_target) {
popup.style.display = 'none';
$(menuId).removeClassName('active');
}
}
}, CUSTOMMENU_POPUP_DELAY_BEFORE_HIDING);
}
function wpPopupOver(element, event, popupId, menuId)
{
if (typeof wpCustommenuTimerHide[popupId] != 'undefined') clearTimeout(wpCustommenuTimerHide[popupId]);
}
function wpPopupPos(objMenu, w)
{
var pos = objMenu.cumulativeOffset();
var wraper = $('custommenu');
var posWraper = wraper.cumulativeOffset();
var xTop = pos.top - posWraper.top
if (CUSTOMMENU_POPUP_TOP_OFFSET) {
xTop += CUSTOMMENU_POPUP_TOP_OFFSET;
} else {
xTop += objMenu.getHeight();
}
var res = {'top': xTop};
if (CUSTOMMENU_RTL_MODE) {
var xLeft = pos.left - posWraper.left - w + objMenu.getWidth();
if (xLeft < 0) xLeft = 0;
res.left = xLeft;
} else {
var wWraper = wraper.getWidth();
var xLeft = pos.left - posWraper.left;
if ((xLeft + w) > wWraper) xLeft = wWraper - w;
if (xLeft < 0) xLeft = 0;
res.left = xLeft;
}
return res;
}
function wpIsChildOf(parent, child)
{
if (child != null) {
while (child.parentNode) {
if ((child = child.parentNode) == parent) {
return true;
}
}
}
return false;
}
function wpSetPopupZIndex(popup)
{
$$('.wp-custom-menu-popup').each(function(item){
item.style.zIndex = '9999';
});
popup.style.zIndex = '10000';
}
enter code here
There is an option in custom menu settings - top offset, may be this option defines top: 20px; attribute.