投稿

ラベル（ソフト開発）が付いた投稿を表示しています

CordovaアプリでAppStoreのストア情報の「言語」に「日本語」を追加するには？

CordovaアプリをAppStoreに提出すると、何もしなければストア情報の「言語」が英語になる。 気づいてはいた。実際のアプリは日本語のみ対応なので、せめて「日本語、英語」と表示されるようにすべきだ。しかし、そんなところを気にするユーザーはいないだろうと思って解決を先送りにしていたら、ユーザーから指摘を受けた。 やっぱりちゃんと解決しないとダメだと思い直したが、どうすればいいのか？色々と調べたけど、ぴったりな情報は無かったのでログしておこうと思う。 XcodeでFile＞New＞File... ダイアログが出るので iOS＞Resource＞Strings File＞Next ファイル保存ダイアログが出るので「Localizable.strings」という名前でResources配下に保存する。 ファイルインスペクター（Xcodeのプロジェクトナビゲーターでファイルを選択すると右に出るやつ）でResources/Localizable.stringsを選択 「Localize...」ボタンをクリック プロジェクトナビゲーターでプロジェクトをクリック Infoタブクリック Localizationsセクションで「+」アイコンをクリックし、Japanese(ja)を選択 ローカライズするファイルを選ぶダイアログが出るので、Localizable.stringsを選択し、Finish すると、 Resources/en.lproj/Localizable.strings Resources/ja.lproj/Localizable.strings ができる。 これでAppStore上で「日本語、英語」と表示されることを確認した。 本当は「日本語」のみの方が好ましいが、次のアップデートで試してみるつもり。
コメントを投稿
続きを読む

AmazonのAppStoreで位置情報を使うアプリの対応端末を増やす方法

イメージ
最近AmazonのAppStoreはパーミッションに関する制約が厳しくなり、これまで何も言われなかったアプリが警告扱いになり、ついに非対応ということになってしまった。 問題のアプリは位置情報を扱うアプリなのだが、Amazonの端末はGPSを搭載している端末が少ないので、このままでは対応端末が非常に限られてしまう。 改善すべきはAndroidManifest.xmlに設定しているパーミッションの指定。現在、位置情報関連のパーミッションは次の２つ。 <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> アプリの性質上、GPSほどの高い精度の位置情報は必要無いので、初めはACCESS_FINE_LOCATIONを消してみた。これでGPSを使わないようになるのではと考えたからだ。 これで対応端末は増えたが、ACCESS_COARSE_LOCATIONだけではキロ単位のズレが発生してしまうことが分かった。これはさすがにまずい^^; エラーの内容をよく見ると、「android.hardware.location.gps」がダメだと言っている。 ということは、「GPSは必須でない」という設定があるはず。ドキュメントを見ると <uses-feature> | Android Developers 「android.hardware.location.gps」というプロパティーがあった。そこで、このように指定することにした。 <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" /> <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> <...
コメントを投稿
続きを読む

Swift2で二地点の緯度・経度からその距離を計算するには？

二地点の緯度・経度からその距離を計算する（日本は山だらけ〜） のJava版をSwift2に移植しました。数学は分かりません。理論も分かりません。でもSwiftとJavaは分かるので移植はできるのです(^^); オリジナルがMITライセンスなので、このコードもリスペクトを込めてMITライセンスとします。 // // GeoUtil.swift // import Foundation /** * 二地点の緯度・経度からその距離を計算する（日本は山だらけ〜） - http://yamadarake.jp/trdi/report000001.html */ @objc(GeoUtil) class GeoUtil: NSObject { static let BESSEL_A: Double = 6377397.155; static let BESSEL_E2: Double = 0.00667436061028297; static let BESSEL_MNUM: Double = 6334832.10663254; static let GRS80_A: Double = 6378137.000; static let GRS80_E2: Double = 0.00669438002301188; static let GRS80_MNUM: Double = 6335439.32708317; static let WGS84_A: Double = 6378137.000; static let WGS84_E2: Double = 0.00669437999019758; static let WGS84_MNUM: Double = 6335439.32729246; static let BESSEL: Int = 0; static let GRS80: Int = 1; static let WGS84: Int = 2; static func deg2rad(deg: Double) -> Double { return deg...
コメントを投稿
続きを読む

iOS9で位置情報を使う定期バックグラウンド処理をする場合のバッテリー消費を抑えるには？

