2017-03-27

埋め込み

ちょっただけ苦戦したので
ページプラグイン - ソーシャルプラグイン - ドキュメンテーション - 開発者向けFacebook
とりあえずここでコードを取得しましょう。

んで、
www.tam-tam.co.jp
ここを参考にして、jsファイルを作成します。

僕の場合はjsファイルを

jQuery(function () {
    var windowWidth = jQuery(window).width();
    var htmlStr = jQuery('#pageplugin').html();
    var timer = null;
    jQuery(window).on('resize',function() {
        var resizedWidth = jQuery(window).width();
        if(windowWidth != resizedWidth && resizedWidth < 400) {
            clearTimeout(timer);
            timer = setTimeout(function() {
                jQuery('#pageplugin').html(htmlStr);
                window.FB.XFBML.parse();
                var windowWidth = jQuery(window).width();
            }, 500);
        }
    });
});

var fb_initialize = function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/ja_JP/sdk???&version=???";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk');

こんな感じにしました。
注意としては
wordpressだと「$」は使えないです。
下のやつは「コードを取得」で出てくる上のやつをコピーして関数部分だけ持ってきてください。

これを使わないと

window.FB.XFBML.parse();

でエラーが出ます。

んでhtml、載せたいところに

<div id="page-plugin">
	<body onload="fb_initialize();">
		<div class="fb-page" data-href="https://www.facebook.com/???" data-tabs="timeline" data-width="400" data-height="500" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/???" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/???">正義の味方カイバーマン</a></blockquote></div>
	</div>
</div>

cssは.fb_iframe_widget spanを消しました。これで中央寄せが効きます。

.fb_iframe_widget,
.fb_iframe_widget iframe[style]{
    width: 100% !important;
}

div内にbody = onloadを書くのがよいのかわからなかったけど、これで動きました。
functions.phpでの読み込みは毎度おなじみですが

wp_enqueue_script( 'fb', get_bloginfo( 'stylesheet_directory') . '/js/your-filename.js', array( 'jquery' ), fasle, true );

上のサイトで間に合う人はぶっちゃけこれ冗長な説明だよねｗ

2017-03-26

wordpressでjsを使うときの備忘録

wp_enqueue_script( 'smart-script', get_bloginfo( 'stylesheet_directory') . '/js/particles.js', array( 'jquery' ), '20170326', true );
wp_enqueue_style( 'main', get_bloginfo( 'stylesheet_directory') . '/css/particles.css', "", '20170326' );

wordpressでjsファイルを読み込みたいときこんな感じのコードを書くと思う。
functions.phpでJSやCSSを一元管理する| WordPressテックラボ | [Smart]

get_bloginfo( 'stylesheet_directory')

とするか

get_template_directory_uri()

を使うかの差がわかっていないけど、
themeisle.com
こういうのを使うときはcssやjsの読み込み場所が異なる。入れ子みたいな構造だからかな？
で日程を導入するところ

'20170326'

があるんだけど、これがChrome、Edge、FireFoxで挙動が違う。
この日程を特に気にしなくてもEdgeとFireFoxは大丈夫だったのだけど、Chromeだけはこの日程の状態でファイルが読み込まれた。
面白いね。

2017-03-23

各言語の複数戻り値

知っている範囲で関数から複数の戻り値を返したいなーって思ってちょこちょこ調べている。少しまとめておこうと思います
私が一番好きなのはjavascript(言語自体は嫌い)

function my_swap(x, y){
	var r;
	r = {
		after_x:y,
		after_y:x
	};
	return r;
}

a = my_swap(1, 2);
console.log(a.after_x); //2
console.log(a.after_y); //1

一つのオブジェクトを返しているので正確には複数戻り値と言わないのかもわかりませんが。

rubyはそのまま複数返せるらしい。配列として返している扱いらしいです。

def my_swap(x, y)
	return y, x
	#return [y, x]
end

a, b = my_swap(1, 2)
print(a) #2
print(b) #1

pythonもrubyと似たようなもんらしい。ただしこっちはタプル型で返ってきているとか

def my_swap(x, y):
    return y, x

a, b = my_swap(1, 2)
print a #2
print b #1

関数で複数の返り値を返す方法 - おっぱいそん！
jsっぽく戻り値を書く方法もちゃんとある。

Processingはない(javaベースなので)
Arduinoもない(Cベースなので)
processingとArduinoはそもそもグローバル変数が多くなりがちな言語なので特殊かな。

ちなみにopenframeworksもない?(C++なので)

需要なさそうだけどVBAでどう複数戻り値を得るかというと配列として返せる

Function MySwap(X As Integer, Y As Integer) As Variant
	Dim R(1) as Variant
	R(0) = Y
	R(1) = X
	MySwap = R
End Function

Dim A As Variant
A = MySwap(1, 2)
MsgBox A(0) '2
MsgBox A(1) '1