ねこメモ くらうど

2022/06/08 20:45:04
Noranekoです。


今回ねこメモのクラウドバージョンをリリースしました。



その名も、「ねこメモ くらうど」どす。



各最新のブラウザーならまず正常に動くと思います。


(たぶん)


細かいバグが残ってるかもしれませんが宜しくドック!



かなりの大規模開発になりました...




気に入ったら押してね
  ブログランキング・にほんブログ村へ




~こんなアプリ出してます~

authored by Noraneko | Comment(0) | Web

最近のweb事情

2019/08/16 14:57:29
RX100それなりに大活躍!!

小さい鞄にカメラ、スマートフォン、iQOS2.4、財布でギリギリ。

このご時世にタバコとかまじロック!

と言う訳で最近のwebサイトがダメすぎて憤慨してるNoranekoです。


古代にiモード専用サイトと言うのがあったのですが、

現在はスマートフォン専用サイト(長いので以下ス専サイト)というのになっており、

その所存でPCで見る際に表示がおかしくなっている。


素人のまとめサイトなんかはword pressで広告貼りまくって、

パーツの寄せ集めをしてるだけなので、ブラウザの幅を狭くして下にスクロールすると

左のコンテンツがメインコンテンツにかぶってしまう。

それだけなら昔からいくつもあったからいいのですが、

更に最近気づいたのが、横のスクロールバーを制御しているサイトが!!


PCでサイトを見る時は、マウスの中央ボタンを押してから

上下左右にスクロールする事が多いので、

画像とかが見切れてるのに左右のカーソルが出なくて、

あれなんだこのサイト?と気になった。


大手の例を挙げると

GU
https://www.uniqlo.com/jp/gu/category/men/tops

UNIQLO
https://www.uniqlo.com/jp/store/feature/uq/easycareshirts/men/

これらをそれなりの大きさから横幅を狭めていくと、

GUのサイトではスクロールバーが制御されているので右側のコンテンツが見えなくなる。

これはhtmlタグのスタイルシートにoverflow-x: hiddenが指定してあるからである。

でもUNIQLOはそんな制御はしていない。

同じグループなんだから資源を有効に使って欲しい。



今のスマートフォンはメモリもそれなりにあり、しかも大画面になってて、

htmlの解釈も問題ないのでPCとス専サイトに分ける意味がない。

一番の問題は両ソースを保持してるので表示するのに激重になっていること。

むしろPCサイトを表示する方が早い。

またス専サイトは横幅が固定されるので、

画像や文字を拡大しようとしても拡大ができない。

三(?)を押さないとメニューがわからかない。

PCサイトにはあるけどス専サイトだと省かれてるコンテンツがある。

上記に関しては問題外だろ…

このようにス専サイトのメリットが見出せない。


私はスマホで見る時もPC版で常に見たいので、

Chromeの設定のPC版サイトのチェックをしたらそれをずっと保持して欲しい。

なんで見るたびにチェックしないといけない仕様にしたんだろう…


そんなこんなで横幅をoverflow: hiddenを使ってる人は気を付けて下さい。




気に入ったら押してね
  ブログランキング・にほんブログ村へ




~こんなアプリ出してます~

authored by Noraneko | Comment(0) | Web
数日前までIE6で『ねこのニジマス』の地図表示できてたのに、

表示できなくなってるぅぅぅううううう^q^


Noranekoさんです。



本家のマップが改悪されて、検索結果の左ペインがうざくなったり、


POIをクリックした時に地図の中央に来なくなったので、


URLから緯度経度が取れなくなったり


ほんと余計なことするなよ…


無駄な情報を出したいなら、最初の時みたいに左ペイン固定にしとけよ…



と言うわけで、Google Maps JavaScript API


を使用したカスタマイズをちょっとだけ説明します。

今回、地図をオレ色にしたいと思って、SNAZZY MAPSからAvocado Worldを拝借して、


更に自分好みにカスタマイズしました。


ソースを見てもらうと

var option = {
zoom: 8,
center: new google.maps.LatLng(36.343103, 138.863238),
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles:[{"featureType":"landscape", bla bla bal... }]
};



という地図の初期化のstylesの部分がデザインになります。


Avocado Worldでは、


{"color":"#abce83"}



という風に色指定をしています。


これにすると、山や海などが一色でベタ塗されてしまいます。


なので、ここを

{hue:"#abce83"},
{saturation:20},
{lightness:-20}