iOSでのバックグラウンド処理の制限 iOSでのバックグラウンド処理は非常に制限されているが、いくつか方法はある。しかし、「定期的にバックグラウンド処理をする」という条件になるとかなり限られる。 どのような方法を選択できるかはアプリのタイプや目的によるが、アプリによらず選択できるであろう方法は少なくとも２つある。 Background fetch iOSがアプリの利用頻度などから「非定期に」バックグラウンド処理を動作させるので使えない。 Remote Notifications サーバーからのNotificationが届くタイミングでバックグラウンド処理を起動する方法だが、サーバーサイドの実装が必要な上、Notificationが届くタイミングはまちまちで、最悪の場合は届かないこともあるので、苦労の割に確実性に欠ける。 AndroidのAlarmManagerの代替は無いのか？ 調べた限り、iOSではAndroidでいうところのAlarmManagerのようなバックグランド処理はできない。 iOSで言うところの「バックグラウンド」とは、タスクマネージャーにプロセスが残っている状態のこと である。つまり、ユーザーがタスクマネージャーからアプリを終了させたらバックグラウンド処理はできない。 位置情報の更新を利用した定期バックグラウンド処理を採用 幸い今回開発中のアプリは位置情報を利用するタイプのアプリなので、「Location updates」のcapabilityを利用して定期的にバックグラウンド処理をさせることができた。 位置情報の更新によるバッテリー消費を抑えるために考えた２つのこと（失敗） しかし、ここで気になるのは、バックグラウンドで位置情報を更新し続けることによるバッテリーの消費がどれだけのものなのかということ。 そこで、このあたりを参考にした。 Energy Efficiency Guide for iOS Apps: Reduce Location Accuracy and Duration 一番始めに考えたのは、iOS9から導入された requestLocation() を利用することだった。タイマーで必要な時だけrequestLocation()を使って位置情報を取得すればバッテリーの...
コメントを投稿
続きを読む

SwiftでCordova（ionic）のpluginを開発するには？

イメージ
Swiftでcordovaのプラグインを開発することはできるのだろうか？ このあたりを見ると開発できそうだ。 Chris Dell - Software Developer :: Writing an iOS Cordova plugin in pure Swift How to write Cordova plugin in Swift? - Stack Overflow やってみよう。 今回はChrisさんのコードを参考に、HTMLからネイティブに小文字のメッセージを送って大文字変換されたメッセージを受信するというサンプルを作る。これが完成形。 ビルドシステムはionicを使うが、プラグイン部分の開発はcordovaでも通用するはず。 まずはblankプロジェクトを作ろう。 $ ionic start CDVEchoPlugin blank CDVEchoPlugin/www/index.htmlをこのように編集する。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> <title>CDVEchoPlugin</title> <link href="lib/ionic/css/ionic.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above <link href="...
コメントを投稿
続きを読む

これがAngularJSの$apply()や$digest()が低速な理由のひとつか？

イメージ
昨日書いた記事 「 琴線探査: Dr. GlebのAngularアプリ最適化TIPSまとめ 」 ã«、try-catchがあるとV8では最適化されないため処理が遅くなると書いた。 今日は自分で書いたアプリをプロファイルしてみた。このように、$apply()や$digest()に相当な時間がかかっていることが分かった。 これは予想通りだったが、驚いたのは$apply()や$digest()でtry-catchを使っているらしいことだ。 「Not optimized: TryCatch Statement」とツールチップが出ている。ひょっとすると、これが$apply()や$digest()が低速な理由のひとつなのかもしれない。 だとすると、かなり根本的なレベルで高速化できていないことになる…内部的にtry-catchを使わないようにできないのかなぁ(´・ω・`)
コメントを投稿
続きを読む

Dr. GlebのAngularアプリ最適化TIPSまとめ

Dr. Glebのブログ記事 Improving Angular web app performance example. | Better world by better software を簡単にまとめておこうと思う。 try-catchはできるだけ使わない V8ではtry-catchを使った処理は最適化されないので、特にループ処理ではできるだけ使わないようにする。Primesの例ではtry-catchを無くしただけで全体の処理は2倍以上、メソッド単体では200倍近く高速化している。 追記15.08.26 ：$apply()や$digest()でtry-catchが使われていることが判明(ﾉ∀`) 琴線探査: これがAngularJSの$apply()や$digest()が低速な理由のひとつか？ ダイジェストサイクルをできるだけ速くする $scope.$apply()した時のあれ。ダイジェストサイクルはフレームレートと同じで、長くなるほどUIが固まってしまうことになる。短くする方法は色々ある。 バインドさせる変数をできるだけ少なくする ng-modelとか$scope.valueとか。バインドさせる変数の数だけダイジェストサイクルは遅くなる。 filterはできるだけ使わない filterはダイジェストサイクルを遅くさせる。「{{ "index" | lowercase }}」的な無駄なフィルターはもってのほか。 one-time-bindingを使う サーバーから持ってくるデータは大抵の場合は大量だ。これをページにレンダリングするために2wayバインディングを使ってしまうとダイジェストサイクルが大幅に遅くなる。 そこでAngular1.3から導入されたone-time-bindingを使う。これを使えば、始めだけはバインディングするのでダイジェストサイクルに影響するが、その後は影響が無くなる。 例えば「{{name}}」としている所を「{{::name}}」とするだけでone-time-bindingになる。 AngularJS: Developer Guide: Expressions React的なレンダリング方法に変更する 特にtableの中身などの反復...
コメントを投稿
続きを読む