として、指定した色に近くなるように調整しました。


Photoshopを使って、HSBを合わせて見たりしたんですが、上手くいかなかったので、


数値をいじりながら指定した色に近づけたのが上記の値です。


あと、日本の高速道路と国道(?)が同一で塗られてしまっている問題があったので、

{"featureType":"road.highway","elementType":"geometry.stroke"}{"featureType":"road.highway","elementType":"geometry.fill"}{"featureType":"road.highway.controlled_access",
"elementType":"geometry.fill"}



これを指定するといい感じで道路の色分けが出来ます。


この道路種別がよくわからなくて、県道とかも途中から塗られてなかったり


仕様が謎です。


また、配列を扱う際は、

var hogeArray = new google.maps.MVCArray();



を使うことにより、

hogeArray.forEach(function(hoge, idx) {
alert(hoge);
});



とforEachを使って要素を簡単に出すことが可能です。


ですが、自分みたいにマーカに対して一対の情報ウィンドウがある場合、


どちらか片方だけ配列に入れておけば事は足ります。


情報ウィンドウが地図の子供としてあるのですが、


『1つのマーカに対して1つの情報ウィンドウを持つ』


と言った使い方をしている人の方が、多いのではないのでしょうか?








???『なんかそういうデータあるんですか?』



???『あなたの感想ですよね?』






ええ、私の勝手な感想です^ω^


つまり何が言いたいかと言うと、


『1つのマーカに対して、1つの情報ウィンドウを持つマーカオブジェクトを作れ』


ということです。


お前が作れって話ですね。


めんどくさいです。


配列2個持ちます。


1つのマーカーに対して、1つの情報ウィンドウを持つマーカオブジェクトを


実装させた方は、是非ご一報下さい!




気に入ったら押してね
  ブログランキング・にほんブログ村へ




~こんなアプリ出してます~

authored by Noraneko | Comment(0) | Web

ねこのニジマス

2015/10/06 21:12:04
朝晩冷え込むようになってきました!

Noranekoです。


というわけで、自分の趣味でもある釣りのポータルサイトを構築してみました。


ねこのニジマス


です。


幾つかは自分も行ったことがあるエリアなので、簡単なレビューも入れて行こうと思っております。

なんかGoogle Maps APIも若干変わってたり、ジオコーディングが使えたりと

使い方のわかる人にとっては、いろんなことができるようになってますね。

自分の使っているやつは無料なので、25,000リクエスト数/日となってます。

つまり25,001番目にトップを開くと地図が表示されないってことですね!

ということで、ニジマス釣りをやる方や興味がある方は、見てみて下さいませ~☆




気に入ったら押してね
  ブログランキング・にほんブログ村へ




~こんなアプリ出してます~

authored by Noraneko | Comment(0) | Web

nginx1.2の設定

2012/05/30 07:40:33
おはようございます!Noranekoだぜぇ。

最近、web業界でnginxなる物が一部で流行ってるようですね。
業務ではIIS、apacheと使ってきましたが、ここにきていろんな人からこのnginxの話をされました。

てことで情弱な私も使ってみたお^ω^


yumさんでnginx1.2をインスコ。


通常のインスコだと設定ファイルは、


/etc/nginx/
/etc/nginx/conf.d


の中にあり、


/etc/nginx/nginx.conf
/etc/nginx/conf.d/default.conf


この2つがメインファイルとなります。


今回はヴァーチャルホストとベーシック認証についてもやっちゃいましょう。

※ヴァーチャルホストとは、日本語で直訳すると仮想上のホストと言うことです。現在歌舞伎町のホストクラブでは人間を雇わず、CGが女性客の相手をしてくれます。CGなので自分の好みの男性を作ることができ、AIも搭載されてるので会話も可能です。


てことで簡潔に言うとconf.dの中に、***.confと言うファイルを置くと読んでくれるので、default.confはさわらずに、ドメイン名+.confというファイルを置いて管理するのが良いと思います。

例えばwilddaro.comteheperoo.comと言うドメインを持っていて、それぞれのヴァーチャルホストをnginx上に持つとする場合、conf.dの中で、


cp default.conf wilddaro.com.conf


とdefault.confをコピーしてファイルを置きましょう。

ここまでで90%終了です!

やったねタエちゃん!ヴァーチャルホストが増えるよ!


では、wilddaro.com.confの編集を行いましょう~。
ついでにphpの設定も行っておきましょう