CSSのtranslate3dをパースして数字の配列にするには？

CSSのtranslate3dは例えば translate3d(5, -10, 0) のような文字列になっているが、このままでは計算するのに使いにくい。 そこで、これをパースして数字の配列にするにはどうすればいいだろう。例えば、このような正規表現を使うというのはどうでしょう？ /** * CSSのtranslate3d文字列を数字の配列に変換して返す */ function parseTranslate3d(string) { var array = string.replace('translate3d', '').match(/-?[\d\.]+/g); for (var i = 0; i
コメントを投稿
続きを読む

ionicでcrosswalkのビルド後のapkがarmv7とx86に分かれた件

最新版のionicでは、crosswalkのビルド後のapkがarmv7とx86に分かれるようになった。 これによって、armv7とx86両対応のために40MB以上になっていたアプリサイズが20MB程度まで軽量化された。 喜ばしい事ではあるけれど、リリース時にとても混乱してしまった。 リリーススクリプトを書いているのだけど、これまでは一つのapkにサインすればよかったものが二つのapkにサインする必要がでてきて、スクリプトがまともに動かなくなってしまったからだ。 しかし、このことに気づいた後は特に問題は無かった。 Google Playでは、すでに一つのリリースで複数のapkをアップロードできるようになっているので全く心配は無い。
コメントを投稿
続きを読む

Angular2.x系が出るまで1.x系でES6やTypeScriptと共存させる方法についてのビデオ

イメージ
Angular2.x系が出るまで1.x系でES6やTypeScriptと共存させるにはどうしたらよいのか？ この疑問に、このビデオ「Getting Ready for Angular 2.0」がある程度答えてくれていたのでメモ。 55:34あたりからThe question is…「But What Do We Do Now？」と始まる。そう。そこが聞きたかった！ ES6って何となく全く違う言語のような気がしていて、一体どんな風に書くの？と思っていた。 しかし、よくよく考えてみるとES6はES5の機能を受け継いでいるので、ES6で書いてもAngular1.x系は動くのである。というか、「ES5でES6の拡張機能が使えるようになったと考えた方がいい」ということに気づかされた。 例えば、これがおなじみの1.x系でのコントローラーの書き方だ。 そして、ES6と共存させて書くとこうなる。 より現実的には、このようにクラスをファイルに分けることになるだろう。 これを使う場合はこうなる。 その他、ディレクティブやNew Routerについてもメンションされている。 これらをヒントに、これからES6というかTypeScriptで書く実験をしてみたいと思う。 ES6はつい先日正式版になったばかりだ。ではES6を使い始めるのは一体いつか？それは今でしょう。 Thanks, Yuri Takhteyev!
コメントを投稿
続きを読む

ionicでインストールするcrosswalkを選択できない件

追記15.07.11 ：最新版のionic（1.6.1）では「ionic browser add crosswalk@バージョン」で指定通りインストールできるようになった。この記事も合わせて読むとionicの更新に依存することなくcrosswalkの最新版をインストールできるようになる。 琴線探査: ionicで最新版のcrosswalkをインストールする方法 ---- 最近ionicのCLIが1.5.0にバージョンアップしたのだが、その後platform/androidを削除してcrosswalkを再インストールしたら、localStorageに保存したはずの値がアプリの再起動時に保存前の状態に戻っているという動作になってしまった。 ChromeのDevToolsでは、crosswalkのバージョンは42.0.2311.135となっている。以前のバージョンが何だったのかは覚えていないが、このバグが出る前は確か41系だったような気がする。 「ionic browser ls」でインストールできるcrosswalkを見ると、crosswalk-liteが増えていたりするので多分アップデートされたと思う。 幸いなことに、 ionicはcrosswalkのインストール時にバージョンを指定できる ので、stableで一番古いものをインストールして実行し、再びDevToolsでバージョンを確認すると…全く変わっていない！ 何かおかしい。ネットで調べると、どうやらcrosswalk-liteもインストールできないという話。 cordova - How to build android with Crosswalk lite using ionic-cli? - Stack Overflow このページを参考に、「ionic browser add」で何をやっているのかソースを見てみることにした。場所としてはここ。 /usr/local/lib/node_modules/ionic/node_modules/ionic-app-lib/lib/browser.js 問題の場所はこの11行目だとわかった。 cordova 5.0.xがインストールされていると「Browser.installCordovaCrosswalk(appDi...
コメントを投稿
続きを読む

ionic（cordova）のカスタムプラグイン開発のワークフローを構築する

イメージ
カスタムプラグイン開発のワークフローが必要だ！ ionic（cordova）のカスタムプラグインを開発するのはそれほど難しいことではない。しかし当然の事ながら、プラグインの開発は試行錯誤を重ねる必要がある。そのための円滑なワークフローを構築するのにかなり苦労したので、まとめておきたいと思う。 ここでは、ionic側からカスタムプラグインを叩いてネイティブのノーティフィケーションを表示するサンプルを作ろうと思う。とりあえずAndroid用を開発することにする。 ionicプロジェクトの作成 まず、ionicプロジェクトを作り、CordovaLib-debug.aarを作るため一度ビルドする。 AndroidStudioプロジェクトの作成 AndroidStudioで~/Documents/git/customplugin-androidに、パッケージ名ex.customplugin、Blank Activityを選択してプロジェクトを作る。 そして、このようなレイアウトを作る。 CordovaLib-debug.aarを組み込む。これはAndroidStudioでCordova関連クラスをimportするのに必要。 File＞New＞New module＞Import .JAR or .ARR Packege＞Next。 File Name: ~/Documents/git/customplugin/platforms/android/CordovaLib/build/outputs/aar/CordovaLib-debug.aar からのFinish。 左のツリーでGradle Scripts＞build.gradle（Module app）を開き、dependency部にCordovaLib-debugの記述を追加。 ここでCordova関連クラスをimportできるようにするために一度ビルド。Build＞Rebuild Project。 ノーティフィケーションアイコンの作成 適当なサイズのアイコン画像（512x512程度、アルファ付き、塗りは白、アイコン内のパディングは極力少なく）を用意する。 その画像をこちらにアップロードしてDownload Zip。 Android Ass...
コメントを投稿
続きを読む

コンテンツのレーティング（IARC）が理由でアプリが不承認（リジェクト）される件 ＠ Google Play

イメージ
Google Playにて、コンテンツのレーティング（IARC）が理由でアプリが不承認（リジェクト）された！不承認を通知するメールにはこんな文言が… 不承認の理由: Google Play コンテンツ レーティング ポリシーへの違反。 提出したアプリの性質からして、どう考えてもリジェクトされる理由が分からなかった。こんなことは初めてだ。しかし、しばらくすると自動的に承認された(^^); 原因は、「IARC認定」（Certificate ID）が得られる前にアプリを提出したことだと分かった。 IARCのコンテンツレーティング認定アンケートなど、アプリの掲載情報を入力すると提出可能になる。 しかし、実際問題としてはアンケートに答えるだけではダメで、IARCからCertificate IDのメールが来て、Google Play Developer Consoleが次のような状態にならなければ承認されないようだ。 12:37に行ったアンケートにはIARC認定のCertificate IDが無い。15:35のはある。 焦ってググったが、この件についての記事が見つからなかったので書いておくことにした。 同様の状態にハマった方は、焦らず、しばらく待ちましょう(^^); Google Playには、Certificate IDが得られるまで提出ができないようなバリデーションを行っていただきたい。
コメントを投稿
続きを読む

脱jQueryするにはdocument.querySelector()もあるけど状況どう？

AngularJS内蔵のjqLiteを使うことにしたが、DOMElementを取得するのにdocument.getElementById()というのは使いにくい場合もある。 ところで、jQueryライクなものとしてdocument.querySelector()もあるけど、状況はどうなのか？と。 Can I use... Support tables for HTML5, CSS3, etc な〜んだ。全然大丈夫じゃん！なら、もはやjQueryも必須ではないし、getElementById()も要らないじゃん！と思ったが… document.querySelector - Web API インターフェイス | MDN 【訳注: 上記ではクラスセレクタを用いた検索を例示していますが、この様な単発のクラス名の場合は getElementsByClassName() メソッドを用いた方が高速な動作となります。また、ID セレクタ ( # ) を対象とする検索も可能ですが、その場合は getElementById() メソッドを用いた方が高速です。対象セレクタが流動的で有る場合や、または隣接セレクタなどによるコンビネーションセレクタでの複雑な検索の場合に於いて、querySelector() や querySelectorAll() は真価を発揮します。】 ということなので、要らないということは無いようだ。 つまり、複雑なクエリ条件の場合はquerySelector()、単純な場合はgetElementById()とかgetElementsByClassName()と使い分けをした方が良いと。
コメントを投稿
続きを読む

angular.element()のjQueryを読み込んだ場合とそうでない場合（jqLite）の動作の違い

できるだけページを軽量化するためにjQueryを読み込まないようにしようと思った。しかし、jQueryは便利なので捨てがたいなと思っていた。そんな時、angular.element()というメソッドがあることに気がついた。 AngularJS: API: angular.element AngularJSは内部でjqLiteというjQueryのサブセット版を持っていて、angular.element()はそれを使ってjQueryのオブジェクトを返してくれるらしい。 ただ実際に使ってみると、jQueryを読み込んだ場合とそうでない場合で動作が違うのでハマった。 jQueryを読み込んでいる場合はこのように#targetを取得できるが、そうでない場合、つまりjqLiteのみの場合は取得できない。 var $elm = angular.element('#target'); 要するにjQueryを読み込んでいる場合は次と等価だ。 var $elm = $('#target'); 一方、jqLiteのみの場合はこのようにする。 var elm = document.getElementById('target'); var $elm = angular.element(elm); Wraps a raw DOM element or HTML string as a jQuery element. というのはそういう意味だったのか！とやっと分かった(^^);
コメントを投稿
続きを読む

ionicプロジェクトのsplash.pngを自動でリサイズしながら9-patchする「make-9patched-splash-ionic」

先日、nodejsで9-patch画像を自動生成する方法について書いた。 琴線探査: nodejsで9-patch画像を自動生成する「FourSide1px9patcher」 その後、このコードを使いやすいようにnodeモジュール化した。 junkoro/four-sides-1px-9patcher ここからが本番。ionicプロジェクトでsplash.pngを自動的にリサイズしつつ9-patchするコードを書くときがｷﾀ(・∀・)!! すでにnodeモジュール化して公開済み。 junkoro/make-9patched-splash-ionic インストール方法やコード内容についてはgithubに譲るとして、ここでは開発時に困ったことについて書いておきたいと思う。 9-patchについては開発済みだったので何の問題も無かったが、画像のリサイズが困った。node-canvasでもリサイズはできるのだが、リサイズ後の画像のクオリティーがとても使えたものではないのだ(´・ω・`) この問題はブラウザ上のJSでも同じで、以前に研究したことがあった。 琴線探査: HTML5 Canvasで画像のリサイズするならコレ！「JS-Image-Resizer」 というわけで、再びこの「JS-Image-Resizer」を使わせていただくことにした。結果は上々だ。 ただ、「JS-Image-Resizer」はブラウザ用のJSコードなので、node用に多少変更する必要があった。と言っても、「modules.exports」行の追加とエラーになる部分（WebWorker部）をコメントするくらいだったが。 これでこの件にコメントすることができるようになった。 Bad splashscreen ratio with Android using CLI new feature - ionic - Ionic この件は自分も困っていたが、他にも多くの人が困っているようなので、このコードが助けになればと思う。
コメントを投稿
続きを読む

nodejsで9-patch画像を自動生成する「FourSide1px9patcher」

イメージ
追記15.05.05 ：使いやすいようにnodeモジュール化した。 junkoro/four-sides-1px-9patcher 9-patchツールの現状 〜 開発意図 前から9-patchを作るのは面倒だし問題だと思っていた。そこで改めて現状を調べてみたが、やはり9-patchを作るには ・Android SDKのdraw9patch ・Android Asset Studio - Simple Nine-patch Generator ・Eclipseプラグイン「 Draw 9-patch Tool 」 ・Fireworksなど汎用の画像編集ソフトを使う という感じ。nodejsで、特にgulpで9-patchを自動化できるツールが無いか探したが、これくらい。 gulp-9-patch このツールはスケーリングしたり非9-patch化する機能しかなく、画像を9-patch仕様に加工することはできない。 開発要件 やはり独自開発するしかないか…もう我慢ならん！こんな ('A`)ﾏﾝﾄﾞｸｾ-ことイチイチやってられるかっての！ ただ、なぜこのような状況なのかは理解できる。9-patchは柔軟性が高く、画像によってパッチすべき場所は変わる。これが自動化ツールが存在しない理由なのだろう。 しかし、画像を作る側が9-patchしやすい条件を作ればどうだろう？たとえばこんな画像で、単純に4辺の周辺1ピクセルを画面にあわせて伸ばすように9-patchすることを考える。 画像はionicのデフォルトスプラッシュスクリーン用の画像 この条件を満たすケースは意外と多いのではないかと。自分的には自動化するためにデザインを犠牲にする覚悟である(^^); このようなことをしてくれるCLIツールを、後々ionicなどgulpやgruntをビルドシステムとして使っているようなものに組み込むことを考えて、nodejsで開発する。 nodejsでの画像処理をどうする？ 〜 技術調査 調べると、みんなよくimagemagickとかを使ってやっているようだが、できればコマンドラインツールに依存するような形にしたくない。 というわけで、前から名前だけは知っていたけれど、よく調べたことがなかったこれを使ってみよう。 ...
コメントを投稿
続きを読む

PCブラウザでネットワーク接続の有無を検知するには？

PCブラウザでネットワーク接続の有無を検知するにはどうしたらいいだろう？ 一応「navigator.onLine」というAPIはある。 window.navigator.onLine - Web API インターフェイス | MDN ブラウザのサポート具合を調べてみると、全てのブラウザというわけにはいかないが、まあまあサポートされていることがわかる。 Can I use... Support tables for HTML5, CSS3, etc しかし、このAPIには色々と問題があることがすぐに分かった。 javascript - How to detect online/offline event cross-browser? - Stack Overflow … Chrome and Safari will detect when you go "offline" automatically - meaning that "online" events and properties will fire automatically when you unplug your network cable. Firefox (Mozilla), Opera, and IE take a different approach, and consider you "online" unless you explicitly pick "Offline Mode" in the browser - even if you don't have a working network connection. … 要するに、ChromeやSafariならネットワーク接続が切れた時点で自動的にオフラインイベントが来るが、FirefoxやOpera、IEはブラウザ側に「オフラインモード」という機能があるので、navigator.onLineの値は実際のネットワーク接続に有無ではなく「オフラインモードかどうか」の値になってしまう、という話。 つまり、全くもって役に立たない！ ではどうするか？ StackOverflowでも議論されているが、要するに「...
コメントを投稿
続きを読む

ツイートボタンをリロードする（ページが読み込まれた後に動的に再作成する）には？

ツイートボタンはこのページで自由にカスタマイズして作成できる。 Twitter Buttons | About 作成したコードをページに埋め込むと、そのページをブラウザでロードしたときに表示されるのは知っての通り。 基本的にツイートするアドレスや内容などはページをロードする時に決まっている必要があるが、ページをロードした後でそれらを変更するにはどうしたらいいだろうか？ ブログやホームページなどの静的なサイトで問題になることはあまりないだろうが、AngularJSなどで構築したシングルページアプリケーションでは大いに問題になり得る。 まず、ツイートボタンを表示するホルダーをこのように作成する。 <!-- ツイートボタンホルダー --> <div id="tweetButtonHolder"> </div> <!-- ツイートボタン作成サイト https://about.twitter.com/resources/buttons#tweet でコピーしたscriptタグ --> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script> このscriptタグは window.twttr を生成する。このオブジェクトは様々なツイートボタンを作ることができる。 Scripting: Factory Functions | Tw...
コメントを投稿
続きを読む

macでsmb（samba）共有サーバーに別名で接続（別アカウント名で接続）する方法

macでsmb（samba）共有サーバーに別のアカウント名で接続したくなった。 接続を解除してもパスワードを保存してしまったために自動的に再接続してしまい、別アカウント名で接続できなくなってしまった(´・ω・`) どうすれば別名で接続できるのか？ Finder＞移動＞サーバーへ接続＞サーバアドレス に下記のように入力する。 smb://アカウント名@ホスト名 ノリでやってみたら、たまたまできちゃった(・∀・) 知らなかったわ〜
コメントを投稿
続きを読む