server {
listen 80 default_server;
server_name wilddaro.com;

#charset koi8-r;
#access_log /var/log/nginx/log/host.access.log main;

location / {
root /wilddaro.com/html;
index index.html index.php;
}

location /himitsu/ {
alias /wilddaro.com/html/himitsu/;
index index.html index.php;
auth_basic "wilddaro?";
auth_basic_user_file /wilddaro.com/html/himitsu/.htpasswd;
}

#error_page 404 /404.html;

# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}

# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}

# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
location ~ ^/himitsu/(.*\.php)$ {
fastcgi_pass 127.0.0.1:9000;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME /wilddaro.com/html/himitsu/$1;
include fastcgi_params;
auth_basic "wilddaro?";
auth_basic_user_file /wilddaro.com/html/himitsu/.htpasswd;
}

location ~ \.php$ {
root /wilddaro.com/html;
fastcgi_pass 127.0.0.1:9000;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
include fastcgi_params;
}

# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
location ~ /\.ht {
deny all;
}
}


鉄人自らご説明致します。
wilddaro.comのパスを/wilddaro.com/html/をドキュメントルートにした時の設定です。お好みで、パスをお好みで、/boot/sbin/tmp等のワイルドなところに設置しても構いません^ω^

2行目
default_serverを付ける事により、逆引きした時のホストとして表示できます。つまり、任意のconfファイルにdefault_serverを付けることにより、IPでのアクセスとドメインでのアクセスを切り分けることができます。

3行目
ヴァーチャルホストのドメイン名をここに記述します。

8~11行目
location /とすることで、wilddaro.comのドキュメントルートのパスとindexファイルの設定を行っています。

13~18行目
http://wilddaro.com/himitsu/以下にベーシック認証をかけています。
ここの13行目なのですが、/で閉じないと、himitsu.htmlというファイルがあった場合に、アクセスした際にベーシック認証が発生してしまいます。16行目のauth_basicはメッセージ、17行目のauth_basic_user_fileがユーザ・パスワードファイルです。

37~44行目と46~52行目はphpの設定ですが、ここで結構はまりました。
まず13~18行目でベーシック認証をかけたつもりでも、
http://wilddaro.com/himitsu/***.php
を叩くとベーシック認証がかかってない状態になっています。

う~ん、locationの中でphpのロジックをネストさせて書いてる人もいたりしますね。
自分はちょっと分けて書きたかったので、こういう風にしてます。
あと注意点としては、先に46行目を書くと37行目のロジックが通らなくなってしまいます。

これはちょっと困った問題で、例えば/abc/def/ghi/というディレクトリがあってghi/にベーシック認証をかけて、さらにdef/にも認証をかけたい場合、
先にghiのロジックを書き、次にdefのロジックを書かないと、先にマッチした方のみ処理が行われるみたいです。

自分の書き方がまずいのかもしれませんが、オレ流としての設定なので、他のもっとすっきりした書き方や有名な人の設定パクッた方がいいお^ω^

42、43行目でhttp://wilddaro.com/himitsu/以下のphpにアクセスがあった時にベーシック認証をかけるようにしています。また、37行目を性器正規表現にして、40行目に$1としてファイル名を渡しています。

57~59行目
.htpasswdファイルが見られちゃうと恥ずかしいので、コメントを取っちゃいます!
ワイルドに行きたい人は、ここはコメントはずさないで大丈夫です。

とまぁこんな感じでファイルを設定して、nginxをrestartして、ドメインを叩いて確認してみて下さい。てかwebサーバ設定しても、Aレコードちゃんと登録しなきゃ見れませんので、先に登録してからnginxの設定した方がよろしいでございます。

あと余談ですが、nginxでphp-fpmを使う際は5.3以上なのですが、
設定した後にサイトを見てて、エラー吐きまくりのページがありました。
ereg系とかを使ってると出まくります。

詳細はこちらにのっております。
http://php.net/manual/ja/migration53.deprecated.php


pregにしたったわ!






参考になった人は是非、いいねボタンを押して下さいね^ω^


















そんなもんついてねーけどな!







気に入ったら押してね
  ブログランキング・にほんブログ村へ




~こんなアプリ出してます~

authored by Noraneko | Comment(0) | Web
1 2 
BLOG内検索
<< 2022/12 >>
Sun Mon Tue Wed Thu Fri Sat
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31